Building a Tilemap Level with the Game Agent

Tiles on their own are art. A tilemap turns them into a place: tiles laid on a grid to form ground, walls, water and props the player can move through. In this guide we'll cover how a tilemap level works and how to build one with the game agent.

What a tilemap is

A tilemap is a grid filled with tiles, like painting with stamps. Because the tiles share one size and their edges match, you can build large, varied levels from a small set. Most 2D games build their worlds this way.

Step 1: Make the tiles

Generate a tileset in the image generator with Type: Tileset: Top-down, 2 terrains for paths and shorelines, Top-down, 17-piece for edges and corners, or Side view, platformer for platform ground. Every tile edge matches the tiles it can touch, so the map shows no grid. Add it to your project.

Step 2: Ask for the level

In the project chat, describe the layout and name the tileset:

• "Build a top-down village level with my grass and path tileset: a path from the south edge to a square in the middle, water along the east side."
• "Make a platformer level with my snow-on-rock tiles: three floating platforms and a gap the player has to jump."

Step 3: Layers

Good levels are built in layers: a floor layer, a layer of walls and obstacles, and a top layer for details. Ask for them by name, for example "put the trees on their own layer above the ground", so you can change one without touching the others.

Step 4: Collision

Art alone doesn't stop the player. Solid tiles (walls, water, cliffs) need collision. Say which ones block movement: "water and rocks are solid; the path and grass are walkable".

Step 5: Depth

In a top-down game, the player should pass behind tall objects such as trees and walls and in front of others. Ask the agent to sort sprites by their vertical position so nearer things draw on top.

Step 6: Play and refine

Walk the level. Problems such as dead ends, awkward collision and repeated patterns show up in motion. Describe what you see and the agent adjusts it.

Prefer to paint it yourself?

The free Tilemap Editor lets you paint a level from a tileset and export a Tiled-style JSON map, which Phaser and most engines can load.