Some of the most compelling experiences on the web come when inspirations of old are brought to life with modern technologies. Last August, “The Wilderness Downtown” brought the wistful feeling of nostalgia to the browser as you run down the streets where you used to live in an HTML5 music experience based on the Arcade Fire song “We Used to Wait.”
“3 Dreams of Black” is our newest music experience for the web browser, written and directed by Chris Milk and developed with a few folks here at Google. The song, “Black,” comes off the album ROME, presented by Danger Mouse & Daniele Luppi, featuring Jack White and Norah Jones on vocals and soon to be released on the record label Parlophone/EMI. ROME is inspired by Italian soundtracks from the 1960s and the classic Italian Western genre. In fact, the album was recorded with the original orchestra from Italian director Sergio Leone’s westerns (remember The Good, The Bad & The Ugly?).
“3 Dreams of Black” is a visual voyage through three dream worlds, told through rich 2D drawings and animations that are interspersed with interactive 3D sequences. At various points in this web experience, you can take control with your computer’s mouse and guide your journey through the unfolding narrative. You can even contribute to the dream by creating your own relics using a 3D model creator. Some of the best user creations will be integrated into the experience and become a part of others’ “3 Dreams” exploration.
In “3 Dreams in Black”, the browser is transformed into a theater for these lucid virtual dreams through WebGL, a new technology which brings hardware-accelerated 3D graphics to the browser. With WebGL in modern browsers like Google Chrome, you can interact with 3D experiences with no need for additional software. For curious web developers out there, we’ve made all the code completely open and available so that you can dig in, have a look around and try it out for yourself.
Because “3 Dreams in Black” is an experiment built with the latest web technologies, it requires a browser that supports WebGL like Chrome, and Windows Vista / Mac OS X 10.6 or above to help ensure that your computer has up-to-date graphics drivers. For those of you who may have hardware constraints, we’ve put together a short video that we hope will provide a glimpse into this unique experience. To explore these dreamscapes, visit www.ro.me. Posted by Aaron Koblin, Google Data Arts Team
Attention, 3D fans: OpenGL in the browser has gradually gotten real. WebGL is a browser-friendly API for OpenGL graphics, and it’s pretty darned close to OpenGL ES 2.0, which in turn will be familiar to anyone doing modern mobile 3D development. WebGL isn’t part of HTML5, but HTML5 makes it possible: the Canvas element is what allows WebGL to work its magic. And WebGL goes nicely with technologies that are part of HTML5 or modern browser experiments, including the web audio API and browser video support. (The superb 20 Things I Learned About Browsers & The Web has a 3D in the browser section, well worth reading.) And you can use JavaScript (among other modern languages) to code 3D creations.
If you love the idea of sharing 3D as easily as a webpage, this is big news. It’s a huge step forward from the clunky, unpredictable, confusing use of Java for browser OpenGL, and unlike that solution, it’s part of the page on which it’s delivered, not part of a plug-in or launched app.
In recent days, we’ve seen the first stable browser with WebGL enabled by default, Google Chrome. Right now, Chrome or Firefox 4 beta are likely the easiest and most stable way to test WebGL graphics. I’ve been testing Firefox 4 beta on Linux and more recently the stable Chrome on Mac, Windows, and Linux, and it’s pretty fantastic.
Read Google’s announcement from Thursday, along with the other enhancements to Chrome: A dash of speed, 3D and apps
Perhaps more exciting than the Chrome update is the superb Chrome Experiments, which recently added 3D goodness, from creative tools to eye candy to useful tools like an exploration of human anatomy: WebGL Experiments
Grabbing the latest Chrome or installing Firefox beta will let you see them, but here are a couple of picks are a cool place to start, and have videos attached if you aren’t near a bleeding-edge browser:
I’m pretty impressed with performance of experiments like the aquarium. I’m on a fairly low-end, last generation laptop with an NVIDIA 9500M, and they run easily.
WebGL is still early in development – Chrome is the first and only stable browser with support – but we’re getting to the phase when you could actually distribute stuff with it, and it could hit prime time very soon.
Which browsers support WebGL?
Chrome’s release is a very big deal. As I write this, WebGL is available in:
Chrome stable, from now on
Firefox 4.0b8 and later, meaning once Firefox 4 stable is shipped, stable Firefox, too
Opera plans support, but no public build is available yet.
Microsoft appears not to be planning support for IE9, meaning it’s most likely to be odd man out … again. But you can get support for WebGL inside IE using the free Chrome Frame plug-in.
Really, if you want to try this out, installing Chrome is a good idea. It’s also no accident that Google’s Chrome Web App store means people with interesting creations have an avenue for distribution, which should soon also be true with an open Mozilla-based store for Firefox et al.
Yes! Processing.js is actually a pretty decent way to fiddle around with it. The caveat is that WebGL support in Processing.js is a work in progress; if you want to get deeper, you’ll probably want to get into direct JavaScript control of WebGL. But that hasn’t stopped people from making some interesting hacks and work, and it’s a great place to start. Some demos –
A Processing.js Web IDE that uses WebGL:
– and a stunning music visualizer we’ve seen here before:
What about Google’s O3D?
O3D is some impressive technology and for many of us was the first truly compelling vision of 3D in a browser. The downside – it’s currently a plug-in. But Google does sometimes live up to their “open Web” hype. They’ve said they’re focused on improving WebGL, and that they’ll take the ideas from O3D (like its scene graph) and port to JavaScript and WebGL. There’s even an early version of the work.
It’s worth reading the (official Google) Chromium blog on the matter, partly to see how they’ve come around on JavaScript performance.
This is all compelling stuff, so let’s all abandon everything we’re doing and switch to WebGL — right? Well, not necessarily:
It’s not done yet. WebGL the spec appears pretty stable, but browser support is still forthcoming. When we (presumably) see stable Safari and Firefox builds in the near term, though, I think the whole thing will get a lot bigger.
Universal browser support is a long ways off. Microsoft’s lack of support in IE could be a side effect of the lack of universal OpenGL drivers on the Windows platform. Whatever the reason, count out IE. And likewise, count out anyone with a capable GPU card. Even compared to the mess of video support, 3D is likely to be a “nice-to-have” feature on the Web, not the universal feature the traditional 2D page is.
Mobile WebGL isn’t even on the table yet. So, JavaScript – yep, it’s faster on desktop computers. But mobile implementations are still evolving, mobile browsers still lag their desktop counterparts (even sometimes when they’re both based on the same Web engine, like WebKit), and performance on much less-capable mobile chips isn’t there just yet. That said, see the last bullet in this list…
Live visuals, art will still often need “native” tools. Want to output to a second monitor, or monitors, plural? Doing something crazy like routing textures between apps? Live visualists are pushing the kinds of features that won’t be accessible immediately on the browser.
Full-blown OpenGL isn’t available. OpenGL ES 2 is pretty great, but if you need the full OpenGL API, this isn’t designed to be that. And…
Performance is still better with C/C++. Don’t get me wrong – performance with JavaScript is stunningly good, good enough that those Google engineers changed their assessment. But it seems to me this depends on your goals. If you’re really concerned with squeezing every last ounce of performance out of your graphics, necessary if your work is about visuals with greater complexity, this still really isn’t for you.
This isn’t an either/or choice – OpenGL wins! Here’s the major point for me. You don’t have to choose WebGL as an exclusive solution, partly because you don’t have to choose WebGL. Invest your time in OpenGL, and learn the basic nuances when comparing, say, OpenGL 3.2 on the desktop to OpenGL ES 2 on Android and iOS to WebGL in the browser, and you can be everywhere with relatively minor adjustments.
What’s surprising to me just writing that list is, while it appears long, the advantages of WebGL are still clear, and it makes sense that some of these differences will disappear. I imagine we will still need desktop software. Google, while characterized as some sort of browser-only religion, themselves continue adding native support in their Android platform, so presumably they understand game developers and other parties want that native OpenGL access. The question may not be whether WebGL “replaces” those tools, but whether people find smarter workflows and integrated higher-level APIs to work across the platforms.
Let’s sum it up this way: if you love 3D, and if you’re an OpenGL nerd, you’re in very happy times, indeed.
And regardless, you get to watch a cool jellyfish in Chrome any time you need to unwind.
There really is too much to list as this release is feature packed! Of course the most exciting being WebGL and hardware acceleration from our perspective.
Firefox 4 now has WebGL enabled by default. Based on the original 3-D Canvas work by Vladimir Vukićević, this is being
widely implemented in browsers. The WebGL spec is on the short path to a 1.0 release and we’re very excited to see this be used in the wild.
Hardware acceleration has finally arrived even though it should have been in nearly all platforms for web last decade, but we’ll take it.
Firefox 4 supports full hardware acceleration on Windows 7 and Windows Vista via a combination of D2D, DX9 and DX10. This allows us to accelerate everything from Canvas drawing to video rendering. Windows XP users will also enjoy hardware acceleration for many operations because we’re using our new Layers infrastructure along with DX9. And, of course, OSX users have excellent OpenGL support, so we’ve got that covered as well.
The javascript engine JaegerMonkey is comparably fast to SunSpider and V-8 javascript benchmarks and has support for EC5 javascript.
And you might have noticed that it’s really fast. This is the world’s first third-generation JavaScript engine, using Baseline JIT technology similar to engines found in other browsers and kicked up a level with the Tracing engine found in Firefox 3.6. As such, we’re competitive on benchmarks such as Sunspider and V8, but we’re also fast at a whole mess of things that we expect to see in the set of next-generation web applications, hence Kraken.
WebConsole looks like they are joining Chrome and Safari with built in inspection tools similar to Firebug, however Firebug still available.
Firefox 4 will include the Web Console. This is a new tool that will let you inspect a web page as it’s running, see network activity, see messages logged with console.log, see warnings for a page’s CSS, and a number of other things.
Note this that is something that we’ll be including with Firefox 4 directly. It’s not an add-on.
(Also Firebug will be ready for the final Firefox 4 release.)
Firefox 4 has other improvements like layering (in-memory retained layers), caching/scheduling improvements and lots of other performance enhancements.
2011 is looking like the year all this is coming together, at least for Chrome, Firefox, possibly Safari (need WebGL in main release) and IE is still the biggest problem to getting WebGL. At this point WebGL looks like it is still over a year out as it may not come to IE until IE10 or possibly never, the WebGL 1.0 spec is on the fast track though (don’t we all love Khronos? They have been amazing with OpenGL since they took over). html5 is looking like it will be close to mainstream by the end of this year depending on the install rate of IE9 when released.
The world is waiting to see if Microsoft implements WebGL or tries the old DirectX/D2D only ways. Nevertheless, getting a push for hardware acceleration and fast renders in 2d/3d is a very sweet direction.
Google recently announced a new netbook operating system to great fanfare: Chrome OS. It's named after Google's browser for a very good reason - all applications run within the browser framework, rather than being downloaded, installed and run atop the user's desktop operating system. Much of the subsequent analysis has revolved around the battle of the titans that is expected to occur now that Google has moved directly onto Microsoft's turf.
Here's my take: Google's approach is gonna win.
Why? Developers, developers, developers, developers. And installers, installers, installers, installers. Developers because people don't buy computers to run operating systems - they buy them to run applications. And developers write those apps. Installers because having a seamless installation experience doubles or triples a software developer's customer base. And nothing is more seamless than clicking on a link.
At least, that's Pathfinder's experience. We've build hundreds of software applications in the past 10 years. Most web-based. But some were native desktop apps that users would download and install locally. And for a huge portion of the population, the everyday process of downloading and installing desktop applications is completely broken. Here are some numbers, based on our experience:
50% to 75% of users who visit a software download web page abandon the page without starting the download.
Roughly 30%-60% of users who download the application never install it.
These two numbers are why companies pay Dell and HP to pre-install crapware on every PC they sell. It's why Google pays to have the Google toolbar piggyback on the installations of Adobe Reader. It's why AOL carpet-bombed North America with installer CDs in the 90s. And it's why the Chrome OS - or something like the Chrome OS - is the future for netbooks. Sure, Windows XP has a head start of 15 million or so netbook installations. But if you believe the numbers above, a cloud-based, browser-based OS like Chrome only needs 25% of that number to be a more valuable platform for software vendors. That's a pretty powerful advantage for a company looking to break Microsoft's stranglehold on some part of the netbook operating system market.
