Patterns are formal descriptions of best practices within a given
design domain. They capture common solutions to design tensions
(usually called "forces" in the pattern literature). The idea of
patterns actually started in the field of architecture (as in physical
buildings). The first book (in the 1970s)
on patterns and pattern languages (collections of related patterns) was Christopher Alexander's A Pattern Language.
The “Alexandrian” format for documenting patterns is still very popular today. Patterns were introduced to the field of commercial software engineering in the mid-1990s by the publication of Design Patterns by Erich Gamma, Richard Helm, Ralph Johnson, and John Vlissides.
In recent years, patterns have taken hold in the field of Human-Computer Interaction (HCI). A very good introduction to UI patterns is (Common Ground: A Pattern Language for Human-Computer Interface Design) by Jennifer Tidwell at MIT. There is a growing body of literature on the topic, as well as a number of peer- reviewed UI pattern websites, such as—
Some Important Points About Design Patterns
UI design patterns do not separate system behavior from “look”. The traditional approach to “Information Architecture” views visual identity as decoration for functional behaviors. A pattern, on the other hand, describes an entire solution to a task (e.g. choose an account from a list), including the way it should look and feel. A pattern can optionally describe the best way to code the solution. In other words, UI architecture standards and style guide can ultimately be combined in the same document in an easy to understand format.
- Are observed through either formal user research or experience.
- Are typically written in a structured format (see below for S1 UI pattern format).
- Are reusable artifacts (i.e. prevent “reinventing the wheel”).
- Exist at different levels of abstraction (e.g., structural patterns vs. behavioral patterns).
- Undergo continuous improvement.
- Communicate design and best practices.
- Can be used together to solve a larger problem.
The Important Design Patterns for Online Systems
Our experience and years of research have taught us that the following UI Design Patterns are extremely critical to positive User Experience:
- Visual Identity
- Screen Layout
- Forms & Form Elements
- Text Usage
- Paging & Scrolling
- Hiding and Showing Information
- Icon usage
- Error Handling
- Messages and Other User Feedback
- Common Functions & Actions
- Buttons & Hyperlinks
- Selecting Objects and Executing Actions
- Online Help
- Multi-part Actions
- Required Field Indicators
We have developed the above-listed patterns for a client. As you might suspect, these patterns are closely-guarded intellectual property; therefore, we cannot share them (see are information on 'Our Corporate Values' and on 'Ethics').