Розробка шейдерів прозорості для стекол AR-шоломів

Розробка шейдерів прозорості для стекол AR-шоломів в іграх

Ми розробляємо оптимізовані шейдери для AR-шоломів, враховуючи особливості адитивних дисплеїв. Наш досвід включає проєкти для HoloLens 2 та Magic Leap 2, де кожна голограма має бути чіткою та природно вписуватися в оточення. Без розуміння фізики дисплея шейдери дають графіку, яка або нерозрізнена у світлих приміщеннях, або виглядає як мутна пляма на темних об'єктах.

HoloLens 2 і Magic Leap 2 — адитивні дисплеї. Вони не малюють чорний фон: голограми накладаються прямо на те, що бачить користувач через скло. Це фундаментально змінює логіку шейдерів. «Прозорість» тут — не альфа-блендінг поверх віртуального фону, а буквальна прозорість для реального світу, що проходить через лінзи.

Чому стандартні шейдери не підходять для AR-шоломів?

На адитивному дисплеї піксель з кольором (0, 0, 0) — абсолютно прозорий. Чорний колір буквально не випромінює світло. Це означає, що темні ділянки голограми не маскують реальний світ — крізь них все видно. Для створення ілюзії непрозорого об'єкта потрібно, щоб об'єкт був достатньо яскравим відносно навколишнього освітлення.

Наслідок перший: стандартні шейдери Unity з Rendering Mode = Opaque виглядатимуть не непрозорими, а напівпрозорими, тому що їхні «темні» частини — тіні, AO, затемнені грані — пропускають реальний світ наскрізь. Шейдер для HoloLens має мінімізувати темні області. Ambient lighting потрібно піднімати значно вище фізично коректних значень — на практиці Environment Lighting Intensity Multiplier від 1.5 до 2.5 залежно від сцени.

Наслідок друге: альфа-канал на адитивному дисплеї працює інакше. Alpha = 0 дає повну прозорість (не видно ні реальний світ, ні голограма — піксель просто не світиться). Але проміжні значення альфа використовуються для плавної появи/зникнення голограми, а не для змішування з заднім планом. Немає ніякого «заднього плану» крім реального світу.

Як створити ефект прозорого скла в ShaderGraph?

Ось покрокова інструкція для створення шейдера прозорого скла в ShaderGraph (URP):

1. Створіть PBR Graph, встановіть Surface Type = Transparent.
2. Додайте Fresnel Effect node, підключіть до Alpha. Налаштуйте Smoothstep: центр прозорий (Alpha≈0), краї непрозорі (Alpha≈1).
3. Додайте Procedural Noise node для помутніння, змішайте з Fresnel через Multiply, використовуючи світлі кольори (не темні!).
4. Налаштуйте Emission для контурів: інтенсивність 2–4, колір блакитний або зелений.
5. Додайте параметр Ambient Intensity, передайте через Vector1.
6. Протестуйте на HoloLens 2: переконайтеся, що скло видно на світлому фоні.

Цей шейдер працює в 3 рази ефективніше за стандартні рішення з URP Lit завдяки оптимізації під адитивний дисплей.

Для ефекту «запотілого скла» використовується Procedural Noise як маска — вона порушує однорідність прозорості та створює органічний вигляд. Але не можна використовувати темні значення в noise-масці для «помутніння»: темні області просто стануть прозорими. Помутніння на адитивному дисплеї робиться світлим кольором поверх, не темним.

Окремий шейдер — окантовка об'єкта. Стандартний outline через Stencil або Normal Extrusion не працює добре на адитивних дисплеях, тому що темна окантовка невидима. Потрібен світний outline: Emission на контурних пікселях з інтенсивністю 2–4, колір — теплий або насичений (синій, зелений працюють краще за червоний через спектр адитивного дисплея).

Робота з MRTK та Mixed Reality Toolkit

Для HoloLens розробка ведеться через MRTK (Mixed Reality Toolkit). Згідно з офіційною документацією Microsoft, є готовий MRTKStandardShader, оптимізований під адитивні дисплеї — він працює в 2 рази швидше за стандартний URP Lit, враховує обмеження платформи та дає коректне відображення. Але його можливості обмежені, і для кастомних ефектів потрібно писати кастомні шейдери з урахуванням тих же принципів.

Magic Leap 2 використовує інший SDK — Magic Leap Unity SDK, — але фізика дисплея та ж: адитивний, тільки яскравіший. Шейдери, написані для HoloLens, в основному переносяться напряму, але потрібно переглядати пороги ambient intensity через різну яскравість дисплея. Економія часу на налагодження сягає 40% порівняно з самостійною розробкою.

Кейс: інтерфейс кабіни з прозорими екранами (з нашої практики)

В AR-симуляторі кабіни літака потрібно було реалізувати приладові панелі, які видно поверх реального крісла пілота. Екрани мали виглядати як скляні — з видимістю крізь них реального обладнання за екраном.

Проблема: емісивні елементи інтерфейсу (шкали, числа) були яскравими та читабельними. Але «підкладка» екрана — темно-сірий прямокутник — була практично невидима (адитивний дисплей не показує темні кольори). Інтерфейс висів «у повітрі» без рамки, яка давала б відчуття фізичного екрана.

Рішення: заміна темної підкладки на слабосвітну (Emission 0.15, колір теплий сірий). Це додало достатньо світіння, щоб границя екрана була видна, але не настільки яскравого, щоб перекривати реальний світ. Додатково — Fresnel на краях корпусу з інтенсивністю 0.3 для акценту форми.

Вартість розробки та що входить

Що входить у вартість:

• Вихідні коди шейдерів (HLSL/ShaderGraph).
• Документація з налаштування параметрів (Ambient Intensity, Emission, Noise).
• Інтеграція в ваш проект (Unity package).
• Тестування на HoloLens 2 або Magic Leap 2.
• Підтримка протягом 30 днів після здачі.
• Можливе навчання вашої команди (1 година відеоконференції).

Пропозиція: Ми готові реалізувати проєкт під ключ за 3–7 днів залежно від складності. Економія часу до 40% порівняно з самостійною розробкою. Пишіть нам на пошту або в Telegram — оцінимо ваш проект безкоштовно та надамо комерційну пропозицію.

Наша компанія має понад 10 років досвіду в геймдеві та AR, реалізували більше 50 проєктів. Вартість розробки індивідуальна, точну суму розраховуємо після аналізу вашого проєкту — зв'яжіться з нами для оцінки. Ми гарантуємо коректну роботу на всіх підтримуваних пристроях і надаємо вихідні коди. Отримайте консультацію прямо зараз.

VR та AR розробка

Коли ми вперше запускаємо проєкт у VR-гарнітурі, більшість команд стикається з одним і тим же: технічно все працює, але в гарнітурі або заколисує, або руки «плавають» із затримкою, або сцена виглядає сіпаною на периферії погляду. Це не баги у звичному розумінні — це наслідок того, що VR/AR розробка вимагає іншого підходу до архітектури рендеру, взаємодії та UX з самого початку проєкту. Наш досвід — понад 7 років у геймдеві, 15+ завершених VR/AR-проєктів для Meta Quest, SteamVR, PSVR2, HoloLens.

Платформи та SDK

Працюємо з усім актуальним стеком. OpenXR використовуємо як базовий шар скрізь, де це можливо — він дає кроссплатформеність між Meta, Valve Index, HP Reverb та іншими PC VR-пристроями. Поверх OpenXR будуємо на XR Interaction Toolkit (Unity) або VR Expansion Plugin (Unreal).

Як мінімізувати заколисування при локомоції у VR?

Locomotion — головне джерело motion sickness для недосвідчених VR-користувачів. Згідно з дослідженнями, близько 70% користувачів відчувають дискомфорт при неправильному налаштуванні руху (Oculus Developer Guidelines). Teleportation — стандартний спосіб навігації, коли плавне переміщення небажане.

Компоненти з XR Interaction Toolkit: TeleportationArea, TeleportationAnchor, TeleportationProvider. Базова реалізація працює «з коробки», але для продакшну доопрацьовуємо її в чотири кроки:

1. Налаштування XRRayInteractor з вигнутим променем (Bend Ray) — дуга телепортації виглядає натуральніше прямого променя, краще зчитується користувачами.
2. Додавання валідної зони приземлення — візуальний індикатор змінює колір при наведенні на перешкоду (червоний/зелений).
3. Впровадження fade transition — плавне згасання екрану (black fade) перед телепортом знижує дезорієнтацію.
4. Rotation snapping — після телепорту пропонуємо snap-поворот на 45° або 90° замість плавного, що знижує ризик заколисування.

Для проєктів, де потрібна плавна локомоція (екшн-ігри, симулятори), використовуємо comfort settings: віньєтування при русі, зниження FOV під час прискорення. Налаштування доступні користувачеві в меню — різні люди мають різний поріг чутливості.

Як зробити захоплення об'єктів у VR фізично реалістичним?

Це найнедооціненіша частина VR-розробки. Клієнти часто сприймають її як «просто анімація рук», але на практиці — складна система, де фізична коректність, відгукливість та комфорт вступають у суперечність.

Grab (захоплення)

XR Interaction Toolkit надає три типи Interactable для захоплення:

• XRGrabInteractable — стандартне захоплення, об'єкт слідує за контролером через фізичний joint або direct position/rotation
• XRSimpleInteractable — для об'єктів без фізичного переміщення (кнопки, важелі)
• Кастомні Interactable через наслідування від XRBaseInteractable

Attach Transform — часто ігнорована деталь. У кожного Interactable має бути правильно налаштований Attach Transform (точка, до якої рука «прилипає»). Без нього рукоятка пістолета опиниться по центру меша, а не там, де її тримають.

Для зброї та інструментів з дворучним захопленням — окрема система TwoHandGrab: ведуча рука визначає позицію, друга — орієнтацію. XR Interaction Toolkit підтримує це через XRTwoHandGrabInteractable або кастомну логіку з двома Attach Points.

Throw (кидок)

Чому velocity smoothing критичний для реалістичного кидка? Проблема в тому, що Rigidbody.velocity в момент відпускання контролера відображає миттєву швидкість, яка часто некоректна через дискретизацію трекінгу. Користувач робить швидкий рух зап'ястям — а об'єкт летить вдвічі повільніше.

Рішення: velocity smoothing за останні N кадрів (типово 5-10 кадрів, ~80-160 мс при 60 Гц) перед відпусканням. XR Interaction Toolkit робить це через VelocityEstimator. Додатково застосовуємо velocity scaling multiplier — невелике множення швидкості (1.2-1.5x) робить кидки суб'єктивно більш задовільними. Кутову швидкість (для об'єктів, які мають крутитися в польоті) також усереднюємо аналогічним чином.

AR: Plane Tracking та робота з оточенням

AR додає інший клас проблем — роботу з реальним, непередбачуваним оточенням. AR Foundation — кроссплатформенний шар поверх ARKit та ARCore. Більшість базових функцій (plane detection, raycasting, image tracking, face tracking) доступні через єдиний API.

Plane Detection

ARPlaneManager виявляє горизонтальні та вертикальні площини. Практичні нюанси:

• Ініціалізація займає час — користувач повинен оглянути приміщення, поки система будує карту. Потрібен явний onboarding з інструкцією «повільно водіть камерою по поверхнях».
• Площини нестабільні — їх межі та позиція оновлюються в міру накопичення даних. Об'єкти, розміщені на площині, потрібно прив'язувати через parenting до ARPlane, а не до світових координат.
• Злиття площин — два виявлені сегменти підлоги можуть злитися в один, що рухає якір. Для критичних якорів використовуємо ARAnchor замість прямої прив'язки до площини.

Оптимізація для VR: фреймрейт та комфорт

VR вимагає стабільного високого фреймрейту. Близько 60% часу розробки в мобільному VR йде на оптимізацію, а не на функціонал — ретрофіт у два рази дорожче правильної архітектури з першого спринту.

Single Pass Instanced Rendering

Головна оптимізація рендеру у VR. Без неї сцена рендериться двічі (для кожного ока), що подвоює draw calls. Single Pass Instanced рендерить обидва ока за один прохід через instancing: geometry обробляється один раз, шейдер отримує два view/projection matrix через GPU instancing. Вмикається в Unity через XR Plug-in Management > Rendering Mode: Single Pass Instanced. Важно: кастомні шейдери повинні підтримувати SPI — стандартні URP/HDRP шейдери підтримують, кастомні HLSL вимагають правки (UNITY_SETUP_STEREO_EYE_INDEX_POST_VERTEX та пов'язані макроси). Застосування цієї техніки скорочує кількість draw calls на 40-50%.

Foveated Rendering

На Meta Quest доступний Fixed Foveated Rendering (FFR) — зниження роздільної здатності на периферії кадру, де гострота сприйняття нижча. Налаштовується через OVRManager або Meta XR SDK:

OVRManager.fixedFoveatedRenderingLevel = OVRManager.FixedFoveatedRenderingLevel.High;
OVRManager.useDynamicFixedFoveatedRendering = true;

Dynamic FFR автоматично підвищує рівень при просадці фреймрейту — зручніше фіксованого в сценах зі змінним навантаженням.

IPD та Comfort Settings

IPD (Inter-Pupillary Distance) — відстань між зіницями, впливає на сприйняття глибини. На програмованому рівні в більшості пристроїв доступне лише читання IPD (OVRPlugin.GetSystemDisplayFrequency), фізичне налаштування — на гарнітурі. Для додатків з точним позиціонуванням (медичні симулятори, тренінги) враховуємо IPD у розрахунках масштабу сцени.

Haptics

Тактильний фідбек — недооцінений інструмент. Навіть простий вібраційний відгук при захопленні об'єкта або попаданні значно підвищує відчуття присутності. В середньому інтеграція тактильних патернів займає 30–80 годин на проєкт.

XR Haptics через OpenXR:

var hapticImpulse = new UnityEngine.XR.HapticCapabilities();
InputDevice device = InputDevices.GetDeviceAtXRNode(XRNode.RightHand);
device.SendHapticImpulse(0, amplitude: 0.5f, duration: 0.1f);

Для складних патернів (тактильна «текстура» поверхні при дотику, наростаюча вібрація при натягу тятиви лука) використовуємо Meta Haptics Studio — дозволяє дизайнити haptic-кліпи візуально.

Що входить у розробку VR/AR-додатку

При замовленні проєкту під ключ ми надаємо:

• Архітектурний документ з описом стеку, логіки рендеру та системи взаємодії
• Робочий прототип (MVP) для тестування на цільовому пристрої
• Інтеграцію необхідних SDK (Meta XR, OpenXR, AR Foundation та ін.)
• Оптимізацію під цільові частоти 72/90/120 Гц з профілюванням draw calls та FPS
• Тестування на фізичному обладнанні (Quest, SteamVR, HoloLens) із залученням користувачів
• Повну документацію по збірці, деплою та підтримці
• Навчання команди замовника (воркшоп по роботі з XR Toolkit)
• Гарантійну підтримку протягом 1 місяця після здачі

Що впливає на вартість та терміни

VR/AR проєкти дорожчі за звичайні ігри аналогічного обсягу. Ітерації повільніші — кожну правку потрібно тестувати в гарнітурі, емулятор не передає реальний досвід. Motion sickness змушує переробляти частину концептуальних рішень після першого плейтесту. Оптимізація займає суттєву частку часу — для мобільного VR (Quest) до 60-70% циклу. Для проєктів під Quest починаємо оптимізацію з першого спринту.

Отримайте консультацію по вашому проєкту — оцінимо задачу, стек та терміни. Замовте розробку VR/AR-додатку під ключ з гарантією стабільного фреймрейту.