UI для VR

UI для VR


Рано или поздно каждая игра сталкивается с тем, что ей необходимо взаимодействовать с игроком, показать ему сиськ.. информацию, статусы, графики и прочее, скучное и не интересное. И лучше всего с этой задачей справляется UI, он же User Interface. Вся эта вакханалия состоит из визуальных элементов, таких как поля ввода, кнопки, надписи, чекбоксы и т.д. На каждом элементе, соответственно своя логика и графика, а часто, еще и анимашка и прочие свистоперделки.

Пример "плоского" интерфейса

Мало того, что продумать, зарисовать, запрогать и сверстать интерфейс не самая простая задача, так еще и делать это предстоит не на плоском экране, а вполне себе в объемном окружении.

Пример VR интерфейса

Размышления

Здоровой практикой в VR приложениях является использования интерактивных объектов окружения: выключатель, рычаг, кнопка и т.д.

Но что если требуется не просто жмякнуть или дернуть, а полноценно просмотреть, прокрутить, посмотреть?! И тут на помощь приходят современные технологии, типа смартфона, планшета или ноутбука, которые идеальны в роли интерактивного элемента!

3D модель ноутбука

Техничка

Так как разработка ведется на игровом движке Unity, то нет смысла изобретать велосипед, тем более что стандартного функционала uGui, и TextMeshPro будет более чем достаточно.

Все UI в Unity строится на основе компонента Canvas, который "навешивается" на GameObject. Он должен быть "батей" всех UI элементов(панельки, кнопочки и прочее). И особенно важно обратить внимание на параметр Render Mode, ибо по умолчанию он выставлен в Screen Space, из за чего отрисовка интерфейса будет происходить отдельной камерой, и она будет "плоской". В нашем же случае интерфейс должен болтаться в мире, так что только World Space, только хардкор!

Компонент Canvas.

Отрисовка - это хорошо, но не стоит забывать, что мы хотим UI еще и тыкать!

Для этих целей существует еще один компонент - Graphic Raycaster

Компонент GraphicRaycaster

Не вдаваясь в подробности, этот компонент отвечает за взаимодействия с UI во всех смыслах этого слова(таскать, дергать, кликать и т.д.)

Ну и вишенкой на торте является компонент Event System - обработчик всего пользовательского рукоблудия, что мы получили выше.

Компонент EventSystem


По каждому компоненту можно почитать подробнее, жмякнув на название компонента, итак душню тут)

Реализация

Экран регистрации из го**а и палок

За исключением особенностей позиционирования и первичной настройке OpenXR(об этой гадости напишу отдельно, если интересно), сам процесс верстки и программирования мало отличается от обычного, "плоского" его собрата. Панельки, виджеты, кнопки и прочая интерактивная муть позиционируется на экране и обкладывается реакциями на те или иные события(типа OnClick, OnSelect и прочее)

Элементы на экране

Сам же экран размещается непосредственно на 3D модельке ноутбука, а уже все элементы являются "тугосерями" того самого экрана. Тадам!

Особенности

Но не стоит забывать, что это разработка, а из легкого тут.. поковыряться в носу, пока делаешь перерыв на кофе. Вот и в данном случае не забываем, что в VR нет никакой клавиатуры или мышки. Как же вводить много букоф? Есть решение - MobileKeyboard!

По факту, это обычная, мобильная клавиатура, которая вызывается в случае, если мы тыкнули на поле ввода, но делает она это только на мобильных устройствах(к слову, большинство VR шлемов работают на Android).

И как быть, если ты хочешь рукоблудить на PC? Есть решение - страдать!)

Благо, некоторые уже настрадали некоторые решения, которые то и можно использовать, дабы не городить новые велосипеды. Встречайте(барабанная дробь) - MRTK-Keyboard, инструмент, создающий клавиатуру прям перед носом игрока, позволяя тем самым вводить самые грязные словечки в любые поля ввода(пока цензур не добралась)

MRTK-Keyboard собственной персоной

Таким образом закрываются большинство потребностей во взаимодействии игрока с данными игры и наоборот) Естественно, ноутбук - это только начало! Кому охота бегать каждый раз к ноутбуку, когда есть планшеты и смартфоны, с помощью которых можно заказывать проститу.. продукты, мебель и прочие радости современности!

Девайсы, девайсики

В общем, есть ощущение, что никто даже не дочитает до этого момента, но если все таки это произойдет, поставьте позязя единорожку(если понравилось) ну или какаху(если.. ну вы поняли) и спасибо за внимание, вы няшки!)





















Report Page