Recently I won the IE9 Dev Unplugged award for ‘Most Innovative Use of Canvas & SVG’ for my game Arena5. Dev Unplugged was a Microsoft sponsored competition aimed at developers working in HTML5 to show what a modern web browser can do without the use of plug-ins.
I’ve been into web technology for a long time, writing web apps, 3D graphics and animations, stuff like that, and I’m also an avid gamer. So with the advent of HTML5 and canvas I wanted to explore the basics and find out if it was fast and powerful enough to create a game.
I don’t pretend to be a big innovator, I prefer to create variations of or expand on existing ideas using current technology. Some of the effects in original games are hard to recreate in a browser – canvas is pretty fast but none of the browsers can cope with too many flashy effects, there comes a point where it slows gameplay down too much. Arena5 hits the browser pretty hard with lots of glow effects and particle explosions and lots of effects are pre-rendered like the particle effects used for explosions. The smudges and small dots are pre-rendered images, so the more expensive elements are re-used to improve performance. Essentially, Arena5 was about seeing how far I could take stuff before canvas would crawl and I think it’s a good test of what canvas can do. All the code’s available to view and you can download it and try it yourself if you fancy playing around.
HTML5 is a standard, so it’s a moving target, but it’s hugely important to make things less fragmented and make sure everyone’s on the same page. All five browsers support canvas in at least 2D and that in itself is a very important stepping stone forward. In creating Arena5 I haven’t had to change anything to make it work across all browsers – I just had to build it once. Anyone can look at the code, there are no external libraries or hacks in there for any of the browsers, and that makes it feel as though the standard is really getting somewhere. I’m quite biased as far as I like to create flashy demos and effects for games, I think it’s great for that, but I’ve not explored the other things you can do with HTML5 like the Forms enhancements so couldn’t comment on other capabilities.
I don’t really consider my HTML5 games as complete, I hope to refine what I’ve done already. I’m not finished with Arena5, I want to make it better and add new features – perhaps adding some aspects of Geometry Wars: Retro Evolved²! I’d also like to explore effects, background rendering and real time stuff. As the performance of canvas improves then I’ll continue to play around with it and refine the game. There could be an ‘Asteroids 2’ game on the horizon as well, so watch this space! I’ve definitely caught the HTML5 bug.