Contents
Figmin XR スクリプト API の特徴と基本構造
Figmin XR Script APIは、JavaScript/TypeScriptをベースとした開発環境で、Meta Quest 3向けに最適化されたAPI仕様を提供しています。空間オブジェクトの同期やメッシュデータの処理など、MR（Mixed Reality）開発に必要な主要機能をカバーし、パフォーマンスと実装性の両立を目指した設計思想が特徴です。以下でAPIの主なモジュールについて解説します。
JavaScript/TypeScript を活用した開発環境では、従来のVR開発に比べて学習曲線を低く抑えることが可能です。非同期処理支援やオブジェクトモデルの簡潔性が強みであり、空間情報の動的更新にも適しています。
APIの主要なモジュール概要
Figmin XR Script APIは以下の主なモジュール構成を持ちます。各モジュールはMR開発における特定の用途に特化しており、統合的な利用が可能となっています。
| モジュール名 | 主な機能 | 補足 |
|---|---|---|
| TransformManager | 位置・回転・スケールの同期処理 | 実時間で空間オブジェクトを操作可能 |
| MeshSerializer | メッシュデータの保存/読み込み | シーンの永続化や動的生成に活用（Meta Quest 3専用機能） |
| XRInputHandler | ユーザーインタラクションイベント | 手指・眼視などに基づく操作処理を管理 |
注意点：
- TransformManagerおよびMeshSerializerはMeta Quest 3のハードウェア特化型APIであり、他のデバイスとの互換性は保証されません。
- サポート対象外機種での使用を検討する場合は、事前に公式ドキュメントで確認してください（参考）。
Meta Quest 3 開発環境の構築手順
Figmin XR Script APIを利用した開発には、Quest 3向けに調整された開発環境の構築が不可欠です。以下に必要なツールとプロジェクトテンプレートの初期化方法を解説します。
必要なソフトウェアとツール
Meta Quest 3での開発は、Node.jsやFigmin CLIなどのツールが前提となります。環境構築において重要なポイントは以下の通りです。
- Node.jsのバージョン管理：
nvmを使用し、公式ドキュメント推奨バージョン（例: v18.x）を導入 -
Figmin CLIのインストール：npm経由でグローバルインストール
npm install -g @figmin/cli -
Quest 3デバイス接続確認：OVR ManagerからTarget Devices設定をQuest 3のみに変更（参考）
注意：
- 上記リンクは外部サイトであり、リンク切れの可能性があります。公式ドキュメントを優先してください。
プロジェクトテンプレートの設定方法
プロジェクトの初期化にはFigmin CLIが提供するテンプレートを使用します。以下に手順を示します。
-
新しいディレクトリを作成し、移動
mkdir my_mr_app && cd my_mr_app -
Figmin CLIでテンプレートプロジェクト生成
figmin init --template xr-script-api -
package.jsonに依存関係を追加（例:@figmin/transform-sync）
npm install @figmin/transform-sync
導入時の注意： サンプルコードでは
main.jsが初期ファイルとして生成されるため、開発環境の動作確認にはこのファイルを起点にします。
位置・回転・スケール同期処理の実装例
MRアプリでは、空間オブジェクトの動的更新が不可欠です。Figmin XR Script APIではTransformManagerモジュールを使って、位置・回転・スケールの同期を効率的に実行できます。
Transform同期の基本パターン
空間オブジェクトの同期は以下のコードで実装可能です。この例ではupdate()メソッド内で、3Dオブジェクトの位置情報を定期的に更新しています。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
import { TransformManager } from '@figmin/transform-sync'; const transformMgr = new TransformManager(); function update() { const targetPosition = getTargetPosition(); // 空間データ取得関数 transformMgr.setPosition(targetPosition); requestAnimationFrame(update); } update(); |
フレームレートに応じた最適化
高フレームレート環境下では、requestAnimationFrame()の呼び出し頻度を制御する必要があります。以下は性能を抑えた例です。
- 条件分岐による処理調整：
javascript
if (performance.now() % 16.67 < 5) { // 約60fpsに合わせたタイミング
transformMgr.applyChanges();
}
パフォーマンスヒント： 常時同期が必要な場合、
TransformManager.setSyncInterval()メソッドで更新間隔を設定することが推奨されます。
MeshSerializerクラスの使い方
MeshSerializerは、3Dメッシュデータを読み込む・保存するためのクラスです。シーンの永続化や動的生成時の処理に活用可能です。
メッシュデータの読み込み・保存処理
メッシュファイル（.glbなど）を読み込む際は、以下の手順で実行します。
-
ファイル読込：
javascript
const mesh = await MeshSerializer.load('path/to/asset.glb'); -
メッシュのシーンへの追加：
javascript
scene.add(mesh); -
メッシュの保存（仮想環境専用）：
javascript
MeshSerializer.save(mesh, 'path/to/save.glb');
重要：
-MeshSerializer.save()はMeta Quest 3のエミュレーション環境または特定された仮想環境でのみ動作します。他のハードウェアで使用する場合は、ファイルシステムへの直接保存機能を備えた代替手段を検討してください。
メタデータ付きオブジェクトのシリアライズ
メッシュデータに追加情報を含めたい場合、setMetadata()メソッドで属性を設定します。
|
1 2 3 4 |
mesh.setMetadata({ created_at: new Date().toISOString() }); |
応用例： メタデータはローカルストレージやクラウドDBに保存されることで、シーンデータのバージョン管理が可能になります。
イベントハンドリングのベストプラクティス
ユーザー操作やセンサー入力などのイベント処理は、MRアプリの動作にとって極めて重要です。Figmin XR Script APIではライフサイクル管理とリスナー登録方法を意識した設計が求められます。
XRインタラクションイベントの処理フロー
以下のようにイベントリスナーを登録し、操作に応じた動作を実装します。
|
1 2 3 4 5 6 7 8 |
import { XRInputHandler } from '@figmin/xr-events'; const handler = new XRInputHandler(); handler.on('pointer-down', (event) => { console.log("ユーザーがオブジェクトを選択しました", event); }); |
メモリリーク防止策
イベントハンドラのライフサイクルを管理しないと、不要なメモリ使用量が増加します。以下の対応を行いましょう。
-
不要なリスナーの解除：
javascript
handler.off('pointer-down'); -
コンポーネント破棄時の処理：
javascript
function cleanup() {
handler.removeAllListeners();
// 其他リソース解放処理...
}
推奨実践： イベントハンドラは、アプリケーションが終了する際やセッション切り替え時に必ず解除することが重要です。この管理の欠如がメモリリークにつながる可能性があります。
最初のMRアプリ開発への道
Figmin XR Script APIで最初のプロジェクトを構築するには、公式ドキュメントとサンプルコードを活用することをお勧めします。それにより、APIの使い方やフレームワーク設計に関する知識を効率的に習得できます。
公式ドキュメントの活用法
公式リファレンスでは、以下のような情報が公開されています：
- 各クラス・メソッドの詳細説明
- サンプルプロジェクトのコード構成
- トラブルシューティングガイド
Figmin XR Script API リファレンス は、開発中の不明点を解決するための最も信頼性のある情報源です。
注意：
- 上記リンクは公式リファレンスとして掲載されておりますが、リンク切れの可能性があります。最新情報を確認する際は、Figmin公式サイトからアクセスしてください。
サンプルコードの実行環境構築
以下のように、公式サンプルプロジェクトを使用して動作確認を行いましょう。
-
GitHubからサンプルコードをクローン
git clone https://github.com/figmin/xr-script-api-demo.git -
プロジェクトディレクトリに移動し、依存関係をインストール
cd xr-script-api-demo && npm install -
開発環境起動
figmin run
注意： サンプルコードはMeta Quest 3のエミュレート機能が必要な場合があります。詳細はこの記事で確認してください。
記事全体の要点
- Figmin XR Script APIはJavaScript/TypeScriptで開発可能
- メッシュデータ処理には
MeshSerializerクラスが用いられる（Meta Quest 3専用） - 位置・回転同期は
TransformManagerで実装可能（他のデバイスとの互換性の注意事項あり） - イベントハンドリングの最適化を心がけること（メモリリーク防止策も含む）
- 公式リファレンスとサンプルコードに注力すること（リンク切れの可能性あり）