Archive

Archive for the ‘tutorial’ Category

HTML5 Games Development

HTML5_Logo_256With the support for the Adobe Flash Plugin in web browsers slowly being eroded, many game developers are looking towards alternative tools for creating web based games. Unity has become a popular choice, but again due to its reliance on a web browser plugin, its days may be numbered too. The current tools of choice for web based games seem to be HTML5 with Javascript.

With this in mind I have began learning to create games with these tools, and aim to write a series of tutorials to help others get to grips with them.

There are several Javascript libraries available to make the implementation of Javascript games easier. Impact.JS, CreateJS, LimeJS and Crafty are just a few of these libraries, some of which are free to use and some of which require licensing. I have decided to start with CreateJS as it is free and is designed with a syntax which is close to ActionScript (which makes it easier for Flash coders like me to use).

Although HTML5 games can be made with lots of different tools, there are great reasons for continuing to use Adobe tools in their development. Adobe Dreamweaver is useful for writing the HTML and Javascript code, and the Live view allows you to test your games within Dreamweaver, negating the need to use a web server for testing. Also, Adobe Flash CS6 with the CreateJS toolkit can be used for creating graphics and animations that can be used in your HTML5/Javascript games.

The following links are to tutorials I’ve used to gain some knowledge of HTML5 game development.

Creating a Pong Game with Create JS

Animating sprites with EaselJS (part of the CreateJS suite)

Getting started with CreateJS Toolkit for Flash