The technologies incorporated into the recently W3C-approved HTML5 specification offer designers and developers a landscape of new opportunities for semantically enriching content and building interactivity. The canvas API, along with native audio and video support, has the capacity for making cross-browser compatible interactive graphics that nip at the heels of Flash.
Local storage capabilities, native drag and drop, and the File System API are creating a more personalized user experience that continues the long term initiative of many browsers to bridge the gap between a user’s desktop and the Web. One of the real wow factors in HTML5 comes from WebGL. The 3D component of the Canvas API is one of the last specifications to be fully supported by all browsers, but it’s sure to change the way we experience and interact with websites.
But let’s not delve into specifics. Let’s look at what people are doing to push the limits of this technology:
Experiments in HTML5
Chrome Experiments and IE Test Drive are the places to see some of the world’s top developers and digital artists collaborate on projects that showcase the abilities of modern browsers. But who exactly are these world-class developers and what else are they doing?
Ray Cromwell, Stefan Haustein and Joel Webber
Back in April of 2010, these three Googlers got the attention of the web community with their release of the popular game Quake 2 as a web application. The trio cross-compiled a Java Port of the Quake 2 engine into Javascript using Google’s Web Toolkit along with WebGL and Web Sockets. Developer Joel Webber said that one point of the Quake porting project was to prove that HTML5 could be used "to build a 'real' game, including complex game logic, collision detection, and so forth".
Aaron Koblin
As Creative Director of Google’s Data Arts team, Aaron Koblin is best known for his work with musical acts such as Radiohead and the Arcade Fire. With both bands, he created music videos which were specifically catered to the browser environment. At the root of all his work is the spirit of collaboration and personalization which makes the web medium so unique. The Johnny Cash Project is one such example. Site visitors are encouraged to contribute to a music video for Cash’s song “Ain’t no Grave” by drawing frames in the video. His first foray into HTML5 was for the Arcade Fire Project entitled The Wilderness Downtown. Used in conjunction with Google Earth, the interactive music video featured extensive use of HTML5’s native video and audio as well as Geolocation and the Canvas API. Juxtaposing this project with his earlier Flash work, one can see the versatility and limitations inherent in both technologies.
Mr. Doob
Another member of the team behind The Wilderness Downtown is the mysterious Mr. Doob. This expert Javascript and WebGL developer was responsible for the three.js script: a Javascript library used for rendering 3D objects to the <canvas> and <svg> elements. He is also a prolific contributor to Chrome Experiments, many of which are linked from his site. His most recent work has been a collaboration with video artist Chris Milk and musicians Dangermouse, Daniele Luppi, and Norah Jones entitled 3 Dreams of Black. Like The Wilderness Downtown, this interactive video focuses on a unique user experience. Where T.W.D. allowed you to enter the address of your childhood home, 3 Dreams of Black allows you to navigate the WebGL landscape with your mouse, thereby creating a unique experience every time. At this stage, WebGL has some obvious graphical limitations, but it’s with work like this that one can see the possibilities of the technology.
Businesses Embracing HTML5
Grooveshark
The popular music streaming service GrooveShark made the transition from a Flash-based application to an HTML5 interface in December of 2010. Although the site does not currently use the <audio> tag to play songs, it has intentions on doing so when encrypted mp3 files can be played in the native player. The redesign came as a result of an initiative to make the site available on more devices as well as increase performance without taking such a toll on users’ CPUs.
Electronic Arts Inc.
Electronic Arts Inc. has taken a big step in the HTML5 direction with its new division EA Interactive. EA Interactive focuses on Web and Mobile games and has already produced a number of titles available in the Chrome Web Store. Most notably are titles such as FIFA Superstars, Lords of Ultima™, Mirror's Edge™ 2D, and Tiger Woods PGA TOUR Online. These highly successful titles involve extensive use of the Google Web Toolkit to produce high-performance applications optimized for modern browsers.
Center for Public Integrity "Looting the Seas" Book
One of the first in what’s sure to be a new trend in multi-platform publication, the Center for Public Integrity’s Looting the Seas is an HTML5-driven book that resizes to fit any device. With intuitive controls, a user can navigate through the pages by using the arrow keys on their keyboard or swiping with their fingers on a mobile device. Although some products such as Adobe’s Digital Publishing Suite exist for publishing content as native apps to any device, the HTML5 eBook is a cost-conscious alternative that opens up possibilities for integration with existing Content Management Systems.
HTML5 is a very new technology and browsers are racing to conform to its standards. Chrome is currently taking the lead with adapting new features, while Internet Explorer is leading the way in performance. Mozilla’s Firefox is not far behind, with Firefox 5 just released in June, and version 6, 7, and 8 are already in development. According to the Mozilla team, version 8 is already 20% faster than version 5 and uses less memory than version 7. It’ll be exciting to see what creative directions the Internet community will take these technologies in the months to come.
Add comment