WebAR / WebXR どこでもドア!iOS・Android対応


WebXR どこでもドア

WebXRとは?

XRとはAR(拡張現実)/VR(仮想現実)などをまとめた総称です。
ARとはスマートフォンやゴーグルに現実世界の映像が映っている中に、現実には存在しない物体を表示する技術です。

QRコードを床や机の上において、それをスマートフォンのカメラで読み込んでAR表示を行うアプリは何年も前からあります。これを実現するためには、スマートフォンにアプリをインストールするのが前提ですが、例えば、イベントなどで来場者にその都度アプリをインストールしていただくのは手間がかかります。

その手間を省くために、普通にホームページを見るような感覚でARを実現する方法が「WebAR」であり「WebXR」です。

Android/iPhone(iOS)に対応したWebXR

WebXRはまだまだ発展途上です。スマートフォンの種類の違い(AndroidなのかiPhoneなのか)などにより、いろいろと動作が異なる部分があるため、難しい部分が多くあります。

VR(仮想現実)はスマートフォンの中のみで完結するため実装しやすい部分も多いですが、AR(拡張現実)はカメラで撮影している映像に仮想の物体を組み合わせて表示しなければならないため、難しいです。

WebAR版「どこでもドア」

今回制作したWebAR版どこでもドアは、あるホームページにアクセスすると次のような動作を行います。

  1. 音声認識により行き場所を特定。今回は鳥取と東京。
  2. スマートフォンを動かし「平面」(部屋の床)の検知
  3. 部屋の中に「どこでもドア」出現
  4. スマートフォンを持って歩きながらドアに近づいていくと仮想世界(360度写真)に入り込む

動作や認識・検知率に差異はあるものの、AndroidでもiPhone(iOS)でも同じコードで動作します。

実際に動作している様子は下記の映像をご覧ください。
スマホでWebXRをしながら画面録画もしているので、WebXR単体動作よりもレスポンスが悪いです。