これは「Babylon.js アドベントカレンダー2024」の8日目です。
前回の私の記事では、Babylon Toolkitの概要や環境構築方法を書きました。
今回はUnityを開いてからの初期設定や、CubeとPlaneを置いたシーンをエクスポートしてブラウザで確認するまでの手順を紹介します。
なお、今回書いた内容は公式？が公開している動画で紹介されている内容と同一です。 13:49までの動画のうち、9:30付近までの内容です。
前提として、前回の記事に沿ってPackage Manager経由でBabylon Toolkitをインポートしている状態で進めます。
Babylon Toolkitインストール直後で、他のアセットインポートやオブジェクトのシーン追加などはしていない状態から始めます。
動作確認環境
Unity2022.3.34f1
Babylon Toolkit 7.28.1 (Community Edition)
- 1. UnityのProject Settingを調整する
- 2. Lighting Settingsを追加して、一部の設定を変更する
- 3. 試しにPlaneとCubeをSceneに追加してビルドし、エクスポート
- 3. 補足：UnityのPlayボタンを押して、通常通りUnity Editorで実行させる方法
- 4. おわりに
1. UnityのProject Settingを調整する
Edit > Project Settingを開いて、Playerの中にある設定を変更します。
Auto Graphics for ~のチェックを全て外して、"+"を選択、OpenGL Coreを選択して上に移動させます。これをWindows/Mac/Linux (ビルド対象のみでよいはず) に対して行います。UnityのRestart指示が出たら再起動します。
一通り変更すると、このようになります。
次に、Project SettingのGraphicsの中にある設定を変更します。
"Low (Tier1)", "Medium (Tier2)", "High (Tier3)" の３つについて、User DefaultsとReflection Probes Blendingのチェックを外します。
2. Lighting Settingsを追加して、一部の設定を変更する
Project Viewの中で右クリックし、Create > Lighting Settingsを選択します。
次に、Unityの上側にあるパネルで、Window > Rendering > Lighting を選択して、Lightingのウインドウを表示させます。
この状態で"Lighting Settings"のエリアで、先ほど作ったLighting Settingsを指定します。
また、このウインドウの"Lightmapping Settings"の中で"Progressive Update", "Importance Sampling"のチェックを外します。
さらに、同じエリアの中の"Lightmap Compression"を"High Quality"から"None"に変更します。
ここまで実行したら初期設定は完了です。
3. 試しにPlaneとCubeをSceneに追加してビルドし、エクスポート
Unityの通常操作でPlaneとCubeを追加してみます。Cubeにはマテリアルで適当に色をつけてみました。
この状態でUnityのPlayボタン (三角形のボタン) を押します。するとEditor実行がされず、Buildを選択するウインドウが出ます。
Buildボタンを押すとしばらく処理が続き、完了するとPreviewするかの確認が出ます。
Previewボタンを押すと、ブラウザが開いてUnityで作ったシーンが表示されます。
3. 補足：UnityのPlayボタンを押して、通常通りUnity Editorで実行させる方法
先ほどまでの手順で進めると、UnityのPlayボタンを押してもBabylon.js向けのビルドしかできなくなります。この設定を解除して、通常通りUnity Editorで実行させるには、Babylon Toolkit Editorの中にある "Attach Play Button"のチェックを外します。
4. おわりに
ひとまずビルドできるところまでは確認できました。
実は1と2の初期設定をせずにいきなり3に進んでも、cubeとplaneをつけた空間をビルドしてブラウザで表示することはできました。
複雑な表現や機能を使う時は1や2が必要になるのかもしれません。
次回は、スクリプト制御の方法を紹介します。
