Co.Design

Beercamp: A Bold Experiment in Zoomable, 3-D Web Design

Moving the scrollbar zooms "into" the site instead of sliding down its surface.

For nearly four decades, computers have been WIMP-ey. That's a technical term — "Window, Icon, Menu, Pointer" — to describe the mouse-driven graphical interfaces we all know so well. But even Steve Jobs, WIMP popularizer extraordinaire, knows that the paradigm is kind of played out. (Maybe you've heard of the iPhone?) But there's another, even more radical rethink of the GUI (graphical user interface) out there: the ZUI — or zoomable user interface. It never quite caught on, but some wacky designers have decided to bring it back for the Beercamp 2011 website. (Perhaps after enjoying a 24-pack or three.)

It's hard to explain without seeing it in action, so, voila:

Oh, that Inception gag at the end is just priceless.

Anyway, this isn't just a dumb stunt — or, if it is, the designers have unwittingly referenced some of the most interesting UI experiments in the history of computing. Interaction designers like Jim Hollan and Jef Raskin (father of Co.Design's current UI geek-lord, Aza) were noodling around with ZUIs decades ago. The idea is that by adding a "third dimension" of zoomable depth to computer desktops, documents, and other tools, you get an extra layer of intuitive interaction on your digital stuff. It makes a lot of sense (in theory, at least) in our current universe of endlessly hyperlinked, multilayered, nested information (and meta-information, and meta-meta-information...). Pushing "into" a link to add extra detail to what you're reading makes physical sense as a metaphor, perhaps more so than jumping laterally between 50 browser tabs or blindly clicking the "back" button. And with the advent of iOS's "pinch to zoom" gestures, the ZUI could conceivably, finally have its day in the sun.

Zoom-1

[Pay attention to the words "Sponsored by" in the middle of the image...]

Zoom-2

[...Zooming in brings you more information. Now pay attention to the words "Flip cup"...]

The Beercamp website is a pretty crude approximation of a true ZUI — you can only zoom backwards and forwards in one straight line directly into the center of the document, whereas the genuine article would feel more free-form, like navigating in a kind of browser-based virtual reality. (That kind of thing requires an effload of computing power compared to GUIs, which is probably why it never caught on.)

But still, the designers at Nclud have put plenty of thought into making such a weird interface feel simple. For example, the hyperlinked graphics become active based on the level of zoom you're at, so that you can't accidentally click on some nano-sized link that you didn't even see because it wasn't blown-up enough yet.

Zoom-3

[...Voila! Zoom in and you get more info about Flip Cup. Zooming in on "team sign up"...]

Zoom-4

[...Gets you more info thereof]

In all likelihood, the designers were just visually goofing on the "nested dreams" aspect of Inception (note the tagline at the bottom of the screen when you first visit the site). But even a silly example like this invites serious consideration of the potential pros and cons of ZUIs on touchscreen devices like the iPad. Jobs may already be planning to ditch the Home button on his flagship devices in favor of gestural commands. With millions of users already comfortable with pseudo-3D pinch-and-spread gestures, why not just go the "full ZUI," as it were, and really blow tech pundits minds? Maybe after visiting Beercamp 2011 and having a few pints, Jobs would be in an appropriate state of mind to consider his non-WIMPey future...

[See more at Beercamp 2011]

Add New Comment

2 Comments