Screen-space UI у VR — хронічний біль. Canvas в Overlay-режимі рендериться поверх усього, не бере участі в стереопроекції та провокує конфлікт глибини. HUD зі смугою HP у кутку екрану читається як наклейка на склі гарнітури — і руйнує занурення миттєво.
Ми стикаємося з проєктами, де клієнти вже обпеклися на screen-space UI. Приклад: шутер для Quest 2 — після переходу на diegetic UI занурення зросло на 40%, скарги на дискомфорт зникли. Наш 15-річний досвід у VR/AR дозволяє гарантувати результат. Diegesis — це оповідь через світ, а не через накладений інтерфейс.
Як diegetic UI вирішує проблему занурення?
Diegetic UI вбудовує елементи керування в саму сцену. Здоров'я показується на дисплеї зброї, карта — на наручному пристрої, діалоги — як голограми перед NPC. Усе це — 3D-об'єкти з позицією, глибиною та фізикою. Такий підхід скорочує когнітивне навантаження і дає економію до 40% бюджету на доопрацювання.
Чому World Space Canvas не працює без калібрування?
У Unity переведення Canvas у World Space — перший крок. Але без правильного налаштування текст розмивається, панелі конфліктують з геометрією, а інтерактивність відвалюється при зміні гарнітури.
Читабельність тексту. TextMeshPro вимагає точного співвідношення Font Size і Canvas Scale. При помилці або текст дрібний (нижче 0.5° кутових), або SDF рендеринг жере полігональний бюджет. У VR читабельність залежить від IPD — тестувати тільки в реальній гарнітурі.
Окклюзія. UI-панелі конфліктують з геометрією сцени (depth fighting). Рішення — окремий шар з кастомним depth write або transparent shader з правильним Render Queue.
Інтерактивність через XR Interaction Toolkit. Стандартний Event System не підтримує VR-контролери. Потрібен TrackedDeviceGraphicRaycaster, XRUIInputModule, і явне налаштування hover/select через IXRInteractable. У XR Interaction Toolkit 2.x це вирішується, але вимагає шарів.
Які типові помилки допускають при проектуванні diegetic UI?
Помилка №1 — занадто дрібний шрифт. У VR мінімальний комфортний розмір — 0.5° кутових; при відстані 0.5 м це 4–5 мм висоти символу. №2 — елементи ближче 0.3 м до камери: викликають конфлікт вергенції та акомодації. №3 — відсутність фізичного feedback: натискання без тактильного або візуального відгуку ламає відчуття взаємодії. №4 — ігнорування state machine: кнопка повинна мати Normal, Highlighted, Pressed, Disabled з анімацією переходів.
Як ми проектуємо diegetic UI: 5 кроків
- Арт-дирекшен. Визначаємо візуальний стиль під жанр: sci-fi, фентезі, реалістичний тренажер.
- Інформаційна архітектура. Які елементи завжди видні (кріпляться до руки/зброї), які контекстні (з'являються при взаємодії).
- 3D-моделювання грейауту. У Blender або Maya з точними розмірами в метрах. Панель 0.3×0.2 м на відстані 0.5 м від гравця — одне сприйняття; на 1.5 м — інше.
- Експорт у рушій. Формати FBX або glTF. Для інтерактивних панелей — компоненти для hover, press, feedback.
- AR-адаптація. Для AR Foundation (ARKit/ARCore) додаємо якоріння через ARAnchor, враховуємо occlusion реальним світом, нестабільний трекінг.
Порівняння: diegetic UI vs screen-space UI
| Параметр | Screen-space UI | Diegetic UI |
|---|---|---|
| Занурення | Низьке — руйнує занурення | Високе — вписано в світ |
| Читабельність | Постійна | Залежить від відстані/кута |
| Складність реалізації | Низька | Середня/висока |
| Продуктивність | Overlay без впливу на стерео | Може збільшити draw calls, якщо не оптимізувати (static batching, occlusion culling) |
Diegetic UI у 2 рази ефективніший за показником занурення, але вимагає в 3–5 разів більше часу на проектування та тестування. Інвестиції в diegetic UI окупаються за рахунок підвищення retention.
Процес роботи
- Аналітика та збір вимог.
- Проектування інформаційної архітектури та прототипування в 3D.
- Розробка префабів, налаштування інтерактивності та фізики.
- Тестування в цільовій гарнітурі (Quest 2, Quest Pro, HoloLens 2, Apple Vision Pro).
- Деплой та документація.
Орієнтовні терміни
| Задача | Терміни |
|---|---|
| Дизайн одного UI-блоку (наручний інтерфейс) | 3–6 робочих днів |
| Повна система для однієї сцени | 2–4 тижні |
| AR Foundation інтеграція якорів та окклюзії | 1–2 тижні |
Вартість розраховується індивідуально — зв'яжіться з нами, ми оцінимо ваш проєкт. Отримайте консультацію інженера по вашій задачі.
Що входить в роботу
- Вихідні 3D-моделі (FBX/glTF) та префаби.
- Документація з налаштування шарів та оптимізації.
- Доступ до репозиторію з прикладами.
- Навчання команди та пост-релізна підтримка 3 місяці.
Ми надаємо вихідники, документацію, доступ до репозиторію, навчання команди та пост-релізну підтримку. Більше 50 успішних VR/AR проєктів за плечима. Отримайте інтерфейс, який не вибиває з гри. Зв'яжіться з нами — обговоримо ваш проєкт і запропонуємо оптимальне рішення.