はじめに
Google Cloud(以下、GCP)が提供する Immersive Stream For XR(以下、is4xr)をみなさん活用していますでしょうか。is4xrの概要や仕組みについては、こちらの記事をご覧ください。
今回は前回の記事でUnrealEngine(以下、UE)のテンプレートプロジェクトが触れるようになったため、ここに3Dモデルを配置する変更を加えてis4xrに実際にデプロイして確認します。
といっても3Dモデルをお持ちでない方も多いと思います。1つの方法として、3Dデータの共有サイトであるSketchfabなどでダウンロードするなどがありますが、今回はGenieというサービスを使って生成AIで3Dモデルを作成して利用してみたいと思います。
UE自体の部分は私も初心者に近いレベルなので、操作や説明部分で内容に誤認や間違いなどがあれば教えてください。
Genieとは
LumaAIというNeRF(画像から3Dモデルを作成する技術)を活用したスマホアプリで有名な企業が提供するテキストプロントから3Dモデルを生成するサービスになります。
商用で利用する場合には制限等がありますので、ライセンスを確認ください。
生成AI等を活用して3Dモデルを作り出すサービスについては他にも色々ありそうですがそれらの比較等は割愛します。色々な方が調査されていますので参考にしてください。
3Dモデルの作成
トップページの右上のログインからGoogleアカウント等でログインします。
早速生成してみます。今回は弊社の公式ゆるキャラの「カグカグ」をイメージして生成してみます。
プロンプトに以下のように打ち込みました、、、、(語彙力、、、)
"A cute and fluffy character based on a blue bird"
生成されました。結構カワイイ!!
左下の3Dモデルを 偽カグカグ として今回は使ってみます。選択すると開くと右下のメニューから品質を変更したり、出力フォーマットを色々選択できるようになっており、非常に便利です。
各項目の説明などはこちらの記事などで詳しく記載されています。
Make Hi-Res
から高品質化をしてみます。
出力はUnreal Engine
を選択してfbx
でダウンロードします。(gltfなどその他の形式でもUEに取り込めます)
参考までにデフォルトでRetopologize
が選択されmed
になっていますが、Retopologize
を外して頂点数がどうなるかblenderで見てみます。10倍近く結構異なっていました。使い所によって様々な選択ができそうです。今回はデフォルトのままの3Dモデルで進めます。
-
Retopologize
のmed
-
Retopologize
なし
テンプレートプロジェクトの編集
こちらも前回の記事を参考にUEでテンプレートプロジェクトのメインレベル(ISXR_Main
)を開くところまで進めます。
背景の変更
3Dモデルを配置する前にデフォルトの背景が味気ないのでHDRIバックドロップ機能を利用して変更します。
まず、今回は不要になる以下についてメインレベルから削除します。
- ExponentialHeightFog
- SM_ScheneStage
- SkyLight
いったん真っ黒になります。
テンプレートプロジェクトには最初からHDRIバックドロップが利用できるようになっているため、アクタのライトからHDRIバックドロップを追加します。今回はHDRIバックドロップの説明は割愛します。
背景がリアルな景色になりました。地面から浮いたような状態でGoogleロゴの3Dモデルが埋まっているように見える場合は位置を(0,0,0)にリセットします。Cubemap
で他にデフォルトでセットされた画像も選択できるので色々試してみてください。
生成した3Dモデルの配置
Genieで生成、出力した 偽カグカグ の3Dモデル(fbxファイル)をテンプレートプロジェクトにインポートします。
ファイルが圧縮されているため解凍し、その中のfbxファイルとrgbの画像ファイルを利用します。
UEのコンテンツブラウザに2つのファイルをドラッグしてインポートします。コンテンツ配下にModels
などのフォルダを作成してそこにインポートします。FBXインポートオプションが表示されるためそのまま全てインポートでインポートします。
- fbxファイルのスタティックメッシュ
- 自動で作成されたマテリアル
- 画像ファイルのテクスチャ
スタティックメッシュにマテリアルが適用されていないため以下を行ってテクスチャを適用します。
- マテリアルをダブルクリックしてマテリアルグラフを開く
- インポートしたテクスチャをベースカラーに紐付けます。
メインレベルの画面に戻ると偽カグカグにもテクスチャが反映されました。
スタティックメッシュをメインレベルにドラッグして配置して位置を調整します。
カメラコントロールの修正
初期で設定されているカメラアクタISXR_3D_Pawn
ですが、初期値の距離が遠めなのと中身に向かって近づける最小距離も遠めに設定されているのでパラメータを変更して近くに寄って確認できるようにしておきます。
is4xrでの動作確認
以前のテンプレートをそのまま動作確認した記事を参考に動作を確認します。
- GCSバケットへプロジェクトのアップロード
- 例によって今回もバケットにプロジェクトを一式アップロードしてしまいましょう
- 既に環境が作成済の場合は一度バケットの中身を削除してからアップロードします
- ビルド
- ビルドして新しいバージョンを作成します
- 今回程度の内容であれば2時間前後で終わります
- インスタンス作成
- WEBブラウザからアクセス
無事 偽カグカグ がクラウドレンダリングを通じてWEBブラウザ上で3Dモデルとして表示されグリグリ指の操作で眺めることができました。近づいてみても結構ちゃんとしています。デフォルトでライトの設定も入っているので影なども表示されていてそれなりに良い雰囲気で表示されているのではないでしょうか。
おわりに
今回はis4xrのテンプレートの背景を変更し、生成AIで作成した3Dモデルを配置してis4xrで動作を確認しました。
HDRIバックドロップで利用したEquirectangular形式のHDRI画像もおそらく生成AIで作成できるものがありそうなのでそちらもいつか試してみたいと思います。
is4xr側の操作はポチポチするだけでクラウドのことはあまり意識せずクラウドレンダリングでWEBアクセス利用できるため、開発者としてはUEのところに注力すればよいというイメージも少し湧いたかと思います。
ここまで良い点を中身に紹介していますが、実際の開発ではそんなに簡単にはいかず、ビルドが意図せず失敗したり、ビルド成功してデプロイしたらローカルでプレイした内容と違う内容になったりすることがis4xrの特性上結構あります。 そういった状況での切り分けや注意する点など、継続的な開発における注意点なども今後まとめてみたいと思います。