
パリッパリにエッジが立ったドット絵好きの皆様。
おはようございます。砂塒です。
今回のテーマは「unityでドット絵をボヤけさせずにインポートする方法」です。
unityは2D画像をピクセルベースで表示しているわけではないのと、ドット絵ゲームを作るために最適化はされていないので、ちょいとした設定が必要になってくる。
unityでドット絵を扱っていく際には、今日紹介する手順を踏むことになるので、ガッチリとマスターしてほしい。
だいじょうぶ。簡単だから!ピクセルパーフェクトはまた別なんだよ・・・。
コンテンツ
1.unityへのドット絵のインポート(取り込み)
まずは、untiyへのドット絵の取り込みから。この取り込み作業を通常「インポート」と呼ぶ。
※ちなみに、反対語は書き出し(エクスポート)。
インポート方法①
プロジェクトウインドウの任意のフォルダ内で、
[右クリック] > [新しいアセットをインポート]をクリック。
すると、ファイル選択のウインドウが別窓で開く。
そこからインポートしたいファイルを選択。
最後にファイル選択ウインドウの右下のインポートボタンをクリックすれば、インポート完了となる。
※アセットとは:
日本語で「資産」という意味の英単語。
unityにおいては画像、音声、プログラムなど、ゲームを作る部品になる様々なファイルのことを指す。ざっくり素材と考えればOK。
インポート方法②
エクスプローラーからunityのプロジェクトウインドウへ、ファイルをドラッグ。
これでもアセットをインポートできる。
この2通りの方法を抑えておけば素材のインポートに関してはもうプロを名乗ってよし。
2.画像の設定(ドット絵をパリパリにするためのお作法)
インポートが完了したら、次は画像の設定を行う。
設定はインスペクターウインドウから実行する。
untiyでドット絵(ピクセルアート)を美しく表示させるには、この設定が最重要項目。
もう、ここさえ押さえてたら、あとはオマケみたいなものである。
では設定を見ていこう。

黄色枠は状況に応じて変化する設定
赤枠はいかなる時も変化しない設定(ドット絵を表示させる場合)
である。
基本的に画像の通りに設定すれば問題ない。
ポイントは、
・フィルターモードをポイント(フィルターなし)
・圧縮をなし
に設定することである。
この設定をすることでドット絵のぼやけが解消される。
最後に設定している画像の縦横のサイズを確認しよう。
インスペクター下部の画像が表示されている部分に数字が確認できるはずである。
もし画像が表示されていない場合は、インスペクター底部の画像名が書かれた2本ラインをクリックしてみてほしい。
画像ウインドウが展開されるはずである。

この数字がインスペクターで編集している画像のサイズだ。
なお、最初の数字が横方向、後の数字が縦方向である。
例 24(横)X 24(縦)
横にドット24個分、縦にドット24個分のサイズの画像。
さて、インスペクターに最大サイズという項目があるが、これは、画像の横もしくは縦のサイズがいくつか?という設定である。
上記の例でいえば、サイズは24だ。
最大サイズに設定する値は、画像のサイズよりも大きい値にする
これがポイントである。
上の例で言うと、32以上の値を最大サイズに設定していればOK。(画像は24だが、32以下の指定サイズが存在しないため)
サイズが128や256の画像に、最大サイズ32や64を設定すると、画像がボケてしまう。
値の設定は
最大サイズ >= 画像サイズ(縦横で大きい方の値)
と覚えておこう。
ここまでの設定が終わったら、インスペクター内の適用するをクリックして設定を確定させる。

3.ドット絵をシーンにぶっこむ
さて、あとは簡単な作業。
設定が終わったドット絵をプロジェクトからシーン(もしくはヒエラルキー)にドラッグするだけである。

ちゃんとドット絵が表示されたかな?
※今回の設定は、ドット絵のボヤけを解消するのが目的。
すべてが同じサイズの正方形ドットが密集した、ピクセルパーフェクト表示には、また別の手順を踏む必要があるのだ!
4.複数の画像を一括で設定する
上記の手順を踏むと、ボヤけとは無縁のドット絵が表示できる。
しかし、使いたい画像の枚数が増えた場合、同じことを何度もやる必要があるのか?という疑問があるかもしれない。
結論から言うと、一括で設定できる。
設定したい画像を複数選択した状態で、上記の設定を行えばよいだけである。

5.更にものぐさなクリエイターへ贈る設定効率化機能
とは言っても、追加の画像があったら、やっぱり都度の設定が必要になる。独自設定のプリセット機能はないのか!とお嘆きのものぐさクリエイターの皆様。ご安心ください。ちゃんとあります。
プロジェクトから、基本的な設定が終わった画像を任意に選んで、インスペクターを見てほしい。
上部に米粒サイズのスライダーアイコンがあるのがわかるだろうか。

ここをポチると、プリセットを選択・保存するウインドウが出る。
次に、プリセット選択ウインドウの下部のSave Current to…ボタン(上画像の黄色枠)をクリックする。(これが現在選択されているインスペクターの設定をプリセットとして保存するためのボタンである。)
保存先を決めるウインドウが開くので、フォルダとプリセット名を自分で決めて、保存をクリックすると、独自の設定プリセットが保存される。

あとは、画像の設定時に米粒スライダーアイコンから、自分が作ったプリセットを選択すれば、一瞬で設定された状態となるので適用するを押すだけでOK。
とても便利な機能である。


6.まとめ
以上がドット絵をunityにインポートする方法である。
誤解を恐れずに言うと、unityでゲームを作るのは、「こうやったら」「こうなる」をたくさん覚えていくことである。
頭と手を動かして、エディター操作を己の体にしみ込ませていくべし!
そして、この先には、ゲームウインドウにピクセルパーフェクトでドット絵を表示させる方法があるのだが。
それはまた別の話🎮
↓下のハートボタンは、サトヤのやる気スイッチに直結しています。
押すなよ~!絶対に押すなよ~!
・・・押してよぉぉぉぉ~!!!