UStackUStack
ReactVision Studio icon

ReactVision Studio

ReactVision Studioは、ブラウザでAR/VRシーンを視覚的に作成し、React NativeとViroReactでiOS、Android、Meta Questへネイティブ配信できるXRエディタです。

ReactVision Studio

ReactVision Studioとは?

ReactVision Studioは、ReactVisionスタックの一部として拡張現実と仮想現実のシーンを構築するための、ブラウザベースのビジュアルエディタです。コンポーネントをキャンバスへドラッグしてシーンを組み立て、StudioGoでスマートフォンやヘッドセット上で変更をプレビューし、同じシーンをViroReact経由でReact Nativeアプリ内にネイティブ配信できます。

この製品は、iOS、Android、Meta Questでのネイティブレンダリングを維持しながら、作成ワークフローをブラウザ内に保つよう設計されています。ページによると、Studioはシーングラフを自動生成し、クラウドアンカーとジオスペーシャルアンカーをサポートし、AIベースの3Dアセットを生成してプロジェクトライブラリに追加できます。

主な機能

  • AR/VR向けのブラウザベースシーンエディタ: デスクトップエンジンではなく、ブラウザ上で視覚的にシーンを構築します。
  • ViroReactによるReact Native配信: 単一のシーン形式を1つのコンポーネントでアプリに読み込めるため、実行時はReact Nativeコードベース内に収まります。
  • ネイティブプラットフォームレンダリング: iOSではARKit、AndroidではARCore、Meta QuestではHorizonOSでレンダリングします。
  • StudioGoによるライブ端末プレビュー: 作業中に、接続された実機へローカルネットワーク経由で編集内容が反映されるのを確認できます。
  • アセットとシーンの管理ツール: エディタにはコンポーネントインスペクタ、モデル・テクスチャ・音声用のアセットライブラリ、アンカー駆動のナビゲーションを備えたマルチシーンプロジェクトが含まれます。
  • AI支援の3Dアセット生成: テキストでアセットを説明して3Dモデルを生成し、そのままプロジェクトライブラリに配置できます。
  • Expo対応: ページでは、Studioは開発ビルド付きでExpoプロジェクトに組み込めると説明されています。

ReactVision Studioの使い方

一般的なワークフローはブラウザから始まり、開発者またはXRクリエイターがStudioを開いてキャンバス上にコンポーネントを配置してシーンを作成します。各ノードを確認し、アセットを追加し、アニメーションやアンカーを設定し、StudioGoを使ってスマートフォンやヘッドセット上でシーンをプレビューできます。

シーンの準備ができたら、StudioSceneNavigatorコンポーネントをReact Nativeアプリに追加します。ViroReactが実行時にシーンを読み込むため、変更ごとにアプリを再ビルドすることなく、チームはビジュアルシーンの反復を続けられます。

ユースケース

  • レイアウトや配置の確認中に実機プレビューが必要なAR製品デモを作成する。
  • 別のヘッドセット専用プロジェクトを立ち上げずに、Meta Quest向けのVRまたは複合現実体験を作成する。
  • 空間シーンを含み、JSXに慣れたモバイルチームが保守できるReact Nativeアプリを出荷する。
  • シーン配置やナビゲーションを頻繁に調整する必要がある、ジオスペーシャルまたはアンカー आधारित体験をプロトタイピングする。
  • テキストプロンプトからプレースホルダーまたは初期段階の3Dアセットを生成し、より速く組み立てるためにシーンライブラリへ追加する。

FAQ

ReactVision Studioはブラウザで動作しますか?
はい。エディタはブラウザベースで、レンダリングされた体験はReact NativeとViroReact経由でネイティブ配信されます。

実行時出力はどのプラットフォームに対応していますか?
ページでは、iOS、Android、Meta Questが挙げられており、ARKit、ARCore、HorizonOSによるネイティブレンダリングに対応しています。

シーンを変更するたびにアプリを再ビルドする必要がありますか?
ページでは、StudioSceneNavigatorがStudioから実行時にシーンを読み込むと説明されており、アプリを再ビルドせずにシーンを反復できるようにすることを意図しています。

Expoは使えますか?
はい。ページでは、StudioはExpoに対応しており、開発ビルド付きでExpoプロジェクトに組み込めると説明されています。

ARプレビューにシミュレーターは対応していますか?
いいえ。ページでは、ARプレビューには実機が必要で、このワークフローではシミュレーターとエミュレーターはサポートされないと説明されています。

代替手段

  • UnityベースのXR開発: AR/VRプロジェクトでよく使われる代替手段で、通常はブラウザエディタとReact Nativeのシーン実行時環境よりも、フルエンジンのワークフローを伴います。
  • UnrealベースのXR開発: もう一つのエンジン中心の選択肢で、JSX駆動のReact Native統合よりも、より広いゲームエンジンワークフローを望むチームで一般的に使われます。
  • WebXRアプリケーション: ネイティブアプリ配信を避けるブラウザ配信のXR体験ですが、ページではReactVisionをブラウザ専用ではなくネイティブ優先の विकल्पとして位置づけています。
  • 手動のReact Native + プラットフォームSDK統合: チームはネイティブのARKit、ARCore、またはQuestツールで直接構築できますが、通常はStudioのビジュアル作成フローよりも多くのプラットフォーム固有実装が必要です。