QuestのMR環境で、仮想オブジェクトが現実物体に隠されるか手前に出るか（MRオクルージョン）を確認するための実験です。
このデモでは、実機のWebXR Depth API（Depth Sensing Module）を直接使う前に、机のエッジと仮想ボックスの奥行きをスライダーで動かし、depth occlusion の有効/無効の差分を見える形にしています。Quest BrowserでMRオクルージョンを試す前に、どの状態を検証すべきか整理するための仕様カードとして使えます。
通常プレビュー
depth occlusion の有効/無効を切り替え、箱と机エッジの奥行きを動かして前後関係を比較できます。
WebXRデモ
Quest BrowserやWebXR EmulatorでARに入ると、目の前に半透明の箱と机エッジを表示します。Depth APIが使えない環境でも通常3D表示として確認できます。
試せること
- depth occlusion の有効/無効を切り替えて、仮想ボックスの合成結果を比べる
- 箱と机エッジの奥行きを動かし、どの位置で隠れるべきか確認する
- WebXRがないデスクトップ環境でも、オクルージョンで見るべき状態を確認する
学べること
WebXRのdepth系機能（Depth Sensing Module）は、コードだけでなく端末、ブラウザ、実験フラグ、セッションモードに強く依存します。
そのため、デモ公開時は「depth情報が使えるか」だけではなく、depth情報が使えない場合にどう見せるか、前後関係が左右目で破綻しないか、通常AR表示へ落ちた時に意味が伝わるかを確認する必要があります。
対応環境
| 環境 | 状態 |
|---|---|
| Quest Browser 146.0以降 | Lab / depth projection検証向け |
| デスクトップChrome | 代替プレビュー |
| iOS Safari | 非対応 / 概念プレビュー |
Quest Browser 146.x メモ
Meta Horizon OS Developers release notesでは、Quest Browser 146.0（2026年4月21日）で WebXR depth projection support が追加されています。このデモは、実APIに依存しすぎる前に、オクルージョンあり / なしの表示差分とフォールバック方針を確認するための Lab として扱います。
実装メモ
- 体験パターン: MR空間での depth occlusion プレビュー
- 描画: Canvas 2Dによる通常プレビュー / Three.jsによるWebXRデモ
- XRモード:
immersive-ar想定 - 任意機能: WebXR Depth Sensing Module
- フォールバック: オクルージョンなしの通常合成として表示
用語メモ
| 用語 | このページでの意味 |
|---|---|
| depth occlusion（MRオクルージョン） | 現実の机や壁との前後関係を使って、仮想オブジェクトを自然に重ねる表示 |
| オクルージョンなし表示 | depth情報を使わず、仮想オブジェクトを画面上にそのまま重ねる表示 |
| フォールバック表示 | 端末やブラウザが対応していない時でも、通常の3D表示として体験を残すこと |