はじめに
スプライトアトラスは、2Dゲーム開発やUIデザインにおいて、複数の画像を1つの大きな画像にまとめる技術です。このテクニックにより、複数の小さなテクスチャを1つの大きなテクスチャに統合することで、ゲームやアプリケーションのパフォーマンスを向上させることができます。
スプライトアトラスのメリット
画像を画面に表示する描画処理というのが重く、画像が多いほど描画処理命令の回数が増え、ゲームのパフォーマンスに影響してしまいます。
スプライトアトラスを利用することで、ドローコール（描画処理命令回数）の削減ができ、高いFPSを維持することができます。
ドローコールの確認方法
Unityでは1フレーム描画するのに、GPUへ何回描画命令をするかというのが確認できます。
シーンに適当な画像を4つ置いてみました。この時のドローコールを確認してみます。
ゲームビュー右上のStatsをクリックすると、SetPass calls: 4 と表示されているのがわかります。これが1フレーム描画するのに描画処理の命令を行なっている回数になります。画像の数だけ命令しているのがわかります。
スプライトアトラスの作成
それでは、スプライトアトラスを作成していきます。
プロジェクトビューで右クリックし、「Create > 2D > Sprite Atlas」を選択します。
作成したスプライトアトラスのインスペクターにある、Objects for Packingにまとめたい画像を入れていきます。
どこかフォルダーにひとまとめにしておき、そのフォルダーを加えると管理しやすいかと思います。
できたら、すぐ下のPack Previewを押します。画像が一つにまとめられました！
ここまでできたところで、再びSetpass callsを確認すると、1に削減されています。
アトラス化した画像の使用方法
アトラス化した画像を使用するには、元の画像をそのまま使用するだけでOKです。
例えば、アトラス化した元の画像をドラッグ&ドロップしてさらに追加します。
画像は増えても、SetPass callsは1のままになっています。スプライトアトラスが適用されているのがわかります。
注意点
元の画像データはResourceフォルダーには置かない
Resourceフォルダー内に元の画像データがあると、アトラス化した画像と元の画像が重複してアプリのデータとなってしまうので、容量が無駄に大きくなってしまいます。そのため、Resourceフォルダーではない場所に置いておきましょう。
UI画像の場合は、Tight packing、Arrow rotationのチェックを外す
ボタンなどのUIに使われる画像をアトラス化する際は、スプライトアトラスのAllow RotationとTight Packingのチェックを外しておきましょう。これらは、uGUIでは反映されないようです。
おわりに
画像をひとまとめにするスプライトアトラスの使い方の紹介でした！
画像を多用する2Dゲームはもちろん、UIにも使えますので3Dゲームにもご活用ください。
