The Second Edition is out!
Visit designinginterfaces.com to read excerpts and learn more.

Extras On Demand


The color dialog box in Windows 2000

What:

Show the most important content up front, but hide the rest. Let the user reach it via a single, simple gesture.

Use when:

There's too much stuff to be shown on the page, but some of it isn't very important. You'd rather have a simpler UI, but you have to put all this content somewhere.

Why:

A simple UI is often better than a complex one, especially for new users, or users who don't need all the functionality you can provide. Let the user choose when to see the entire UI in its full glory -- they're a better judge of that than you are.

If your design makes 80% of the use cases easy, and the remaining 20% are at least possible (with a little work on the user's part), your UI is doing as well as can be expected!

When done correctly, Extras On Demand can save a lot of space on your interface.

How:

Ruthlessly prune the UI down to its most commonly used, most important items. Put the remainder into their own page or section. Hide that section by default; on the newly-simplified UI, put a clearly-marked button or link to the remainder, such as "More Options." Many UIs use arrows or chevrons, ">>", as part of the link or button label. Others use "...", especially if the button launches a new dialog.

That section should have another button or other affordance to let the user close it again. Remember, most users won't need it most of the time. Just make sure the entrance to and exit from this "extras" page are obvious.

In some interfaces, the window literally expands to accommodate the details section, then shrinks down again when the user puts it away. See the Closable Panels pattern (Chapter 4) for one way to do this. Various desktop UIs provide another mechanism: a dropdown for fill color, for instance, contains a "More Fill Colors..." item that brings up a separate dialog box.

Examples:


From http://cnn.com

Narratives frequently use Extras On Demand to separate the gist of an article from its full text. A reader can scan the leader, such as this one from CNN, and decide whether or not to read the rest of the article (by clicking "Full Story," or the headline itself). If they don't go to the jump page, that's fine -- they've already read the most important part.


From Windows Explorer

This is the file search facility in Windows 2000. Clicking "Search Options" opens a box of extra options. Likewise, clicking the titlebar of the Search Options box, with its "<<" chevron, closes the box. Not shown is another level of Extras On Demand: when the user unchecks "Advanced Options," the indented checkboxes below it disappear. This makes it similar to Responsive Disclosure (Chapter 4), which talks about content that comes and goes as a side effect of the choices the user makes, as opposed to Extras On Demand, which requires an intentional act to open or close content.