A fun HTML5 interactive music video: Evelyn, performed by ABBY, coded by Bleech

ABBY's recent music  video, Evelyn, was created in HTML5 to support an interactive experience. As the band plays, you can select one of three paths for each musician, and switch them around in real-time to see what unfolds. The interactive version of the video can be found at http://evelyn-interactive.searchingforabby.com/ 


Steffen Bewersdorff and Dominik Tranklein are the developers who created the video. Their web agency, Bleech, based in Berlin, Germany, focuses on providing innovative services to music and media industry clients.  (More information about the nuts and bolts of the development process can be found in a post on the Web Designer Depot site:  "An awesome HTML5 interactive music video".)


Note:  The interactive musical video performance requires a fast computer. You'll need a browser that has extended HTML5 support, such as a Safari browser if you have a Mac, or a Chrome browser if you are using Windows. Be sure to close your running applications, and enjoy creating/playing with the band! 


Below is the non-interactive version of the video, which provides a walk-through of one possible interactive musical experience:
 

UPDATE:  I used this interactive video, displayed on a SMARTBoard, with students who have special needs, in several classrooms, and it was a great hit.  They especially liked the drummer.  For some reason, we couldn't get the fifth section to show a musician.  The students didn't mind.

RELATED/SOMEWHAT RELATED
The Wilderness Downtown (Arcade Fire, Chris Milk)
OK Go's Interactive HTML5 Music/Dance/Message Video, Featuring Pilobolus
ROME: "3 Dreams of Black" An Interactive Film by Chris Milk, Music by Danger Mouse, Daniele Luppi & Norah Jones
ROME: "3 Dreams of Black" The Technology
Creating Responsive HTML5 Touch Interfaces (Stephen Woods)
Popcornjs.org (open source HTML5 media framework)

Web goes pop: HTML5 is rejuvenating music videos online
Madhumita Venkataramanan, Wired UK
Behind the Scenes: The Interactive Music Video Game built in HTML5 (MSDN - includes link to code samples, including a frame code reader to sync video and interactive elements.)

Take a short break to enjoy a performance by the KAIST Mobile Phone Orchestra!

Thanks to CreativeApplications.Net for sharing this video!

KAMPO Performance @INDAF 2010 from Sihwa Park on Vimeo.

KAMPO KAIST Mobile Phone Orchestra
"Mobile phones (especially smartphones), with more advanced features and computing power than those of ordinary telephones, have been revolutionizing our life and culture in a variety of ways. The KAIST Mobile Phone Orchestra (KAMPO) aims to explore this potential of mobile media for music and media art. In addition to suggesting new and innovative mobile performance paradigms through concerts, KAMPO conducts active research/education in music and mobile media as well as software development." -Intro from the KAMPO website

Interactive Display with 4,500 Streaming Videos, Powered by a NAND flashcard by Fusion-io

The video wall below streams 4,500 videos through Fusion-io's NAND flash card. It can take care of 1 million transactions per second, the equivalent of 6 gigabytes of throughput per second, according to a recent Computerworld post by Lucas Mearian.


Wow.




FYI:  Steve Wozniak, co-founder of Apple, serves as Fusion-io's chief scientist.
RELATED
What a wall of 4,500 video streams looks like
Lucas Mearian, Computerworld 4/12/11
Fusion-IO Jobs (Colorado)
SIGGRAPH 2009 Version of Fusion-io's Streaming Video Wall:






SOMEWHAT RELATED
Driving Data Warehousing with ioMemory
Fusion-io Whitepaper 1/11/11
Transcription:  Fusion-io CEO David Flynn on Enabling a New Class of Cloud Computing Apps
Bert Latamore, Wikibon, 4/8/11
"We're talking about a fundamental new building-block. So it impacts and will impact everything in the entire data center. In the database world it typically means that a database server can do about 10X the throughput, for the same server. And those queries are answered 30%-40% faster. So it means faster page loads, more throughput per server. So Answers.com retrofitted their MySQL scale-out database tier and saw 9X the throughput per server. What they chose to do was to shrink the database farm four-to-one. So they got a 75% consolidation, and with that remaining one-out-of-four servers they were still getting more than twice the throughput they had before." - David Flynn