published by Eric Mill on

Web-based 3D is getting very powerful, and very easy. Here is a pyramid, all JavaScript, no Flash:

I wrote that by hand in WebGL by using Three.js, which makes it dirt easy. Three.js' creator, Ricardo Cabello, has a real simple example literally running atop its code. (WebGL won't run in IE. If you're on Safari, you can enable it.)

WebGL basically lets developers like me use your graphics card to do Real Big Boy Stuff without leaving the universal commons of HTML. If you've ever wandered into Google's Chrome Experiments (some of them are quite breathtaking), WebGL is what they've been using.

Getting started with Three.js can be a bit intimidating. As seems to be trendy these days, the creator is not super big on docs. There are some tutorials and blogs out there, and a very healthy StackOverflow tag, but you'll learn the most by looking at examples and viewing the source. If you're willing to pay a bit of money though, a book was also published just last month called "WebGL: Up and Running" - I bought it, and it's really great so far.

Last year, I messed around a little bit with 2D animation using Processing.js - first with a sea of triangles, and then stepped it up to hexagons in an attempt to model a childhood quilt (it turns out drawing stitches requires trigonometry!). It was fun, and Processing.js is a great tool, but I never worked on much beyond proofs of concept, and trailed off.

This time feels more grounded and exciting, if challenging. Three dimensions just feel inherently more worthwhile than two. And hey, there's always four. After reading Flatland, one of my first Internet obsessions was a Java applet (that still exists!) of a rotating hypercube, made for red-blue 3D glasses. I bought 30 pairs and handed them out to my math class and made them all watch it. 13 years later, maybe I'll make a new incarnation, but with all the reach and ease of the Web.

  1. Eric Mill

    "'re welcome, Robert..."

  2. Robert Holbert

    I tried viewing this post in my two favorite browsers and none of them rendered the pyramid. Finally succumbed and used Chrome. Felt bad, and had to shower afterwards. Thanks for nothing, pyramid!