Quest / PICO First
WebXRデモ一覧
VR/AR/MRをブラウザで試せるWebXRデモをまとめています。すべてのデモに「対応端末かどうかをImmersiveセッションに入る前に判定するパネル」があり、非対応の環境では理由が表示されて停止します。サイレントに失敗するデモはありません。
Recommended Flow
新しいVRデバイスで試す順番
最初から尖ったMR機能に行かず、VR入室 → 音と入力 → 描画fallback → 境界確認の順に見ると、Meta QuestとPICOの差分を安全に切り分けられます。
WebXR Audio Space - 空間音響をブラウザで試す
VRに入って、頭を動かすと音の定位が変わるかを確かめる
Meta Quest / PICO / PC Browser
IWSDK VR Gallery — VR空間で記事カードを閲覧するデモ
VR空間内で記事カードを選び、遷移なしで本文まで読む
Meta Quest / PC VR
WebGPU / WebGL fallback — 描画経路の切り替えを可視化する実験
WebGPUが使えるか、WebGLに落ちるかを画面上で診断する
Meta Quest / PICO / Desktop
WebXR Bounded Floor ビューア — プレイエリア境界(boundsGeometry)の可視化
プレイエリア境界(boundsGeometry)を床に描画して確認する
Meta Quest
バッジの見方
Track 1
VR動作チェック
新しいMeta QuestやPICOで最初に回す基本チェック。VR入室 → 音・入力 → 描画fallback → 境界の順で、端末の素性を切り分けます。
Body Tracking — WebXR proposal で全身スケルトンを扱う検証
起動可否・入力・終了導線をまず確認する
WebXR Body Tracking proposal の body-tracking feature descriptor と XRFrame.body / XRBody を前提に、全身スケルトン取得とアバター駆動の入口を確認する実験デモ。
WebXR Body Tracking — 全身トラッキング関節を点と線で可視化
XRFrame.bodyの全身関節が取得できるかを見る
WebXR Body Tracking proposal の body-tracking feature を使い、XRFrame.body の関節姿勢を確認する実験。PICOなど対応ブラウザでの実機検証に使います。
動作確認済WebXR Audio Space - 空間音響をブラウザで試す
VRに入って、頭を動かすと音の定位が変わるかを確かめる
WebXR と Web Audio API を組み合わせ、ヘッドセットやブラウザ上で音の位置・距離・向きによる聞こえ方を確認する空間音響デモ。
LabWebXR Bounded Floor ビューア — プレイエリア境界(boundsGeometry)の可視化
プレイエリア境界(boundsGeometry)を床に描画して確認する
WebXR の bounded-floor / local-floor ReferenceSpaceType と boundsGeometry でプレイエリア境界を可視化し、Quest Browser 146 修正後の床基準とのずれを確認する実験。
LabWebGPU / WebGL fallback — 描画経路の切り替えを可視化する実験
WebGPUが使えるか、WebGLに落ちるかを画面上で診断する
WebGPU が使えない端末やブラウザで、WebGL の描画経路へ fallback する判断を可視化するデモ。navigator.gpu と requestAdapter() で GPU adapter を取得し、feature detection で経路を選ぶ設計を確認できる。
Track 2
MR / AR Lab
パススルーAR、hit-test、depth、room meshなど端末依存が強い機能のLab。事前判定パネルで対応可否を確認してから入ります。
条件付きWebXR Hit Test Advanced - 現実空間への配置をブラウザで試す
現実の床や机にreticleを吸着させ、オブジェクトを置く
WebXR Hit Test Module を使い、スマートフォンARやMeta Questのパススルー環境で、現実空間の床や面に3Dオブジェクトを配置する挙動を確認できるデモ。
LabWebXR Depth Occlusion デモ — Quest depth projection でMR合成を検証
現実物体と仮想物体の前後関係(depth)の差を見る
WebXR Depth Sensing Module と Quest Browser 146 の depth projection 実装で、仮想オブジェクトが現実の机や壁に隠れる MRオクルージョンを検証する実験。
プレビュー可HTML model 要素のプレビューと fallback — 空間表示へつなぐ実験
3Dモデルのfallback(native / polyfill / 画像)を切り替えて見る
HTML の model 要素、fallback ライブラリ(polyfill)、image fallback を切り替えながら、Webページ内の3Dモデル表示を確認するデモ。Safari 27 beta の model 要素と Spatial Web を想定。
Track 3
スマホWebAR
WebXRではなくカメラベースWebARの枠。iPhone / Androidのブラウザで動かします。

