Archive for September, 2010

Wilderness Downtown experiments in HTML5

September 20th, 2010 by Kris in

The wilderness downtown is a new interactive video that demonstrates pretty well some of the experimentation going on right now with HTML5. The experience is customized by inputing an address. You can see my customized experience near where a buddy of mine and I had an apartment back in the day.

The alternative rock music group Arcade Fire released this interactive video that uses a combination of google maps imagery and HTML5 video and sound. The main concept of the interactive experience is to enter a street address and the experience is customized to that address. It starts out with one window of a man running followed by several windows open showing google imagery and a nicly animated effect of birds flying. The birds flying effect is impressive on its own, but is also synchronized between windows as birds fly from one window to the next. There is an animated drawing section where you can write messages and the final effect is trees growing all over the google maps imagery. The experience is summed up by a call to share your “movie”.

While the window synchronization is not a new effect (I guess so old that its now new again) and user experience professionals would frown down on this type of functionality in a real site. I think as an experiment the site does well. The site apparently was good enough to win an FWA, which I believe may be a first for an HTML5 site.

I’ve examined the code a bit, the birds and trees overlayed behind the google maps imagery are done in Canvas. I’ve a feeling that the animation is mainly all code driven especially, though I believe the animated trees are some videos which are imported and manipulated with canvas.

The video is directed by Chris Milk and the development was done by the crew at radical.media.