Проєктування 3D-графіки інтерфейсів (Diegetic UI) для AR VR ігор

Проектування 3D-графіки інтерфейсів (Diegetic UI) для AR VR ігор

Screen-space UI у VR — це біль. Canvas у Overlay або Screen Space Camera режимі рендерить поверх всієї сцени, не участвує в стереопроекції нормально, викликає конфлікт глибини у частини користувачів. Класичний HUD з полосою HP у кутку екрану у VR читається як наклейка на скло гарнітури — та руйнує іммерсію за секунди.

Diegetic UI розв'язує це радикально: інтерфейс стає частиною світу. Здоров'я показується на дисплеї оружия, карта — на наручному пристрої персонажа, діалогові варіанти всплувають як голограми перед NPC. Все це — об'єкти у світовому просторі, що мають позицію, глибину та фізику.

Технічні проблеми, які виникають при переході на World Space Canvas

У Unity стандартний шлях — перевести Canvas у World Space режим та розташувати у сцені. Звучить просто. На практиці — кілька граблей.

Читаємість тексту при масштабуванні. World Space Canvas з TextMeshPro потрібно калібрувати: при неправильному співвідношенні Font Size та Canvas Scale текст либо розмитий (растризований занадто дрібно), либо вимагає величезного полігонального бюджету для SDF рендерингу на великій площі. У VR текст ще й читається інакше через IPD — потрібно тестувати у реальній гарнітурі, а не у Play Mode.

Окклюзія та depth fighting. UI-панель, розташована у просторі, конфліктує з геометрією сцени. Потрібно либо використовувати окремий шар з кастомним depth write, либо йти на transparent shader з правильно настроєним Render Queue. Частий помилка — UI проваливається за стіни або мерцяє на стику з поверхнею.

Інтерактивність через XR Interaction Toolkit. Стандартний Event System не працює з VR-контролерами з коробки. Потрібна TrackedDeviceGraphicRaycaster замість стандартного GraphicRaycaster, настройка XRUIInputModule та написання логіки hover/select для кожного інтерактивного елемента. У XR Interaction Toolkit 2.x це розв'язується через IXRInteractable інтерфейс та XRSimpleInteractable на UI-компонентах, але вимагає явної настройки шарів взаємодії.

Як будується 3D-дизайн інтерфейсу

Перш усього — арт-дирекшен. Diegetic UI повинен органічно вписуватися у світ гри. Sci-fi шутер, фентезійна RPG та медичний VR-тренажер вимагають принципово різної візуальної логіки.

Проектування починається з інформаційної архітектури: що гравець повинен видити завжди, що — по запиту, що — у визначеному контексті. Це визначає розташування UI у просторі: постійно видимі елементи крепляться до руки або оружия, контекстні — з'являються у світі при взаємодії з об'єктами.

Далі — модельний greyout у 3D-редакторі (Blender або Maya), з чіткими розмірами у метрах. У VR одиниці виміру мають значення: панель 0.3 × 0.2 метра на дистанції 0.5 метра від гравця — одне сприйняття; та ж панель на 1.5 метра — совсім інше.

Кінцеві ассети експортуються у FBX або glTF для імпорту у движок. Для інтерактивних панелей — окремі компоненти для hover-станів, press-анімації, feedback-візуалізації.

У AR (через AR Foundation + ARKit/ARCore) логіка трохи інша: UI повинен коректно якоритися до AR-площин або об'єктів через ARAnchor, враховувати окклюзію реальним світом (якщо включен depth occlusion), та нормально працювати в умовах нестабільного трекінгу.

Типічні помилки при проектуванні Diegetic UI

• Занадто дрібний шрифт. У VR мінімальний комфортний розмір — близько 0.5° угловых. При дистанції 0.5 м це близько 4–5 мм висоти символа у світових одиницях.
• Елементи, розташовані занадто близько до камери (< 0.3 м). Викликають дискомфорт через конфлікт вергенції та аккомодації.
• UI без фізичного feedback. У VR натискання кнопки без тактильного або візуального відклику відчувається сломаним — навіть якщо технічно все працює.
• Відсутність state machine для елементів. Кнопка повинна мати явні стани: Normal, Highlighted, Pressed, Disabled — та анімовані переходи між ними.

Вартість розраховується індивідуально після аналізу вимог та цільової платформи.