HTML5 is still in its adolescence, but that hasn’t stopped web developers from experimenting with the technology. Thanks to new features, especially the canvas element, front-end developers are able to create complex images and interaction without the need for plugins such as Flash.
Here are 8 Interesting HTML5 Experiments, some more useful than others, of the capabilities of HTML5. To experience the demos you’ll need a modern browser such as Google Chrome.
Magnetic
Particles orbit around magnets which can be dragged around to create currents. The HTML5 canvas element is used for visual output.
Blowing up HTML5 video and mapping it into 3D space
I’ve been doing a bit of experimenting with the Canvas and Video tags in HTML5 lately, and found some cool features hiding in plain sight. One of those is the Canvas.drawImage() api call. Here is the description on the draft site.
Visualizing the World Cup
The visualization above is accomplished using html5 and css3 and by viewing it in a modern web browser. If you are using internet explorer all you’ll see is an unordered list!
Conductor in progress video
Tentatively titled Conductor, it recreates the New York subway system as a musical instrument. It’s currently built in HTML5 + Javascript. SVG was very useful, as I could create the design in Illustrator, then import the coordinates into Javascript.
Chrome Experiments – Arcade Fire
Choreographed windows, interactive flocking, custom rendered maps, real-time compositing, procedural drawing, 3D canvas rendering… this Chrome Experiment has them all. “The Wilderness Downtown” is an interactive interpretation of Arcade Fire’s song “We Used To Wait” and was built entirely with the latest open web technologies, including HTML5 video, audio, and canvas.
Rumpetroll
A massive multiplayer experiement done in HTML5/Canvas/JS and magical websockets. Rumpetroll is norwegian, but probably not what you think
The Cloth Simulation
What makes this simulation special is the speed at which everything is computed. Javascript (the language this is written in) is not exactly the most efficient language for this type of computation. This being said, much time was spent squeezing out every little detail that slows things down.
Ball Pool
Mr Doob, or Ricardo Cabello, is a designer/developer that likes to play with the possibilities on the web. He’s done a variety of work, but his latest is an HTML5 experiment that allows you create a pool of balls and shake them when you shake your browser window.
