I’ve been working on HTML5 games for more than a year and now I’m very comfortable with a set of tools that I’ve decided to call The HTML5 Game-development Survival Development Kit (HTML5 Game SDK for short). I’m currently living in Venezuela and its economic behavior doesn’t allow me to invest much on paid services/tools, so I must invest time on research in order to find the best available tools to do the job.

Framework: Phaser

phaser-logo

It is really easy to install and learn, and despite being very object-oriented in its internal architecture, it is not an opinionated framework; meaning we have a lot of control and flexibility in the way we use it to make our games. We can use a lot of function calls to develop our game or apply object-oriented principles and structures in order to make our code reusable. It not only works well with JavaScript prototypes, it also allows us to develop HTML5 games using Typescript.

You can download Phaser at phaser.io.

Text editor: Brackets

brackets-editor-logo

As a text editor aimed to web development, Brackets has worked marvelous in the recent months. Multi-platform and very customizable, it makes for a great text editor that handles projects in a very smart way; you just need to open the folder where the project lies and that’s it (no additional project files to handle).

The Live Preview feature is one of the things I certainly love because it runs the html file from an embedded web server, using Google Chrome. Why is it so important? Because as you may already know, certain JavaScript libraries such as jQuery and Phaser, work better or require the code to be executed from a web server and not like an opened html file on our machines.

Furthermore, there is a plug-in called Phaser Chains, based on the website with the same name, that lets us search the Phaser docs without leaving Brackets.

You can download Brackets at brackets.io.

Assets: Kenney’s free assets

kenney-logo

Also known as “Asset Jesus“, Kenney is always releasing top-quality asset packs for free. There’s also a cheap pair version, but we can always use the free versions for prototyping ideas. There are certain gameplay mechanics that can be tested using only squares and circles, but there are others that require a little bit more of art-crafting techniques; such as 2D isometric worlds.

You can find free assets from kenney at kenney.nl.

Mobile deployment: CocoonJS

cocoonjs-logo

Ludei’s CocoonJS is a cloud-based tool for deploying HTML5 applications and games to mobile. It doesn’t require us to download any other SDK or software besides an optional app for rapid testing on our devices before taking the steps into deploying the zip file into a native* application.

You can sign up for free at ludei.com.

As we can see, the only reason not to start making HTML5 games is not having time (dedication) to do so. There are more good free tools, but these are the ones that have worked well for me so far. However, I’ll be more than happy to know about your experiences in the comments section.

*:not really native because its a web viewer with the application folder embedded.

Picture: “High Jump” by Asif Akbar.

Share.

About Author

Programmer with 5-year experience, two of them dedicated entirely to game development. Specializing in AI and gameplay programming.

1 Comment

Leave A Reply