« November 2006
January 2007 »
The Grandma Test
Because in silicon valley we're surrounded by computer tech professionals, I know that it's easy to forget how hard computers are to use for most people. To adjust for that, I try to resist designs that add subtle features or new interaction styles, because they will confuse people.

But even so, watching my Grandma try to use her computer is a stark reminder that I have completely lost touch with average users. For example, over the phone I might have recommended that she use Picasa for organizing photos, since I think it's very easy to use:

But actually Picasa is very confusing for her, basically unusable. And the reason isn't that it's poorly designed, so much as that it's just not designed for someone with such a total lack of understanding of basic computer concepts. Some examples:
  • Grandma doesn't understand the concept of different views of data, so when she sees her pictures in Picasa she thinks they're copies of the pictures on her hard drive--- and so she keeps deleting and moving her pictures around to try to "get rid of the extra copies."
  • Grandma's digital camera automatically installed Photoshop Elements 4.0, and she doesn't understand that Picasa is different from Photoshop. So when she uses Picasa she looks for Photoshop features on the screen and thinks she "lost" them.
  • Picasa's camera import utility prompts you to give your photos a name, which is great. But Picasa isn't the default import utility, and Grandma's camera software imports her photos directly into a folder with just the date, and doesn't ask for a name. So she has thousands of pictures with names like "12_04_05/IMG_3241.jpg", so when she searches for things like "Spain", of course Picasa doesn't find any of her pictures.
  • Once Grandma has clicked into an album, she thinks the rest of her photos are "lost" because she doesn't understand that the Album View is different from the Library View, and that she has to click "back" in order to see the rest of her pictures.
For someone with this level of computing skill, I don't believe that design success is possible at all--- Picasa can't teach Grandma what folders and windows are, and Picasa can't prevent other third-party software from interacting badly with it.

Computers are just way too hard to use.

You might argue that Apple doesn't have this problem because they design all of the software to work together. I would almost agree, except that for users who buy a non-Apple-brand digital camera, there will always be some dumb third-party software that makes things just as confusing. While it's true that OSX doesn't have much third-party software available to muddy up its Macintoshes, Apple has no inherent immunity to this problem. If anything, its lack of widespread support is it's best protection--- if Apple had 80% market share, Canon would have written a confusing Photo Import Utility for it, too.
You kids today

I'm visiting my grandmother in Virginia for Christmas, and since I'm from California the inevitable Politics Conversation ensued, complete with a You Kids Are Sending This Country To Hell In A Handbasket talk. But it's not really what I expected. For example, one quote from my Grandma:

"I feel like the country is becoming much more intolerant; these big churches today with their own schools and hospitals scare the heck out of me."

You might think I'd be happy to have a Grandma that agrees with my political leanings, but actually I'm terrified:

One of the few things that keeps me sane is my belief that, long-term, the world is becoming more progressive, even though there are short-term conservative trends. To hear someone with an 85-year perspective say that things are getting worse is basically my deepest fear realized.

(Grandma would want you to know that this isn't her in the picture; she's a much younger-looking 85 than this.)

An air travel haiku

use the bathroom lock
i don't want to see you poop
i'll be scarred for life

Tis the Season
I'm not even half way done writing all of these Christmas cards, and my writing hand is a gnarled husk. This season it appears that I'm giving the Gift of Repetitive Stress Injury.

This all started last year when I got fed up even more than usual by the stress and materialism of Christmas--- totally aside from how the Shopping Task totally ruins the holidays for me, when you get to the point where you're exchanging the SKU numbers of items that you want with your family members, it's time to admit that there's something wrong with the process.

So last year and again this year, I added up all of the money I would have spent on gifts and donated it all to a charity instead. (Which is a frightening sum, when I bother to add it up.) Last year it was Direct Relief International, a very cool medical supply organization based out of Santa Barbara. (This year it was the AFSP for a few different personal reasons, but it probably will be DRI again next year.)

But lest you claim that the charity lump sum is a cop-out, I hand write all of the Christmas cards, so that I at least take some time to think about each member of my family. Considering that I barely even remember how to use a pen and paper anymore, it's pretty brutal on my wrist.

But it still beats the hell out of shopping.

PS: Shopping for a charity? I got a lot of mileage out of www.charitynavigator.com; it's very interesting to see how much the executives make, and how much money is spent on real work versus self-marketing. It's worth looking up your favorite charities on there, their spending behavior might surprise you.
Not Clicking is Not Action
Don't think of this as a blog post so much as an entreaty--- please, I beg of you, stop creating rollovers. It makes no sense, it's really bad user interface, and I'll tell you why:

What's a "rollover"?

It is any user interface element that has behavior or takes action just because the user's mouse is near it, even though they haven't clicked. And whenever you put one into a web page (or really any computer user interface) that you are creating, it makes me want to kill you.

For Example

Look at this buy.com shopping page. The entire window is a grid of the products that you could browse. That's actually pretty good; I can see 12 items at a time--- or can I? As soon as I start to read the page, I find that one of the items randomly swells to hide 3 of the other ones, so now I can only read 9 items instead of 12.

Confused, I realize that it's because of my mouse cursor happened to come to rest on one of the items. So if I'm not careful with my mouse, the page devalues itself. If I want to just read the page's 12 items, I have to first go "park" my cursor in one of the tiny 7 pixel gutters on the page that contain no mouse booby traps. What is good about this?

The mouse is not an eye tracker

Simply put, the mouse position does not correlate with the user's attention. Most rollovers are designed with the assumption that the user is much more interested in whatever is under the mouse, or more likely to click on what is currently under the mouse. But the mouse is NOT an eye tracker, that's a very different kind of interaction. When you make rollovers, you are building your interface on a bogus assumption.

So what does the mouse's position mean, usually?

Most users use the mouse as a tool for clicking (duh?), and so the mouse's position correlates best with the user's last click, not their next click. Most users don't waste energy waving the mouse around the screen, they just look around the screen (which is much faster and more accurate), leaving the mouse motionless until they have selected their next clicking goal.

So if you insist on creating rollovers, the ones that are most likely to activate are the ones under whatever the user last clicked on, such as the previous page, or a dialog box, which are usually not even visible anymore. Is that what you want? Didn't think so.

And what is mouse motion?

While I'm ranting, I may as well emphasize that the mouse is also not a gesture interface. The user cannot teleport their mouse to their next clicking goal, they have to move it along the 2D surface of the screen, from where it is now to where they want it to be for the next click. Most all users, from novice to experienced, will move the mouse as best they can in a basically straight line, according to Fitt's law.

What's important about this is that the user does not regard any elements on the screen except for the next clicking target--- they don't drive the mouse around like a car in Manhattan, avoiding obstacles and planning their route. They just go in a straight line, and if you've put a rollover on the screen that happens to be between any pair of clickable items, the user is going to hit it regardless of how uninterested they are in your stupid popup menu.

So when will rollovers activate?

The actual facts about how users mouse pretty much add up to one answer: Most of the time, rollovers activate by accident. If your interface is full of rollovers, then you've essentially made an interface full of accidents waiting to happen. So unless your rollover actions are very subtle, they will effectively punish the user for even looking at your interface--- every time they move the mouse, you're telling them that they are using your interface incorrectly. Your screens will feel booby-trapped, like there's no safe place for the mouse to go without causing some accidental action. Is that what you want? Didn't think so.

So cut it out!

  • Avoid rollovers that take any action that the user might find frustrating if it were to happen accidentally (rollover-activated ads, zero-click shopping, etc.)
  • Avoid rollovers that reorganize the information on the screen (i.e. rollover menus that shove the layout around when the mouse gets near them.)
  • Avoid rollovers that pop up to occlude click targets; the user might be moving the mouse towards a button at the exact moment that you choose to hide it from them with your stupid popup menu
  • Avoid rollovers that occlude information on the screen, because the user might be trying to read it
  • You can use gleams (little color changes or animations to hint that something is interactive when you mouse over it.) They're okay because activating one by accident doesn't hurt.
  • You can use tooltips if they're small. That's such an old interaction style by now that most people understand what they do, and even expect them.
  • If you want to present more information to the user, you can offer a small icon that gleams when they mouse over it, and uses more screen real-estate only if they click.
  • If you MUST have a rollover display lots of information, why not just reserve space for it on the screen ahead of time? Create a box into which your information is filled, and the user can read it without having to suffer a loss of some other part of the screen through occlusion. (I would argue that this isn't very discoverable UI, but hey, it's a free country.)

Wow, I'm shocked that you read this whole thing. I don't rant very often, and when I do I assume that I get switched off faster than an NPR pledge break. You have way too much free time.
Making your day just a bit worse

Thanks, Digg.

Whitespace is cheap, use it
(This post was almost titled "Improving UI Designs", a haughty parable containing 4 paragraphs of my self-important rambling intended to impart my lofty design wisdom upon you lowly masses. But it read exactly like a Jason Fried article, so I couldn't bring myself to publish it. Instead, here's the short and sweet:)

Presenting a list of blog post comments should be a pretty simple design problem. And there's nothing really wrong with this design: Now, associating a label with a value has got to be one of the oldest design problems ever (think tax forms), and so you'd think that we would have nailed it by now. But if you look at the same list of blog post comments once you've scrolled down a bit, you'd see this: This design offers a 50% chance that your user will think the middle post was made by "Jason" instead of "ShirtBloke". Best case, if your user wants to know who he should send his angry flame at for maligning The Eagles, he would have to laboriously scroll to the top of the list of comments to figure out which name goes with which post.

Worst case, your user will wrongly send the flame to Jason, and Jason will turn out to be the president of a nuclear super-power who is having a very bad day, and World War III will erupt, extinguishing all life on the planet. (I said it was worst-case.)

So remember, if you don't want to have the blood of every living thing on your hands, don't be stingy with the goddamned whitespace.
The views expressed on this site are mine personally, and do not necessarily reflect the views of my employer.