コンテンツへスキップ

RPG 用のマップ画像の作り方

最終更新日:2024年9月3日

みなさん、RPG ゲームを作ったことはありますか?そのとき、マップはどのようにして作成しましたか?この記事では、超簡単にマップを作成する方法と、本格的なマップを作成する方法の2種類の方法を解説したいと思います。

ad-earth-shop-online

超簡単にマップを作成する方法

「スクラッチ用RPGマップ作成ツール」を利用する

こちらのサイトにアクセスして、マップを作ります。作り方は超簡単です。右側にあるマップの素材を、左側のキャンバスに置いていくだけです。下の動画を参考に作ってみてください。

マップができたら、「ダウンロードリンクの作成」ボタン(下記の左の図)を押します。すると、「ダウンロード」というリンク(下記の右の図)が表示されるので、リンクをクリックして画像をダウンロードします。

scratch-rpg-map1
scratch-rpg-map2

スクラッチにマップの画像をアップロードします。下記の手順で、作成したマップをアップロードできます。

マップの1枚目

scratch-rpg-map3

マップの2枚目以降

scratch-rpg-map4

以上です!

本格的なマップを作成する方法

本格的なマップを作成するために、「Tiled」というマップ作成ソフトをインストールします。このソフトは無料で利用でき、Windows、macOS、Linux に対応しています。小学校でよく配布されている ChromeOS では利用できないので注意が必要です。

「Tiled」を使うと何がいいかというと、マップをレイヤーごとに作成することができる点です。「超簡単にマップを作る方法」では、1枚の画像としてしかマップを作成できないので、草原や川をプログラム(スクラッチ)で区別することが難しいです。一方「Tiled」では、「草原のレイヤー」、「川のレイヤー」、「山脈のレイヤー」と、レイヤーを使ってマップを作成することができます。そして、レイヤーごとに画像を出力することができます。レイヤーを使うとスクラッチでプログラムが作りやすくなります。例えば、歩けない場所の当たり判定などです。

scratch-rpg-map90

プログラムはこちら

scratch-rpg-map80

【インストール】マップ作成ソフト「Tiled」をインストールする

「Tiled」を使うためにはソフトをインストールする必要があります。以下に手順を記載します。

① 「Tiled」のサイトにアクセスします

公式サイト

② 「Download on itch.io」をクリックします

scratch-rpg-map10

③ 「Download Now」をクリックします

scratch-rpg-map11

④ 「No thanks」をクリックします

寄付するかどうかを尋ねられます。「No thanks」を選択すれば、無料で利用ができます。

scratch-rpg-map12

⑤ OS に合わせて「Download」をクリックします

Windows 10 以上、Windows 7、macOS 11以上、Linux(64bit)の中から、自分の PC に合うものを選択してダウンロードしてください。

scratch-rpg-map13

⑥ 「Tiled」のインストーラーを保存します

scratch-rpg-map14

⑦ インストーラーを実行し、「Next」をクリックします

scratch-rpg-map15

⑧ 「チェック」を入れて、「Next」をクリックします

scratch-rpg-map16

⑨ 「Next」をクリックします

scratch-rpg-map17

⑩ 「Install」をクリックします

scratch-rpg-map18

⑪ 「Finish」をクリックします

scratch-rpg-map19

⑫ 「Tiled」が起動されればインストール成功です

scratch-rpg-map20

【準備】タイルセットを作成する

タイルとは、マップを作成するための画像のことです。マップチップとも呼ばれます。これらをまとめて使いやすくしたものが「タイルセット」です。タイルセットは有料のものもありますが、無料で使えるものもたくさんあります。以下のサイトがおすすめです。お気に入りのタイルセットを見つけてみてください。

無料で利用できるタイルセットのおすすめサイト

① タイルセットをダウンロードします

ダウンロードの方法はサイトごとに異なります。ここでは、ドット絵世界のA2「陸や森」をダウンロードしました。画像を右クリックして「名前を付けて画像を保存」を選択して、PC にタイルセットを保存します。

scratch-rpg-map30

② 「Tiled」を起動して、「新しいタイルセット」をクリックします

scratch-rpg-map31

③ 「名前」、②でダウンロードしてきた「ファイルパス」の設定、タイルの「幅と高さ」を入力して、「ファイル名をつけて保存」をクリックします

タイルの幅と高さは、元の画像を分割する際の単位のことです。大きな数字を入れるとタイルひとつのサイズが大きくなり、小さな数字を入れるとタイルのサイズが小さくなります。

scratch-rpg-map32

タイルの幅や高さは、ダウンロードするときに記載されている場合が多いです。下記は、ぴぽや倉庫のマップチップのダウンロードページです。このように指定がある場合はそれに合わせて入力します。(下記の場合、タイルの幅「32 px」、タイルの高さ「32 px」と入力します)

scratch-rpg-map35

下図は、ドット絵世界のA2「陸や森」を 16 px で分割したものと、 32 px で分割したものです。私は、16 px でタイルセットを作成しました。図の左上に小さな赤い枠が見えますか?この赤い枠が、ひとつのタイルのサイズです。

16 px で分割

scratch-rpg-map33

32 px で分割

scratch-rpg-map34

【作成】マップを作成する

タイルマップが準備できたら、いよいよマップを作成していきます。

① 「新しいマップ」をクリックします

scratch-rpg-map50

② スクラッチの画面サイズに合うようにします

種類は「長方形」、マップの大きさは「480 * 360 ピクセル」(※ピッタリ同じにならないときは、少し大きめに作ります)、タイルの大きさは、タイルセットと同じ値にします。

scratch-rpg-map51

「OK」をクリックすると、下記のようにマップが表示されます。

scratch-rpg-map52

③ タイルセットを開きます

下記の手順でタイルセットを開きます。

scratch-rpg-map53
scratch-rpg-map54

タイルセットを開くと下図のような画面が表示されます。赤枠部分をクリックして、マップを開いてください。

scratch-rpg-map55

左側にマップ、右側にタイルセットが表示されれば OK です。

scratch-rpg-map56

④ レイヤーを作成します

現在のレイヤー名を「歩けるマップ」に変更します。レイヤーを「ダブルクリック」すると名前を変更できます。

scratch-rpg-map57

下記の手順に従って、レイヤーを追加します。名前は「歩けないマップ」とします。

scratch-rpg-map58

レイヤー「歩けるマップ」を選択して、画面いっぱいに草原を描きます。

scratch-rpg-map59

次に、レイヤー「歩けないマップ」を選択して、湖や高い山脈などを描きます。

scratch-rpg-map60

レイヤーの右側にある目(下図の赤枠部分)を閉じると、そのレイヤーは非表示になります。

scratch-rpg-map61

⑤ レイヤーごとに画像を出力します

下記の手順に従って、画像をエクスポート(出力)します。

scratch-rpg-map63

出力したいレイヤーだけ表示して、「表示レイヤーのみを含める」にチェックを入れます。これで、レイヤーごとにマップを保存できます。

scratch-rpg-map64

下記は、「歩けないマップ」を保存しているところです。

scratch-rpg-map65

「ファイル名をつけて保存」をすれば、マップを保存できます。マップを変更する可能性がある場合などは、マップを保存しておきましょう。

scratch-rpg-map62

まとめ

「Tiled」は高機能なマップ作成ツールです。タイルセットを読み込んだり、マップをレイヤー別に作成したり出力したりすることができます。このツールを使いこなせれば、楽しい RPG ゲームが作れるようになると思います。頑張ってみてください!

最終更新日:2024年9月3日

広告

最終更新日:2024年9月3日

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA