Introduction You will find in this post several free and open-source 2D sprite editors and pixel art tools that can be used on your browser to create fancy pictures and animations. Pixelorama Pixelorama is an awesome free and open source pixel art editor, proudly created with the Godot engine, by Orama Interactive. Whether you want…
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…
Introduction In this unit we are going to use Phaser together with a tilemap editor to build our world. 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…
Introduction In this unit we are going to expand our world with a whole different scene. We will use the game developed in the previous unit so that by modifying or adding some code, we will have double the entertainment than before 🙂 The new assets These are the new assets that we will use…
Introduction Phaser is one of the best frameworks to develop Desktop and mobile HTML games. You will be able to create 2D games and make them available to everyone with a simple domain with less than 10MB storage capacity. Also, it is fast, free, and opensource! You may find more information at the Phaser official…
Overview Infographic Slides and video Through this presentation, these slides, and this video, you’ll get familiar with the key contents of this unit. Why flexbox? Flexbox is a one-dimensional layout method for laying out items in rows or columns. Items flex to fill additional space and shrink to fit into smaller spaces. This unit explains all the fundamentals. For…
Overview Infographic Slides and video Through this presentation, these slides, and this video, you’ll get familiar with the key contents of this unit. Introduction Everything in CSS has a box around it, and understanding these boxes is key to being able to create layouts with CSS, or to align items with other items. In this lesson, we will…