Appearance
VR/XRプロトタイピングツール調査
ShapesXR
web上とHMD上両方からUIやオブジェクトの位置を調整したり、インタラクティブな要素を着けて体験することができるアプリ。
figmaからのフレーム取入れも可能らしい。
価格問い合わせメール送信済み。
Bezi
figmaでデザインしたUIをそのまま反映してHMDで確認できるらしい。数年前にAIプラットフォームとBezelという元のツールが合体して今の形になっているらしい。
いまのBeziはAIを使ったゲーム制作ツールが機能の主となっているうえ、英語しかドキュメントがなく、日本語での記事も英語での記事も少なすぎて使いにくいかもしれないです。
ドキュメントが読みにくかったのでAI情報ですが、下記の手順で可能らしい。
1. 準備：FigmaとBeziのアカウントを用意する
- Figmaで作成したUIフレームを用意する。
- UI要素は必ずFrameとして整理しておくこと。
- Beziのアカウントを作成し、ログインする。
2. Figmaアクセストークンの発行
BeziがFigmaのデータを読み込むためには、Figma側のPersonal Access Tokenが必要です。
- Figma → Menu（右上ユーザーアイコン） > Settings > Personal Access Tokens
- 新しいトークンを作成する（名前を付けて発行）
- 発行したトークンをコピーする
- これをBeziの設定で貼り付けます。
3. BeziにFigmaを連携する
- Beziのプロジェクトを作成する
- Bezi内の「Figma Import / Image Texture」の設定画面を開く
- 先ほど発行したFigmaトークンを貼り付ける
- Figmaで取り込みたいFrameのリンクを取得する
- Figmaで対象Frameを選択 →右クリック → Copy Link
- Beziの「Figma Frame Texture」欄にリンクを貼る
- 「Set to native ratio」を押すと、元のアスペクト比に合わせてサイズ調整されます。
4. 3D空間上に配置する
- 読み込んだFigmaフレームを選択すると、Bezi内でテクスチャ付きパネル（UIプレート）として扱えるようになります。
- そのUIパネルを3D空間上にドラッグ＆ドロップして配置する
- 必要に応じて
回転、スケール調整
位置調整
視点/カメラ位置の変更
を行います。
5. インタラクションとアニメーション設定（任意）
Beziでは簡単なインタラクションも設定できます（例：ボタンを押した後の画面遷移やアニメーションなど）。
UIパネルを選択した状態でプロパティからイベント/アニメーション設定を追加します。
6. HMDでの確認
BeziプロジェクトはWebベースで動作するため、対応するHMD/デバイスのブラウザでURLを開くことで確認できます。
- Meta Quest系ではブラウザでURLを開く
- Vision Proなど対応デバイスも同様の方法でプロトタイプを閲覧できます
- Figmaで作成したUIフレームを用意する。
MinsarStudio
metaquestで動く空間デザインアプリ。
デモ動画からはshapesxrのようなことができるアプリのように見える。webからの編集は不可能っぽい。料金や商用ライセンスなどの表記は見つけられませんでした。
ShapesXRとの問い合わせ記録
おそらくアジアエリア担当のHansという方をJordanからメールで紹介されました。電話でコミュニケーションがとりたいという旨だったため、英語が流暢な人間が社内にいないためhansが日本語出来ないなら電話は難しいのでメールが良いという旨の返信をしています。
Author: 松崎 | Source:
松崎\VR XRプロトタイピングツール調査 2f8aba435ee780c5ac52e4efa3ef9fd3.md