Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Вибір способу управління часто стає проблемою для розробника мобільних VR-додатків, адже далеко не кожен користувач в наш час має контролер для свого девайса. У цій статті ми розповімо вам про цікаву системі управління без джойстика - GVRNavi, її функціонал і можливості. Також ми надамо детальну інструкцію по створенню власного VR-додатки з використанням цієї системи.

вступ

Останнім часом велике поширення набувають ігри та програми у віртуальній реальності. І якщо з HTC Vive, Oculus Rift, PS VR і подібними все зрозуміло, то з віртуальною реальністю на мобільних пристроях є одна велика проблема. Як ви знаєте, є різні окуляри віртуальної реальності для мобільних пристроїв: від Google Cardboard і VR BOX до Google Daydream і Samsung Gear VR, які коштують значно дорожче. Не у всіх є включається в поставку управління, наприклад, джойстики.

Так ось, про проблему. Розглянемо основні способи управління пересуванням без джойстика в мобільній віртуальної реальності:

  • Рух по точкам. Підходить для віртуальних музеїв та схожих проектів. Основною проблемою даного способу є відсутність можливості ходити в будь-якому напрямку, тобто свободи переміщення.
  • Рух у напрямку погляду. Свобода пересування є, але відсутня можливість щось розглянути. Також проблемою є постійні зіткнення зі стінами. Може підійти для РАННЕР.
  • Віртуальний джойстик знизу. Свобода пересування є, але при частому перемиканні постійно доводиться нахиляти голову далеко вниз, як підсумок - шия може почати хворіти. На даний момент досить популярний спосіб.
  • GVRNavi. Є свобода переміщення, немає проблем з надмірними нахилами голови. З мінусів - в рідкісних випадках може загороджувати контент. Цю проблему можна вирішити за допомогою налаштувань всередині Ассет.

Як працює GVRNavi

опис механіки

Ходьба здійснюється шляхом переміщення курсору на горизонтальну смугу навігації (див. Скріншот). Ця смуга розширюється, і гравець починає рухатися вперед. Якщо курсор відвести зі смуги, то гравець зупиняється, а смуга стискається, зникаючи з екрана.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 1 - демонстрація роботи GVRNavi

Організація меню і підміню в віртуальної реальності без необхідності використання джойстика

Навігаційна панель може бути декількох квітів (різних або однакових). При переході на наступну смугу зайві зникають, не захаращуючи екран.

Пункти меню на панелі навігації можна прокручувати вліво і вправо, просто повертаючи голову.

Організація меню і підміню на об'єктах у віртуальній реальності

Додатково до навігаційної панелі ви можете помістити меню на об'єкти в віртуальному просторі. На відміну від панелі навігації, меню на об'єкті не буде рухатися за поглядом користувача.

Найбільший плюс плагіна в тому, що не доведеться дуже сильно мотати головою (вгору і вниз), щоб почати йти. Досить зручно його використовувати в презентаційних речах і іграх жанру квест, пригода, Раннер і т.п. де не потрібно активне переміщення боком.

Детальна інструкція по створенню додатка з використанням GVRNavi

підготовка

Встановлюємо Unity Daydream technical preview. Необхідно переконатися, що при установці включений компонент "Android Build Support" для Android або "iOS Build Support" для iOS. Для складання VR-додатки під iOS можна використовувати звичайний Unity3d версії 5.2.1 і вище.

Створюємо новий проект. Вибираємо потрібну платформу для проекту: File → Build Settings → Android або iOS.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 2 - вікно "Build Settings"

Далі йдемо в File → Build Settings → Player Settings. Ставимо галочку навпроти "Virtual Reality Supported" і вибираємо "Cardboard".

Ілюстрація 3 - вікно "Player Settings"

Завантажуємо і імпортуємо Google VR SDK for Unity (на момент написання статті версію 1.30) і GVRNavi.

Налаштування Google VR SDK

Для початку на сцену необхідно додати стандартні префаб з Google VR SDK, які забезпечать управління камерою в просторі і роботу системи подій:

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 4 - GvrViewerMain.prefab

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 5 - GvrEventSystem.prefab

Зверніть увагу, що при створенні билда під Android в File → Build Setting → Player Settings значення "Minimum API Level" має бути не менше 19-ти, інакше при компіляції випаде помилка.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 6 - вікно "PlayerSettings"

Перевірка Google VR

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 7 - демонстрація роботи Google VR

Перед налаштуванням GVRNavi зберемо просту сцену зі стандартних кубів.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 8 - створення простої сцени

Базова настройка GVRNavi

Тепер необхідно додати на сцену префаб Assets / GVRNavi / Prefabs / VRPlayer.prefab.

Ілюстрація 9 - VRPlayer.prefab

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

Тепер додамо на сцену тривимірне кільце. При наведенні прицілу на нього будемо активувати переміщення. Для цього додамо на сцену префаб Assets / GVRNavi / Prefabs / VRRingSimple.prefab і призначимо його дочірнім об'єктом 3D_UI.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 10 - розташування компонента "VRRingSimple"

Потім вкажемо подій в компоненті "VRRingSimple" необхідні реакції, як зазначено на скріншоті:

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 11 - компонент "VRRingSimple"

Подія "On Ring Enter" викликається в момент попадання прицілу в зону кільця. Подія "On Ring Exit" викликається в момент виходу прицілу із зони кільця. Подія "On Ring Trigger" викликається після того, як приціл потрапить в зону кільця і ​​пройде певний час, протягом якого приціл буде залишатися на кільці (час налаштовується за допомогою зміни значення "TimeToTrigger" в компоненті "VRRingSimple"). Призначені нами реакції на події дозволять вмикати / вимикати режим переміщення камери, а також змінювати текстуру прицілу.

У компоненті "Floor Panel Rotation" необхідно призначити "Transform" камери персонажа. Якщо цього не зробити, кільце не буде обертатися при повороті камери і приціл не потраплятиме в коллайдер кільця (коллайдер знаходиться тільки в передній частині кільця).

Ілюстрація 12 - компонент "Floor Panel Rotation"

Перевірка GVRNavi

Тепер запустимо сцену і наведемо приціл на кільце. При попаданні прицілу в зону кільця воно розшириться і через секунду спрацює тригер, після чого ви почнете рух вперед.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 13 - демонстрація роботи GVRNavi

У межах кільця можна обертати камеру, змінюючи напрямок руху. Як тільки приціл покине зону кільця, згенерує подія і камера зупиниться.

Додаємо інтерактивності в сцену

Створимо новий об'єкт, яким можна буде управляти - наприклад, куб. Ініціалізіруем новий матеріал, з яким вказуємо відмінний від білого колір, і призначаємо на куб.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 14 - створення нового об'єкта на сцені

Створимо файл VRCube.cs і вставити туди наступний код:

Призначимо на куб цей скрипт. Він дозволить нам взаємодіяти з кубом за допомогою прицілу. При спрацьовуванні тригера куб буде переміщатися в випадкову точку простору в межах зазначеного діапазону. Для взаємодії з прицілом об'єкт повинен реалізовувати інтерфейс IGvrGazeResponder. що робить скрипт VRObjectGaze. від якого успадковується VRCube.

Векторні параметри "rangeX", "rangeY", "rangeZ" вказують діапазон значень за відповідними осях, в яких може перебувати куб при зміні позиції. Параметр "hoveredColor" - колір, який буде призначатися матеріалу куба при наведенні прицілу на куб.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 15 - об'єкт "Cube"

Функціонал зміни кольору зашитий в методах скрипта, тому призначати реакції на події не потрібно. А ось для зміни позиції куба в просторі необхідно задати реакцію на подію спрацьовування тригера - виклик функції SetToRandomPosition (). яка знаходиться в тому ж скрипті "VR Cube".

Тепер при запуску сцени можна навести курсор на куб, щоб переглянути зміна кольору і зміну позиції куба при спрацьовуванні тригера.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 16 - демонстрація роботи скрипта "VRCube"

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 17 - демонстрація роботи скрипта "VRCube"

Внесемо ще одну можливість - повернення куба в початкове положення. Для цього додамо на сцену префаб Assets / GVRNavi / Prefabs / VRRingContainer.prefab. Це кільце другого типу з плагіна GVRNavi. Воно дозволяє прикріплювати до кільця інші елементи: кнопки, чекбокси, скроллбар і т.д. Це кільце так само, як і перше, має бути дочірнім об'єктом 3D_UI.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 18 - розташування компонента "VRRingContainer"

Потрібно не забути вказати "Transform" камери в скрипті "Floor Panel Rotation", як ми вказували для першого кільця. Також необхідно посунути кільце вниз, щоб воно знаходилося нижче першого кільця.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 19 - компонент "VRRingContainer"

Тепер запустимо сцену. При наведенні прицілу на перше кільце під ним з'явиться друге.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 20 - демонстрація роботи компонента "VRRingContainer"

Зараз воно не приносить ніякої користі, тому зупинимо програвання сцени і доповнимо його чимось корисним.

У кільця є дочірній об'єкт Root. Він служить контейнером для інших VR-об'єктів, які будуть прикріплені до кільця. Додамо до об'єкта Root префаб VR-кнопки Assets / GVRNavi / Prefabs / VRButton.prefab.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 21 - розташування компонента "VRButton"

Позиція кнопки на кільці регулюється за допомогою зміни вектора "Rotation" в компоненті "Transform", а не вектора "Position". В скрипті кнопки "VRButtonGaze" необхідно додати реакцію на подію спрацьовування тригера.

Створюємо мобільне vr-додаток з керуванням переміщенням без джойстика

Ілюстрація 22 - компонент "VRButton"

При натисканні на кнопку прицілом позиція куба буде скидатися на початкову.

висновок

Це все, що ми хотіли вам розповісти. Тепер ви можете створювати свої прості VR-додатки. Зв'язатися з розробниками GVRNavi можна по електронній пошті - [email protected]. Удачі вам!

Для найшвидших - два промокодом на безкоштовне скачування Ассет GVRNavi з Unity Asset Store:

Необхідно активувати промокод в налаштуваннях користувача, після чого плагін можна буде скачати безкоштовно.

За наданий матеріал висловлюємо подяку компанії Garpix.

Пропонуємо Вам ознайомитися з нашими посібниками по розробці додатків змішаної реальності: