Ben Crowder

Blog: #webgl

3 posts :: tag feed :: archive :: about the blog

By way of the Glue chat comic (interesting ideas, by the way), I came across John Palmer’s excellent posts on spatial interfaces and spatial software. Mmm. As a productivity nerd and a hobbyist toolmaker (there are probably ten or so personal tools I’ve been using over the past several years that I’ve never blogged about, but that’ll change soon), I’m very, very interested in these kinds of ideas. Particularly in using 3D interfaces for productivity. I’ve thought a bit about doing that in VR, but I hadn’t really considered building tools in 3D even outside of VR.

No concrete ideas yet, just little threads leading off to various areas that I’m interested in exploring (todo lists, website/blog engines, writing/outlining tools, etc.).

At this point the plan is to use Three.js for prototyping some ideas to see if it’s viable. My initial sense is that for the kinds of tools I’m interested in, I’ll probably need a good way to render/edit text from within Three.js, and it looks like rendering to a canvas and then using the canvas as a texture will work. Anyway, more to come.

Spin

Introducing Spin, a game I threw together hastily for a little game jam I did with some friends.

Basically, you’re in a maze and have to get out before the timer runs out (ten minutes, which I display as 600 seconds because hey, I didn’t have much time) (pun not intended?). The world rotates 90° every five seconds with gravity changing as well, and the walls and obstacles hurt you if you touch them. And that’s about it. I threw most of the level together in, oh, about twenty minutes, so gameplay may end up being more frustrating than fun. But there is an exit, I promise. It may just take several rounds to find it without dying.

Technology-wise, Spin uses Box2D for the physics and THREE.js (WebGL) for rendering. I recommend playing it in Chrome, since Firefox’s WebGL wasn’t hardware accelerated (at least on my Mac) and was dog slow. (Safari works fine, but you have to enable the developer menu and then enable WebGL.)

Update: I realized this morning that it would be fairly trivial to add a first-person mode, since all I’d need to do is change the camera. So I did. It’s more boring of a game — with the gravity and world-rotation gone, it’s just maze exploration — but it’s kind of cool that WebGL makes it easy to do both kinds. The README has more info on how to activate the first-person mode.