Dreams in 3D: a WebGL experience for the modern browser
By
Ricardo Cabello (aka Mr.doob), Google Data Arts TeamLast 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.meRicardo 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
