Learn · Game design

Grids and tiles in 2D games

The camera decides how a game looks at its world; the grid decides where things can stand and what counts as one step. Here is the same house, tree, and hero on six kinds of space, with the places the hero can reach in one step lit up.

Tile grids Square grid Square cells: four neighbors, or eight with diagonals. Details
Tile grids Hex grid Six neighbors, all the same distance away. Details
Tile grids Isometric grid A square grid turned 45° and squashed into diamonds. Details
Fewer places to stand Lanes A few parallel rows; things move along their own row. Details
Fewer places to stand Node map Stops joined by paths; you move from stop to stop. Details
No grid No grid Anything can stand anywhere and move any way. Details
Pick a grid

Tile grids

The map is cut into equal cells, and everything stands in one of them.

Square grid

Also called tile grid, rectangular grid

The map is cut into squares. Each cell touches four others side to side, or eight if diagonals count. A diagonal step covers about 1.4 times the distance of a straight one, so 8-way movement needs care.

One step
4, or 8 with diagonals
Good for
Almost anything; the simplest to draw and to code

Hex grid

Also called hexagonal grid

The map is cut into hexagons. Every cell has six neighbors, all equally far, so range and movement feel fair in every direction. Hexes come point-top (drawn here, where each row sits half a cell over from the last) or flat-top (where each column does).

One step
6, all equally far
Good for
Strategy and war games, overworld maps

Isometric grid

Also called diamond grid, iso tiles

A square grid seen through an isometric camera: turned 45° and squashed into diamonds twice as wide as they are tall. Underneath, it works exactly like a square grid.

One step
4, or 8 with diagonals
Good for
City builders, tactics

Fewer places to stand

Instead of a whole map of cells, the world is a few rows or a set of stops.

Lanes

Also called rows, tracks

The world is a handful of parallel rows. Things move along their own row and only meet what's in it, so choosing a row is most of the decision.

One step
2 along the lane; changing lanes is a move of its own
Good for
Tower defense, auto-battlers, one-screen idle games

Node map

Also called graph, route map

The world is a set of stops joined by paths. You only ever stand on a stop, and the paths decide where you can go next.

One step
Whichever stops the paths connect
Good for
Roguelike runs, world maps, choosing a route

No grid

Things can stand anywhere.

No grid

Also called free movement, continuous space

Positions are continuous: things stand anywhere and move in any direction. Enemies still need a way to find a path, usually a navigation mesh or a hidden grid.

One step
None; anything within reach
Good for
Action games, shooters, physics toys

Side by side

Grid One step reaches Good for
Square grid 4, or 8 with diagonals Almost anything; the simplest to draw and to code
Hex grid 6, all equally far Strategy and war games, overworld maps
Isometric grid 4, or 8 with diagonals City builders, tactics
Lanes 2 along the lane; changing lanes is a move of its own Tower defense, auto-battlers, one-screen idle games
Node map Whichever stops the paths connect Roguelike runs, world maps, choosing a route
No grid None; anything within reach Action games, shooters, physics toys