Book review: Designing Gestural Interfaces

If you've been to the stunning new California Academy of Sciences in San Francisco, you may have noticed a number of interactive exhibits in the halls on the first floor. Among them are two game-like pieces by Snibbe Interactive that allow visitors to physically interact with a projected "natural" environment via motion sensors.

Bug Rug by Snibbe Interactive at the Cal Academy of Sciences, from a video of the installation.

One is called Bug Rug and is set on the floor of a Madagascar forest with insects running around under fallen leaves and branches. Visitors can scare the bugs by stomping around, or they can trap them to learn more about them by guiding bait into traps with a very specific gestural interaction. In the other, Arctic Ice, visitors use their shadows to block the sun's rays, allowing ice to form so that a baby polar bear can find its way back to its mother.

After watching kids play with both, and speaking with someone intimately involved in the installation of the works who's watched people interact with both quite a lot, it's pretty clear that visitors tend to be more engaged and successful with Arctic Ice than with Bug Rug. In pondering why this is the case (beyond the obvious fact that for most people, baby polar bears are a lot more compelling than bugs), I've landed upon the theory that the physical interaction of using one's shadow to block the sun's rays is a lot more natural and discoverable than placing one's hands next to each other palm down, with thumbs touching to move things around on the ground.

With the increasing prevalence of physical and gestural interactivity, from the iPhone to Jeff Han's election night Magic Wall spectacle on CNN, to the Wii, it's likely we're all going to be faced with the excitement and challenge of interacting with and designing devices and environments in new ways. One of the biggest challenges associated with physical interactivity is the lack of transparency into the "commands" or actions available with a given device or environment. The graphical user interface was, in many ways, a huge improvement over the previous idioms of the command line because it made it much more obvious what commands were allowable in a given context. Looking into the brave new future of physical interactivity, we're confronted with the need to create idioms and vocabulary that are as discoverable and useful as possible to avoid stepping back into command line-like arcana.

Continue reading...

One free interaction

"One free interaction" is a prospective design pattern that gives software and hardware a more humane feel. It exists outside of task flows and the concept of users as task-doers. Instead it sits in the "in between" spaces, suiting users as fidgeters, communicators, and people who play with things.

Snapback pages

When I got my iPhone, I spent time opening up all the applications and playing around. I was keeping an eye open for what new facets of the touchscreen interaction design were fun and useful. When using the Safari web browser, I noticed the funny stretchy-edge pages. Meaning, when you use your finger to scroll above the top of a page or below the bottom of a page, it pulls away from the edge of the browser, revealing a small blank area that sits “behind” the page. When you lift your finger up, the page snaps back into place. It’s kind of hard to describe, so this little video should help.

It was pretty cool, since it provided some visual confirmation of the edges of the page. But honestly I thought it was just a coding oversight. Then I saw it again in the text message page. And again in email menus, and the emails themselves. Nope, I realized, it’s baked into the OS.

I put the feature out of my mind until I found myself fiddling with it. Mulling over an email, or waiting for a text response from someone, I’d sit and idly flick the pages away from the edge just to watch them snap back. Flick-snap. Flick-snap. It was so satisfying, even if it was sort of useless.

Then I started seeing this same pattern in other things.

Continue reading...

Nothing is special

Numbers abound in interfaces, hopefully delivering a great deal of information. Bigger numbers usually indicate more activity (like when you're looking at comment threads), or more work to do (like when you're looking at your inbox); smaller numbers generally indicate low activity. However, when the number zero must be represented in an interface, it should be treated differently than other values. Why? As I'll show below, "zero" can actually imply a variety of things, depending on its context.

Search results

Zero results can mean either that the term isn’t represented in the searched data set, or that the user mis-keyed the term. Each possibility would suggest a different recourse.

• Correct term, but no results? You need to find another term or look elsewhere.
• Bad term mis-keyed? You need to supply the correct term.

When the search results are zero, help the user notice the error with attention getting graphic design, and provide options about alternate terms or places to look.

Google provides helpful “Did you mean?” suggestions when a search produces no results.

Continue reading...

Whither Clippy?

Remember Clippy, the Microsoft Office Assistant? If you're like me, you remember Clippy because you hated his guts. Figuring out how to do basic stuff in Microsoft products is (often) frustrating and difficult, but being patronized by a grinning cartoon paperclip while doing so was infuriating. The fact that Clippy seemed to offer help at all the wrong times — well, that just added fuel to the fury. When Clippy joined his anthropomorphic predecessor Microsoft Bob in the UI dustbin, every user became a little happier and more productive.

Clippy came to mind when I was in Japan, a nation and culture richly populated with animated characters. On every surface, there are characters — talking penguins, inflatable dogs, instructive manga characters — and their cumulative presence seems to make the environment more engaging and friendly.

I saw this little guy in the UI of a Nintendo DS when I toured ATR, the Advanced Telecommunications Research Institute in Kyoto.

I don't know what he's saying, but he sure is cute.

So, after my trip to Japan, I'm worried that we've taken the wrong lesson from the shortcomings of Clippy. There must be an appropriate a place for characters in interactive systems that are not simply games — not all interactive systems, but some, maybe?

My question: Can anyone point me to some good implementations of characters in non-game software? Or recommend some best practices?

 

What do you think? Join the conversation in Comments

Better ways to login

With Governor Sarah Palin's very public web-email security breach this week, there are dozens of blogs and websites pointing out how common password reset schemes are broken and debating how to improve the security of password reset tools.

Of course, password reset is just one part of the login experience which could use some improvement. There are a variety of ways to set up a web login system. A survey of many of the leading social networking and web services reveals some best practices and a number of less than satisfactory solutions. The choice of approach to a login ID determines how users must act to recover usernames and passwords and what kinds of verification must be provided.

Continue reading...