２Ｄマップを作成するために必要な画像ファイルを探してダウンロードしたり、自分で作成したりして Unity 内にインポートします。
Unity の機能の1つである TileMap を利用することで、この画像をタイルのように敷き詰めて、１つのマップとして作成することが出来ます。
まずはこの手順で、TileMap で利用するために、画像ファイルの準備を行います。

---

　マップ用の画像ファイルを準備します。自由な画像を設定しましょう。
今回のプロジェクトでは、ぴぽや様の画像を利用させていただいています。無料でダウンロードできますが、しっかりと利用規約を守って利用しましょう。
イメージしているフィールドの画像を用意してください。例えば、ワールドマップ、市街地、ダンジョン、などです。

ぴぽや様
ホーム
https://pipoya.net/sozai/

ぴぽや様
マップチップ　pipo-map001.zip
https://pipoya.net/sozai/assets/map-chip_tileset32...

---

　ダウンロードしたファイルは多くの場合、圧縮されていますので、まずは解凍して使用できる状態にします。
　
　Unity へ画像ファイルをするには、Assets 内に対象のファイルをドラッグアンドドロップをすればインポートできます。
インポート前に、Project 内に画像ファイル用の Textures フォルダ内に Fields フォルダを作成して用意しておくと細分化でき、管理がしやすくなります。

　先の手順を考えつつ、どのようにすればプロジェクトの管理しやすいかを考えながら操作を行うようにしていきましょう。


フォルダ画像



　画像ファイルですが、ダウンロードしたファイルすべてをインポートする必要はありません。
フィールドの地形用の画像として利用したいファイルを数枚、Unity へインポートしてください。
あとでインポートすることも可能です。


インポート後のフォルダ画像



　上記のフォルダ画像のように、画像のファイルの右横に矢印のアイコンが出ない場合もありますが、それは今後の設定で解消されます。
これは Texture Type の設定によるもので、インポートした画像が、Unity 内の 2D 画像としてすでに利用できる状態かどうかを示すものです。
作業を進めていくとちゃんと矢印が表示されて Unity で利用できる状態になります。今は気にせずに進めてください。

　以上でインポートは完了です。

---

　インポートした画像ファイルは２Ｄゲームで利用するための設定を行う必要があります。ここではその手順を進めていきます。

---

　インポートした画像ファイルの設定を行います。

　画像ファイルを選択するとインスペクターに画像の設定情報が表示されます。


インスペクター画像


　
　画像ファイルは Unity では Texture(テクスチャ)と呼ばれます。詳細は、公式マニュアルを確認しておいてください。
インスペクターの設定項目についても記載されています。

参考サイト

Unity公式マニュアル
テクスチャ
https://docs.unity3d.com/ja/2018.4/Manual/class-Te...

---

　
　３箇所変更を行います。

　最初に、Texture Type を確認します。こちらを Sprite(2D and UI) に設定します。
この設定になっていないと、2D / UI 用のテクスチャとして利用することが出来ません。

　続いて、上記の画像例のように、１枚の画像に複数の画像が登録されている場合、Sprite Mode を Single から Multiple に変更をします。
こちらを変更すると、Sprite Editor という機能を利用して、１枚の画像を複数の画像に分割することが出来るようになります。
１枚の画像に１枚の画像の登録の場合には、この手順は不要です。

　最後に Pixels Per Unit の値を 32 に変更します。
この値は Scene ビューのワールド座標の１単位(マス)当たりのピクセル数を指します。
例えばキャラクターの Pixels Per Unit の値を 32 にして、地形用の画像の Pixels Per Unit の値も 32 にすることで
１マスごとに地形とキャラの大きさが合うように設定できます。


Scene ビュー画像例



参考サイト

ぺんごや様
【Unity】pixelsPerUnit （1ユニットのピクセル数）をおさらい【2D向け】
https://pengoya.net/unity/pixelsperunit/

　以上の手順が終了したら、インスペクターの一番右下にある Apply ボタンを押してください。
隠れている場合は、インスペクターを下方向にスクロールすることで表示されます。このボタンを押すことにより、設定が反映されます。

　完成した際のインスペクター画像です。


Apply 後のインスペクター画像


　
　先ほどインポートした画像の右横に矢印が出ていなかった場合は、Texture Type を変更したことによって、
この時点で矢印が表示されるようになっていますので、確認してみてください。

---

　なお、Filter Mode という設定については、初期設定は Bilinear という設定になっています。これは画像をぼかす処理です。
今後 Tilemap としてテクスチャを利用した際に、ならべたテクスチャがぼやけてしまう場合には、この Filter Mode の設定を Point (no filter)変更することでぼかす機能を解除できます。


　参考サイト

うにてぃブログ様
【Unity】Sprite の Filter Mode
https://hacchi-man.hatenablog.com/entry/2020/03/28...

---

　インポートした画像に複数の画像が１枚の画像として登録されている状態の場合、Sprite Editor 機能を利用することで分割が出来ます。

　分割したいテクスチャをフォルダ内で選択します。
インスペクターに選択したテクスチャの情報が表示されますので Sprite Editor ボタンを押してください。
ポップアップで Sprite Editor ウインドウが開きます。このウインドウの大きさや位置は可変可能ですので、見やすい大きさに適宜変更して使用してください。


Sprite Editor画像



　ウインドウ内の左上にある Slice ボタンを押すことで、画像の分割ができます。適宜な大きさやサイズで分割してみてください。
分割したい升目がわかっているのであれば、Grid By CellCount を指定することで行の画像数と列の画像数を指定して分割できます(１×５、などの場合)

　Slice をすると画像に切れ目が入りますので、各画像が適切な大きさになっているかを確認します。
その後、修正する場合には Slice を押せば何回でも修正できます。

　問題なく Slice が終了しましたら、SpriteEditorウインドウの右上にある Apply ボタンを押してください。これで画像の分割が確定されます。
確定後でも Slice は可能です。変更した場合には最後に必ず Apply して分割情報を反映してください。

　分割に成功すると、１つの画像ファイルであった画像を選択すると、その中に子として分割された画像ファイルが表示されます。


分割されたファイル



　このファイルをクリックすると、分割された各画像が表示されます。


　ファイルの通し番号が画像のように順番になっていない場合には、SpriteEditor 内で分割している画像を選択することで、ファイル名の変更ができます。
分割画像を選択後、右下にある、下記の画像のような小さいインスペクターの部分で変更できます。


分割した画像のファイル名の設定(Sprite Editor 内の小さいウインドウ)



　以上でこの手順は完了です。


参考サイト

YTTMWORK 様
スプライト
https://yttm-work.jp/unity/unity_0014.html

---

　この手順は以上で終了です。

　次は　手順４　−Tile Pallete と TileMap の作成−　です。