Технології Майбутнього У Веб-дизайні: Мрії Про VR Збуваються

1. Що є веб в VR
2. Експерименти веб-дизайну з VR
3. Особливості існуючого веб-дизайну з VR
4. Необхідність VR для веб-дизайну
5. Майбутнє VR і веб-дизайну

Людина завжди мріє про майбутнє, про те, що йому недосяжно. Ці мрії сприяють розвитку світу, прогресу, появи технологій. Колись людина не могла подумати про те, що зможе уподібнитися птиці; Зараз же, навіть володіючи можливостями виходу у відкритий космос і запуску супутників, він все ще піднімає погляд на небо і розмірковує про міжгалактичних крейсерах і далеких-далеких галактиках. Але скільки з того, про що розповідали нам письменники-фантасти у своїх книгах, дійсно існує вже зараз? Як мінімум це - віртуальна реальність (VR).

Що таке VR і як це використовувати - багато хто вже чули, а може хтось із читачів блогу навіть має гарнітуру віртуальної реальності. Інше питання, здатний розбурхати творчі уми, та й не тільки: «Невже технології VR здатні знайти своє застосування в веб-дизайні?»

Відповідь: Так.

І ми розповімо вам і навіть покажемо.

Що є веб в VR

Двомірне простір (2D) цілком може перетворитися в 3D, стати інтерактивним і відчутним. Уявіть, що знаходитеся в величезній бібліотеці, де, наприклад, про Стародавньому Єгипті можна не читати, а дивитися інформацію. Ви проходите повз пірамід, повз Сфінкса, йдете далі і бачите під ногами дюнні насипу. Пройшовши ще трохи і, активуючи наступні блоки даних, переноситесь в центр Аль-Кахира або Саиса, а може навіть і Напате, прогулюється по вулицях, ринках, серед приземкуватих цегляних будівель і тільки ще здалеку починаєте помічати високі пальми, басейни і сади зі статуями фараонів і древніх богів. Але головне, вас постійно супроводжує віртуальний гід, який розповідає про історію цього світу, культурі, економіці стародавньої цивілізації. І так, не обходиться без характерних звуків і атмосферности навколишнього середовища.

Вражені?

Подивіться на створену віртуальність тест-драйву для Volvo XC90 (Відео за посиланням), познайомтеся з параметрами, положеннями сидінь, відчуйте швидкість автомобіля. Ще років двадцять тому думки про те, щоб дивитися Олімпійські ігри в окулярах віртуальної реальності, була схожа на з використанням голодека з Зоряного Шляху. А адже вперше використовуючи технологію в 2016 році, тепер Samsung і зимові ігри 2018 року транслювати у вигляді VR.

І це вже не фантастика, але ще й не буденність.

Апаратні засоби для використання цієї технології поки ще знаходяться в «зародковому» стані. Це і HD-камери, 360-градусні, потужні і високошвидкісні графічні процесори, особливі моделі смартфонів. Але пристрою ці громіздкі, дорогі і не дуже ще поширені ні на ринку, ні у користувачів. З ростом випуску продукції, зрозуміло, і ціна стане нижчою, і масове використання зросте, і технологія буде більш розвиненою.

Експерименти веб-дизайну з VR

Для того щоб технологія віртуальної реальності стала доступною, створений був JavaScript API , Іменований як WebVR . Саме ця бібліотека дозволяє забезпечити доступ до таких пристроїв, як Oculus Rift або Google Cardboard; вона також вбудована в Nightly Firefox, Chromium, браузер Samsung; можна навіть використовувати емулятор VR за допомогою розширення для Google Chrome . Але, так чи інакше, без гарнітури ви нічого не зможете відчути і розглянути і потрібно саме гарнітура для VR, а не звичайні окуляри з кінотеатру з темними або різнокольоровими «лінзами». Втім, для веб-дизайну використовують і їх, але про це іншим разом.

Запаслися пристроями? Тоді саме час вирушити на MozVr і відкрити один з 11 проектів, представлених там. Якщо ви ще залишилися у нас, то вивчіть документацію на Mozilla Developer Network по підключенню гарнітури і смартфонів і відвідайте Vizor.io і створіть самі красивий проект. Якщо ж ви щасливий володар HTC Vive, то перші кроки по веб-дизайну з технологією VR вам краще зробити разом з проектом A-Painter .

На відміну від розважальної середовища, функціональність VR в веб-дизайні і в інтернеті в цілому являє собою складну екосистему. Набагато частіше ми бачимо окремі інтерактивні сайти, сайти з елементами 3D, перспективою і анімацією. Побачити справжню віртуальну реальність не можливо.

Особливості існуючого веб-дизайну з VR

Зазвичай весь простір робочого столу на екрані монітора займає 30-40 см, коли як інша ширина екрану просто не використовується. Людському оку досить мати всі елементи в межах цієї ширини і зосередженість буде забезпечена.

У віртуальній реальності немає єдиного полотна, немає верхньої та нижньої частини. Ви повертаєте голову і бачите додатковий полотно з інформацією, дивіться вниз - інформації стає більше. У вас немає якоїсь рамки, в межах якої ви шукайте інформацію і пізнаєте її. Це (з рамкою) - вже Доповнена реальність (а-ля, знаменитий проект Pokemon Go ). Віртуальна реальність, навпаки, занурює вас в нове середовище проживання, немов обіймаючи вас є.

Саме тому багато веб-дизайнери, створюючи експериментальні проекти, створюють варіації VR у вигляді 360-Градусова веб-дизайну, які представляють собою такий собі аналог VR, але в 2 D просторі. Поглинання немає, немає необхідності повертати голову, ви прокручуєте полотно курсором мишки, а глибина (перспектива) - «штучна».

проект Rainforest як раз і виглядає як велика інтерактивна карта, яку можна вивчити. Є у вас окуляри і чи можете ви покриття головою або тільки мишка, але в будь-якої категорії просто затисніть ЛФМ дивіться, вивчайте, насолоджуйтеся джунглями.

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

проект подорожі по Туреччині - міста, замки, руїни, печери, гори, вулиці та інше дозволить доторкнутися до VR, не маючи гарнітури. Рухи, завантаження, інтерактивність була відтворена в 2D-просторі. Неймовірний проект, красивий. Просто крутите навколо себе (а не самі себе) карту, вибирайте елементи (кружечки), клікайте і переноситесь на нову місцевість.

Google, зрозуміло, теж вирішили використовувати фантастичні технології і пропонують вивчити древній місто Петра в окулярах або в 2D.

Віртуальний тур по JUB кампусу і спілкування зі студентами - чудовий приклад доповненої реальності.

На сайті Awwwards ще багато цікавих робіт по віртуальної реальності і інтерактивності. як і панорамних проектів в 3600. Деякі з них спочатку пропонують підключити VR-гарнітуру, інші ж дають відвідувачам вибір між VR і 2D інтерактивним варіантом.

Якщо ж розглядати тематику таких проектів, то в наші дні вона ще досить специфічна. VR або 3600 використовують для створення культурних проектів (музеїв, подорожей, вивчення міст і країн); спортивних (експериментальний проект Samsung для Олімпійських ігор ); для демонстрацій продукції компанії, як це створили в Siemens; в розважальній середовищі.

Чи не для кожної тематики можна створити веб-дизайн в VR. І не через складність або неможливість. Немає в цьому потреби. Якщо веб-дизайнер створює інтернет-магазин, то який сенс вертіти головою і шукати хліб або пару туфель? Втім, цікаві ідеї все ж є, але вони, скоріше, у вигляді ідеї. Але якщо створюється проект туристичний або для авіакомпанії, то VR, інтерактивність і 3600 будуть дуже цікавою і чудовою знахідкою.

Необхідність VR для веб-дизайну

Веб-розробники все більше використовують стандартизацію, бо навіть в VR ми очікуємо звичний інтерфейс. Так, наприклад, на Samsung Gear VR в браузері перед очима знаходиться знайомий веб-інтерфейс: повороти головою, нахили, голосові команди працюють так само, як ми звикли при використанні клавіатури і мишки. І цього на даний момент досить, щоб представити споживачам технологію віртуальної реальності. І саме тому її не складно інтерпретувати в варіації 360-градусного веб-дизайну в 2D-просторі.

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

«Чи варто вивчати WebVR веб-дизайнеру?» - запитаєте ви. Безумовно так. В найближчому майбутньому і розробники, і дизайнери будуть використовувати VR на своїх сайтах. Це і інтерактивні карти, навчальні посібники (довідки, FAQ і ін.), Різні візуалізації. А все це, як відомо, ті елементи, які майже завжди використовуються на більшості сайтів і незвичайність яких дає переважно проекту в конкурентній боротьбі.

Іншими словами, деякі моменти ідеї і технології віртуальної реальності цілком можна використовувати в звичайних проектах. І на прикладах вище ми це вам і показали. Не обов'язково 3600 не обов'язково повноцінне VR, але інтерактивність, панорамності.

Якщо говорити про складність, то практично всі проекти базуються на A-Frame , Наборі бібліотек з відкритим вихідним кодом (open-source WebVR framework) для роботи з HTML. В основі A-Frame знаходиться three.js , А тому її легко інтегрувати з більшістю існуючих зараз інструментів веб-розробки. Одним словом, на сайті A-Frame є і приклади коду, і візуалізації.

Майбутнє VR і веб-дизайну

Цілком очевидно, що стандарти веб-дизайну будуть поєднуватися з технологією віртуальної реальності. Але деякі речі просто зникнуть. Наприклад, навіть якщо новинні портали будуть створюватися у вигляді VR, багато хто за звичкою продовжать використовувати 2D-варіацію, бо звикли до зручності читання. У гонитві ж за варіантами оформлення веб-інтерфейсу в VR йде на другий план вибір використання плоских або об'ємних кнопок, плиткових елементів або невеликих тіней під ними. VR оперує з глибиною в просторі і створює оточення з інформації, фотографій, відео. І чи буде під інтерактивним елементом легка тінь чи ні - не так важливо, головне, щоб було зрозуміло і красиво, що не дратівливо і не недоладно.

Що ж до найближчого десятиліття, то компанії продовжують інвестувати в розвиток даної технології, а пристроїв з'являється все більше. Якщо є прагнення досягти вершини технологій веб-дизайну і залишитися на ній, то слід задуматися: Які пристрої запускаються компаніями в продаж? В якій галузі більш затребувані проекти веб-дизайну для VR? Якими гаджетами можете скористатися саме ви, щоб не просто створювати, але тестувати і вивчати тему?

висновки

Відмінна новина - принципи хорошого веб-дизайну витримали випробування часом. Багато теорії, що формують зараз наше поняття про те, яким повинен бути веб-інтерфейс, були сформульовані ще сотні років тому, якщо не тисячі. Тому незалежно від вашого інструменту або технології - як раз ці принципи і теорії будуть з вами завжди, саме вони і дозволять створити сайт, який буде також цікавий, інформативний, функціональний при перегляді в окулярах VR, як і в 2D-варіанті (3600) .

І треба зауважити, що люди все більше і більше готові зануритися в VR, захопитися інтерактивністю, опинитися в тих самих далеких і давніх мріях про майбутнє.