Vision Pro の アプリ構築 (3) - 完全没入体験の作成

以下の記事が面白かったので、簡単にまとめました。

・Creating fully immersive experiences in your app

前回

1. はじめに

「完全没入体験」(fully immersive experiences) は、ユーザーが見るすべてのものを、作成したカスタムコンテンツに置き換えます。
これは、次のことに使用できます。

・一時的な過渡的な経験を提供
・コンテンツに気を散らすことなく空間を作成
・バーチャルリアリティ(VR)ゲームを作成
・探検する仮想世界を提供

「完全没入体験」では、開発者は画面に表示されるすべてのものに責任があります。システムはパススルー動画を非表示にし、提供したコンテンツを表示し、その人の手が視界に入ったときにのみ示します。最高のパフォーマンスを得るには、「RealityKit」または「Metal」を使用してコンテンツを作成し、アニメーション化します。

通常、「完全没入体験」を他のタイプの体験と組み合わせて、それらの間のトランジションを提供します。最初にウィンドウを表示してから、「完全没入体験」に入るためのコントロールを提供すると、ユーザーに移行の準備をする時間を与えます。

2. 完全没入体験のトランジション

明確な視覚的なトランジションにより、大きな変化に適応しやすくなります。突然の移行は、混乱したり、不快にしたり、うまくいかなかったと思わせる可能性があります。

起動時に、周囲を見ることができるウィンドウやその他のコンテンツを表示します。そのコンテンツにコントロールを追加して、「完全没入体験」への移行を開始し、コントロールが何をするかを明確に示します。その際、体験を終了する方法を提供してください。

【注意】
「完全没入体験」を開始すると、visionOS は人の頭の最初の位置から約 1.5 メートルまで広がるシステム境界を定義します。 ユーザーの頭がそのゾーンの外に移動すると、システムは自動的に「完全没入体験」を停止します。この機能は、誰かが物体に衝突するのを防ぐためのアシスタントです。

「完全没入体験」を設計する方法のガイドラインについては、「Human Interface Guidelines」を参照してください。

3. ImmersiveSpace を開く

「完全没入体験」を作成するには、ImmersiveSpaceを開き、そのスタイルをfullに設定します。 ImmersiveSpace は、ユーザーの周囲のどこにでもコンテンツを配置できる「SwiftUI」シーンの一種です。シーンに full スタイルを適用すると、パススルー ビデオを非表示にし、アプリのコンテンツのみを表示するようにシステムに指示します。

アプリオブジェクトの body プロパティ、または 「SwiftUI」シーンを管理する任意の場所でスペースを宣言します。
次の例は、メインウィンドウとfullなImmersiveSpaceを備えたアプリを示しています。 起動時にアプリはウィンドウを表示します。

@main
struct MyImmersiveApp: App {
    @State private var currentStyle: ImmersionStyle = .full


    var body: some Scene {
        WindowGroup() {
            ContentView()
        }


        // Display a fully immersive space.
        ImmersiveSpace(id: "solarSystem") {
            SolarSystemView()
        }.immersionStyle(selection: $currentStyle, in: .full)
    }
}

ImmersiveSpace を表示するには、「SwiftUI」環境から取得した openImmersiveSpace を使用して開きます。このアクションは非同期で実行され、提供された情報を使用してシーンを検索して初期化します。
次の例は、solarSystem を使用して空間を開くボタンを示しています。

Button("Show Solar System") {
    Task {
        let result = await openImmersiveSpace(id: "solarSystem")
        if case .error = result {
            print("An error occurred")
        }
    }
}

アプリで一度に表示できる空間は1つだけです。別の空間が表示されている時に空間を開こうとするとエラーになります。開いた空間を閉じるには、dismissImmersiveSpace を使用します。
空間の表示について詳しくは「ImmersiveSpace」を参照してください。

4. RealityKit でのコンテンツの描画

「RealityKit」は、コンテンツが「形状プリミティブ」や「USD」で構成されている場合にうまく機能します。「RealityKit」エンティティを使用してシーンのコンテンツを整理し、コンポーネントとシステムを使用してそのコンテンツをアニメーション化します。「Reality Composer Pro」を使用して、コンテンツを視覚的に組み立て、動的なシェーダー、アニメーション、オーディオ、その他の動作をコンテンツに追加します。「RealityKit」シーンのコンテンツをシーン内の 「RealityView」に表示します。

実行時に「Reality Composer Pro」シーンをロードするには、「Reality Composer Pro」のパッケージファイルのURLをフェッチし、シーンのルートエンティティをロードします。
次の例は、アプリのバンドルにあるパッケージのエンティティを作成する方法を示しています。

import MyRealityBundle


let url = MyRealityBundle.bundle.url(forResource:
         "MyRealityBundle", withExtension: "reality")
let scene = try await Entity(contentsOf: url)

「RealityView」でコンテンツを表示し、コンテンツとのインタラクションを管理する方法について詳しくは「Adding 3D content to your app」を参照してください。

5. Metal でのコンテンツの描画

完全没入のシーンを作成するためのもう1つのオプションは、「Metal」ですべてを自分で描画することです。「Metal」を使用してコンテンツを描画する場合は、「Compositor Services」フレームワークを使用してそのコンテンツを画面上に配置します。「Compositor Services」は、Metalレンダリングエンジンをセットアップして描画を開始するために必要なコードを提供します。

「Metal」および「Compositor Services」を使用してコンテンツをレンダリングする方法、およびコンテンツとのインタラクションを管理する方法について詳しくは「Drawing fully immersive content using Metal」を参照してください。

次回

OpenAI GPT-4V／ChatGPT／GPTs 人工知能プログラミング実践入門 | 株式会社ボーンデジタル