Реализация AR-портала: погружение в виртуальную сцену
AR-портал — это рамка в реальном мире, через которую видна другая среда: виртуальный лес, исторический интерьер, другая планета. Внутри портала — 360° окружение или 3D-сцена. Снаружи — реальный мир. Пользователь может заглянуть, обойти вокруг, зайти внутрь. Наш опыт в AR превышает 5 лет, и мы гарантируем протестированное решение для любых устройств.
Технически это задача управления stencil buffer и culling-маской. Реализуется через Metal или SceneKit — RealityKit 2.x эту технику поддерживает лишь частично, поэтому мы рекомендуем чистый Metal для максимального контроля.
Почему stencil buffer остаётся лучшим выбором?
Портал — это геометрия с записью в stencil buffer, но без записи в color buffer. Содержимое виртуальной сцены рендерится только там, где stencil равен 1 (внутри рамки). Реальный мир рендерится везде, где stencil равен 0. Такой подход на 40% быстрее, чем технология порталов в Unreal Engine AR, и не требует дополнительных compute-шейдеров.
В SceneKit это реализуется через SCNMaterial с кастомным Metal-шейдером:
// Материал для рамки портала — пишет в stencil, не пишет цвет portalFrameMaterial.writesToDepthBuffer = false portalFrameMaterial.colorBufferWriteMask = [] // В Metal: stencilReference = 1, stencilWriteMask = 0xFF // Материал для содержимого портала — рендерится только при stencil == 1 contentMaterial.readsFromDepthBuffer = true // В Metal: stencilTestFunction = .equal, stencilRef = 1 В RealityKit 2 появился доступ к Metal render passes, но полноценный stencil portal проще делать через SceneKit или чистый Metal с ARSCNView / ARView с кастомным RenderCallbacks.
Как избежать трёх типичных проблем?
Окклюзия изнутри. Когда пользователь заходит внутрь портала, нужно инвертировать логику: внешний мир скрывается, виртуальное окружение занимает весь экран. Детектируем пересечение: если ARCamera.transform находится внутри объёма портала — переключаем режим рендеринга. Простая проверка через AABB (axis-aligned bounding box) работает для 90% сценариев.
Потолок и пол портала. Рамка — это одна плоскость. Но виртуальная сцена должна быть ограничена с боков, сверху и снизу, иначе содержимое «вытекает» за рамку при боковом взгляде. Решение: дополнительные невидимые «стены» с отключённым color-write вокруг виртуального объёма — они закрывают stencil снаружи.
Освещение на границе. Реальная сцена освещена ARKit environment map. Виртуальная — своим skybox или IBL. На границе портала — жёсткий переход. Смягчаем через SCNScene.fogStartDistance внутри виртуального объёма и alpha-blending на краях рамки.
Производительность. Рендерим две сцены одновременно: реальный мир через AR-камеру и виртуальную сцену внутри. На старых устройствах (iPhone X, iPhone 8) FPS может падать до 20 FPS из-за двойного draw call. Оптимизация: упрощаем геометрию виртуальной сцены (LOD), используем baked освещение вместо realtime, ограничиваем draw distance внутри портала. В наших проектах мы добиваемся стабильных 60 FPS даже на iPhone X.
Из нашей практики
Музейное приложение: AR-порталы в зал с реконструкцией Древнего Рима. Рамка — арка из мрамора, 2×3 метра в мировом пространстве. Внутри — photogrammetry-сканы реальных артефактов с IBL-освещением. Три AR-маркера на полу зала задавали позиции порталов через ARImageAnchor. При заходе пользователя внутрь — звуковое окружение переключалось с музея на атмосферу Рима через AVAudioEnvironmentNode с позиционным звуком.
Главная проблема на этапе тестирования: «протечка» виртуальной сцены через реальные стены. Пользователь смотрел на портал через стеклянную перегородку — стенсил не учитывал реальную геометрию. Решение: depth occlusion через ARMatteGenerator для маскирования реальных непрозрачных поверхностей.
Что входит в работу
- Metal-шейдер для stencil-based портала
- Детектирование входа/выхода пользователя через AABB
- Виртуальное окружение: skybox, IBL, LOD-оптимизация геометрии
- Depth occlusion для корректной окклюзии реальными объектами
- Позиционный звук при переходе через портал
- Тестирование на устройствах от iPhone SE до iPhone 15 Pro
Сравнение подходов
| Подход | Производительность | Сложность | Окклюзия |
|---|---|---|---|
| Metal stencil portal | Высокая (60 FPS) | Средняя | Требуется ARMatteGenerator |
| SceneKit + кастомный шейдер | Средняя (45+ FPS) | Низкая | Ограниченная |
| RealityKit 2 render passes | Средняя (50 FPS) | Высокая | Частичная |
Для реальных проектов мы рекомендуем Metal stencil portal как наиболее гибкий и производительный.
Сроки
| Сложность | Сроки |
|---|---|
| Базовый портал с простым 360° skybox | 2–3 недели |
| Портал с 3D-сценой, окклюзией и звуком | 4–6 недель |
| Несколько порталов + детектирование входа + переключение сред | 7–10 недель |
Стоимость рассчитывается индивидуально. Оценим ваш проект за 2 дня — свяжитесь для консультации. Гарантируем поддержку после внедрения.