All is Not Lost is a new HTML5 music
experience based on a three-way collaboration between the band OK Go, dance troupe and choreographers Pilobolus, and Google. In this music
experience, you can embed your message in a music video, and have the band dance it out. The
band and Pilobolous dancers are filmed through a clear floor, making increasingly complex
shapes and eventually words – and messages you can write yourself.
This project principally employs HTML5’s
<audio> and <video> tags, along with an event listener to ensure the
correct sync of audio and visual components. A challenge, however, was balancing and syncing
load, with the potential of too high a load and thus corresponding delays. As a result, we
store movies with the <video> tag as a buffer, using the image object in Canvas
2D. The canvas image object allows us to draw the videos in perfect timing with the music and
create a smooth experience throughout.
Keiko Hirayama is a Senior Marketing Manager on the Google Chrome team in
Tokyo. When she is not at work, she enjoys playing with her 2-year-old boy (but sometimes
wishes she has her own time!)
