Pseudo-3D Tiles

I’ve been asked how I created the 3D effect in my upcoming game, so I thought I’d write up a little explanation without going into too much detail.

The most important thing are the tiles themselves. It’s a simple brick pattern. We only need the bricks on the edges of the tile, but they should be offset so opposite rows don’t line up. This will be important once we stack them. Also note the 1-pixel blue border around the edges of the tile. This will be the mortar between one layer and the one below it.

Now we create 3 layers of tiles, with a simple y-axis offset to simulate the height of the wall. The first and third layers are identical. But the trick here is to rotate the second layer so the bricks don’t line up and we get the alternating brick pattern. (This step is actually a lot more complicated and involves rotating, mirroring, and some other tricks. You may even want to consider a whole new set of tiles for the middle layer. But you get the general idea.)

And here is the result for a whole level.