Interaction design patterns are a way to describe solutions to common usability or accessibility problems in a specific context. They document interaction models that make it easier for users to understand an interface and accomplish their tasks.

History

Patterns originated as an architectural concept

Design pattern (architecture)

Pattern in architecture is the idea of capturing architectural design ideas as archetypal and reusable descriptions. The term "pattern" is usually attributed to Christopher Alexander, an Austrian born American architect. The patterns serve as an aid to design cities and buildings. The concept of...

 by Christopher Alexander

Christopher Alexander

Christopher Wolfgang Alexander is a registered architect noted for his theories about design, and for more than 200 building projects in California, Japan, Mexico and around the world...

. Patterns are ways to describe best practices, explain good designs, and capture experience so that other people can reuse these solutions.

Design patterns

Design pattern (computer science)

In software engineering, a design pattern is a general reusable solution to a commonly occurring problem within a given context in software design. A design pattern is not a finished design that can be transformed directly into code. It is a description or template for how to solve a problem that...

 in computer science are used by software engineers during the actual design process and when communicating designs to others. Design patterns gained popularity in computer science after the book Design Patterns: Elements of Reusable Object-Oriented Software was published. Since then a pattern community has emerged that specifies patterns for problem domains including architectural styles and object-oriented frameworks. The Pattern Languages of Programming

Pattern Languages of Programming

Pattern Languages of Programs is the name of a group of annual conferences. The purpose of these conferences is to develop and refine the art of software design patterns. Most of the effort focuses on developing a textual presentation of a pattern such that it becomes easy to understand and apply...

 Conference (annual, 1994—) proceedings includes many examples of domain specific patterns.

Applying a pattern language approach to interaction design was first suggested in Norman and Draper's book User Centered System Design (1986). The Apple Computer's Macintosh Human Interface Guidelines also quotes Christopher Alexander's works in its recommended reading.

Interaction Design Pattern Libraries

Alexander envisioned a pattern language

Pattern language

A pattern language, a term coined by architect Christopher Alexander, is a structured method of describing good design practices within a field of expertise. Advocates of this design approach claim that ordinary people of ordinary intelligence can use it to successfully solve very large, complex...

 as a structured system in which the semantic relationships between the patterns create a whole that is greater than the sum of its parts, much like the way that grammatical relationships between words make language meaningful. While some collections of patterns attempt to create the structural relationships needed to form a language, many others are simply an assemblage of patterns (and thus are more appropriately termed pattern libraries.)

Elements of an interaction design pattern

For patterns to be helpful to the designers and developers who will make use of them, they need to be findable and readable.

Common Elements

Though pattern descriptions vary somewhat, many pattern libraries include some common elements:

• Pattern Name: Choosing a clear and descriptive name helps people find the pattern and encourages clear communication between team members during design discussions.
• Pattern Description: Because short names like "one-window drilldown" are sometimes not sufficient to describe the pattern, a few additional lines of explanation (or a canonical screenshot) will help explain how the pattern works.
• Problem Statement: Written in user-centered language, this communicates what the user wants to achieve or what the challenge is to the end-user.
• Use When: "Context of use" is a critical component of the design pattern. This element helps people understand situations when the design pattern applies (and when it does not.)
• Solution: The solution should explain "how" to solve the problem, and may include prescriptive checklists, screenshots, or even short videos demonstrating the pattern in action.
• Rationale: Providing reasons "why" the pattern works will reinforce the solution, though time-pressed developers may prefer to ignore this explanation.
• Examples: Each example shows how the pattern has been successfully applied This is often accompanied by a screenshot
  Screenshot
  A screenshot , screen capture , screen dump, screengrab , or print screen is an image taken by a computer to record the visible items displayed on the monitor, television, or another visual output device...
  
   and a short description.
• Comments: Including a place for team members to discuss the use of the pattern helps maintain an active resource and keeps the team engaged.

Optional Elements

Pattern libraries can also include optional elements, depending on the needs of the team using them. These may include:

• Implementation Specifications: A style guide with detailed information about font sizes, pixel dimensions, colors, and wording for messages and labels can be helpful for developers.
• Usability Research: Any supporting research from usability tests or other user feedback should be captured. This can also include feedback from developers, customer service, or the sales team.
• Related Patterns: The pattern library may include similar patterns, or it may be organized into a hierarchy with parent and child patterns.
• Similar Approaches: Since there are likely to be many possible solutions to this problem, teams may want a place to capture similar alternatives.
• Source Code: If the code is modular enough to be reused, then it can be included in the library as well.

Reasons to use design patterns

Benefits of using interaction design patterns include:

• Teaching novices some best practices and common approaches
• Capturing collective wisdom of designers across many uses and scenarios
• Giving teams a common language, reducing misunderstandings that arise from different vocabulary
• Reducing time and costs in the design and development lifecycle
• Making usable designs the "path of least resistance
  Path of least resistance
  The path of least resistance describes the physical or metaphorical pathway that provides the least resistance to forward motion by a given object or entity, among a set of alternative paths. The concept is often used to describe why an object or entity takes a given path.In physics, the path of...
  
  "
• Eliminate wasted time spent "reinventing the wheel"
• Ensuring users have a consistent and predictable experience within an application or service

Advantages over design guidelines

Guidelines are generally more useful for describing requirements whereas patterns are useful tools for those who need to translate requirements to specific software solutions. Some people consider design guidelines as an instance of interaction design pattern as they are also common approach of capturing experience in interaction design. However, interaction design patterns usually have the following advantages over design guidelines:

1. Abstract guidelines, like the Eight Golden Rules of Interface Design by Shneiderman, do not suggest how to solve a problem like many interaction design pattern, and cannot be used for interdisciplinary communication. Furthermore, guidelines do not provide an explanation as to why a particular solution works.
2. Concrete guidelines, like Macintosh Human Interface Guidelines, are too tailored to a specific interface, and therefore are not as effective when applied to other interfaces (especially non-Macintosh interfaces).
3. Other problems with guidelines are that they tend to be too numerous which makes it difficult for designers to apply the right guidelines. Also guidelines assume an absolute validity while usually they can only be applied in a particular context. A result of that is also that guidelines often tend to conflict just because they lack describing a context.

Guidelines and patterns are not necessarily conflicting, and both can be used in conjunction to identify the problem and then create a valid solution.

See also

• Design pattern
  Design pattern
  A design pattern in architecture and computer science is a formal way of documenting a solution to a design problem in a particular field of expertise. The idea was introduced by the architect Christopher Alexander in the field of architecture and has been adapted for various other disciplines,...
  
  
• Gameplay
  Gameplay
  Gameplay is the specific way in which players interact with a game, and in particular with video games. Gameplay is the pattern defined through the game rules, connection between player and the game, challenges and overcoming them, plot and player's connection with it...
  
  
• Information architecture
  Information Architecture
  Information architecture is the art of expressing a model or concept of information used in activities that require explicit details of complex systems. Among these activities are library systems, Content Management Systems, web development, user interactions, database development, programming,...
  
  
• Interaction design
  Interaction design
  In design, human–computer interaction, and software development, interaction design, often abbreviated IxD, is "the practice of designing interactive digital products, environments, systems, and services." Like many other design fields interaction design also has an interest in form but its main...
  
  
• Sonic interaction design
  Sonic interaction design
  Sonic interaction design is the study and exploitation of sound as one of the principal channels conveying information, meaning, and aesthetic/emotional qualities in interactive contexts. Sonic interaction design is at the intersection of interaction design and sound and music computing...
  
  
• Interactivity
  Interactivity
  In the fields of information science, communication, and industrial design, there is debate over the meaning of interactivity. In the "contingency view" of interactivity, there are three levels:...
  
  
• Interface design
  Interface design
  Interface design deals with the process of developing a method for two modules in a system to connect and communicate. These modules can apply to hardware, software or the interface between a user and a machine...
  
  
• Usability
  Usability
  Usability is the ease of use and learnability of a human-made object. The object of use can be a software application, website, book, tool, machine, process, or anything a human interacts with. A usability study may be conducted as a primary job function by a usability analyst or as a secondary job...
  
  
• User-centered design
  User-centered design
  In broad terms, user-centered design or pervasive usability is a design philosophy and a process in which the needs, wants, and limitations of end users of a product are given extensive attention at each stage of the design process...
  
  

Further reading

• A Pattern Approach to Interaction Design, by Jan Borchers, ISBN 0471498289
• A Pattern Language for Web Usability, by Ian Graham, ISBN 0201788888
• The Design of Sites: Patterns for Creating Winning Websites (Second Edition), by Douglas K. van Duyne, James A. Landay, and Jason I. Hong, ISBN 0131345559
• Designing Interfaces: Patterns for Effective Interaction Design, by Jenifer Tidwell, ISBN 0596008031
• Designing Social Interfaces: Principles, Patterns, & Practices for Improving the User Experience, by Christian Crumlish and Erin Malone, ISBN 0596154925

External links

• Interaction Design Patterns Page by Tom Erickson
• 5 Great UI Pattern Resources by Andre Charland
• Design Patterns: Introduction