Start Developing HTML5 games in Phaser using TypeScript

TypeScript is a superset of JavaScript which compiles to plain JavaScript. Anyone with an intermediate knowledge in JavaScript knows that as the project complexity increases, the number of classes and script files increases. JavaScript differs from other languages and the OOP is done through prototypical inheritance. Lack of typing and intellisense in IDE is another problem. TypeScript solves all these and helps developers with all the things they need – typing, auto-completion etc. TypeScript came from Microsoft and thus both Visual Studio and Visual Studio Code has full support for the syntax with intellisense. Continue reading

7 Lerping tricks you need to know as a Game Developer

Linear Interpolation or lerping is a mathematical function which interpolates between two values. The interpolation amount is varied by passing a weight factor along with the start and end values. Linear interpolation is used in many areas of game development for movement, rotation, scale and everywhere you can think of. This article is about 7 lerping tricks you need to know as a game developer. Continue reading

Creating an html5 game like concentration

In this tutorial, we are going to explore various features of the phaser library by creating an html5 game like concentration. One of the advantages of using the phaser library is its cross-platform compatibility. And it is very easy to prototype a game. You can learn so much things by going into the phaser website.

There are so many tutorials on internet about phaser or this games. But here, we are going to explore various aspects like loading texturepacker spritesheet, using phaser custom signals, phaser tweens etc. It is not what you create, but how you create the game.

Continue reading

Multiscreen development in phaser 2.4.2

Earlier, I posted a tutorial on scaling the game and assets for multiple devices. But it does not work very well in latest phaser version 2.4.2(as if the time of writing). So I thought it will be good to post an updated version for the latest phaser.

The idea is simple, Create a group and add all of your game objects into that group. After that, scale and position the group correctly to display the game fully inside the browser/device. The scaling and positioning is done such a way that there will be no black bars around the game and it will be in the correct aspect ratio. Continue reading

Multi screen game development in Phaser

Note: This tutorial was targeted for a previous version of the Phaser library. The updated version can be found here.

Phaser is a robust, famous multi-platform game development framework based on the fast PIXI library. It is getting much attention now-a-days. There are so much examples there in http://examples.phaser.io/, and thus learning Phaser is very simple.

First of all, thanks for the team behind this excellent library. When we consider multi-platform development, we need to think about multiple resolutions and devices. Using high quality assets in big screen devices will ensure your game will look beautifully on those. But this high quality assets will affect performance of low end devices, so we need to load the graphics for each devices separately and scale up or down the game according to the screen resolution.
Continue reading