I finally got around to playing with the HTML 5 canvas element and attempted to build a quick game to compare the process to my past experiences of Adobe Flash.

I was quite surprised with how much I was able to do using only canvas, WebGl, the gamma JS library and some example code. I was able to create:

  • Platforms
  • A controllable entity that the ‘camera’ follows
  • Enemy objects with collision detection
  • Dynamic Lighting
  • Multiple Levels
  • Basic Textures
  • Entities from COLLADA files

Although I was amazed that I could do these things the process wasn’t easy, it was a lot of work to do many of the things that I would take for granted in flash.

Fortunately there seems to be an explosion of libraries and game engines built using these standards that will make the process much easier and if you do want to create a game using canvas I would recommend not trying to reinvent the wheel and sticking to one of these. Although with there being so many of these engines popping up it’s quite hard to tell which ones will gain the most popularity.

While there might be some catching up to do for canvas/WebGL games the quality is increasing at an incredible rate while free libraries and game engines lower the entry level to creating them. While flash might be the weapon of choice for web based game developers now I feel Adobe will have to do something special to keep up.

The game is very basic and was just an attempt to see what was possible, still if you want to play it you can find it here and you’ll need the latest chrome/firefox/safari.

Categories: Uncategorized


WebGL around the net, 28 April 2011 | Learning WebGL · April 28, 2011 at 1:07 pm

[…] the beginnings of a platformer using the Gamma library from David Sherlock (demo link at the bottom of the blog […]

Lets Monkey Around | blogotron.co.uk · May 3, 2011 at 9:42 am

[…] found HTML 5 Canvas/WebGL powerful my recent play tests with them have been very frustrating (You can see some of my tests here) and Monkey has reminds me that sometimes programming can be fun! I would recommend monkey to […]

Leave a Reply

Avatar placeholder

Your email address will not be published. Required fields are marked *