Indie rock band Arcade Fire used HTML5 and the Google Maps API in its latest video to transport us to the neighborhood we grew up in. Director Chris Milk worked with the Google Chrome team to blend music, art, and place into an interactive experience called The Wilderness Downtown. The video mashup takes us into the memories of our youth through Street View and 3D rendered map tiles.
Visitors to the site enter an address for the street they grew up on. They then wait for the video to be rendered using that location. The mashup seems to work best in larger cities where the needed Street View and map data are more likely to exist. I tried the small town that I grew up in but was told that there wasn’t enough data to get the full experience. The whole thing is heavily optimized for HTML5 compliant browsers and is probably best viewed using Google Chrome. Since many browser windows are launched in sync with the music, a beefier computer also helps.
After the experience finishes rendering you are treated to a video of vague running figure in a hoodie that presumably represents you. HTML5 videos launch in sync with the music and you start to see the figure from a birds eye view running down the streets and gazing around the neighborhood. It’s all choreographed to the song “We Used to Waite” with HTML5 audio.
The production renders, zooms, and rotates map tiles in a scripted 3d environment to create the feeling of motion. Birds are rendered by the HTML5 canvas 3D Engine to provide a sense of depth. It’s like you are looking at the ground from a balloon.
The rendering engine is aware of more than just map tiles and Street View content. The Google Maps API is used to call up dynamic routes for the figure to run down. If you look very closely you can see a tiny little person running down the street. The route is also use as the scripted perspective to render Street View using 3D sky dome. So you see what the figure would be seeing from that point in the street.
The final piece of mapping API magic uses street detection to render trees in the middle of the streets in some scenes. The trees are composited dynamically using HTML5 3D rendering over Street View.
Google mapping technology and HTML5 are used by director Milk in a powerful way. He taps into the sense of place present in human memory and uses it to connect with emotion. The Google Maps API, Arcade Fires’s music, and 3D video combine synergistically to create something greater than the sum of each element. Earlier this week the rap enthusiasm site Rap Genius helped fans get in touch with rap music through a map. In this experimental production, mapping technology puts the fans into the music itself.