UI у VR — не екран, який користувач бачить перед собою. Це об'єкти в просторі, з якими він взаємодіє руками чи променями. Наші інженери з 8-річним досвідом у геймдеві вирішують це завдання під ключ: від прототипу до фінального деплою. Звичний Canvas у Screen Space не працюватиме. World Space Canvas — відправна точка, але й тут починаються складнощі.
Стандартна помилка: взяти UI з 2D-гри, перемкнути Canvas на World Space, помістити перед гравцем — і отримати панель, яка або надто близько (незручно читати у VR на відстані 30 см), або надто далеко, або не реагує на контролери. Оцінимо ваш проєкт — зв'яжіться для консультації.
Чому стандартний Canvas Screen Space не підходить для VR?
Screen Space Canvas прив'язаний до екрана. У VR він не враховує глибину — текст і кнопки накладаються на сцену, викликаючи конфлікт акомодації та конвергенції. Це призводить до швидкої втомлюваності та запаморочення. World Space Canvas розміщує UI в реальних координатах: ви можете підійти, відійти, зазирнути за панель.
Дистанція та кутовий розмір елементів
У VR все вимірюється в кутових градусах, не в пікселях і не в метрах. Комфортна зона читання — 1.5–2 метри від очей користувача. На цій відстані шрифт повинен займати мінімум 0.5° кута огляду для впевненого читання — це приблизно 1.5 см висоти символу на відстані 2 м.
Кнопки потребують ще більшого розміру для впевненого натискання променем: мінімум 3×3 см фізичних на 2 метрах — це 0.86°. Дрібні елементи UI, які чудово працюють на моніторі, у VR стають неюзабельними.
Інтерфейс слід розміщувати в «зоні комфорту» — горизонтально в межах ±35° від напрямку погляду, вертикально в межах ±15°. Панель, розміщена збоку або знизу, потребує постійного повороту голови та втомлює.
Як правильно налаштувати XR Interaction Toolkit для UI?
XR Interaction Toolkit (XRI) — стандарт для взаємодій у VR на Unity. Для UI надає TrackedDeviceGraphicRaycaster (заміна GraphicRaycaster для World Space Canvas) і XR Ray Interactor на контролері. У наших проєктах ми використовуємо XRI версії 2.5+ для підтримки постійних кутових розмірів.
Базова налаштування: Canvas → додати TrackedDeviceGraphicRaycaster, прибрати стандартний GraphicRaycaster. На контролері — XR Ray Interactor з LineType = StraightLine або ProjectileLine для більш органічного вигляду. UI Press Threshold — чутливість «натискання» променем, зазвичай 0.1–0.2 для Trigger-based взаємодії.
Проблема з EventSystem у XRI: стандартний StandaloneInputModule конфліктує з XRUIInputModule. У сцені повинен бути лише один EventSystem з XRUIInputModule. При імпорті XRI пакета це іноді налаштовується автоматично, але при роботі з кількома канвасами можуть виникати конфлікти — особливо якщо частина UI була створена до підключення XRI. Ми гарантуємо коректне налаштування всіх модулів введення.
World Space Canvas і роздільна здатність текстур
World Space Canvas рендериться в світових координатах через CanvasScaler з Scale Factor. Роздільна здатність текстури канваса залежить від фізичного розміру Canvas × Reference Pixels Per Unit. За замовчуванням Reference Pixels Per Unit = 100 — для Canvas 1×0.5 м це 100×50 умовних одиниць. При рендері у VR це буде виглядати розмито.
Правильна налаштування: CanvasScaler → Scale With Screen Size не застосовне для World Space. Використовуємо Constant Physical Size з Physical Unit = Centimeters — це дає передбачуваний розмір елементів незалежно від Canvas dimensions. Текст рендеримо через TextMeshPro — його distance field рендеринг значно кращий за стандартний Unity Text при масштабуванні в просторі.
Додатково: для World Space Canvas у VR обов'язково вмикати Pixel Perfect = false (він ламає просторовий рендер) і перевіряти Dynamic Pixels Per Unit у CanvasScaler — для VR зазвичай потрібно значення 2–4 для чіткого тексту.
Інтерфейс на передпліччі: «наручний годинник» паттерн
Один із найбільш прийнятих паттернів у VR UI — інтерфейс, прикріплений до передпліччя недомінантної руки. Гравець піднімає ліву руку, повертає долонею до себе — з'являється панель з інвентарем, картою або налаштуваннями.
Реалізація: Canvas як дочірній об'єкт LeftHandController з локальним зміщенням і ротацією. Активація через Palm Up detection: беремо Vector3.Dot(leftHand.up, Camera.main.transform.forward) — коли значення вище порогу (~0.7), рука повернута долонею до обличчя, показуємо UI.
Важливо: UI повинен з'являтися плавно (Lerp alpha + scale за 0.15–0.2 с), інакше миттєва поява панелі прямо перед очима лякає. І не повинен з'являтися випадково при рухах у бою — потрібен мінімальний threshold за часом утримання пози (0.3–0.5 с).
Haptic Feedback і візуальне підтвердження
У VR немає звуку кліка миші та немає фізичного натискання кнопки. Без зворотного зв'язку гравець не розуміє, чи потрапив він променем у кнопку та чи натиснув її.
Мінімальний набір: візуальний hover state (кнопка змінює колір при наведенні променя), візуальний pressed state (кнопка «вдавлюється» — scale по Z на 0.05–0.1 одиниці), haptic pulse при натисканні через XRBaseController.SendHapticImpulse(0.3f, 0.05f). Трьох сотих секунди легкої вібрації достатньо для підтвердження. Без хаптики кнопки у VR відчуваються «мертвими».
Що входить у роботу
| Етап | Результат |
|---|---|
| Аналіз сцени та вимог | Документ з рекомендаціями щодо розміщення UI |
| Прототипування інтерактивів | Робочий прототип з базовою взаємодією |
| Інтеграція XRI та налаштування EventSystem | Коректно працюючі промені та кнопки |
| Налаштування Haptic Feedback та анімацій | Кнопки з візуальним і тактильним зворотним зв'язком |
| Оптимізація draw calls та batching | UI з FPS budget під цільові пристрої |
| Тестування на цільових гарнітурах | Звіт та виправлення багів |
| Підсумкова документація | Інструкція з інтеграції та підтримки |
Орієнтовні терміни
| Тип інтерфейсу | Терміни |
|---|---|
| Базова World Space панель (Ray Interactor) | 3–5 днів |
| Набір UI компонентів (меню, інвентар, HUD) | 1–3 тижні |
| Складний інтерфейс (наручний, жести, зонування) | 3–6 тижнів |
Вартість розраховується індивідуально після ознайомлення з дизайн-макетами та сценаріями взаємодії. Отримайте консультацію — напишіть нам, ми оцінимо проєкт протягом 2 робочих днів.