Phaser Tutorial

How to Create a Loading Screen in Phaser

When you open a game, one of the first things that occur as that image and asset files need to be loaded from the disk or from remote sources. You can’t make your player wait with a blank screen as that would create a bad experience. Instead, what people do is create loading screens that indicate the progress of the asset loading.

In Phaser, you can create loading screens by using States. Think of a State as a “lifetime event” of your game. You can have States to represent key moments such as asset loading, the game itself, a home screen, et.

The following Phaser video tutorial is a free sample from The Complete Mobile Game Development Course – Learn by Making 15 Games where we build 15 mobile games using JavaScript and Phaser, and also cover how to export them to iOS, Android and Amazon.

This tutorial explains how to use a State to create a loading screen with progress bar for your game.:

Join hundreds of developers and participate of the discussions in the course

Published by

Pablo Farias Navarro

Pablo is an educator, developer and entrepreneur. Founder of Zenva, Pablo has published over 30 online courses that teach game, app and web development. Pablo has also created educational content for companies such as Amazon and Intel.

Share this article