By Ricardo Cabello (aka Mr.doob), Google Data Arts Team
Last August, we released “The Wilderness Downtown”, a music experience that brought together HTML5 and JavaScript, as well as the Google Maps and Street View APIs. Today, we’re excited to introduce our newest project, “3 Dreams of Black”, made with WebGL, HTML5 and JavaScript, and designed for modern browsers like Google Chrome. We previewed this music experience yesterday with web developers at Day 2 of the Google I/O keynote.
“3 Dreams of Black” takes you on a journey through three dream worlds constructed through a combination of rich 2D drawings and animations interwoven with interactive 3D sequences. Throughout various points in these dream worlds, you can grab your mouse and guide the protagonist’s point of view through the experience. This music experience also includes a 3D model creator that allows you to create your own relics and contribute to the shared collective dream. “3 Dreams of Black” is written and directed by Chris Milk, and developed with a few folks here at Google.
In creating “3 Dreams of Black”, we’ve had the opportunity to build many tools, libraries, and models. We’ve fully opened up the source code and made it available for web developers to tinker with us at www.ro.me/tech. In addition to the code, a few other highlights include eight WebGL demos, a fun model viewer for interacting with some of the animals from the web experience, and the Three.js 3D library used for building the experience. In addition, a big part of the project was to define a good pipeline for getting all the animals and environment models right in WebGL -- for this, we extended Blender with custom plugins so we could manipulate and export the data with ease.
“3 Dreams of Black” is set to the song “Black” off the album ROME, presented by Danger Mouse & Daniele Luppi, featuring Jack White and Norah Jones on vocals, to be released soon on the record label EMI. Because it’s built in WebGL, it requires a WebGL-supported browser like Chrome, and Windows Vista / Mac OS X 10.6 and above to help ensure that your computer has the necessary and up-to-date graphics drivers. We hope you’ll take a moment to dive into the experience and the developer resources at www.ro.me
Ricardo Cabello is a designer/developer in the Google Data Arts Team. He is the creator of several popular Chrome Experiments, including Google Gravity, Ball Pool, and Harmony.
Posted by Scott Knaster, Editor
Amazing. A watershed moment for the web. Now if you could make a real Game with this power you possess :)
ReplyDeleteI don't understand how you can be creating a ground-breaking cinematic experience such as ro.me and coding the great Three.js framework at same time!
ReplyDeleteGreat work! Ill be taking a look at three.js
ReplyDeleteLoved the movie!
ReplyDeleteCould you tell us a bit more about the workflow for getting animated objects from blender to the three.js scenes?
fantastic... as in a dream... thanks!
ReplyDelete