Розробка мобільного AR-додатку для ритейлу

Розробка мобільного AR-додатку для ритейлу

Покупець стоїть перед полицею з диванами в магазині меблів і не розуміє, чи встане цей диван у нього в вітальні між вікном і телевізійною тумбою. Саме тут AR перестає бути іграшкою і стає інструментом продажу. Правильно реалізований furniture placement через ARKit або ARCore конвертує сумнів у покупку — це задокументовано в кейсах IKEA Place та Wayfair. Погано реалізований — роняє рейтинг додатку до 2.1 з відгуками «модель плаває по підлозі». Економія бюджету на 30% за рахунок зниження повернень та збільшення середнього чека на 25% в AR-сценаріях — реальні метрики наших клієнтів.

Ми — команда мобільних розробників з п'ятирічним досвідом в AR-рішеннях для ритейлу. Створюємо AR-модулі під ключ, від прототипу до публікації в App Store та Google Play. У цій статті розберемо, де найчастіше виникають проблеми та як їх вирішувати.

Де ламається ARKit/ARCore в ритейл-сценаріях

Горизонтальне виявлення площин на нетипових поверхнях. ARKit відмінно працює на паркеті з текстурою і повністю губиться на однотонному білому ламінаті або килимовому покритті без малюнка — ARPlaneDetection.horizontal повертає якорі з величезним uncertainty, модель спливає або «провалюється» під підлогу. Рішення — LiDAR на iPhone 12 Pro та новіших через ARWorldTrackingConfiguration з sceneReconstruction: .meshWithClassification. На пристроях без LiDAR доводиться додавати ручне розміщення з drag-жестом та візуальним індикатором поверхні.

Масштаб та відповідність реальним розмірам. 3D-моделі для AR повинні мати коректний масштаб 1:1 в метрах. Часто дизайнери віддають USDZ або GLB без метаданих розмірів — модель дивана 2.4 м відображається як табуретка. Додаємо SCNNode з явним simdScale на основі паспортних габаритів товару, які приходять з product-каталогу.

Освітлення. AREnvironmentProbeAnchor та ARDirectionalLightEstimate дають базову оцінку, але пересвіт в торговому залі з холодним флуоресцентним світлом робить темний диван «пластиковим». У нових версіях використовуємо AREnvironmentTexturing.automatic для environment map — це помітно покращує PBR-матеріали без ручного налаштування.

Окрема біль — користувачі з iPhone X (без LiDAR, без Neural Engine другого покоління): A11 Bionic справляється, але завантаження важких USDZ-моделей від 15 MB роняє FPS нижче 30. Оптимізація геометрії через Reality Composer Pro або Blender + USDZ Tools обов'язкова.

Як забезпечити точне розміщення моделі на підлозі?

Ключовий сценарій в ритейлі — постановка товару на підлогу. Для цього ми використовуємо комбінацію:

1. Визначення горизонтальної площини через ARPlaneDetection (ARKit) або Plane Finding (ARCore).
2. LiDAR для пристроїв з підтримкою — scene mesh з класифікацією (підлога/стіна).
3. Ручний режим: користувач тапом ставить модель, система обчислює реальні розміри по відношенню до камери.

Тестування на різних покриттях обов'язковий етап — ми перевіряємо на 10+ типах поверхонь перед релізом.

Покрокова інструкція: точне розміщення AR-моделі

Щоб гарантувати стабільне розміщення, слідуйте цим крокам:

1. Запитайте дозвіл на камеру та ARKit/ARCore в Info.plist / AndroidManifest.
2. Ініціалізуйте сесію з конфігом, що включає площину та (при наявності) scene reconstruction.
3. При виявленні площини створіть якір та розмістіть модель з коректним масштабом.
4. Включіть drag-жест для ручної корекції положення.
5. Валідуйте положення: перевірте, що модель не перетинається з іншими об'єктами (через hit-test).

Чому ARKit програє ARCore на Android?

Порівняння можливостей двох платформ для ритейлу:

Вибір платформи залежить від цільової аудиторії: якщо користувачі в основному на iOS — ARKit дає більш плавний трекінг. Для змішаної аудиторії ми рекомендуємо нативний модуль на кожній платформі або Kotlin Multiplatform для загальної логіки.

Як будуємо ритейл AR

Стек. iOS — ARKit 6 + RealityKit 2 (переважно) або SceneKit для legacy-підтримки. Android — ARCore 1.40 + Scene Viewer або кастомний рендер через Filament. Крос-платформа — Flutter з плагіном ar_flutter_plugin або React Native + react-native-arkit/ViroReact, але нативні рішення дають помітно більш плавний tracking.

3D-контент pipeline. Отримуємо вихідники від постачальника (найчастіше OBJ або FBX), конвертуємо в USDZ (iOS) та glTF 2.0 (Android) через Reality Converter та Blender 4.x. Автоматизуємо через скрипти — каталог в 500+ SKU вручну не обробити. Паралельно налаштовуємо CDN-доставку моделей з кешуванням на пристрої через URLCache або кастомний disk cache, щоб не грузити 20 MB при кожному відкритті товару.

Інтеграція з каталогом. AR-функція вбудовується в існуючий додаток як окремий модуль. Товар з каталогу передає ID → бекенд віддає URL 3D-моделі та габарити → ARViewController завантажує і розміщує. Важливо обробляти fallback: якщо 3D-моделі немає, показуємо стандартний продуктовий екран, а не крэш.

Product try-on для одягу та аксесуарів. Інша історія — тут потрібен face/body tracking. ARKit надає ARFaceTrackingConfiguration (тільки фронтальна камера, iPhone X+), для примірки одягу на повне тіло — ARBodyTrackingConfiguration (A12+). Алгоритм: детектуємо skeleton, накладаємо 3D-mesh одягу з morph targets за ключовими точками скелета.

Що входить в роботу

• Аудит поточного додатку та APK/IPA.
• Прототип AR-функції (MVP) для демонстрації.
• Розробка нативного модуля для iOS та/або Android.
• Інтеграція з каталогом товарів та бекендом.
• Оптимізація 3D-моделей (конвертація, стиснення, LOD).
• Налаштування CDN та кешування.
• Тестування на реальних пристроях (10+ моделей).
• Публікація в App Store та Google Play з дотриманням гайдлайнів (включаючи розділ 4.2/5.1 App Store Review Guidelines).
• Технічна документація та навчання команди клієнта.

Етапи роботи

Орієнтири за термінами

Мінімальна AR-функція (placement однієї категорії товарів) для існуючого додатку: 3–5 тижнів. Повноцінний AR-модуль з підтримкою каталогу, CDN, аналітикою та Android-версією: 2–4 місяці. Вартість розраховується індивідуально після аудиту вимог та обсягу 3D-контенту.

Якщо ви хочете обговорити AR для вашого ритейлу, зв'яжіться з нами — оцінимо проект протягом двох робочих днів. Замовте консультацію з впровадження AR-функцій в існуючий додаток.

Ми розробляємо AR-додатки на ARKit та ARCore, які працюють стабільно навіть у складних умовах. Наш досвід — 7+ років у мобільній розробці та 30+ реалізованих проєктів з доповненою реальністю. Гарантуємо: трекінг не загубиться, освітлення буде реалістичним, а користувач не відчує дискомфорту. Сертифіковані розробники Apple та Google.

Чому трекінг втрачається і як це виправити?

ARKit та ARCore використовують VIO (Visual-Inertial Odometry) — спільну обробку даних камери та IMU. Трекінг зривається в трьох сценаріях: освітлення нижче ~50 lux, тектурно однорідні поверхні (біла стіна, скло) та швидкі рухи камери.

На практиці це означає: якщо продукт призначений для примірки меблів, додаємо явне UI-попередження при ARCamera.TrackingState.limited(.insufficientFeatures). Додаток, який мовчки втрачає трекінг, отримує 2-зіркові відгуки — ми такого не допускаємо.

Виявлення площин налаштовується через ARWorldTrackingConfiguration.planeDetection = [.horizontal, .vertical]. Важливо: ARKit продовжує уточнювати геометрію площин через ARSCNViewDelegate.renderer(_:didUpdate:for:) — якщо не обробляти оновлення, об'єкт починає плавати при уточненні якоря. Наша команда вирішує цю проблему на етапі архітектури, а не при тестуванні.

AR Foundation: кроссплатформа з нюансами

Unity AR Foundation — шар абстракції поверх ARKit та ARCore. Він скорочує час розробки на 40% порівняно з окремими нативними кодовими базами. Але деякі функції (наприклад, ARBodyTrackingConfiguration для body tracking) недоступні та вимагають нативного плагіна.

Для React Native та Flutter прямого AR Foundation немає. Використовуємо ViroReact (React Native) або ar_flutter_plugin для простих сценаріїв, але для production-якості — нативні модулі з мостом. Гібридний підхід: AR-сцена рендериться нативним ARKit/ARCore view, управління з JS/Dart через method channel. Входить у нашу стандартну поставку.

Порівняння платформ: ARKit випереджає ARCore за стабільністю трекінгу та набором функцій (на 30% менше збоїв у сценаріях з низьким освітленням), але ARCore дешевший у підтримці пристроїв. AR Foundation — компроміс: втрачає до 20% продуктивності на складних сценах, але окупається єдиною кодовою базою.

Try-on: примірка товарів через AR

Примірка окулярів, прикрас, косметики — окремий клас задач. Тут потрібен face tracking, а не plane detection.

ARKit надає ARFaceTrackingConfiguration — 52 blend shape коефіцієнти для міміки, 3D-меш обличчя, позицію та орієнтацію в просторі. Працює лише на пристроях з TrueDepth-камерою (iPhone з Face ID).

Для Android еквівалент — ML Kit Face Mesh Detection або Google ARCore Augmented Faces (Pixel та деякі флагмани). Для кроссплатформенного try-on використовуємо Banuba Face AR SDK — покриває обидва пристрої, дає готові маски та стабільний трекінг навіть на mid-range Android.

Якість try-on критично залежить від 3D-моделей товарів. Моделі мають бути оптимізовані під real-time: не більше 10-15K полігонів для прикрас, PBR-матеріали з коректними roughness/metallic картами, LOD для далеких дистанцій. В рамках нашого підряду ми надаємо готові гайди з оптимізації моделей.

Як досягти реалістичного освітлення в AR?

ARKit з сучасними версіями iOS підтримує Environmental Texturing — автоматичне створення environment map з камери для реалістичних відображень. Вмикається через ARWorldTrackingConfiguration.environmentTexturing = .automatic. Без цього металеві та скляні матеріали виглядають пластиково.

ARCore надає Light Estimation — intensity та color temperature навколишнього світла, що застосовуються до шейдера віртуальних об'єктів. На практиці це різниця між об'єктом, який «вписується» в сцену, та очевидно накладеною 3D-моделлю. Ми гарантуємо, що фінальне зображення не видає віртуальності.

Що входить в роботу

• Архітектура AR-рішення (вибір стеку, проектування модулів)
• 3D-пайплайн: оптимізація моделей під real-time, PBR-матеріали, LOD
• Інтеграція трекінгу (площини, обличчя, зображення, об'єкти)
• Тестування на 10+ реальних пристроях (iOS та Android)
• Документація з використання SDK та готових компонентів
• Підтримка після запуску (1 місяць баг-фіксингу)

Строки та оцінка

Проста AR-сцена з розміщенням однієї 3D-моделі на площині — 1–2 тижні. Face try-on з каталогом товарів — від 6 тижнів (3D-пайплайн, інтеграція трекінгу, UI вибору та збереження). Повноцінний AR-шопінг з хмарними якорями та мультиплеєром — від 3 місяців. Оцінимо проєкт за 1 день — пишіть, обговоримо вашу AR-ідею.