推奨: NSDT エディタを使用して、プログラム可能な 3D シーンをすばやく構築します
Unity でモバイル アプリを開発するときは、すべてが最適化されていることを確認することが常に重要です。フレーム レートを最大化すると、スクリプトの最適化、ライトのベイク処理、オブジェクトの変更などに集中できます。
モバイルアプリを仮想現実に持ち込む場合、これはさらに重要になります。最適化の措置を講じるために集中できる領域は数多くありますが、ここでは 1 つのテクスチャ アトラスだけに焦点を当てます。
1. テクスチャ アトラスを使用する理由は何ですか?
テクスチャ アトラスは、すべてのゲーム画像またはテクスチャを 1 つのファイル (スプライト シートとも呼ばれます) に論理的にグループ化する方法です。
Blender などのモデリング プログラムでオブジェクトを作成する場合、各画像の座標を使用するオブジェクトにマッピングできます。これにより、Unity でのレンダリングがより効率的になり、多くのオブジェクトが同じマテリアルを共有できるようになります。その後オブジェクトを静的にすると、Unity は静的バッチ処理を使用して (動かない) ゲーム オブジェクトを大きなメッシュに結合し、より高速にレンダリングできます。
2. ステッカーを作成する
テクスチャ アトラスを作成して使用するには、Unity 用に独自のオブジェクトを作成し、画像をファイルに配置できる必要があります。画像をグラフィックに挿入するには、無料の画像編集プログラムである Gimp を使用できます。アトラスをオブジェクトにマッピングするには、3D モデリング プログラムである Blender を使用できます。
2.1 画像を追加する
このデモンストレーションのために、以下でいくつかのオブジェクトを見てみましょう。使用したい素材を思いついて、オンラインで取得してコンピューターに保存できます。
画像を保存した後、Gimp で 1028x1028 の画像を作成し、各画像をテクスチャ アトラスにドラッグ アンド ドロップできます。画像のサイズは、よほど大きくなければ任意のサイズにすることができます。
テクスチャ アトラス用に画像を収集する場合、画像を論理的にグループ化することが合理的です。建物がある場合、これらすべてのテクスチャ (レンガ、壁、床など) を 1 つのテクスチャ セットに入れることができます。キャラクターでも同じことができます。これにより物事が整理されますが、この場合はこだわりはありません。全部ここに放り込んでみましょう。
Gimp を使用してすべての画像を 1028x1028 にドラッグします
最終的な完成イメージは次のとおりです。
完全なテクスチャ アトラス
注意すべき点は、これらは単純な画像であるということです。3D モデルの洗練されたテクスチャを生成できるプログラムがあります。ただし、私たちの場合、それがなくても、形状に素晴らしいテクスチャを得ることができます。
2.2 テクスチャの作成とマッピング
テクスチャ アトラスが完成したら、次のステップは Blender を開くことです。Shift + A を押しながら Mesh > Cube を選択することで、使用するプリミティブを追加できます。
Shift + A ショートカット キー
見てください...立方体
次のステップは、オブジェクトとすぐに UV イメージ エディタが表示されるようにウィンドウを分割することです。ウィンドウの右上隅をクリックし、左にドラッグして 2 つのビューを作成します。
次に、下部にあるエディター タイプ アイコンを選択して、UV/イメージ エディター ビューに切り替えます。
ビューが設定されたので、実行できるようになります。Unity がゲーム オブジェクトにマテリアルを割り当てるとき、各テクスチャが正しくマッピングされるように UV 座標を参照として使用します。UV は X/Y 座標系によく似ています。未定義の場合、テクスチャ アトラス全体がこのオブジェクトにマッピングされます。モデルの UV 座標をアトラス テクスチャに定義することで、Unity がオブジェクトのどの部分がテクスチャ アトラスに一致するかを認識できることがすぐにわかります。
左側は 3D ビューア、右側は UV/画像エディタです
左側のウィンドウを選択した状態で、タブをクリックして編集モードに切り替えることができます。これにより、オブジェクトのすべての部分または個々の部分を選択できるようになります。ショートカット キー a を使用すると、すべてを選択できます。
編集モードでは、面だけを選択することで立方体の片側を配置できます。
2.3 オブジェクトを展開する
すべてのオブジェクトを選択したら、それを開く必要があります。これにより、3D 形状が 2D 平面上に展開され、テクスチャのどの部分にマップされるかを定義できるようになります。
立方体の 3D ビューに戻り、u をクリックして展開し、展開を選択します。これにより、UV/イメージ エディタですべての面が展開されます。スマート UV プロジェクションを選択すると、すべての面を隣り合ってマッピングできます。これは、複雑なオブジェクトを展開するときに便利です。
左: 拡張例—右: スマート UV プロジェクション
次に、テクスチャ アトラスを開いてロードします。
これにより画像がロードされ、展開された画像がテクスチャ上のどこに位置するかがわかります。明らかに、画像全体は必要ないので、すべてを選択するには をクリックする必要があります。次に s を押して、選択範囲を選択したテクスチャに合わせて拡大縮小します。
展開されたイメージ (現在選択されていない) はテクスチャ アトラス全体をカバーします
展開が好みに合わせて縮小されたら、g を押してそれをつかみ、ターゲットとするテクスチャに移動できます。この場合は明るい木目です。
完了したらファイルを保存すると、このテクスチャ アトラスを参照するマップされた UV 座標を持つオブジェクトが作成されます。
2.3 さまざまな面のマッピング
Unity に入る前に、各面を個別に選択できることに注意してください。私たちの立方体の場合、各面をテクスチャ アトラスの異なるテクスチャにマッピングでき、うまく機能します。この場合、立方体はすでにマッピングされており、3D ビューアで立方体の面を選択できます。編集モードになっていて、面が選択されていることを確認する必要があります。
対応する展開は以下の通り。UV/イメージ エディタに移動し、a を押してすべてのポイントを選択します。次に、g を押して、展開された立方体面を割り当てたいテクスチャに移動します。
これをすべての面に対して行うことも、少数の面だけに対して行うこともでき、より細かいテクスチャを実現できます。これは、モデルがより複雑になるにつれて役立つ可能性があります。
立方体の 3 つの独立した面を描画する
UV/イメージエディターでペイントするスツールベースを選択します
Unity に飛び込む前に、いくつかのオブジェクト (球、円柱など) を作成し、それらをテクスチャ アトラスにマッピングします。準備は完了です。
3. 3D モデルを Unity にインポートします
テクスチャ アトラスにマッピングされたオブジェクトを Blender で作成したら、これらのオブジェクトを Unity およびプロジェクト ウィンドウにドラッグできます。プレハブ フォルダーがある場合は、そのフォルダーに置くことができます。
通常、オブジェクトとそのマテリアルは Unity のマテリアル フォルダーにインポートされます。しかし、場合によっては、オブジェクトを開くだけで 1 時間を無駄にしたことに気づくかもしれません。このようなことが起こった場合、解決策はあります。Unity では、テクスチャ アトラスをインポートする必要があります。残りのテクスチャと組み合わせることができます。
次に、プロジェクト ウィンドウ内で右クリックし、[作成] > [マテリアル]を選択します。マテリアルを選択した状態で、インスペクターを見て、[移動/ライトなし] が選択されていることを確認します (ライトマップがサポートされています)。モバイル デバイスに焦点を当てているため、すべてのライトをテクスチャにベイク処理します。これを実現するには、モバイル/アンリット シェーダを割り当てることが良い方法です。
「移動/照明なし」を指定すると、そのマテリアルに関連付けられたテクスチャを選択できるようになります。ここで [選択] をクリックし、テクスチャ アトラスを見つけます。
Mobile/Unlit を使用すると、モバイル デバイスで最高のパフォーマンスが保証されます
テクスチャがマテリアルに割り当てられると、オブジェクトが更新されます
テクスチャ アトラスを使用するマテリアルが用意されたので、Blender でマップするオブジェクトは、指定したテクスチャとうまく同期します。
3.1 シーンを静化してベイクする
すべてのオブジェクトを同じマテリアルで設定したら、次のステップは Unity の静的バッチ処理を利用することです。これは、すべてのオブジェクトを静的としてマークすることで迅速に行うことができます。これらがアプリケーションでアニメーション化されていないと仮定すると、これを行う必要があります。
効果を高めるためにいくつかのスポットライトを使用し、それらを必ずゾーン(ベイク処理のみ)としてマークします。このようにして、シーンは明らかにライトを取得しており、オブジェクトは静的になっているため、テクスチャにライティングをベイクすることもできます。
これらの変更を表示するには、[ウィンドウ] > [照明] > [設定] に移動し、シーンの照明を生成します。
ベーキングシーン
3.2 静的バッチはどこにありますか?
冒頭で、静的バッチ処理はシーンのレンダリングを最適化する方法であると述べました。Unity は同じマテリアルの静的オブジェクトを取得し、それを大きなメッシュにレンダリングして処理を高速化します。Unity での描画呼び出しが少なくなると、1 秒あたりのフレーム数が増加します。オブジェクトが 1000 を超えると、これがなぜそれほど重要なのかがわかります。
オブジェクトのテクスチャ アトラスを作成するため、Unity はすべてのゲーム オブジェクトを一度に描画できます。実際に何が起こっているかを確認する 1 つの方法は、フレーム デバッガーを使用することです。
3.3 Unityのフレームデバッガ
フレーム デバッガーを使用すると、プレイ モード中にゲームを一時停止し、各フレームがどのようにレンダリングされるかを分析できます。右側の階層内の各項目を段階的に確認すると、各レンダリングが発生する順序がわかります。ゲーム ビューの下で Static Batch 行が強調表示されており、Unity が 1 回の描画呼び出しでこれらすべてのオブジェクトを一度にレンダリングしていることがわかります。すごいですよね？
各オブジェクトに異なるマテリアルを割り当てる場合は、以下に示すように、描画呼び出しを追加し、Unity に各オブジェクトを個別にレンダリングさせます。あまり効率的ではありません。
共有マテリアルがなければ、静的なバッチ処理は行われません
4. アトラス、解凍とバッチ処理...
シンプルなテクスチャ アトラスを生成すると、Unity の複数のゲーム オブジェクトにわたって共有マテリアルを作成できるようになります。Blender などの 3D モデリング ツールでモデルを作成または変更できれば、これらのテクスチャのマッピングをより詳細に制御でき、アプリケーションをより効率的に実行できるようになります。
モバイルデバイスがより強力になったとしても、私たちはハードウェアの限界を押し広げ続けています。最高のユーザー エクスペリエンスを提供するためにアプリを最適化する必要がある多くの方法のうち、これはその目標を達成するための重要なステップの 1 つにすぎません。テクスチャアトラスを思い出してください。