XRソリューション：WebXR
専用アプリなしで、PCやスマホ、タブレットのブラウザ上で3Dオブジェクトなどを現実空間にオーバレイ表示します。
QRコードを読み取ったり、画像・マーカー認識やブラウザ上で特定のURLを開いたりすることで、3Dオブジェクトなどを現実空間に重ねて表示したり、ARコンテンツとインタラクションしたりできます。
▮ WebXRとは
Webブラウザ上で仮想現実（VR）や拡張現実（AR）などのXR(Cross Reality／Extended Reality)体験を実現するための技術です。
WebXR（WebAR/VR）領域において重要視されている「WebXR Device API」は、W3C（Web標準化団体）が定めたブラウザAPIで、以下をサポートしています。
- VR表示（Virtual Reality）
- AR表示（Augmented Reality）
- 6DoFトラッキング（ポジション・向き）
- ヘッドセット・スマホなどマルチデバイス対応
これにより、Chrome、Edge、FirefoxなどのWebブラウザ上で、XR体験が可能になります。
▮ WebXRの主なメリット
| 特徴 | 説明 |
| インストール不要 | ブラウザだけで動作。アプリ不要。 |
| マルチプラットフォーム | PC、スマホ、ARグラス、VRヘッドセットで表示可能。 |
| URLで共有 | Webサイトと同じようにリンクで共有できる。 |
| 開発が簡単 | Three.js や A-Frame など既存のWeb技術と連携しやすい。 |
▮ WebXR体験
恐竜骨格３Ｄモデルやゴジラ３ＤモデルのQRコードを読み取り、現実世界に３Dモデルをオーバレイ表示※体験できます。
※スマホ画面やタブレット画面上の「ARオーバレイ表示ボタン」（左図）をクリックすると３Dモデルが現実世界に重ねてオーバレイ表示されます。
▮ WebXRの主な開発ライブラリ
WebXR実装に当り主な開発ライブラリには以下に示すものがあります。| ライブラリ名 | 特徴 |
|---|---|
| A-Frame | HTMLライクに3D/XRコンテンツを記述可能。初心者向け。 |
| Three.js | 高度な3D描画が可能。カスタマイズ性が高い。 |
| Babylon.js | 高機能でゲームエンジン的な使い方も可能。 |
| 8thWall | 高精度なWebAR。商用利用も多い（有料）。 |
| MindAR.js | マーカー認識ARに特化した軽量ライブラリ。 |
▮ WebXRの活用可能性
各適用分野でのWebXR活用可能性例を以下にご紹介します。| 適用分野 | 活用例 |
|---|---|
| 教育 | XR教材・理科実験の再現 |
| 観光 | バーチャル観光地案内 |
| 小売 | AR試着や商品展示 |
| 展示会 | オンラインXR展示ブース |
| 医療 | 手術トレーニングのWebVR化 |
どのような場面で活用いただけるのか等 お気軽にお問い合わせください。
