Designing tiles for a triangular maze

We are updating some of our examples with better art. One of the cool examples on our site is a simple implementation of Prim’s maze generation algorithm. The maze is a triangular grid, but to depict walls nicely, we use a rhombille grid to lay out the tiles.

Here is how our original example looked:

maze_simple

Using these two tiles:

maze_closed_1   maze_open_1

It’s difficult to see how the tiles connect without showing the borders.

maze

In designing the tiles, it’s important to remember how they can and cannot connect in a rhombille grid. The rule is small angles always connect with other small angles, and big angles always connect with other big angles. Nowhere does a big angle touch a small angle.

configurations

You can see in the original example, the borders of the maze are not very nice; you need at least a third tile to close up the gap. Here is some of the images that we used to go through the thinking:

tile_explanation1

tile_explanation2

 

tile_explanation3

 

We commissioned Dave Baxter to make the set for us. We gave him an open brief, but hinted that we liked the art of Incredipede. Dave took on the challenge, and designed five beautiful tiles:

Tile05 Tile04 Tile03 Tile02 Tile01

The center of the maze is made from tiles that correspond to the original two tiles. The border of the maze has two layers, each built from one additional tile. Finally, the exterior of the maze is built from the last tile. The different sections of tiles are shown in the image below.

maze_closed

Here is the result:

prim

The tiles are very detailed:

detail

You can also see a live example of the the maze being built step by step on our example page, or see the code here.

Scroll to Top