AI Віртуальна примерка окулярів у мобільних додатках
Warby Parker, EyeBuyDirect, Zenni Optical — всі великі онлайн-оптики впровадили AR примерку. Конверсія в покупку вище у користувачів, які віртуально примірювали окуляри. Технічно це один з найточніших AR try-on сценаріїв: окуляри — жорсткий об'єкт з відомою геометрією, точки кріплення на обличчі (ніс, скроні) фіксовані й добре визначаються face tracking.
Face Tracking та розміщення окулярів
ARKit (iOS, TrueDepth). ARFaceAnchor.geometry забезпечує глибинно-точний face mesh. Ключові точки для окулярів: nose bridge landmarks + temple landmarks. ARKit забезпечує blend shapes — використовуйте eyeBlinkLeft/eyeBlinkRight для анімації: коли користувач моргає, окуляри залишаються на місці (очевидно), але це дозволяє правильно рендерити під час морління без артефактів.
Позиціонування: візьміть ARFaceAnchor.transform як world transform → розташуйте 3D-модель окулярів відносно face anchor з зсувом за точкою nose bridge. Міжзрачкова відстань (IPD) з face geometry (leftEyeTransform, rightEyeTransform) → масштабуйте модель окулярів на конкретний розмір обличчя.
MediaPipe Face Landmarker (Android / кроссплатформа). 478 точок включно з райдужною оболонкою. Точки 1, 2, 98, 327 — nose bridge; точки 234, 454 — скроні. Матриця трансформації голови через Facial Transformation Matrix з MediaPipe. На Android — inference через TFLite або нативний MediaPipe Tasks API.
3D-моделі окулярів: вимоги
Каталог оправ — 3D-моделі в glTF 2.0 (PBR матеріали). Вимоги:
- Точний масштаб 1:1 у метрах (стандартна оправа ~140 мм від скроні до скроні)
- Origin моделі в центрі носового мостика — точка прив'язки до face anchor
- Матеріали: метал (
metallic: 1.0, roughness: 0.1), пластик (metallic: 0.0, roughness: 0.6), gradient tint для лінз - LOD: для real-time достатньо 2000–5000 полігонів на оправу
- Лінзи — окремий меш з прозорим/tinted матеріалом, що імітує скло
Конвертація від постачальника оправ: часто надають OBJ або FBX без PBR матеріалів. Pipeline: Blender → ре-топологія якщо потрібна → призначення PBR матеріалів → експорт glTF → валідація через gltf-validator.
Лінзи: прозорість та tint
Лінзи в AR — складний матеріал:
- Прозорість: alpha blending,
SCNMaterial.transparency - Tint (сонцезахисні): кольоровий прозорий матеріал — HSV overlay поверх background capture
- Антибліковой покриття: тонкий specular highlight на зовнішній поверхні лінзи
- Фотохромні: анімоване змінення tint залежно від
ARLightEstimate.ambientIntensity
На ARKit: рендеримо camera background → face mesh як occluder → окуляри зверху. Лінзи — окремий pass з additive blending, щоб бачити "крізь" них реальний світ.
Розмірна сумісність та рекомендації
Корисна функція: визначити, чи підходить оправа за розміром обличчя. З face geometry обчислюємо ширину обличчя в реальних сантиметрах (відстань від скроні до скроні через simdDistance). Порівнюємо з параметром frame_width з каталогу. Показуємо: "Оправа 140 мм, ширина вашого обличчя 145 мм — ця оправа підійде".
Інтеграція з інтернет-магазином
AR примерка вбудовується в product detail екран. Після примерки — пряма кнопка "Додати в корзину" з вибраним розміром і кольором. Deep link у Safari/Chrome для WebAR (Quick Look для iOS, model-viewer для Android) як fallback для користувачів без додатку.
Аналітика: які оправи пробують частіше, після яких купують — надсилаємо try_on_started, try_on_duration, added_to_cart_after_tryon у Firebase.
Часова шкала: AR примерка окулярів з каталогом оправ для iOS: 5–8 тижнів. Кроссплатформа iOS + Android з повним PBR-рендером, tinted лінзами та інтеграцією з магазином: 10–16 тижнів. Вартість розраховується індивідуально.