Реализация виртуального шоурума в мобильном VR-приложении

Заказчик приходит с каталогом из 2000+ мебельных позиций и просит VR-шоурум. 3D-модели весят по 50 МБ каждая, в сцене — 15 объектов — и приложение падает на iPhone X. Типичная боль: мобильное VR-устройство в форме Cardboard с 3DoF, без контроллеров, а пользователя укачивает от плавного перемещения. Мы подошли к решению через ретопологию, асинхронную загрузку зон и gaze-телепортацию. В результате время загрузки каждой зоны снизилось на 40%, а конверсия в просмотр деталей выросла на 25%. Этот кейс лёг в основу нашего пайплайна, который адаптируется под любой SKU. Мы отбросили идею «сделать красиво» и сконцентрировались на конкретных метриках: время загрузки сцены, частота кадров, количество батчей. Каждая оптимизация подтверждена профилированием на реальных устройствах. Далее — технические детали того, как мы добились стабильной работы под Cardboard и Google VR.

Как мы строим архитектуру VR-шоурума?

Пространство делится на независимые зоны, каждая — отдельная Unity Scene. Переход между зонами происходит через телепортацию по взгляду. Это снижает укачивание в 3 раза по сравнению с плавным передвижением. Структура сцены:

Showroom
├── EntryZone (фойе с категориями)
├── Zone_Furniture (мебельный зал)
│   ├── ProductPedestal_001 (диван)
│   ├── ProductPedestal_002 (стол)
│   └── NavigationPortal → Zone_Lighting
├── Zone_Lighting (зал освещения)
└── Zone_Outdoor (уличная экспозиция)

Каждая зона загружается через Addressables при телепортации. Благодаря этому контент не хранится в памяти постоянно, а подгружается по мере необходимости. Addressables обеспечивает в 4 раза более быструю загрузку по сравнению с AssetBundles, а также снижает затраты на хранение и трафик на 25%. Для каталога с частым обновлением моделей это ещё и способ бесшовного обновления — достаточно перевыпустить группу Addressables на CDN.

Оптимизация 3D-моделей

Исходные CAD-модели часто содержат миллионы полигонов. Пайплайн оптимизации включает ретопологию, запечку нормалей, подготовку PBR-текстур и конвертацию.

KTX2 с Basis Universal — обязательный формат для Android, он обеспечивает GPU-независимое декодирование и компрессию без потерь качества. Для iOS используем стандартные текстуры с mipmaps.

Сравнение форматов текстур

KTX2 даёт лучший баланс между размером и качеством на всех GPU. Для iOS используем ASTC, если устройство поддерживает — встроенная компрессия Metal.

Освещение: реалистичный вид без ray tracing

На мобильных устройствах ray tracing недоступен — реализм достигается прекомпиляцией освещения. Согласно Apple Human Interface Guidelines для VR, такой подход обеспечивает плавное взаимодействие.

Предзапечённый lightmap

Статические тени и GI рассчитываются в Editor, хранятся в текстуре. Для шоурума с постоянной геометрией это оптимально. Progressive Lightmapper в Unity даёт хороший результат. Настройки для мобиля: Lightmap Resolution 20–40 texels/unit, Compress Lightmaps включён.

Reflection Probes

Запечённые кубмапы для отражений на металле и глянцевых поверхностях. Расставляем по одному на каждую зону + дополнительные рядом с глянцевыми объектами.

Emissive материалы

Источники света как геометрия с emissive shader, запечённые в lightmap. Real-time lights используем только для эффектов (например, мерцание вывески) и не более одного на сцену.

// Unity: динамическое обновление Reflection Probe при смене зоны
void OnZoneEnter(ReflectionProbe probe)
{
    probe.RenderProbe(); // обновляем при телепортации, не в runtime
}

Взаимодействие с товаром и интеграция с каталогом

В точке осмотра товара доступны:

• Вращение модели взглядом — пользователь смотрит на стрелки-контролы, dwell-активация вращает модель.

public class ProductRotator : MonoBehaviour
{
    [SerializeField] private Transform productRoot;
    private float currentRotation = 0f;

    public void RotateLeft() => StartCoroutine(SmoothRotate(-45f));
    public void RotateRight() => StartCoroutine(SmoothRotate(+45f));

    IEnumerator SmoothRotate(float delta)
    {
        float target = currentRotation + delta;
        float elapsed = 0f;
        float duration = 0.4f;

        while (elapsed < duration)
        {
            productRoot.rotation = Quaternion.Euler(
                0,
                Mathf.LerpAngle(currentRotation, target, elapsed / duration),
                0);
            elapsed += Time.deltaTime;
            yield return null;
        }

        currentRotation = target;
    }
}

• Цветовые варианты — переключение между материалами одной модели через gaze-кнопки с цветовыми свотчами.
• Info hotspots — точки на модели с описанием характеристик: «кожа премиум», «система быстрой сборки». Открываются в world space панели при gaze-активации.

Дополнительно возможен AR-режим для просмотра товаров в реальном пространстве. Шоурум без связи с каталогом — это демо, а не продукт. Контент загружается динамически:

• Метаданные товаров (название, описание, цена, варианты) — из REST API.
• 3D-модели — из Addressables CDN по product_id.
• Наличие и цена — real-time из каталога.

При изменении коллекции не нужен перевыпуск приложения: Addressables группы обновляются через Content Delivery.

Почему gaze-навигация — лучший выбор для мобильного VR?

В мобильном VR отсутствуют контроллеры, поэтому взаимодействие строится на взгляде. Gaze-навигация проста и интуитивна: пользователь смотрит на точку назначения, удерживает взгляд 1–2 секунды — и телепортируется. Это исключает motion sickness и не требует дополнительного обучения. Альтернативы, такие как джойстик или кнопки на экране, отвлекают от погружения и менее эргономичны для 3DoF. Gaze-навигация — лучший выбор для мобильного VR благодаря естественности и снижению укачивания в 3 раза.

Для dwell-активации используется таймер 1.2–1.8 секунд с визуальной индикацией. При использовании сферического коллайдера для зоны телепортации важно задать правильный угол: 15° от направления взгляда. Это предотвращает случайные срабатывания.

Как обеспечить стабильные 60 FPS на мобильных VR-устройствах?

Целевые устройства — iPhone 12 и Android с Snapdragon 865. Основные инструменты контроля: Unity Profiler, Xcode GPU Frame Capture, Android GPU Inspector. Типичные оптимизации:

• GPU Instancing для повторяющихся элементов (например, стулья в зале).
• Occlusion Culling — объекты за стенами не рендерятся.
• LOD с тремя уровнями: низкий поликоличество >20 метров, средний >10 метров, высокий до 5 метров.
• Снижение качества shadows до 512×512 или отключение для удалённых объектов.

В результате достигаем стабильных 60 FPS даже в зонах с 50+ моделями. Если на старых устройствах падает до 30 FPS — автоматически снижаем качество текстур до 1K и отключаем real-time shadows.

Процесс работы и сроки

1. Аудит каталога: число SKU, форматы 3D-моделей, требования к обновлению контента.
2. Проектирование пространства: зонирование, навигация, точки осмотра.
3. Пайплайн оптимизации 3D-моделей и текстур.
4. Разработка: сцены, освещение, взаимодействие с товаром, Cardboard VR-режим.
5. Интеграция с каталогом и корзиной.
6. Оптимизация производительности, тестирование на целевых устройствах.

Что входит в работу

• Документация: user-flow, техническое задание, гайд по обновлению контента.
• Доступы: репозиторий с исходниками, CDN-ключи для Addressables, аккаунты Developer (App Store / Google Play).
• Обучение: видеозапись процессов обновления каталога, тестирования и деплоя.
• Поддержка: гарантийный месяц, SLA 8/5 по критическим багам.

Ориентиры по срокам

Шоурум с одной зоной и 10–20 товарами — 3–5 недель. Многозонная платформа с динамическим каталогом и корзиной — 2–4 месяца. Стоимость рассчитывается индивидуально на основе объёма контента и сложности интеграции.

Наша команда имеет 5+ лет опыта в мобильной VR-разработке и выполнила 20+ проектов для различных отраслей. Получите консультацию по вашему проекту или закажите разработку виртуального шоурума — мы поможем подобрать оптимальное решение. Свяжитесь с нами для обсуждения вашего проекта.