UI&us is about User Interface Design, User Experience design and the cognitive psychology behind design in general. It's written by Keith Lang, co-founder of Skitch; now a part of Evernote.  His views and opinions are his own and do not represent in any way the views or opinions of any company. 

External Articles

« Isometric Maps | Main | Designing for a Specific Perspective »

The Art of Expectations

This great TED talk introduces the idea that we don't see what we think we do. Watch the first five minutes, and do what the magician says, and I'm sure, like me, you'll find yourself fooled.

The idea that someone can be fooled is not new, of course. Magicians and all form of artists (especially the con variety) have been doing it for centuries. But the more I read, the more I realize that we've got a pretty weak grip on reality anyway.

The Study of Attention

If you've ever read into a little coginitive science, you would have come across the following experiment: A person is told to watch a video where a number of people are passing basketballs between one another. The experimentee is told to count the number of passes. Midway in the video though, a man in a gorilla suit walks slowly across the middle of the scene. Amazingly, when asked about this later, most people say they didn't see anything strange in the video. They literally didn't see the gorilla because their focus was so directed!

This, and other wonderful experiments on attention can be found at the Visual Cognition Lab in the University of Illinois, including, this amazing "Construction worker" experiment:

You can see the original footage on the , construction worker Visual Cognition Lab page but I've made a storyboard with Comic Life with some screen grabs to explain what happens. This video is copyright Viscog Productions.

Storyboard of construction worker switch.

This is an astounding study. The brain is very keen to fill in the gaps, or warp our sensory input to match what we believe to be true. If you want to test yourself, try the 'Gradual changes to scenes' examples. Personally I didn't see many of the changes, and if I did, I only had a rough sense of what changed, and was often wrong.

The Dance Music Display
Before getting into the software world, I was working at a large CD store. There were two levels, with Dance Music on the upstairs level. A massive neon sign pointed along the wall and up besides the escalator to the Dance Music section. But many people would still come to the counter on the lower level and ask if the store stocked Dance Music. "Can't they read??!" we'd wonder. Then one day, the Dance Music guy from upstairs put a display of a few select titles on a shelf on the lower level. In between the select Dance Music CDs on the display were empty CD cases with the text "More Dance Music Upstairs".

It was then I realized: People were literally looking for Dance Music, not the indications to it. They were in "find the right CD" mode, not "read signs" mode.

Unread Skitch Tips
In our Skitch application, keeping the interface clean meant many of the advanced features required you to hold down the Shift/Command/Option key. As a helpful reminder, we floated a little tip bezel above the main Skitch window.
Skitch Application screen capture with small window of text tips floating above.

Seeing What You're Looking For

But you guessed it; nobody reads that. Why? Probably for the same reason. They're looking for something they expect to be in a certain form (probably an icon). As a result, they literally cannot the text.

I've seen some great eye-tracking data from the respected Nielsen Norman Group for this. 'Heat Maps', an accumulation of eye-tracking data, show that many people literally don't see the graphical ads on web sites. Even when the ads provided the answer to the experimentee's task, eg "Find the lowest price Skiing holiday on the website".

Fake Ski ad  with caption

How to Make a UI Disappear

Good UI design is about making the UI mirror the users mental model of the user. But the transmission from the UI to the user is not so clear, linear or instant. And sometimes you don't want the user to incur the cost of noticing ever-changing states.

Apple Mail icon in the dock without, and with notification badge.

For example; we're constantly inundated with email, IM, twitter notifications and the like. But the 'Gradual changes to scenes' example shows us that changes over a period of 15 seconds can go un-noticed, so it's possible to change the state of something without triggering our attention.

Instead of popping up a notification, or adding a badge instantly, the UI could slowly fade in a change over 15 seconds. This could be applied across many areas of User Interfaces. And I'd personally love a computer experience which emphasized 'flow' and gradual, constant change. No longer would every little change pull your attention away from an important task. Instead, those Mail notifications, system messages and the like could gently change without you noticing, until you decided you wanted to actually look.

SIDENOTE: I actually turn off Mail.app notifications, and simply un-Hide Mail when I want to check for mail. I'm sure Merlin Mann would approve.

EmailEmail Article to Friend

References (1)

References allow you to track sources for this article, as well as articles that were written in response to this article.
  • Response
    As an Art Director, I don't feel inspired by this system at all. I applaud the effort, and it's admirable to spend so much time pro- bono. I like the banners, they look great. But as everyone else has mentioned it's far too trendy. Please don't pimp this logo out with ...

Reader Comments (5)

[...] Le débat s’était ouvert tout récemment, et j’avais lu quelques bonnes choses ici : uiandus.com [...]

December 8, 2008 | Unregistered CommenterLinearis » Blog Archive

"As a result, they literally cannot the text."
Hehe, you almost got me :)

August 6, 2009 | Unregistered CommenterMatt

Was a mistake, but a fitting one :-)

August 6, 2009 | Unregistered CommenterKeith Lang

Really nice article - thanks for sharing.

There's a great passage in Jef Raskin's 'The Humane Interface' in which he talks about the problem of blindness to instructions.

He points out that as people become more engaged in a task their 'locus of attention' narrows. The change blindness trick works because the patsy's attention is focussed on the problem of explaining directions, not on the construction worker.

So, ironically, as people try to figure out how to do something, they're less likely to look around for help - and so less likely to see help text (unless it's right under their mouse).

The record store example is a great one - the small, human-scale cues help guide people to the large cues.

December 29, 2009 | Unregistered CommenterGiles Colborne

Following my own analysis, thousands of people in the world get the personal loans from well known creditors. Hence, there is good possibilities to find a short term loan in every country.

June 2, 2010 | Unregistered CommenterHardingMelissa35
Editor Permission Required
Sorry — had to remove comments due to spam.