Представьте: пользователь открывает ваше приложение, надевает Cardboard и оказывается в центре виртуального тура по дому. Он смотрит влево — кухня, вправо — гостиная, задерживает взгляд на телевизоре — всплывает спецификация. Но реальность мобильной VR-разработки — это борьба за каждую миллисекунду задержки head tracking и управление десятками 360-панорам высокого разрешения. Мы проектируем архитектуру, где latency стабильно ниже 20 мс, а контент обновляется на лету без релиза в App Store.
Готовы взяться за ваш проект под ключ: зафиксируйте требования, а мы предложим оптимальный стек — от Unity до нативного Metal или Vulkan. Типовой тур с 10-15 сценами и навигацией — 2–3 недели работы. Оценим вашу задачу за один день.
Проблемы, которые мы решаем
- Задержка head tracking в VR. Используем нативный рендеринг (Metal на iOS, Vulkan на Android) с прямым доступом к IMU. На практике latency стабильно ниже 20 мс — в 3-5 раз лучше WebView.
- Долгая загрузка панорам. Предзагрузка соседних сцен в фоне, сжатие текстур до 8K JPEG с поддержкой mipmap. Типичная экономия времени загрузки — 40%.
- Сложность обновления контента. Встраиваем CMS или конфиг на CDN — новые туры появляются через пару минут после редактирования, без повторной аттестации в магазинах. Экономия бюджета на поддержке — до 50%.
Благодаря 7+ годам опыта и 50+ реализованным проектам мы гарантируем стабильную работу на устройствах от iPhone SE до Galaxy S24.
Как устроен граф сцен для VR-тура?
Тур — это граф. Каждая точка (node) — 360-панорама или 3D-сцена. Рёбра графа — переходы (hotspots). Данные хранятся в JSON-конфиге:
{
"tour_id": "apartment_demo",
"start_node": "living_room",
"nodes": [
{
"id": "living_room",
"type": "equirectangular",
"media_url": "scenes/living_room_8k.jpg",
"hotspots": [
{ "id": "to_kitchen", "target_node": "kitchen",
"position": { "yaw": -45, "pitch": -10 },
"label": "Кухня" },
{ "id": "info_tv", "type": "info",
"position": { "yaw": 20, "pitch": 5 },
"content": "Samsung QLED 65\"" }
]
}
]
}
Клиентская часть загружает граф при старте, предзагружает медиа соседних нод. Для offline-режима — кеширование выбранных туров с проверкой версии конфига.
Какой рендерер выбрать: WebView или нативный?
| Критерий | WebView (Three.js) | Нативный (Metal/Vulkan) |
|---|---|---|
| Задержка head tracking | 50–100 мс (зависит от WebView) | <20 мс (прямой доступ к IMU) |
| Поддержка Cardboard VR | Нет | Полная |
| Скорость обновления контента | Мгновенно (серверный) | Требуется релиз при смене движка |
| Производительность | Средняя (WebGL) | Высокая (оптимизация под GPU) |
| Сложность разработки | Низкая (HTML/JS) | Высокая (Metal/Vulkan/Unity) |
Для полноценного VR в Cardboard VR нативный рендеринг в 3-5 раз лучше по качеству трекинга. Если VR не требуется, WebView достаточно и быстрее в разработке.
Как обеспечить плавные переходы между сценами?
Жёсткий jump между 360-сценами создаёт дискомфорт в VR. Мы используем один из трёх подходов:
| Тип перехода | Описание | VR comfort | Сложность |
|---|---|---|---|
| Fade to black | Fade за 0.5 с, стандарт Google VR Design Guidelines | Высокий | Низкая |
| Fade + scale | Сцена уменьшается/увеличивается | Средний | Средняя |
| Video transition | Короткий ролик «прохода» | Высокий | Высокая |
teleportation через fade — standard для VR. На non-VR платформах часто используем fade+scale, экономящий время съёмки.
// Unity: корутина перехода с fade
IEnumerator TransitionToScene(string targetNodeId) {
yield return StartCoroutine(FadeOut(duration: 0.5f));
LoadScene(targetNodeId);
yield return StartCoroutine(FadeIn(duration: 0.5f));
}
Интерактивные hotspots: типы и реализация
Hotspot в пространстве — это raycast из центра взгляда + gaze dwell activation (удержание взгляда 1-2 секунды). Поддерживаемые типы:
- Navigation — переход в другую точку.
- Info panel — всплывающая карточка с текстом/фото/видео.
- Media — воспроизведение видео на поверхности (TV в интерьере).
- Link — открытие браузера для внешнего действия (забронировать, купить).
Hotspot рендерится в world space на Billboard, всегда повёрнут к камере. Масштаб — constant apparent size через transform.LookAt(camera) + scale = distance * constant.
Как интегрировать CMS для обновления контента без релиза?
Туры должны обновляться без повторной выкладки в магазины. Мы интегрируем админ-панель или храним конфиги на CDN. Приложение загружает актуальный граф при старте, для офлайна — кеширование с версионированием. Экономия на поддержке — до 50% по сравнению с частыми релизами.
Что входит в разработку (deliverables)
- Архитектурный документ с графом сцен и типами hotspots.
- Исходный код с документацией и CI/CD.
- Инструкция по обновлению контента через CMS или конфиг.
- Тестирование на 5+ реальных устройствах (iPhone, Android).
- Гарантия 3 месяца на выявленные баги.
Процесс работы
- Аудит контента — определяем тип медиа (фото/видео/3D), количество сцен, требования к обновлению.
- Проектирование — создаём граф сцен, выбираем рендерер и схему переходов.
- Разработка — реализуем рендеринг панорам, head tracking, взаимодействие с hotspots, переходы.
- CMS-интеграция — подключаем систему обновления контента без релиза.
- Тестирование — оцениваем качество head tracking в режиме Cardboard, производительность на budget-устройствах.
Ориентировочные сроки
- Базовое приложение для одного тура с фото-панорамами и навигационными hotspots — 2-3 недели.
- Полноценная платформа с CMS, несколькими типами hotspots, offline-режимом и Cardboard VR — 2-3 месяца.
Свяжитесь с нами для точной оценки вашего проекта. Закажите консультацию — мы поможем выбрать оптимальный стек и предложим прозрачное ценообразование.