ブラウザ(HTML5)ではVRできないの?

最終更新日:2016年09月17日

ブラウザのVRについて簡単にまとめています。

更新履歴

(2016年9月17日)「ブラウザVRの現状は?」を更新、ストア審査とSSLについて追記
(2016年7月01日)「WebVRを使用するには?」を作成
(2016年6月25日)とりあえずページ作成


ブラウザVRの現状は?

現在、ChromeとFirefoxにおいて、VRヘッドセットのトラッキングデータ等にアクセスするWebVRというAPIの実装が進められています。このAPIを通してヘッドセットの位置・方向を取得し、WebGLを使ってVRレンダリングを行うことができます。

MSのEdgeもWebVRをサポートする方針を表明しています。

WebGLでのレンダリングには通常Three.js等のライブラリを使用します。

特に、一つのウェブページで、ヘッドセットを持っていない人からGoogle Cardboard、ハイエンドのHTC ViveやOculus Riftまで対応しようというレスポンシブなVRという考え方があります。それをThree.jsベースで比較的簡単に実装できるWebVR Boilerplateのようなフレームワークがあります。

また、HTMLでVR空間を記述するA-Frameというフレームワークなども登場しています。

WebVR APIを使用するには?

Windowsでは、FirefoxのNightlyビルドWebVRアドオンをインストールするか、Chromeの実験ビルドを使用します。

Androidでは、Chrome Beta(ベータ版ビルド)でchrome://flagsを開くと、「WebVR」フラグがありますので、有効にして再起動します。また、Chrome Dev(開発版ビルド)には「VR シェルを有効にする」というフラグもあり、Google CardboardやDaydreamヘッドセットを被ったままでウェブブラウズできる機能を実装中のようですが、現時点ではまだ機能しないようです。

WebVR APIを使用するページはHTTPSになっている必要があります。現在、GoogleやMozillaはウェブの全SSL化を進めており、HTTPSになっていないウェブサイトではブラウザの機能が制限される方針になっています。

ブラウザで本格的なVRコンテンツは作れる?

いわゆる本格的なVRはブラウザでは今のところ難しいです。現状、VRコンテンツのほとんどはUnityやUnreal Engineでネイティブアプリケーションとして作られています。各ヘッドセットが正式にサポートしているということもありますが、VRはグラフィックス性能や表示遅延などの要求が非常に厳しかったり、3Dアセットのデータ量が多かったり、複雑なVR空間を構築するのにゲームエンジンのシーンエディタが必要なためです。

将来的には、UnityのWebGL出力がWebVRに対応して、UnityでブラウザのVRコンテンツが簡単に作れるようになるかもしれません。また、PlayCanvasというブラウザベースのゲームエンジンがWebVRに対応しているようです。

そもそもブラウザでやる必要あるの?

個人的な意見ですが、VRは今のところどうしてもヘッドセットベンダやゲームエンジンにロックインされる面が大きいので、バックアップとしてウェブプラットフォームでもVRができることは重要なのではと考えています。

もちろんインストールせずに実行できるメリットもあります。スマートフォンのページをGoogle Cardboardに対応しているケースはすでにありますし、PCでも、普通にネットを巡回していて、VR対応ページを見つけたらヘッドセットを被って見るというのは(比較的)想像しやすいのではないでしょうか。素性の知れないexeファイルを実行したくないという人も多いと思います。一方で、SteamやOculus Storeにはアプリ審査があり、出せないアプリが出てきます。

また、ウェブページと同じように、いろんな人が作ったVR空間がそれぞれURLを持ち、リンクで飛べたりしても面白いかと思います。

ブラウザのVRについては、本サイトではまだあまり触れていないのですが、はてなブックマークのWebVRタグでいろいろとブクマしていますので参照してください。

書いた人:こりん(@korinVR
VR開発メモトップ