オープンソースプロジェクト「Project Spirare」で始めるノーコード AR コンテンツ開発

オープンソースプロジェクト 「Project Spirare」で始める ノーコード AR コンテンツ開発 株式会社ホロラボ 古田 裕介 田野 哲也

自己紹介 古田裕介 たるこす (@tarukosu) 株式会社ホロラボ Researcher 2

• https://twitter.com/tarukosu

自己紹介 た の てつ や 田野 哲也 ソフトウェアエンジニア Playful Fields すまのべ！ Unityを中心にXR系コンテンツの 開発をやっています。 Copyright© HoloLab Inc. All rights reserved 3

Project Spirare 概要 Copyright© HoloLab Inc. All rights reserved 4

Project Spirare とは • ホロラボが開発を進めているオープンソースプロジェクト • AR コンテンツの作成と表示がノーコードで簡単に行える Copyright© HoloLab Inc. All rights reserved 5

Spirare Editor と Spirare Browser Spirare Editor Spirare Browser PC 用コンテンツ作成アプリ 各種端末用コンテンツ表示アプリ Copyright© HoloLab Inc. All rights reserved

2種類の配置方式 地理配置 空間配置 特定の場所 (マーカー, VPS マップなど） を基準として、 そこからの相対位置 (x, y, z) で オブジェクトの位置を指定 緯度・経度・高さ（楕円体高）で オブジェクトの位置を指定 3D都市モデルおよびPLATEAUオルソはProject PLATEAU で提供されるデータを利用 (https://www.mlit.go.jp/plateau/) 地形データは、測量法に基づく国土地理院長承認（使用）R3JHs 778を得て使用 Copyright© HoloLab Inc. All rights reserved 7

• https://www.mlit.go.jp/plateau/

空間配置モードの Editor, Browser Spirare Editor Spirare Browser PC 用コンテンツ作成アプリ 各種端末用コンテンツ表示アプリ Copyright© HoloLab Inc. All rights reserved

地理配置モードの Editor, Browser Spirare Editor Spirare Browser PC 用コンテンツ作成アプリ 各種端末用コンテンツ表示アプリ 3D都市モデルおよびPLATEAUオルソはProject PLATEAU で提供されるデータを利用 (https://www.mlit.go.jp/plateau/) 地形データは、測量法に基づく国土地理院長承認（使用）R3JHs 778を得て使用 Copyright© HoloLab Inc. All rights reserved

• https://www.mlit.go.jp/plateau/

実機デモ（空間配置モード） • 空間配置の基準位置として QR マーカーを利用 Spirare Editor Spirare Browser Copyright© HoloLab Inc. All rights reserved 10

デモ動画（地理配置モード） 3D都市モデルおよびPLATEAUオルソはProject PLATEAU で提供されるデータを利用 (https://www.mlit.go.jp/plateau/) 地形データは、測量法に基づく国土地理院長承認（使用）R3JHs 778を得て使用 Copyright© HoloLab Inc. All rights reserved 12

• https://www.mlit.go.jp/plateau/

Spirare Editor, Browser を試すには 詳細な手順はブログ記事をご参照ください ・ Spirare Editor: ビルド済みアプリケーションをダウンロード可能 ・ Spirare Browser: 一度だけ Uniｔｙ Editor でのビルドが必要 Project Spirare による AR コンテンツ作成 [AR Foundation, QR マーカー編] Project Spirare による AR コンテンツ作成 [AR Foundation, Geospatial API 編] Copyright© HoloLab Inc. All rights reserved 13

Project Spirare の仕組み Copyright© HoloLab Inc. All rights reserved 14

(再掲)Spirare Editor と Spirare Browser Spirare Editor Spirare Browser PC 用コンテンツ作成アプリ 各種端末用コンテンツ表示アプリ Copyright© HoloLab Inc. All rights reserved

3D コンテンツ用フォーマット POML(ポムル) Spirare Editor PC 用コンテンツ作成アプリ Babylon.js を利用 Spirare Browser 3D コンテンツデータ POML モデルデータ 画像データ Copyright© HoloLab Inc. All rights reserved 各種端末用コンテンツ表示アプリ Unity を利用

POML(ポムル) とは • Project Spirareで仕様を定義している 3D コンテンツのためのフォーマット • XML ベース • 特定のゲームエンジンに依存しない • 3D モデル、画像、動画などの表示位置を記述する • 個別のデータ自体は POML には含まず外部ファイルを参照する 3D コンテンツデータ POML モデルデータ (.glb) 画像データ (.png, .jpg) POML の仕様 <poml> <scene> <model src="./Whale.glb"> </model> <image src="./HoloLab.png"> </image> </scene> </poml>

POML(ポムル) による拡張性 Spirare Browser (AR) Spirare Editor 3D コンテンツデータ Spirare Browser (VR) POML モデルデータ プログラムで生成 Web アプリケーション 画像データ カスタムアプリケーション 3D都市モデルおよびPLATEAUオルソはProject PLATEAU で提供されるデータを利用 (https://www.mlit.go.jp/plateau/) 地形データは、測量法に基づく国土地理院長承認（使用）R3JHs 778を得て使用 Copyright© HoloLab Inc. All rights reserved 18

• https://www.mlit.go.jp/plateau/

Project Spirare 活用事例 Copyright© HoloLab Inc. All rights reserved 19

アプリ組込み：torinome AR VPSモード 地理配置モード torinome Webで地図上にオブジェクト配置 torinome ARで現地にて重畳表示 ※位置合わせはARCore Geospatial APIを利用 POML 読み込み torinome AR(iPadアプリ)にSpirareを組み込んでいるため、torinome APIが出力した POML形式のデータを読み込むだけで、現実へのCGの重畳表示を簡単に実現。 Copyright© HoloLab Inc. All rights reserved 20

アプリ組込み：観光案内ARアプリ 空間配置モード 歴史的建造物が並ぶ観光地向けの案内を行うためのARアプリ開発時、現地の街並み をスキャンした3Dモデルに対してSpirare Editorで各種オブジェクトの配置を実施。 実際のARアプリにもSpirareを組み込み、現地でのCGの重畳表示を実現。 ※VPSは他社ライブラリを使用 Copyright© HoloLab Inc. All rights reserved 21

提案活動：品川テクノロジーテラス 地理配置モード 2024年3月に開催された品川テクノロジーテラスで展示するコンテンツのイメージを 伝える際にSpirareアプリを活用。使用する予定の3DモデルをMR表示で見せることで 文字やイラスト以上にイメージを伝えることができ、コンテンツ案の早期確定に繋がった。 ※動画は実際に展示した完成品で、提案時にはない各オブジェクトの動きや演出が加えられている Copyright© HoloLab Inc. All rights reserved 22

事前検証：Meta Quest 3 精度チェック 空間配置モード Meta Quest 3発売直後、デジタルミュージアムを閲覧するためのMRデバイスとして 採用可能か判断するため、オブジェクトを配置して質感や6DoF精度のチェックを実施。 Copyright© HoloLab Inc. All rights reserved 23

おわりに Copyright© HoloLab Inc. All rights reserved 24

おわりに • Spirare Editor と Spirare Browser を使うことでノーコードで AR コンテンツ開発ができる • 有償にて Spirare をベースとしたカスタムアプリ開発も可能です • ホロラボ社員またはお問い合わせフォームよりご連絡ください Project Spirare による AR コンテンツ作成 [AR Foundation, QR マーカー編] Project Spirare によるARコンテンツ作成 [AR Foundation, Geospatial API 編] Copyright© HoloLab Inc. All rights reserved ホロラボお問い合わせフォーム 25