Introduction In the previous unit, we developed a clone of Google Chrome’s “secret” Dino game using simple web technologies such as HTML, CSS, JavaScript, and Phaser 3. This game can be run on any device using any browser (not only Chrome). The result is a game that closely resembles the original with less than 10%…
Introduction Super Mario Phaser is a modern web-based recreation of the classic Super Mario Bros game, built using the Phaser framework. This project is designed to bring the beloved nostalgic experience of the original game to today’s web browsers, allowing players to enjoy it directly online. One of the standout features of Super Mario Phaser…
Introduction The main goal of this unit is to provide a fun and simple game where users can add and see their favorite emojis on the screen interacting with them in a dynamic way. These will be the main features: CSS code (style.css) The CSS file styles the web page for the game as follows:…
Introduction In this unit we will develop a game to merge objects inspired by the Suika Game, also known as the Watermelon Game. Although our game will be quite similar, it will feature a Halloween theme, from this specific Suika Clone version: CSS code (styles.css) We are going to insert some CSS code to remove…
Play the games Alpha adjust Asteroid Blockade Blocks Breakout Candy Crush Clocks Coin runner Endless runner Flappy Bird Snake Space Invaders Super Mario Land Tank Run the games in your computer Since all the games are open source, you can run all the games in your own computer. Just follow these steps: You can download…
Introduction In this unit we will define a simple Phaser game that can be used as a template to define an unlimited number of levels, enemies and objects. The map will be drawn from a simple array of tiles where several characters will be used to choose the positions of each item. We will also…
Introduction In this unit we will build a clone of Google Chrome “secret” Dino game (the original game can be revealed by entering “chrome://dino” in the address bar). We will use simple web technologies such as HTML, CSS, JavaScript and Phaser 3, so that any user can play on any device just using any browser…
The source code and the assets You can download this zip file to get the source code and all the assets. Updating the map As done previously, you can use the tile map editor to update the map. In case you have not done it yet, you can download the editor from this link and install it…
A preview of the map You can have a look at this preview of the whole map. The source code and the assets You can download this zip file to get the source code and all the assets. Updating the map As done previously, you can use the tile map editor to update the map….
Introduction In this unit we are going to use Phaser together with a tilemap editor to build a maze. You may find more information at the official page of the Tiled editor and you may also have a look at some interesting demonstrations at the Phaser’s examples page, and also performing some search on the…