Learning WebGL

Word is starting to get around so I might as well cop to it: as of today I have official taken over as Editor-in-Chief of Learning WebGL. While I fancy myself more a programmer than a journalist, I must say that the opportunity to guide this great site into the future was simply too good to pass up.

Giles Thomas created Learning WebGL in 2009, when WebGL was just getting going. Most browsers didn’t do WebGL yet, and if they did, they did it wrong or they all did it differently. There was no documentation, other than the specification, which is itself based on the public spec for OpenGL ES. To say that the spec is obscure and a tough read for any but the experience 3D graphics programmer would be an understatement. I’m a fairly experienced 3D programmer, and my first look at the spec back in 2010 was nerve wracking. So I googled, and found Learning WebGL.

Giles started the site as a way to teach himself WebGL programming. He wisely chose existing OpenGL tutorials as a starting point and built from there. In the four years since, he has created an awesome resource, the first stop of any programmer’s wanderings through the thicket of information that comprises WebGL development. If Learning WebGL didn’t exist, I’m not sure I could have written my book, or made sense of what Mr. Doob’s Three.js code was doing half of the time. (Open source is great, but unfortunately in this modern world, access to the source has become synonymous with no documentation.)

Giles has given the world a fantastic gift. I hope I am equal to the challenge of maintaining it.

For the “official story” of the site’s leadership change, you can read the press release here.

From the Front Lines, February 2013

WebGL continues to gain in popularity. New fun showcases are coming out all the time, and we are starting to see experimentation from big media names like Disney with its Find Your Way to OZ movie promo, and The New York Times showing a visualization of last year’s record hang-gliding flight. Google also recently released mobile WebGL support in the latest beta of Chrome for Android, and Blackberry continues to lead with its most-conformant HTML mobile implementation that has included WebGL for over a year.

With big brands, great content and growing mobile support, 2013 is already shaping up to be a great year. Is this the year Microsoft relents, and Apple uncorks WebGL for iOS? Here’s hoping.

Web3D: The Next Generation

I believe the children are our future…

Last week I had the good fortune of speaking to a group of Carnegie Mellon students at the Entertainment Technology Center. ETC is a satellite program hosted at EA’s main offices in Redwood Shores, run by the legendary Carl Rosendahl of Antz and Shrek fame. Carl and his partner Jiyoung Lee have created a wonderful program with a gifted group of master’s students building interactive media and games.

I presented a crash course in WebGL, my typical fare of late, crammed into ninety minutes with too many demos. The talk was lively and interactive with a lot of Q&A. The students even sent me a list of interview questions beforehand; you can see the interview here and a student writeup here.

Overall, it was a great experience. What I think I loved most about it was that I was in a hater-free zone. Believe it or not, in 2013, I still run into the occasional pinhead who asks “Why would I need 3D?” These days I am able to promptly tag them as a 3tard and move on, but every once in a while it gets under my skin. So it was really refreshing to hang out with a few dozen twenty-somethings for whom this is not a question. It never comes up. These kids just get it. They’re ready to make stuff with WebGL already and are just looking for the best way to get going.It heartens me to know that I was in the presence of the multimedia developers of tomorrow.

Teach them well and let them lead the way!

Alias Ugly

WebGL just got beat hard with the ugly stick. As reported by Ken Russell of the Chrome team, there was a graphics driver issue on “some Mac OS hardware” that caused a nasty bug which corrupted memory. The culprit turned out to be antialiased rendering, that great technique for smoothing out jaggy lines along edges by blending adjacent pixels. The Chrome team decided to fix the bug by turning antialiasing off on all offending machines until Apple deals with a couple of bugs in their NVIDIA drivers. This sounds safe enough, and I can’t blame them. Better safe than sorry, especially when it comes to trashing computer memory.

Except that it turns out that when citing “some Mac OS hardware” Ken meant: “The affected machines are those with NVIDIA and Intel GPUs.” Um, that’s pretty much any Macbook. Including mine. Suddenly one day some awesome WebGL demos I wrote got visibly less awesome after Chrome auto-updated. Then I checked the same demos in Firefox and it turns out they followed suit and recently pushed a similar fix. The net result is that several of my previously beautiful projects now look shite. I am seriously bummed.

I could investigate one of several techniques for doing my own antialiased rendering via writing custom GLSL shaders. But that’s some R&D and work load I hadn’t been budgeting for. What would be much better is if Apple fixes this situation ASAP. Dean Jackson from Apple is on the case (thanks for the email replies Dino!) and I hope they fix it soon! If you’re having issues like I am, maybe add your voice to the chorus. The email archive for this thread contains info on the already-filed bug reports and an address for filing new bugs with Apple.

Just a heads-up for everyone who may have wondered why their WebGL got ugly overnight… meantime I am seriously considering (shudder) buying a new Windows laptop to show off my stuff. Somebody stop me.

SketchFABulous

I just met with the 3 founders of Sketchfab, who are in town from Paris for most of the month. This is a great new 3D publishing service that lets you upload models and share live WebGL previews using embed codes. Alban, Cedric and Pierre-Antoine are very nice, very smart and on a mission to democratize 3D publishing. They are currently raising seed funding and working with Mozilla’s WebFWD accelerator program.

Like Ourbricks, a service launched last year that features live WebGL preview of models, Sketchfab’s goal is to facilitate sharing of 3D content by enabling live, web-integrated previews using WebGL. But Sketchfab has taken the functionality further by offering upload support for various file formats, and better still, exporters that will get content out of the pro tools like Max and Maya in a sane way so that artists don’t have to get lost in the alphabet soup of which standards/formats to export.

As with any such service– and this includes the bloated curiosity shoppe known as the Sketchup 3D Warehouse– I question the utility of hosting simple models that have no animation, interactivity or scripts (what can developers do with those?), and with no style guides and publishing standards governing how the content is organized. Without those in place, you never know what kind of content you’re going to get, what units its modeled in (inches? centimeters? angstroms?) and so on. Maybe Sketchfab’s social features like ranking will help separate the good from the crap; we’ll see.

Come meet the Fab 3 while they’re still in town, at our next WebGL Meetup in San Francisco, early December.

Clouded Thinking

Check out my article on Gaming Business Review, wherein I play market analyst for a day and bash cloud gaming.

TL;DR: cloud gaming is based on decade-old assumptions and needs a major rethink. Meantime, beware the hype.

Clouded Thinking

Why Cloud Gaming is a Non-Category, and How Networked Games Really Work

The recent acquisition of Gakai by Sony Computer Entertainment could be the sign of an impending bonanza for cloud-based gaming services. As reported in Engadget and elsewhere, the consumer electronics giant paid $380M for the streaming game service in order to deliver new entertainment experiences for SCE’s network. Sony stands to gain big from the operational efficiencies that Gakai’s infrastructure and team bring to the mix, and Gakai’s team got a well-deserved payday for building a great platform. But is this deal the beginning of a trend in cloud gaming, or the end of the line? [Read more...]

Three – WAY!

Three.js enjoys continued popularity. Last night we held a WebGL Meetup Featuring Three.js. It was very well attended (I’d say 40 or so) and there were several amazing demos, including an Open Street Maps mashup that showed San Francisco bike routes with elevation (tres important), a new round of awesome and inspiring data visualizations by Theo Armour, a solar system simulation based on real, current data including satellites, and a working, in-production collaborative design system by Sunglass.io. Someone has even ported Three.js to the new Dart language in a project called Three.dart. All demos were written in Three.js and the presenters had nothing but good to say about the open-source library.

I’ve made no secret that I think Three.js has its limitations. It’s not a game engine (though people are starting to talk about writing game engines on Three.js) and IMO I think it could use a lot of optimization and feature work. Still, I believe it’s a great place to get started with WebGL development. And it appears to be getting a lot of mileage, if last night’s meetup is any indication. Check it out.

From the Front Lines, August 2012

A year and a half ago I presented WebGL for the first time to the crowd at Dorkbot San Francisco. Full of excitement that the browser makers finally, really shipped it, I spun the big vision and showed the most beautiful demos I could get my hands on. Back then it was Aki Rodic’s Chrysaora jellyfish forest, the  Zygote visible human simulation, and Brandon Jones’ insane port of Id Software’s RAGE. Still crowd-pleasers, all.

This year it’s different. Things have moved from buzz to reality, and the reality is good. Last week I gave the Dorkbot crew an update from the front lines. While the demos aren’t as exciting as a year ago, they are more real. They’re about visualization, mapping, 3D printing, terrain generation, new devices and just creating fun projects– in other words, the stuff of web development. The overriding theme is that WebGL is here to stay, it’s appearing in real applications, on new devices, in money-making products and books (nudge nudge as in by yours truly). These are wonderful developments… but frankly I am just relieved that some skittish product manager at Google or Apple didn’t yank WebGL support sometime in the past year. Paranoia? Perhaps. But after watching 3D appear on the web in fits and starts for fifteen years, indulge me.

Apologies for the lame HTML page graphics, it’s been a busy summer and I had to put it together on the spot.

The Computationalist Manifesto

At last night’s WebGL Meetup, David Sheets presented his work with Gloc, a tool set for creating and composing programmable shaders for WebGL. At least, that’s how the talk was billed to the group. Much to my surprise and delight, what we got instead was a vision of the future. More than a vision– it was a manifesto. A Computationalist Manifesto.

In his presentation, titled GPU Functions as Hypermedia, David threw down his vision of a universe of hyperlinked graphical program code, something like a Mathematica meets Project Xanadu. Wiry and frenetic, more Bram Cohen than Ted Nelson, David evoked a future world where programmable shaders– those amazing powerful C-like programs we use in WebGL to realistically render grass and water, or create mind-blowing dynamic animation effects– can be composed together into a seamless system of connected, reusable code, instead of trapped in web pages, shackled in service to a single, pixel-bound purpose.

More than just a production system for hooking together special effects, e.g., Blinn-shaded geometry meets Instagram image filter plus refraction mapping, Sheets sees this interconnected network of little programs as an underlying computational fabric, a web of hyperconnected code governed by a functional programming model. It’s a grand vision, and David is on a crusade to make it into reality, or, borrowing his word from last night, reify it. (I don’t know about you, but anyone who uses the word like that several times in a single presentation is my kinda people. He had me at the first reify.)

Whether shaders become the computational reality underlying a hypermedia web will depend largely on David’s ability to bring it home. He has written a great tool set. But it’s early and we’ll need layers up above it, such as graphical editors, before it is anywhere near ready for the mainstream. Even then, he will be fighting an uphill battle. Though his insights are grounded in the reality that WebGL is computational, not declarative, most people simply don’t think that way. And even though the two views have been demonstrated to be, ultimately, equivalent (in my favorite CS book ever, thanks Hal and Jerry), most people, you know, just don’t think that way.

David has serious conviction and I hope the world doesn’t beat him down too hard. Gloc is really exciting, and I wish him well on this adventure.

Till this all plays out, I’ll be hearing in my mind David’s unspoken call to arms:

“Graphics programmers of the world, unite! You have nothing to lose but your tool chains!”

It’s Official: Now I Have Seen Everything

An ASCII renderer for Three.js?! Here’s a spinning cube rendering in glorious ASCII.