The Cooper Journal: Entries about Interaction Patterns

Journal


Entries about

Interaction Patterns


Alternate dimensions

by Daniel Kuo on February 5, 2010 | Comments (4)

If you’re a typical designer working in the software world, the majority of products you’ll create will have strictly two dimensional interfaces — length & width only, pixels on the screen. As interfaces have evolved over the years many have gained a very simple kind of "depth": lighting effects, drop shadowing, and modeled surfaces. But they are (ironically) strictly surface effects: aids to perceiving flat objects on a flat screen in discreet layers. The illusion of depth is useful for managing a limited amount of space, and contributes to a more detailed and "real"-feeling experience. Yet like piled sheets of paper, they have depth but are not in any meaningful way three dimensional objects.

An alternate dimension that can be added to our otherwise flat interfaces is time.

Continue reading...

Making pagination meaningful

by Chris Noessel on December 7, 2009 | Comments (3)

Working with long lists of information over a network, like web email, can be problematic. Very long lists can have a huge performance hit on your servers, leaving the user tapping her fingers waiting on slow page loads, especially on “very thin” clients like mobile devices. To limit the server hit and improve response times, some systems paginate data, that is, break it up into a series of pages.

This works well since most lists can be sorted by smart defaults, and the first page is the one that users most likely want to pay attention to, anyway. In the web email example, you can sort lists of individual emails by date with newest on top, or threads by most recent activity, and be confident that users will find what they’re most often looking for quickly.

But if a user needs to hunt for something, she’s going to need access to other pages, and this article is about how those controls should look and behave.

Continue reading...

A better algorithm isn't enough to fix Netflix's recommendations

by Stefan Klocek on August 7, 2009 | Comments (7)

There has been a lot of hype recently as Netflix announced provisional winners of their million dollar contest to improve their recommendation algorithm. The goal was to improve matching by 10%. Since it took over 50,000 entrants the better part of three years trying to improve past 10% this is probably a trick they can only pull off once. Given that their current recommendation engine does a miserable job of recommending movies for me, even a 10% increase isn't likely to be particularly satisfying.

I've rated just shy of 800 movies on Netflix;and just over 150 items on Amazon, yet Amazon's recommendations are usually satisfying while Netflix struggles to accurately recommend any movies I'd like to see. This isn't a case of esoteric movie tastes, in fact I'm fairly mainstream, largely preferring the entertainment of a summer blockbuster to the intellectualism of an indie documentary. The books I like are the opposite: non-fiction, obscure, expensive, limited runs, or out-out-of-print, in short; not popular. And still, Amazon recommends the right books.

Pandora is a music service which delights me by consistently recommending new music to me which I like. Netflix can't give me great recommendations. Amazon and Pandora do. Why?

Clearly the algorithm is a critical part of any good recommendation engine. But there seem to be limits to what can be accomplished just by tweaking the math. If Netflix can only squeeze a 10% improvement out of the calculation for recommendations, where can they turn to get additional increases in quality?

Tweaking what happens before and after the algorithm seems to be the only other opportunities. Both of these are ultimately interaction design solutions. Let's take a look at a few approaches to recommendations used by Netflix, Amazon and Pandora and see how they lead to different results.

Continue reading...

Auto-reply? More like auto-fail

by Doug LeMoine on July 9, 2009 | Comments (8)

Smarter autoreply

Millions of us use these annoying robo-responses. Why? Because email is the primary communication channel for business, and because we want to appear attentive to customers and colleagues. We figure that it's better to hackily and immediately "respond" than to leave important people hanging. The makers of PIM tools (Outlook, IBM Notes, Entourage) obviously don't care why we use auto-replies; if they did care, we'd have tools that actually support what we want to do.

Let's end this little charade

Our primary business tools can do better than asynchronous notes telling us that we've failed. Many of us set a variety of statuses during the course of a day, and good tools bring critical contextual information to us.


Smarter autoreply - 1
Let's say that someone wants to send me email. (It happens from time to time).

Smarter autoreply - 1
Once the sender's PIM tool recognizes who I am, it could quickly ping the address.

Smarter autoreply - 1
Let's pretend at this point that I have told my PIM tool that I will be out of the office. This is immediately reflected in the sender's tool.

Smarter autoreply - 1
That's not good enough, though, because the sender needs to know that there is some kind of recourse. What if the tool could politely indicate where the message was going?

Smarter autoreply - 1
Even better, what if I could create a special VIP list who would immediately be forwarded to me?

Google Wave may make this argument irrelevant over the next few months, but until then, I offer the above, inspired in parts by Facebook, the real-time elements of the Google Wave demo, and a conversation with Jared Goralnick. Jared's service, AwayFind, provides a nice way to get around Outlook's blunt, siloed approach to business communication. Check it out.

 

What do you think? Join the conversation in Comments

Book review: Designing Gestural Interfaces

by Dave Cronin on February 12, 2009 | Comments (1)

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

by Chris Noessel on January 27, 2009 | Comments (80)

"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

by Chris Noessel on December 5, 2008 | Comments (7)

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-0search.jpg
Google provides helpful “Did you mean?” suggestions when a search produces no results.

Continue reading...

Whither Clippy?

by Doug LeMoine on November 21, 2008 | Comments (11)
Clippy-letter.gifRemember 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.

japanese_character.jpg
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

by Stefan Klocek on September 19, 2008 | Comments (4)

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...