webvr compatible browser что это
Web VR: виртуальная реальность в вашем браузере
WebVR – это открытая спецификация, которая позволяет использовать VR в вашем браузере. Ее цель состоит в том, чтобы облегчить каждому пользователю качественный опыт виртуальной реальности, независимо от его устройства.
Какой шлем нужен для работы с WebVR?
Проще всего начать использовать WebVR с Google Cardboard (так как эти очки стоят крайне дешево). Также можете использовать Daydream, Oculus или HTC Vive. В первом случае достаточно скачать Chrome для Android, во втором и третьем нужно
Web VR для Mozilla Firefox
Для того, чтобы начать пользоваться Web VR, вам необходимо скачать браузер Mozilla версии 55 и выше.Никакого Web VR Player скачивать не нужно! Далее стоит проделать следующие действия:
Что касается Web VR для браузера Chrome, разработчик данной технологии рассказал о том, что на данный момент разрабатываются новые опции, которые смогут расширить функционал Web VR. Пока что для Web VR можно использовать мобильную версию браузера.
Уже в первой половине 2016 года была произведена полная поддержка спецификации, реализованная в сборках браузера Мозилла. Чтобы активировать предварительные возможности технологии, люди использовали расширение Mozilla Web VR Plus.
Заключение
В 2016 году компания Samsung уже успела представить похожую технологию, вместе со своим браузером Samsung Internet, но она не снискала большой популярности. В дальнейшем Google будет работать над расширением поддерживаемых устройств, таких как HTC Vive и Oculus Rift.
Просмотр виртуальной реальности с помощью Firefox WebVR
Начиная с Firefox версии 55, вы можете наслаждаться контентом Виртуальной Реальности (VR) прямо с вашего настольного компьютера Windows через полностью реализованный стандарт WebVR.
Что такое WebVR?
WebVR это технология, позволяющая разработчикам и дизайнерам создавать среду Виртуальной Реальности (VR), основанную на веб-интерфейсе, в которой вы можете перемещаться с помощью своих гаджетов (таких как Oculus Rift и HTC VIVE) и Firefox на вашем Windows компьютере. Вы можете видеть и управлять средой VR, которую вы видите в вашем гаджете, с помощью контроллера устройства и вашими движениями в физическом пространстве.
Если вы хотите проверить последнюю версию аппаратного обеспечения и поддержку браузера для WebVR, посетите https://webvr.rocks/firefox.
Поддерживает ли мой компьютер WebVR?
Приложения VR могут потребовать интенсивного использования системных ресурсов. До получения гаджета VR, постарайтесь пройти Тест Производительности SteamVR, чтобы убедиться, что ваш компьютер соответствует требованиям.
Как настроить WebVR на Windows?
Нужна помощь?
Если вам нужна помощь с гарнитурой, обратитесь к производителю гарнитуры.
Если вам нужна помощь с WebVR на Firefox, посетите http://webvr-slack.herokuapp.com/ (требуется авторизация).
Эти прекрасные люди помогли написать эту статью:
Станьте волонтёром
Растите и делитесь опытом с другими. Отвечайте на вопросы и улучшайте нашу базу знаний.
Доступные шлемы, технологии и кейсы применения Статьи редакции
Инструкция по работе с виртуальной и дополненной реальностью в браузерах от системного архитектора «Туту.ру» Александра Майорова.
Виртуальная и дополненные реальность становятся популярными не только в компьютерных играх. Интерес к VR- и AR-технологиям возрос, когда разработчики придумали устройства для их интеграции с браузерами. Уже сейчас можно экспериментировать и создавать прототипы веб-проектов с помощью JavaScript API, который называется WebVR API.
Разработчики начали писать спецификацию в 2014 году, но первую версию в начале 2016 года представила компания Mozilla. Разработчики Mozilla показали полноценную черновую спецификацию WebVR API, которая описывает программный интерфейс для работы с VR-устройствами, например с Oculus Rift. Спецификацию разработали при участии Брэндона Джонса из компании Google и Джастина Роджерса из Microsoft.
Поддержка новой спецификации WebVR реализована в браузерах Firefox и в мобильном Chrome. Это значит, что вы уже можете свободно экспериментировать с технологией. Если ваш браузер стар, странно работает или не обновляется — для всего этого есть полифиллы.
WebVR API — это программный интерфейс для работы с устройствами виртуальной и дополненной реальности, который ничего не знает про 3D-графику. Работу с графикой, отрисовку сцены, установку источников света выполняют программисты. WebVR API абстрагирует доступ к устройствам.
Такой API предоставляет инструменты для визуализации картинки, для получения информации об устройстве, его возможностях и технических характеристиках. При этом картинку и 3D-мир нужно рисовать, используя веб-технологии вроде HTML, CSS, WebGL, Canvas.
Для программиста WebVR API предоставляет основные объекты для работы:
Когда говорят про VR, то вспоминают Oculus Rift и им подобные. Если говорят про WebVR, логично предположить, что рассчитывают на веб-приложения, работающие в браузерах.
Разработчики выпустили несколько мобильных VR-устройств:
Это устройство с линзами существует в разных исполнениях, вплоть до копий Samsung GR VR, но с подключением через Bluetooth любой модели телефона. Качество очень даже хорошее, к линзам претензий нет. Можно докупить Bluetooth-джойстик, который будет работать с любым смартфоном на любой ОС.
Особенность: наличие механической кнопки-манипулятора, работающей по принципу стилуса, который нажимает на «слепую» зону экрана в области переносицы. Смартфон крепится через через вырезы в крышке устройства и застегивается на молнию.
Особенности: смартфон подключается к устройству через USB, имеет сенсорную панель и кнопки на шлеме. При подключении активируется функциональность Oculus, и телефон становится Oculus-совместимым устройством. В смартфонах GR VR встроен Oculus Store, который открывает доступ к приложениям, написанным для Oculus Rift.
Особенности: шлем сделан из картона. В шлеме есть кнопка, выполненная в виде небольшого круглого магнита. Встроенный магнитометр считывает изменения магнитного поля, и это изменение засчитывается как действие по кнопке в Cardboard-совместимых устройствах.
Особенности: основательный и удобный шлем и пульт управления в комплекте.
Если у вас есть смартфон с Chrome и VRBox из перечисленных выше, то вы можете проверить WebVR в действии. Лучший вариант — Chrome Canary или Samsung Internet. Есть исключение — это iOS. Но на нем VR можно использовать через полифилл, поэтому некоторые демо-версии будут доступны с iOS-устройств. Важно понимать, что WebVR API — это не о создании 3D-графики, и сделать WebVR-мир можно под iOS без использования VR API.
Взглянуть на VR-мир можно через окно десктопного браузера, в котором происходит разработка. Сначала разработчики строят мир без шлема, а затем добавляют возможность разбить картинку под оптическую пару. Для этого используются браузеры: Firefox Nightly, Chrome с плагином WebVR API Emulation, Chrome Canary со включенной поддержкой или специальная сборка поисковика Chromiuum VR.
Сейчас WebVR API поддерживают браузеры:
Посмотрите полный список с таблицами совместимости.
Если ваше устройство не поддерживает WebVR API, воспользуйтесь полифиллом, который можно подключить на страницу или использовать специальное расширение для браузера.
Можно установить плагин WebVR API Emulation for Chrome. Он не просто добавляет эмуляцию WebVR API, но также интегрируется в DevTools.
Вы можете менять координаты объектов, крутить сцену и так далее. Если используете этот плагин, отключите полифиллы на странице, так как они могут конфликтовать.
Чтобы понять мир VR, нужно научиться работать с 3D-графикой. Это сложно, если вы будете осваивать WebGL с нуля. Проще взять готовые библиотеки, такие как Threejs, D3.js или специализированные фреймворки для работы с VR, такие как A-Frame от команды Mozilla. Уже даже есть превью-релиз React VR для поклонников React и всего, что выходит из недр Facebook.
Используя A-Frame, можно сверстать VR-мир с минимальными усилиями. A-Frame — это HTML-фреймворк для создания веб-приложений и сайтов под виртуальную реальность. В браузере это выглядит как веб-страница, которая представляет 3D-изображение с возможностью навигации и взаимодействия с объектами. Картинка отрисована с помощью WebGL.
Основная задача A-Frame — предоставить простой инструмент, который помогает создать 3D-мир способом, похожим на HTML-разметку. Фреймворк базируется на Threejs и является более высокоуровневой надстройкой.
A-Frame создает 3D-сцену через набор геометрических примитивов. Вы можете добавлять более сложные компоненты и дописывать свои, если базовых не хватает. Объектам сцены доступны геометрические свойства: местоположение, вращение, масштабирование. Также можно описывать расположение камер и источников света.
У A-Frame есть хороший инспектор, позволяющий делать отладку 3D-мира.
Посмотрите примеры. Они простые для понимания и, изучив их, можно быстро сделать свой первый «Hello VR-world». Программисты также используют A-Frame для разработки дополненной реальности. Рекомендую изучить ReactVR. Это фреймворк, базирующийся на Reactjs.
WebVR API нужен только для работы с VR-устройствами, а точнее, для получения характеристик о дисплеях и визуализации картинки. В случае Mobile VR мы физически работаем с одним экраном. Также возможно эмулировать стереопару. Тогда WebVR API изолирует работу с экраном таким образом, что мы будем взаимодействовать с двумя физическими дисплеями.
При этом код будет кроссплатформенным, и мы сможем запустить WebVR-приложение на Oculus в браузере Carmel.
WebAR также возможно создать в браузере. Но «WebAR API» не существует — это просто обозначение дополненной реальности, реализованной на веб-технологиях.
Технически работа выглядит так же как и с WebVR, но также вы получите видеопоток с веб-камеры, используя WebRTC. Дополнительно нужно написать логику покадровой обработки для поиска нужных объектов. Затем вы рисуете 3D-сцену на фоне видеопотока. Для AR не обязательно нужен шлем: вспомните Pokemon Go — это AR-проект, но без VR-шлема.
Возможность реализовать WebAR зависит от наличия поддержки WebRTC. WebAR можно реализовать на всех Android-устройствах. В iOS тоже можно сделать WebAR, но с небольшими ограничениями.
С WebVR в iOS-устройствах все можно реализовать через полифиллы или вовсе обойтись без WebVR API. Это возможно, если самостоятельно все описывать, отслеживать действия через акселерометр, «бить» картинку и эмулировать два дисплея.
У AR нет поддержки WebRTC, но решить задачу можно с помощью проект Argonjs. Это проект, который состоит из фреймворка, базирующегося на A-Frame и специального браузера.
Идея работы браузера проста: есть два слоя. Первый слой — это Webkit-движок, второй слой-подложка — это вывод видеопотока с камеры. В браузере есть свой API, чем-то это напоминает работу первых версий PhoneGap.
При этом Argonjs можно использовать и для VR-прототипа под iOS. Если вам необходимо разрабатывать кроссплатформенное приложение под VR или AR на JavaScript, то обратите внимание на React Native вкупе с React VR или «упакуйте» все в PhoneGap.
В AppStore есть несколько версий браузера. Скачивайте четвертую версию, иначе фреймворк не будет работать.
В «Туту.ру» мы разработали идеи применения этих технологий в контексте туристического бизнеса. Например, 3D-галереи для проекта «Туры». Галереи 360 можно адаптировать под VR-шлемы, и все, у кого дома есть VR Box, могли бы «осмотреть» будущий отель и пляж с эффектом присутствия.
Эта техника применима к 3D-галереям для проекта «Поезда», где можно посмотреть вагон изнутри и выбрать место в «Сапсане» напрямую из VR-шлема. В будущем можно внедрить технологию выбора места в междугородних автобусах. Для проекта «Экскурсии» возможно создать демо-версию будущей экскурсии.
Другой сценарий применения VR- и AR-технологий — это развлечение клиентов в офлайн-офисе. Пока посетитель ждет в очереди к тур-менеджеру, он может посмотреть каталог путешествий через Samsung GR VR шлем. Стандартные брошюры и журналы уже не привлекают внимание, а реклама, показанная через новую технологию, может порадовать клиента.
Firefox Reality — лучший браузер для Oculus Quest 2 и просмотра YouTube в VR
Содержание статьи (кликабельно)
Казалось бы, зачем ставить «Огнелиса» на Квест, ведь там есть свой родной браузер? Хороший вопрос, ответ на который вы узнаете, прочитав эту статью. А причины тому есть, поверьте) Я вобще не думал делать о нем отдельный пост, но, пока день использовал, понял, что всё-таки он этого достоин (как и Скайбокс, например).
За идею поста спасибо товарищу @century1402 из нашего телеграм-VR-чата.
Где скачать Firefox Reality для Oculus Quest 2
Прежде чем перейти к волшебным фишкам Фаерфокса, скачайте его прямо на Oculus Quest 2 бесплатно и без смс из магазина Oculus. Кроме того, можете поискать его в магазине внутри шлема и скачать оттуда, на момент написания статьи приложение занимает 180 мегабайт.
Так этот сайт выглядит в Firefox Reality (экран можно увеличить)
Хотя, многие говорят, что на ПК Фаерфокс мертв, для Квеста он более чем актуален, как минимум, из-за убогости родного браузера и отсутствия вменяемых альтернатив.
Внимательный читатель заметит, что скины на тачах еще с первого Квеста.
«YouTube на максималках»
Это первая и главная киллер-фича Фаерфокса
Что в родном браузере, что в приложении YouTube VR качество роликов ограничено. И фиг бы с ним, если будешь пытаться смотреть что-то плоское в Full HD, это не так страшно. А вот те же панорамные 360-градусные видео, там качество картинки уже критично (т.к. всё разрешение «размазывает» по сфере), но, повысить его нельзя. В итоге мы получаем мыло.
Например, вот ролик, который я смотрел еще на Карборде, и, хотя там можно выставить 2160p, картинка всё равно будет мыльной.
Обычный 3D ролик с Ютюба в Фаерфоксе — по сути, большой экран перед глазами
Ровно по этой причине я сам особо не смотрел панорамные видео с Ютюба, а народ скачивал ролики отдельным «Даунлодером 4к», (или как называлась эта софтина?), закидывал в шлем и смотрел разными плеерами, что муторно и неудобно, как вы понимаете.
Что же теперь? А теперь красота, ведь Фаерфокс позволяет нам выставить максимальное качество ролика в 8к (4320p)!
Мы знаем из спецификации процессора XR2, что он способен воспроизводить 360°-видео с разрешением 8K с частотой 60 FPS или в разрешении 4K с частотой 120 FPS, но, теория это одно, а что на практике?
Доступное качество YouTube в Фаерфоксе для Oculus Quest 2
ВАЖНО : Для того, чтобы получить полнофункциональный YouTube, не забудьте переключиться с мобильной версии на версию для ПК (три точки рядом с адресной строкой, и там пункт внизу):
Включаем версию для ПК
Тут надо сделать оговорку, что, на первом попавшемся ролике у меня работало только 2160р, и хотя, 8к выбиралось, но, в полноэкранном режиме был просто пустой черный экран. Я даже решил, что маркетологи нас надули.
Но, потом я наткнулся на вот такой ролик, где прямо вся солянка: 360 3D 8к 60 FPS и — о чудо — Oculus Quest 2 его потянул! (смотреть прямо в Квесте, выбрав макс.качество):
К сожалению, таких роликов крайне мало. Вот канал этих типов, я так понял, на Анриале делают.
Но, очень много просто 8к-роликов, 4к 60 FPS и так далее. Теперь вообще не очень ясно, зачем надо 4к-телевизор, если Квест 2 легко тянет 8к, а размер экрана там такой, что и в квартиру-то не влезет. Да и цветопередача весьма неплохая, как по мне:
Картинка с ютюба на Oculus Quest 2 через Фаерфокс. Кадр взят из этого ролика
Даже обычные 3D ролики в 4к там выглядит впечатляюще, например, вот Дум в VR, 4к, 60 FPS:
Ну и вот эта панорамка мне понравилась, хотя, 4к и мыло)
Вот еще канал с хорошими панорамными видосами в 5к-8к, часть из которых даже на русском языке.
ВЫВОД: сегодня Firefox Reality — это лучший способ смотреть YouTube на Oculus Quest 2
Полезные фишки при просмотре YouTube
Смена качества на максимум
Выше была картинка, да и я думаю, что вы сами знаете, где это делать. А совет простой — проверяйте, нет ли у вашего ролика 8к-версии, т.к. по дефолту шлем ставит 4к (2160p). Для плоских роликов это не смертельно, у нас всё равно 1832 × 1920 пикселей на глаз и в безумие тут впадать не стоит. А вот для панорам, как показано выше, даже 8к не будет лишним. На приведенных мной примерах видно, что, например, для 360 3D мало даже 4к, там муть. Вобщем, чем больше, тем лучше)
Но, тем сильнее греется шлем, да и интернет нужен хороший. В мои 100 Мбт/с пролазит.
Вызов быстрого меню и смена формата для видео
Когда вы развернули ролик на весь экран, вам доступно быстрое меню. На кнопки А, Х, или курки. Нажатие на В или У делает «Назад», что, кстати очень удобно (и работает это не только при просмотре в YouTube, но и в браузере вообще). Через это меню вы можете ставить на паузу, перематывать, а так же менять размер экрана для плоского видео или подобрать нужный формат для панорамы (значок Cardboard, рядом со звуком):
Если плеер ошибся, выбираем нужный формат сами
Как изменить размер экрана
Когда видео будет развернуто на весь экран, при нажатии на А, Х или курки снизу ролика появятся четыре пиктограммы, одна из которых даст вам увеличить размер вплоть до х3. Там же можно сменить яркость окружения или вообще его отключить.
Как придвинуть экран
К сожалению, у нас есть изменение размера, но, нет изменения положения экрана. Однако, и это не беда! Для этого вам нужно сместиться назад, отцентровать вид через долгое нажатие системной кнопки Oculus (мелкая кнопка на правом таче со значком Oculus, нет, это не буква О), и вернуться в исходную позицию. В итоге экран станет к вам ближе.
Как смотреть YouTube лежа
Да так же: ложимся, центруем экран кнопкой Окулуса, и, хотя само окружение по прежнему будет на месте, экран Ютюба перенесется под потолок.
Прочие полезности Firefox Reality
Но, не только Ютюбом жив Фаерфокс, поговорим про его другие полезные штуки.
Синхронизация с ПК-версией
Если вы юзаете Лису на ПК, скорее всего, у вас там будет свой акаунт, к которому привязаны все закладки и расширения/дополнения. Так вот, теперь их можно перенести на Квест. Это предложат вам сделать в самом начале, но, если вы скипнули, то можно сделать это либо в настройках (там будет фиолетовая пиктограммка «Войти в акаунт»), либо в свойствах страницы (три точки рядом с адресной строкой):
Делаем общие закладки
Однако, сам я этого делать не стал, т.к. у меня на ПК куча расширений, и даже закладками рулит одно из них. Во-первых, я не уверен, что оно корректно перенесется, во-вторых, оно может перенести туда кучу всего того, что не нужно, а памяти у меня на Квесте не так и много, двадцать гигов осталось. Только в YouTube авторизовался, и хватит пока что.
Но, если у вас только список закладок — имеет смысл сразу подрубить туда свой фаерфокс-акаунт.
Дополнения и расширения
Подробно не копал эту тему, но, они там есть. Например, сразу рекомендуют адблок для YouTube, находится всё на странице закладок, в разделе дополнений:
Адблок и другие расширения для Фаерфокса
Работа в нескольких закладках
Если вы хотите на одной вкладке смотреть Ютюб, на второй Телегу, на третьей Инсту — изи, без проблем все это организуется через стрелочки и крестик над каждой вкладкой. Вот, например, Telegram и Ютюб:
Таких закладок можно сделать сколько душе угодно, лишь бы хватило места по периметру. Кроме того, тут очень удобно копировать контент туда сюда, например, копируешь ссылку нажатием на шаринг в ютюбе и тут же вставляешь в VR чат долгим нажатием курка в поле ввода.
Веб-версии популярных сервисов
В данном случае, это удобнее, чем ставить отдельные АПК-файлы, правда, работает, только когда запущен сам Фаерфокс. Пример телеги уже был, не буду повторяться. При желании так же можно слушать Спотифай и что вам там еще нужно, у чего есть веб-версия.
Приложения на А-фрейме и Web VR
Почему-то квестовый браузер это не поддерживает, а Firefox Reality поддерживает. Отдельный пост про А-Фрейм я уже писал, в данном случае просто посмотрите примеры на стартовой странице Фаерфокса, там первая строчка как раз про это:
Примеры приложений на Web VR
Кроме того, в подборках Файерфокса часть VR-опыта так же использует эту технологию.
Разнообразные окружения
Мелочь, а приятно. Их тут штук десять.
Все показаны в моем ролике. Кроме того, там показаны многие вещи из того, о чем я говорю в этой статье, там десять минут, наслаждайтесь)
Я оставил пока подводный мир.
Минусы Firefox Reality на Oculus Quest 2
Как всегда, куда ж без них. К чему тут можно придраться?
Это весьма нелепо, набирать что-то на виртуальной клавиатуре и не чувствовать жужжания тачей, когда она воспринимает нажатие. Вроде бы и придирка, но с этим было бы удобнее. Или я не нашел, как включить.
Сворачивается при снятии шлема
Это подбешивает, хотя, обычно Квест запоминает последнее запущенное приложение. Здесь же, если на несколько минут отошел — привет стандартная оболочка. Хорошая новость в том, что Фаерфокс помнит последние вкладки и не нужно их по новой открывать.
Иногда просит переключиться на трекинг рук
Опять же, обычно после того, как шлем полежит выключенный несколько минут.
Его нельзя установить браузером по дефолту
Или я не нашел как. Хорошо бы было внедрить его вместо родного окулусового браузера. Может, потом добавят.
YouTube в полноэкранном режиме скрывает другие окна
Не то, чтобы минус, но, вы должны про это знать, это его нормальное состояние.
Иногда путает форматы в Ютюбе
И вместо 360 открывает 360 3D или наоборот. Благо, это не проблема через вызов меню тут же пофиксить.
Возможно, он уже не развивается
О чем говорят старые скины от тачей первого Квеста и работа в 72 Гц (а он работает в 72 Гц).
С другой стороны, а что там развивать, работает как есть и хорошо. А, еще почему-то в приложениях на Web VR, о которых я писал выше, он сферы показывает как яйца, такие же сплюснутые. По идее, это всё фиксится, может, со временем допилят.
Подводя итог
Несмотря на незначительные минусы, о которых я писал выше, Firefox Reality должен быть на каждом Квесте. Как минимум, для комфортного просмотра YouTube (максимальное качество и даже адблок есть). Кроме того, если ваша работа целиком завязана на браузер, вы вообще можете создать там кучу экранов-вкладок и рулить всем прямо из шлема. Так что, как минимум рекомендую его попробовать.
Другие интересные статьи про Oculus Quest 2:
На этом пока всё, с вами был @Pavel419, до новых постов!