Designing Interfaces

THE PATTERNS

As you might have guessed if you read through the control tables in the preceding section, most of these patterns describe controls—specifically, how you can combine controls with other controls and text in ways that make them easier to use. Some patterns define structural relationships between elements, like Dropdown Chooser and Fill-in-the-Blanks. Others, such as Good Defaults and Autocompletion, discuss the values of controls and how those values change.

A large number of these patterns deal primarily with text fields. That shouldn't be surprising. Text fields are as common as dirt, but they don't make it easy for users to figure out what should go in them. They're easiest to use when presented in a context that makes their usage clear. These six patterns give you many ways to create that context:

• Forgiving Format

• Structured Format

• Fill-in-the-Blanks

• Input Hints

• Input Prompt

• Autocompletion

The next three patterns deal with controls other than text fields. Dropdown Chooser describes a way to create a custom control; Illustrated Choices encourages visuals in lists and other controls; and List Builder describes a commonly reinvented combination of controls that lets users construct a list of items.

• Dropdown Chooser

• Illustrated Choices

• List Builder

You should design the remaining patterns into the whole form. They apply equally well to text fields, dropdowns, radio buttons, lists, and other stateful controls, but you should use them consistently ...