HTML, combined with CSS, is probably one of the most complex and counter-intuitive systems you can imagine to create layouts. If you’re not working with this on a regular basis, positioning an image or text exactly as you envisioned can mean hours of work.
This made developing games in JavaScript quite a complicated undertaking.
Luckily, for game development in HTML5, you barely need to touch the HTML/CSS mess.
One of the key features for game development in HTML5 is the canvas element. Using JavaScript, it allows you to render 2D graphics to your browser.
Now you only need a simple HTML5 page with a canvas element, and enjoy the freedom of writing code in object oriented JavaScript.
While the HTML5 standard is still under development, with only partial support in mainstream browsers, the canvas element is almost fully supported in all of them.
Moreover, it’s also working on most mobile devices’ browsers (iOS and Android included).
One of the advantages over Flash for browser game development is that it’s also working on iOS devices, removing the need to go trough the App Store to get a game running on an iPhone or iPad!
We’ve made a simple HTML5 demo, optimized for Firefox and Safari. It’s using the HTML5 canvas element and JavaScript. Feel free to have a look at the source code if you want to learn more.
If you’re interested in a HTML5 prototype or proof-of-technology, don’t hesitate to contact us!
Really like the demo Bernard – simple, but shows what is possible!
Thanks, Ian.
Actually, credit for the source code goes to Jonas, our intern who’s currently having a look at technologies we may additionally use for our rapid prototyping services.
Great demo, its time for flash to step down and html5 to step up, thanks for the source code, I am myself learning JS and HTML5 to make games.
Thanks, Gaurav. Feel free to post a link to any HTML5 demos you would make! This counts for everyone of course.