読者です 読者をやめる 読者になる 読者になる

Let's Enjoy Unreal Engine

Unreal Engineを使って遊んでみましょう

UE4 RPGツクールのようなマップが作れるタイルセットとタイルマップを使ってみる

UE解説

UE4.8から正式な機能として早期プレビュー版ですが、Paper2Dの新しい機能としてタイルセットとタイルマップが追加されました。

これは横スクロールタイプのアクションゲームや日本では昔から馴染み深い、RPGツクールなどで作られているマップチップでマップデータを作っていく方式のツールセットです。

UE4は従来の3Dゲーム以外でも2Dゲームを作れる部分を推してきている部分がありますが、2Dでも特にこのタイルセットとタイルマップは8bitや16bit時代のレトロゲームを作るための機能です。

まだこのツールに関してのドキュメントは公式に存在していないので、ここにまとめておきます。また今回の素材はOpenGameArt.Orgの中から使用させていただいています。

opengameart.org

 テクスチャーをタイルセット化する

まずタイルマップを作る前にタイルセットを作成しておく必要があります。タイルセットとはテクスチャーをマップチップのようなドット単位のパーツに切り分けた小さな集まりのことです。まずはテクスチャーをインポートしてタイルセット化します。

f:id:alwei:20150618160638j:plain

インポートしたテクスチャーをコンテンツブラウザーから右クリックでテクスチャーアクションを選び、"Create Tile Set"を選択します。もしここで完全なレトロタイプの2Dゲームを作っている場合には"Apply  Paper2D Texture Settings"も選択しておきます。

これでフィルター処理などがなくなり、完全にピクセルがクッキリとした状態になり、昔ながらのドット絵らしくなります。

タイルセットをセッティングする

作成したタイルセットを開きます。

f:id:alwei:20150618161727j:plain

タイルセットエディターを開くとテクスチャー全体が見れます。ここで右下にある"Tile Set"の中に注目し、"Tile Size"を確認します。

このサイズはいわゆるマップチップの1チップに相当するものです。この単位でマップ上に配置する事が可能です。なので、テクスチャーを描く段階でピッタリとタイルサイズを合わせておく必要があります。

今回は1タイルを16x16ピクセルにしています。

ちなみに今回はやりませんが、このタイルの中に自由にコリジョンを設定ができます。コリジョンはタイルを選択した状態で、ツールバー上部にある、"Add Box"、"Add Polygon"、"Add Circle"から追加し、自由に頂点をいじる事が可能です。

タイルマップを作成

タイルセットが用意できたらいよいよタイルマップの準備です。

f:id:alwei:20150618162306j:plain

タイルマップはタイルセットと同じようにコンテンツブラウザーからタイルセットを右クリックして"Create Tile Map"を選択して作成します。

f:id:alwei:20150618162741j:plain

タイルマップを開くと、いよいよタイルセットの配置が可能となります。デフォルトのままだと4x4のタイルしか配置できないので、"Map Width"と"Map Height"を自分で必要なタイル数まで拡張させておく必要があります。

タイルを配置する

実際にタイルを配置していきます。

f:id:alwei:20150618163042j:plain

タイルを配置する時にはツールバーにある"Paint"モードに切替えておきます。あとは配置したいタイルを1タイルずつ選択、もしくはドラッグして複数のタイルを同時に選択します。選択するとあとは真ん中のビューポート上に配置していくだけです。

f:id:alwei:20150618163309j:plain

配置はクリック、もしくはドラッグすることにより、一気に並べて配置する事が可能です。選択したタイルは"X"キーで水平にフリップし、"Y"キーで垂直にフリップします。更に"Z"キーを押すと左に回転し、"Shift+Z"キーで右に回転します。

ツールバーから"Eraser"を選択するとタイルを消去する事ができます。"Fill"を選択するとまだ配置されていない部分に選択したタイルが一気に配置されます。

f:id:alwei:20150618164041j:plain

そんな感じで適当に配置していくとあっという間にそれっぽいマップが出来上がります。あとはPaper2Dスプライトと同じように配置する事ができます。コリジョンが必要があれば、Detailsもしくは詳細にあるCollisionを設定しておきます。不要であればNo Collisionにしておきましょう。

f:id:alwei:20150618164428j:plain

あとは作成したタイルマップをレベル上に配置し、通常通りに2Dゲームを作っていくだけです。レトロなアクションゲームにするか、RPGスタイルにするかはあなた次第となります。