Phaser 3 Dungeon Crawler Tutorial

TRY IT HERE!

Learning how to use Phaser 3 to build an RPG dungeon crawler. Based on tutorial series on Ourcade by Tommy Leung aka @supertommy.

Dungeon Crawler in Phaser 3

Tools:

• Tiled - tilemap editor
• Free Texture Packer
• Bitmap Font Generator Online - SnowB BMF

Assets credits:

• Dungeon Tileset II - 0x72
• Abaddon Font - Caffinate

Setup:

1. yarn add webpack webpack-cli -D to install webpack.
2. npx webpack-cli init to initialize webpack.
3. yarn add phaser to install phaser.
4. yarn add file-loader -D to install file-loader for webpack.
5. Use file-loader in webpack.config.js to serve static images.

Use yarn serve to run locally.

Notes:

1. For bottom walls add to the wall_above layer on top as a mask to hide objects like the character weapon that exceeds the character physics body box when it extends pass the walls.

TODO:

1. change string references to consts.
2. Implement restart mechanics.
3. Improve speech system.
4. Touch controls.
5. Add timer.
6. Add end state.
7. Add local high score.