今回は、Web VRについて解説していこうと思います。

VRと聞くとヘッドマウントディスプレイを被った上で、デバイスに合ったアプリをインストールしてプレイするなど、何かと用意するものがあると考えられがちです。

Web VRはブラウザ上でプレイできるので、コンテンツごとにアプリをインストールする必要がなく、手間なく遊ぶことができます。

これらのWeb VRについて知りたい方は是非この記事をご覧ください。

それでは早速始めていきましょう。

|Web VRとは?

そもそもWeb VRとは一体何でしょう。

VRを体験するためには、以前までは専用のヘッドセットの着用を必要としましたが、現在ではWebブラウザ上でVR体験ができる技術Web VRが登場しました。

Web VRを利用すれば、特別なソフトウェアをインストールすることなく、Webブラウザ上でVRを体験できます。

Web VRに対応したWebサイトを紹介するときは、自分のブログにサイトURLを記載するだけで、多くの人とVR体験を共有することが可能です。

これはゲームとしての用途以外にも幅広く利用されており、不動産の物件紹介や、自社製品のプロモーションなどに活用され始めています。

|Web VRとVRの違いは?

とはいえ、Web VRとVRの違いははっきりと分かっていないと思います。

ここからはWeb VRとVRの違いについてご紹介していこうと思います。

一言で言うと、Web VRは「VRデバイスとVRを搭載したWebサイトのみで簡単にVR体験を可能にする」、VRは「VRデバイスと1つのVRアプリ(layストア、Appleストアからダウンロード)を通してバーチャルリアリティ体験を可能にするという違いがあります。

VRアプリの有無が大きく違っています。

|Web VRとふつうのWebサイトの違いは?

それでは逆にWeb VRと一般のWebサイトとで違いはどこにあるのでしょうか。

フラットコンテンツ(2D)のみを描画する通常のWebサイトとは異なり、VR Webサイトは3Dテクノロジーと仮想現実をWebサイトに適用します。

 一般的なWebサイトのように画像と動画が同じ平面に積み重ねられたコンテンツを使用する代わりに、VR Webサイトでは完全に3D空間にオブジェクトを配置できます。

3D空間のオブジェクトは、簡単に操作、回転、反転できるので、製品の詳細をあらゆる角度から観察するために、仮想ナレーターを簡単に追加して、視聴者が実際にセールスショールームで製品をプレゼンテーションしているように見せることもできます。

2Dと3Dの違いが一番大きく関わってきています。

|Web VRを楽しむ方法

Web VRに対応したコンテンツを楽しむためには、現在大きく2つの方法があります。

1つ目はPC環境でOculus RiftやHTC Viveを使う方法で、対応ブラウザはChromeとFirefoxです。

2つ目はスマホ環境で、スマホ用VRゴーグルを利用するものです。こちらの場合、使用するブラウザは何でも構いません。

WebVRの普及によってVRヘッドセットはもちろん、スマホVRゴーグルなどを使って手軽にVR体験をすることができるようになりました。

|Web VRは何で開発されている?

WebサイトのコンテンツをWeb VRで見られるようにするためには、当然ながらすべてのコンテンツを3D対応にする必要があります。

WebVRの開発は、HTML、 Javascriptを使えばできます。

JavaScriptのAPIなので、HTMLファイルにJavaScriptで記述すれば、開発が可能です。

しかし、3Dグラフィックスを表現したり、ライティング、ジャイロセンサーとの連携を計ったりするなど、対応しなければならない点は多く、開発に多くの時間がかかる事もあります。

そこで、Web上で3Dコンテンツをより単純に作成するためには以下の2つの方法があります。

・WebGLを使う方法

・A-Frameを使う方法

WebGLはWeb上で3Dコンテンツを作成するための技術で、Three.jsというJavascriptのプラグインを使用すると比較的簡単に実装することができます。

一方のA-FrameはFireFoxを開発するMozillaのVRチーム「MozVR」によって設計された「WebVR」用フレームワークであり、HTMLを書くような感覚でWebVRコンテンツを開発することができます。

|Web VRが体験できるコンテンツを紹介

さて、ここまでは文章メインでWeb VRについてご紹介してきましたが、皆さんも実際に触ってみないとわからないものも多いと思います。

ここからはA-Frameで作成されたものの中から、皆さんが体験していただけるようなコンテンツを3つご紹介します。

A-Painter

最初に紹介するのは「A-Painter」です。

A-PainterはHTC ViveとOculus Rift向けのVRペイントツール「Tilt Brush」に影響を受けて制作されたペイントツールで、Tilt Brushと同じ操作方法でバーチャル空間でイラストを描くことができます。

30種類以上のブラシが使用可能で、カスタムのブラシを追加することもできます。

それぞれのブラシのカラーやトーン、サイズなどを変える際のインターフェイスも機能的で、URLをシェアすることで描いたイラストを簡単にシェアすることもできます。

また、他のソフトウェアで制作したOBJ.ファイルを『A-Painter』に読み込んで編集できるなど、様々な機能を備えています。

A-Blast

次に紹介するのは「A-Blast」です。

A-Blastはウェブ上でプレイできるVRシューティングゲームで、プレイヤーはコントローラーを操作して、バーチャル空間に浮かんでくる絵文字のような敵キャラを撃ち落とすことでスコアを獲得します。

コントローラー操作やゲームのアニメーションの質は、アプリをダウンロードしてプレイするゲームと変わらず、シームレスなゲームプレイを体験できます。

A-Saturday Night

最後に紹介するのは「A-Saturday Night」です。

A-Saturday Nightはウェブ上でプレイできるVRリズムゲームで、約15秒間のビートに併せてダンスします。

バーチャル空間で使用できるアバター4つのうちから1つを選び、ダンス中の動作を記録してシェアすることもできます。

シンプルなコンテンツですが、位置と身体の動きを正確にトラッキングして、スムーズなダンスゲームをプレイできます。

Web VRのサンプルを見てみたい人はこちらをチェック

Web VRのサンプルは各社から出されています。

Faraday Future社のEV「FF91」の新車紹介用コンテンツは実際に車をカスタムすることができます。

それ以外にも、本家A-FRAMEからデモが出されています。

下のリンクをたどって、画面をクリックしていただければデモが始まります。

いろいろなサンプルがありますので触ってみてください。

Web VRで何ができるのか非常にわかりやすい内容になっています。

https://aframe.io/examples/showcase/helloworld/

Googleからもデモが公開されています。

ピンポンや花火などのゲーム系のサンプルや、音楽ライブで視線を振って演奏者を追うVRサンプル、火星の表面を探索車に乗ってドライブするVR映像など様々なサンプルがありますので、こちらもいろいろ触ってみていただければと思います。

またソースコードも公開されていますので、Web VRコンテンツを作ってみたい方は参考にしてみてください。

|Web VRの今後

コンテンツを利用するデバイスを選ばず、ブラウザでVR体験が可能となるWeb VRは、ユーザーのVR体験の敷居を大きく下げる存在です。

現在は、Unityなどで作ったコンテンツの方が表現力は豊かですが、Web VRのコンテンツはA-FRAMEを利用すると非常に簡単に作成することができ、ゲームやエンターテインメント利用だけでなく、VRの業務利用も大きく推進する存在になると思われます。

ARアプリやVRアプリは「ダウンロードしてもらわなければならない」という大きな問題がありましたが、Web VRにはこの問題がないからです。

スマートフォンの性能向上や、A-FRAMEなどの技術進化により、Web VRはVR体験の本命になる可能性が十分に考えられるのではないかと思います。

|Web VRのまとめ

さて、今回はアプリインストール不要のVRコンテンツ「Web VR」について紹介してきました。

Webブラウザからすぐに楽しめるということで、かなりユーザーの参加障壁を抑えられることは間違いないです。

進化を続けるWeb VRは、Web業界に限らずあらゆる業界で需要が高まることが期待されます。

この技術がもっと豊かになり、どんどんVRが世の中に普及してほしいと思います。