Creating a Simple Tile Map in Phaser3

Here’s how to setup a Phaser3 game with a tile map system that uses simple strings to indicate the tiles so that anyone can edit and create levels simply with a text editor, or build a simple map-editing tool. The tiles can be used later with a physics engine and collider to change the behavior of the entities in the game. Or, you can leave physics out and code your own simple engine that detects which tiles alter how the game works.

But First …

This particular project has a lot of graphics in it so having a graphical editor makes the most sense. It can certainly be done with a terminal editor and the image previewer on your computer. Both approaches will be using Browsersync to preview.

Step by Step