はじめに
Google Cloud（以下、GCP）が提供する Immersive Stream For XR（以下、is4xr）をみなさん活用していますでしょうか。is4xrの概要や仕組みについては、こちらの記事をご覧ください。
前回の記事では説明をスキップした、is4xr向けにGoogleが用意しているUnreal Engine（以下、UE）のテンプレートプロジェクトを実際にローカルPCで触りながら中身を簡単に紹介したいと思います。
UE自体が初心者の方向けの内容となっておりますので、紹介している内容に誤認や間違いなどがあれば教えてください。
私自身もWEBアプリケーション、インフラ系をメインとしたエンジニアですのでUE自体は初心者に近いです。一緒に勉強しましょう！
テンプレートプロジェクトとは
is4xrをより簡単に利用するために、必要な機能をテンプレートとして実装したUEプロジェクトになります。Googleが公式でgithubで公開しているものです。Readmeにはかなり詳しく説明が記載されていますので、UEに詳しい方などはそちらを確認ください。
is4xrではUEプロジェクトをクラウドレンダリングで利用するために様々な処理を行っています（詳細が公開されているわけではないのでおそらくです）。それらに必要な処理が事前に実装されているものとなっており、ここをベースに開発することでより早く開発を進めることができます。
テンプレートプロジェクトを使わずに開発されたUEプロジェクトをis4xrで動かしてみたい方向けには、is4xrで必要な機能のみインテグレーションする手順もReadme内に追加されましたのでそちらを参考にチャレンジしてみてください。
ローカルPCの準備
クイックスタートのBefore you beginを見ると以下のように書かれています。
最小スペックとして、windowsかつGPUなども必要と書かれていて、そもそも諦めてしまいそうになりますが、実際には性能が足りなくても、macでもとりあえず動かすことはできます。今回はmacで確認します。
参考までに、Unreal Editor自体のmacの推奨スペックはこちら。
今回のローカルPCのスペック
- Model: MacBook Pro 14-inch, Nov 2023
- Chip: Apple M3
- Memory: 24 GB
- OS: macOS 14.4
Unreal Enginの準備
UE向けに用意されたプロジェクトとなるため、ローカルPCにUEをダウンロードしてインストールします。公式のダウンロードページの通りインストールします。
- Epic Gamesのアカウントを作成します
- Epic Game Lancherをインストールします
- Unreal Engineをインストールします（5.3.2）
現在の最新バージョンは5.3.2に対応しています。
継続的な開発運用を進めるにあたってバージョンについては気をつける点などがありますが別の記事で紹介します。
テンプレートプロジェクトを触ってみよう
ローカルPCの準備が完了したので実際にテンプレートプロジェクトを開いて、中身の構成や用意されたデモをどのように動かすかなど簡単に紹介します。
テンプレートプロジェクトのダウンロード
テンプレートプロジェクトをダウンロードします。
テンプレートプロジェクトの起動
テンプレートプロジェクト内のフォルダUnreal_Template_Projectがテンプレートプロジェクトになります。フォルダ内のXR_Template.uprojectをダブルクリックします。
Unreal Editorが開くのを待ちます。スペックによって時間は様々です。
こんな画面がひらけば成功です。
画面上部の再生ボタンで再生して操作してみましょう。
テンプレートプロジェクトの中身について
起動時にはメインレベルのISXR_Mainというレベルが表示されます。画面右のアウトライナーでテンプレートとして実装されているアクタを確認することができます。いくつか重要なアクタや実装について紹介します。
今回でてくるUE用語を簡単に記載します。
| 言葉 | 意味 |
|---|---|
| レベル | ゲームの１つの空間（ワールド、マップ等）を指します。 |
| アクタ | レベルに配置するオブジェクトの総称です。色々なアクタがあります。 |
| ポーン | 操作などの制御が可能なアクタです。 |
| ブループリント | グラフティカルなUIでプログラミングするツールです。 |
| EventBeginPlay | ゲーム開始時に発生するイベントです。 |
ISXR_Init
is4xrで動作するためのコアな機能や処理が含まれたアクタです。消すとis4xrで動かなくなります。
既存プロジェクトにインテグレーションする場合も、このアクタは必ず必要でメインレベルに配置してEventBeginPlayでこのアクタ内のブループリントが動くようにする必要があります。
- URLアクセス時に適切なレベルにマッピングします
- クラウド側のインスタンスとの接続の制御も行っていそうです
- etc...
アウトライナーからISXR_Initを編集をクリックするとブループリントが開きます。EventBeginPlayでレベルのマッピング等の処理を行って再生されます。
ISXR_3D_Pawn
is4xrでWEBブラウザからのタップやスワイプなどの操作がクラウド上のインスタンスと連動するカメラのポーンです。
- １つの点を中心に360度旋回するorbitカメラです
- 詳細のパラメータからピンチインなどのスピードや最大最小の距離などを調整できます
- ユーザのカメラ操作が不要な場合はこのカメラを使う必要はありません。例えば、シーケンサーを使ってcine cameraアクタで演出側カメラを自動で操作制御をするような場合などは別途カメラを追加します
UI関連
体験時に前面に表示されるUIです。これはアクタではなく、UIフォルダにウィジェットブループリントとして用意されています。UI機能を使うことでWEBブラウザ上でのボタンタップなどでの制御が可能です
All -> Content -> UI -> を開きます
Main_UIは、実際の画面に表示されるウィジェット部分です。
ISXR_HUDは、EventBeginPlayでUIを表示したり、WEBブラウザ上での回転を検知して見た目を調整する機能などが実装されたブループリントです。
デモアプリケーションの動きを確認しよう
メインレベルとは別にデモ用のレベルが用意されているので動かしてみます。
- コンテンツブラウザが開いていない場合はメニューのウィンドウからコンテンツブラウザを開きます
- All -> Content -> Demos -> Featuresを開きます
-
Features_Demoというレベルがあるのでダブルクリックします - 選択したレベルの内容に切り替わります
画面上部の再生ボタンで再生してみます。
Featuresから他のものを選択することで他のレベルのデモに切り替わります。車や家の中のリッチなデモを体験できます。内部的には、All -> Content -> Demos -> Autos/Spacesにある各レベルに切り替えています。
おまけ
is4xr上でWEBブラウザからのアクセス時にレベルを切り替える方法です。
ISXR_InitにはURLアクセス時のURLパラメータを取得してレベルを切り替える機能が備わっているため、Link Generator ToolでURLを作成する際にAsset IDをFeatures_Demo:Session_ID:000とすることでUEプロジェクト内での実装を変更せずにデモをそのまま利用できます。素晴らしい仕組みですね。
リッチなデモもクラウドレンダリングで遅延なく動作する様子を見ることができます。
おわりに
今回はis4xrのテンプレートプロジェクトをローカルPCで開き中身について簡単に紹介しました。
デモとして作り込まれているようなリッチなものをいきなり作るのは中々難しいですが、次回は用意されたテンプレートにアセットなどを追加したりしながらis4xr上で動作を確認したいと思います。