HTML5 Cross Platform Game Development Using Phaser 3

✍ Scribed by Emanuele Feronato

• Tongue: English
• Leaves: 203
• Category: Library

✦ Table of Contents

HTML5 Cross Platform Game Development Using Phaser 3
A little preface
What is a cross-platform game and why should I make cross-platform games?
What is HTML5?
What is Phaser?
Ok, I am lost. HTML5, CSS, JavaScript, Phaser… too much stuff
Can I build games like GTA with Phaser?
Choosing a free text editor
Other free software you may need
Choosing a free web server
REALLY choosing a web server, rather than closing the book
Choosing a web browser
Downloading Phaser
The structure of your first Phaser project
Running your Phaser game
Creating a Phaser Game configuration object
Adjusting CSS to make the game run in the center of the page
Resizing the game to cover the wider area possible
Understanding Phaser scenes
Adding more scenes to the game
The game we are going to build: 4096
Preloading and adding images to the game
The importance of storing all game customizable variables in a single place
Creating tile graphics as a sprite sheet and using it in the game
The importance of adding as less sprites as possible during the game
Using two-dimensional arrays to store board configuration
Placing “two” tiles on empty spots on the board
Using tweens to animate tiles
Checking when tweens end
Waiting for player input
Understanding how pixels scale
Processing keyboard input
Processing pointer input
Moving tiles
Understanding the conditional operator
Keeping on moving tiles
Understanding depth or Z-order
Moving only necessary tiles
Moving tiles as long as there is room for movement
Merging tiles
Keeping on moving
Moving tiles according to game rules
Checking if the player actually moved
Upgrading tiles only once per turn
Animating tile movement
Animating tile upgrade
Adding sound effects
Covering the entire window area
Adding game interface
Making sprites interactive
Using bitmap fonts
Handling a score system
Saving the best score
Limiting tile value to “4096”
Web Apps Vs Native Apps
Installing Node.js
Installing Cordova and creating your first Cordova project
Installing Android Studio and creating your first Android project
Running your game in Android Studio
Editing Android manifest file to set game configuration
Using your own icons and loading screens
Building the APK to be published on the stores
Publishing your game on Android stores
Using the Scale Manager
Adding Full Screen mode
Creating a pure JavaScript class with no dependencies to handle the game
Using a Texture Atlas
Thank you and let's keep in touch