俺とプログラミング

某IT企業でエンジニアをしてます。このブログではプログラミングに関わることを幅広く発信します。

【入門】 Tiled Map Editorを使ってみよう

Tiled Map Editorとはゲーム開発用の2Dマップを簡単に作成できるツールです。クロスプラットフォームで無料です。この記事では主にTiled Map Editorのチュートリアルを紹介します。

以下のリンクからダウンロード、インストールしてください。
ダウンロードリンク:Download - Tiled Map Editor


Ubuntuなら以下の手順でインストールできます。

$ sudo add-apt-repository ppa:mapeditor.org/tiled
$ sudo apt-get update
$ sudo apt-get install tiled

事前に以下のサンプル画像をダウンロードしておきましょう:
f:id:ttlg:20150424232215p:plain


紹介する環境はUbuntuですが、まあ他のでも大体同じだと思います。以下は起動後の画面になります。
f:id:ttlg:20150424225949p:plain

左上から、新しいマップを作成します。マップの大きさを適当に調整します。
f:id:ttlg:20150424230356p:plain

次にメニューから新しいタイルセットを選択します。
f:id:ttlg:20150424230814p:plain

事前にダウンロードした画像を選択します。パラメータはそのままで大丈夫です。
f:id:ttlg:20150424230826p:plain

右下に画像が表示されたと思います。その中から草を一つ選択して、草原を作ってみましょう。
f:id:ttlg:20150424230839p:plain

上のメニューの塗りつぶしマークをクリックして、塗りつぶしモードにしてから、フィールドをクリックすると、草原の完成です。
f:id:ttlg:20150424231100p:plain

次はスタンプ機能を使ってみましょう。複数のタイルを選択すると、同時にスタンプできます。
f:id:ttlg:20150424231320p:plain

スタンプマークをクリックして、スタンプモードにします。クリックでタイルをスタンプできます!
f:id:ttlg:20150424231452p:plain

最後にレイヤーを導入して、マップをかっこ良く仕上げます。レイヤーを使うことで、透過タイルをシームレスに重ねることができます。
まずはタイルレイヤーの追加をクリック。
f:id:ttlg:20150424231606p:plain

透過タイルをスタンプしてみましょう!
f:id:ttlg:20150424231812p:plain

簡単にかっこいいマップが完成してしまいました!
あとはtmx形式で保存するだけです。お疲れ様でした。

cocos2d-xではじめるスマートフォンゲーム開発 [cocos2d-x Ver.3対応] for iOS/Android

Androidゲームプログラミング A to Z

Copyright © 2016 ttlg All Rights Reserved.