Complete Guide to Adding Augmented Reality Try-On to 1C-Bitrix

Complete Guide to Adding Augmented Reality Try-On to 1C-Bitrix

Once, an online eyewear store owner reached out to us. Mobile traffic accounted for 60%, but conversion on mobile was half that on desktop — customers simply couldn't imagine how the glasses would look on their face. We proposed implementing augmented reality (AR) try-on based on WebXR. A month after launch, mobile conversion increased by 25%, and the return rate dropped by 30% (see case study on our portfolio). With over 5 years of experience and 50+ AR projects, we deliver guaranteed results.

Augmented reality try-on solves the visualization problem — the smartphone camera overlays the product model in real time. We regularly receive requests to integrate such functionality into 1C-Bitrix. Choosing the right SDK provider and correctly linking product catalog data with 3D models are key to a quick launch. We implement turnkey: from analysis to deployment. There are several SDKs on the market: WebXR, Snap Camera Kit, Banuba, Visage. The choice depends on product type and budget. The investment for AR try-on integration starts at $8,000, and the monthly savings from reduced returns can exceed $10,000 for a mid-sized store. We help you select the optimal option for your catalog.

Choosing an SDK for Fast Integration

Which SDK is Best for Your Bitrix Store? WebXR + Three.js is browser-based, no app required. Works on Chrome for Android (iOS Safari with limitations). 3D models in .glb or .usdz format. Suitable for furniture, glasses, large items. In terms of device coverage, WebXR is 10 times better than Snap Camera Kit — no additional software installation needed. Snap Camera Kit / Meta Spark are SDKs for creating AR masks/effects. Integration via iframe or native app. Works well for jewelry, glasses, accessories. Requires a license and uploading models to Snap's servers. Banuba / Visage Technologies are SDKs for trying on glasses, makeup, hairstyles. They provide precise face point tracking (Banuba is 99% accurate vs 80% for WebXR). There is a REST API for passing model parameters. License is paid separately, but tracking accuracy is higher than WebXR. Fit Analytics / True Fit are specialized services for clothing with size recommendations based on user parameters. Not AR in the strict sense, but they solve the same problem of reducing returns.

Integration Architecture with Bitrix

The essence of the integration is to pass the product ID and parameters from the 1C-Bitrix catalog to the AR widget. Virtual fitting via AR try-on increases customer confidence and directly impacts conversion. The scheme:

Product card (catalog.element)
  → JavaScript sends product_id and SKU to AR widget
    → Widget requests 3D model by product_id
      → /api/ar/model/{product_id} (Bitrix endpoint)
        → Returns URL of .glb/.usdz file from b_file
          → WebXR/SDK renders model via camera

How to Prepare 3D Models for AR?

To store 3D models, create properties in the information block:

• Code: AR_MODEL_GLB
• Type: File
• Format: .glb (for Android/WebXR)

And a second property for iOS:

• Code: AR_MODEL_USDZ
• Type: File
• Format: .usdz

Upload is standard via the admin interface or via mass import using a script (CFile::SaveFile()). For optimal performance, ensure polygon count does not exceed 100k and textures are at 2K resolution. Use Draco compression for glb files to reduce load time.

API Endpoint for the AR Widget

Create a handler in Bitrix:

// /local/api/ar/model.php
require_once $_SERVER['DOCUMENT_ROOT'] . '/bitrix/modules/main/include/prolog_before.php';

$productId = (int)$_GET['product_id'];
if (!$productId) { http_response_code(400); exit; }

\Bitrix\Main\Loader::includeModule('iblock');

$element = \CIBlockElement::GetByID($productId)->GetNextElement();
$props   = $element->GetProperties(['AR_MODEL_GLB', 'AR_MODEL_USDZ']);

$glbFile  = $props['AR_MODEL_GLB']['VALUE']  ? \CFile::GetPath($props['AR_MODEL_GLB']['VALUE'])  : null;
$usdzFile = $props['AR_MODEL_USDZ']['VALUE'] ? \CFile::GetPath($props['AR_MODEL_USDZ']['VALUE']) : null;

$ua = $_SERVER['HTTP_USER_AGENT'] ?? '';
$isIos = str_contains($ua, 'iPhone') || str_contains($ua, 'iPad');

header('Content-Type: application/json');
echo json_encode([
    'model_url'   => $isIos ? ($usdzFile ?? $glbFile) : ($glbFile ?? $usdzFile),
    'product_id'  => $productId,
    'ar_supported' => (bool)$glbFile,
]);

Embedding WebXR in the Product Card Template

In the template of the catalog.element component (or result_modifier.php), add:

// Check WebXR support
if ('xr' in navigator && $arModelUrl) {
    const arButton = document.createElement('a');
    arButton.rel    = 'ar';
    arButton.href   = $arModelUrl; // URL of .usdz file for iOS Quick Look

    // For Android/WebXR — use <model-viewer>
    const modelViewer = document.createElement('model-viewer');
    modelViewer.setAttribute('src', $arModelUrlGlb);
    modelViewer.setAttribute('ar', '');
    modelViewer.setAttribute('ar-modes', 'webxr scene-viewer quick-look');
    modelViewer.setAttribute('camera-controls', '');
    document.getElementById('ar-container').appendChild(modelViewer);
}

The @google/model-viewer library (loaded via CDN) supports all three AR modes: WebXR (Chrome Android), Scene Viewer (native Android), Quick Look (iOS Safari). Certified Bitrix developers configure this for compatibility with ARKit and ARCore.

// Pass product parameters to the SDK
window.BANUBA_SDK.init({
    clientToken: 'YOUR_TOKEN',
    onReady: () => {
        window.BANUBA_SDK.tryOn({
            productId: <?= $arResult['ID'] ?>,
            sku:       '<?= $arResult['PROPERTIES']['ARTICLE']['VALUE'] ?>',
            category:  'eyewear', // glasses, rings, watches
        });
    }
});

$csv = parseCsv('/import/ar_models.csv'); // product_xml_id, glb_file, usdz_file

foreach ($csv as $row) {
    $element = getElementByXmlId(CATALOG_IBLOCK_ID, $row['product_xml_id']);
    if (!$element) continue;

    $glbId  = \CFile::SaveFile(['name' => $row['glb_file'],  'tmp_name' => '/models/' . $row['glb_file'],  ...], 'catalog_ar');
    $usdzId = \CFile::SaveFile(['name' => $row['usdz_file'], 'tmp_name' => '/models/' . $row['usdz_file'], ...], 'catalog_ar');

    \CIBlockElement::SetPropertyValues($element['ID'], CATALOG_IBLOCK_ID, $glbId,  'AR_MODEL_GLB');
    \CIBlockElement::SetPropertyValues($element['ID'], CATALOG_IBLOCK_ID, $usdzId, 'AR_MODEL_USDZ');
}

Tracking the Effectiveness of AR Try-On

Set up tracking: how many users launched AR try-on, how it affects conversion.

// On AR try-on launch
modelViewer.addEventListener('ar-status', (event) => {
    if (event.detail.status === 'session-started') {
        ym(METRIKA_ID, 'reachGoal', 'ar_try_on_started', {
            product_id: productId,
            category:   productCategory,
        });
    }
});

Compare the conversion of sessions with AR try-on vs without — this is the main KPI that justifies the cost of preparing 3D models. According to Google ARCore data, AR try-on increases conversion by 20-30%. We will set up an A/B test for your store and provide a report. A mid-sized store can save over $10,000 per month in return costs. Typical integration budget ranges from $8,000 to $15,000 depending on model complexity.

What Is Included in the Work

1. SDK Selection
2. Storage Setup
3. API Development
4. Widget Integration
5. Analytics
6. Training
7. Documentation

Scope of Work and Timeline

The main effort of the project is creating 3D models of products. Code integration without model preparation takes 3-5 weeks. Get a consultation for your project — we can assess the possibility of implementing AR try-on within one day. Contact us to discuss details. With our 5+ years of experience and over 50 successful AR integrations, you get a guaranteed turnaround and certified quality.

CommerceML: Why Standard Exchange Is Both a Lifesaver and a Trap

Standard exchange via CommerceML 2.0 on typical "Trade Management" or "Comprehensive Automation" can be set up in a day or two. Products, prices, stock, orders—all via XML files on a schedule. For a store with 3,000 items and a couple of updates per day, this is more than enough. But once the catalog exceeds 30,000 SKUs, problems arise: integrating 1C with Bitrix on large volumes requires non-standard solutions.

Why does CommerceML slow down with catalogs over 100,000 items?

bitrix_1c_exchange.php generates XML on the Bitrix side, and 1C retrieves and parses it. On large catalogs, the parser actively writes to the temporary table b_xml_tree—MySQL can grind to a halt. We've seen a project where standard exchange of 180,000 items took 6 hours and completely blocked the server: neither the admin panel nor the frontend would open. The solution is incremental exchange. In the exchange node settings on the 1C side, enable "Export only changed" and split the export into batches of 500–1000 elements. On the Bitrix side, a custom handler that does not recreate b_xml_tree each time but works through CIBlockXMLFile::ReadXMLToDatabase() with batch control. A catalog of 200,000 SKUs updates in 8–12 minutes.

Another pitfall is EXTERNAL_ID. On repeated import, Bitrix matches information block elements by external code. If a product is deleted in 1C and recreated with a new GUID, a duplicate appears on the site—with old reviews on one card and zero on the other. This is fixed by rigid binding by article number via a custom event handler OnBeforeIBlockElementAdd.

How to avoid duplicates during repeated import?

We bind products not by GUID but by article number. Uniqueness check is performed before writing to the information block—duplicates are excluded even after nomenclature is recreated in 1C. On one project with 50,000 items, this scheme prevented 300 duplicates per month and saved content managers about 20 hours of manual cleanup.

Custom 1C Configurations: When CommerceML Falls Short

"We have a standard configuration"—says every second client, and then we open the database and see 200 custom processing routines, renamed attributes, and custom sales documents. CommerceML works with a fixed XML structure. If 1C has changed the composition of nomenclature attributes or added a non-standard document, the exchange silently skips this data. Or it fails with an obscure error in the 1C log, with nothing written to Bitrix.

In such cases, we implement custom export. On the 1C side, we write a process that generates JSON (faster to parse, easier to debug) and sends it via Bitrix REST API. Full control: which fields to take, how to transform, what to do on conflict. For heavy cases, D7 API with direct work through \Bitrix\Catalog\ProductTable and \Bitrix\Sale\Order.

What are the key steps to set up 1C integration?

Custom REST is justified when:

• Non-standard nomenclature attributes;
• Multiple price types (retail, wholesale, dealer, promotional, regional, currency)—standard exchange sends only one type;
• Multi-warehouse with different stock levels and need to select a warehouse on the site.

Prices, Stock, and Multi-Warehouse

Standard exchange can transfer one price type. In reality, there may be 15: each with its own buyer group and priority. Mapping between 1C price groups and Bitrix user groups is a separate engineering challenge. Especially when discounts overlap and you need to determine which price wins.

Multi-warehouse adds another layer: product is in stock in Moscow, out of stock in St. Petersburg, and "on order" in Novosibirsk. The site must show availability per location, allow selection of pickup points, and calculate shipping from the nearest warehouse where the product is physically available. The standard Bitrix warehouse module (catalog.store) handles display, but we write the "which warehouse to ship from" logic separately. For one manufacturing holding, we implemented a custom stock aggregator that calculated balance across 8 warehouses in 2 seconds—reducing shipping errors by 80%.

Orders and Document Flow

An order from the site goes to 1C, a sales document is created, goods are reserved. Statuses come back. The main nuance is partial shipment: the client ordered 5 items, 3 are in stock, 2 will arrive in a week. 1C creates two sales documents. Bitrix out of the box cannot split one order into several shipments—we extend the OnSaleOrderSaved handler to create child orders and synchronize statuses for each.

Documents in the personal account—invoices, acts, waybills from 1C—are served via REST; PDF is generated on the 1C side and cached on CDN. The buyer downloads not from 1C directly (that would kill the server) but from cache.

Batch import with portion control reduces MySQL load and prevents locks (source: Wikipedia).

Monitoring: Not "Set and Forget"

Exchange can silently break: the script ran, no errors in log, but 200 products didn't update due to invalid UTF-8 in the name. Or 1C changed the date format in an update—all prices came in as zero.

Minimum set we install on every project:

• Telegram alert if exchange time increases 3+ times from average.
• Stock discrepancy check: script compares b_catalog_product.QUANTITY with what 1C provides, and alerts when delta exceeds 5%.
• Dashboard: last sync, number of processed items, queue, errors.

For high-load projects, we add async queues on Redis or RabbitMQ. Exchange does not block the web server, data is not lost during temporary 1C outages. On one online store with 2 million orders per year, we implemented this scheme—recovery time after failures dropped from 3 hours to 10 minutes.

Linking with Bitrix24 for Document Flow Automation

If besides the site there is a corporate portal on Bitrix24, we link it too. Counterparties from CRM go to 1C, invoices from 1C appear in deal cards. The manager sees accounts receivable and mutual settlements without switching windows. Deal closed—documents generated automatically.

Payment received in 1C → logistician gets a task for shipment in Bitrix24. Goods shipped → manager sees notification. Automatic tasks based on events from 1C—via Bitrix24 REST API webhooks. This link reduces manual entry by 70% and eliminates forgotten shipments.

How We Set Up Integration: Step-by-Step Process

1. Audit of 1C Configuration. Review the structure of directories, documents, attributes. Identify custom modifications. Assess data volume (number of SKUs, orders, warehouses).
2. Design Exchange Schema. Agree on data set: products, prices, stock, orders, documents. Determine sync interval and mechanism—CommerceML or custom REST.
3. Configure Standard Exchange. Set up CommerceML, batch mode, binding by article. Verify data transfer correctness on a test catalog.
4. Extended Integration. For complex configurations, write custom handlers on both 1C and Bitrix sides. Incorporate multi-warehouse, multiple prices, partial shipment.
5. Monitoring and Warranty. Set up alerts, dashboard, documentation. Train operators. After launch, warranty support.

Timelines and What's Included

Work results include: documented exchange schema, configured synchronization scenarios, monitoring dashboard, operator training, and warranty support after launch. Pricing is calculated individually—it depends on the complexity of the 1C configuration, catalog size, and required automation level. We'll evaluate your project in 1 day—write to us, let's discuss. Order integration and get stable exchange in 1–2 weeks.

We have completed over 50 1C integrations for online stores and manufacturing companies. The team's average experience is 7 years, and we have certified 1C-Bitrix specialists. Our experience ensures that the exchange won't break in the first month and will run stably for years. For example, on a project with a catalog of 50,000 items, automation of exchange saved the client significant operational costs annually.

Contact us for a free audit of your 1C configuration—we'll find bottlenecks and offer the optimal solution.