Close

2008-12-03

Patterns, Idioms and Metaphors

In conversation and in writing, I’ve used the terms “pattern,” “idiom” and “metaphor” in the context of design. But what do these terms mean? Don’t these terms pertain to language and not design? Well certainly, these terms are words about language, or a language about language. But, design is a kind of language. The products we design speak a language that is translated from human to machine and back again. However, in the context of design, these terms have special meaning beyond the meaning used to describe spoken language and other mediums.

Patterns

Patterns are easy. We see patterns everywhere. Our human brains are remarkably good at recognizing patterns, even on the subconscious level. A pattern is simply a repeatable relationship of attributes. All of human spoken and written language is a type of pattern. It is the patterns that make it possible for us to communicate.

We can identify patterns in clouds, in water, in paint texture, in highway traffic, in child development, in bird flights and countless other things. This observation of patterns lead to the development and creation of design patterns. This is a different kind of “design” that applies to the programming, development and construction of software. It is related to architecture and engineering. The essence of these patterns is a manner of making concepts that are implicit more explicit and defined. It takes ideas that most people are familiar with and creates a vocabulary that makes it easier for people to communicate about the ideas.

In the context of interaction design, visual design and interface design, patterns are the basic building blocks of making an interface familiar to the humans. When a human being recognizes a pattern, it becomes more familiar and more “usable” to them because of the familiarity. Just about everything that “makes sense” in an interface is the result of a pattern. In the context of interaction design, an idiom is a pattern and a metaphor is a pattern. Think of patterns as the DNA of interface design.

Metaphors

A metaphor is a thing that is a thing and yet, not really that thing. Frequently in language, a familiar (and almost intuitive) concept is used to describe something that is more difficult to understand. For example, when someone says, “John is a closed door on this matter,” the person is not saying that John literally is “a movable, usually solid, barrier for opening and closing an entranceway, cupboard, cabinet, or the like, commonly turning on hinges or sliding in grooves.” In this case, the speaker is using the very familiar concept of a door to describe John’s emotional, judicial and personal attitude and position on a particular subject.

In the context of interaction design, specifically in software interface design, a metaphor is the application of familiar ideas and concepts and using them to convey meaning about a virtual environment. For example, if you are familiar with modern operating systems, you’ve probably heard of a “desktop.” This is not literally the top surface of a piece of furniture, but simply a term used to make a vague concept more discernible to the average person. There are plenty of these metaphors in an operating systems. “Files,” “folders,” “buttons,” and “trees” are not literally these things, but are actually representations of data using metaphoric terms to aid in human communication.

Metaphors are frequently used in the semiotics of icons. If you pay attention to icons in your operating system, you are likely to see many metaphors:

The actions associated with these icons are not represented literally, but rather, metaphorically. This is applied broadly to general interface design as well. Both in the linguistic description of patterns and also in the visual and behavioral representation of interaction elements, metaphors are frequently used to help human beings understand what the machine is doing or going to do.

One of the most common design metaphors is the idea of a “page” or a “document”. The computer doesn’t need to consider a grouping of data as a page or a document. These are metaphors from pre-computer days that are fairly easy for us to understand. The designers decided to use these metaphors to help humans understand how the data is grouped together.

Idioms

Idioms are like metaphors except that they are less specific and frequently don’t use something familiar to describe something less familiar. In the English language, we use idioms all the time. In fact, I just used an idiom: “all the time” isn’t precisely true. It is an idiom to mean that the frequency and proliferation of idioms in the language is high or very high. An easier idiom is something like “let’s take off.” When somebody uses this phrase, they don’t literally mean that they are going to take any clothing off. If a listener understands the idiom of “taking off” in the terms of aircraft, they probably wouldn’t expect that somebody saying “let’s take off” to mean that this idiom is the same as the aircraft idiom (unless maybe they were sitting in an airplane at the time). When someone uses this phrase, they generally mean “I think we should leave from where we are and go to another place.”

An idiom is a pattern of language or objects that are not to be taken literally, but that have special meaning within a particular context. Idioms in language and in semiotics are very common and constitute a significant portion of human communication. It is important to note, though, that an idiom is within context and culture is a part of that context. Sometimes different cultures and subcultures that use the same language have idioms that are unfamiliar to each other. For example, I was speaking with somebody from Texas and he said, “…that really burns my hide…” Not being from the same subculture as he, I had never heard that phrase and it took me a moment to understand what he meant. (Sometimes an idiom is called a colloquialism and vise versa, but I don’t want to get into discussing the distinctions here.)

In the context of design, an idiom is a pattern of representing behavior using ideas and concepts that aren’t to be taken literally. This can be tough to discern at first, so let’ look at an example.

The image above contains controls (buttons) with specific behavior attached to them. I think most people are familiar with these buttons. You’ll notice that I blurred the text above the buttons to illustrate a point. Even without the text, these symbols, in this basic arrangement have become very familiar to many of us. To take them literally, we have buttons with triangles, squares and circles in specific geometric arrangement and accompanied by significant color (red especially). A square is not an action, but the button performs an action. The square on the button is an idiom–a particular kind of pattern–that conveys meaning to a human being. Below is a collage of screen shots from several software applications using the same idioms. See if you can guess what these software applications do and how these controls work.

Most software idioms are far more subtle and complex than this and require a great deal of effort to appropriately discern and analyze. Most of them become usable through repeated exposure and cognitive learning rather than “obvious” and “intuitive” uses. There is nothing intuitive about a triangle facing to the right. Yet over time, we become familiar with the meaning and this allows us to communicate with a machine.

Hopefully, these brief explanations will help you, dear reader, understand me better. I know, I can be pedantic at times, but it is my humble opinion that the definitions of things help maintain world peace… but that’s hyperbole… or is it a simile? …an analogy? oh well. Please feel free to leave comments below about your ideas about patterns, idioms, and metaphors. If you have any questions, don’t hesitate to leave those in the comments as well.