May 19, 2017 at 14:41Metaphors and analogies in product design
- Transfer
Metaphors and analogies have always been used in the interaction between humans and computers and in the design of user experiences to draw attention to the features and capabilities that technology offers. Analogy and metaphor are closely related concepts, but it is important to be aware of the difference between them. Among other things, understanding the essence of these techniques will help determine in which situations it is better to use metaphors, and in which - analogies.
The essence of the metaphor is to use some concept from another semantic field to indicate what you are implementing in the design.
What to do :
Turn the unfamiliar into the familiar.
The metaphor helps explain a new, unfamiliar phenomenon through what the user already knows. The most famous metaphor for human-computer interaction and user experience design is the “desktop metaphor” by Alan Kay. She helped us move from entering commands on the command line to managing visual objects represented in digital form directly.
The first desktop on 1984 Mac OS, which brought fame to the new graphical user interface.
Create positive associations.
Using metaphors, you can evoke an emotional response. When Apple was working on the second generation of iMac, Steve Jobs and Joni Ive once walked in the garden and tried to imagine what the new model of the device would look like. Steve caught the eye of a sunflower, and he proposed making the second-generation iMac look like a sunflower. If you look at the picture below, you will notice that with its flexible leg, with which you can change the position of the screen, the device really resembles a sunflower.
Using the metaphor of the sunflower makes the iMac more human.
Persuade people
If you offer people an original product that is not similar to those that already exist, you need to describe it at least partially with the help of concepts that the audience understands well. Pinterest, which has won 10 million users in a record-breaking time for the social platform, is built on the note board metaphor. Users “attach” to themselves on the board the photos they found on the Web, and make up thematic collections. This metaphor inspires people to be creative.
What not to do :
Avoid primitive, literal metaphors
Choosing a good metaphor for design is very difficult. There is always a risk that you will make the wrong choice and everything will go head over heels. As we all know from experience, a bad metaphor can be confusing. One such example is Skrepysh from Microsoft. He gained fame as one of the most unsuccessful interface solutions ever offered to the general public, and was among the most unpopular features in the history of the franchise. Krepysh serves as a reminder to us that if you make the metaphor too straightforward, get too carried away with it, it starts to get on your nerves.
Microsoft's Strep is an annoying animated clip that appeared in a corner of the screen and distracted users from the workflow.
Don’t copy the real prototype blindly
from Apple’s iBooks — a great example of such a mistake. IBooks used a design simulating a bookcase, up to 3D shelves and wood-like textures. The bookcase metaphor was designed to help users transfer what they know about bookcases in reality (a place to store and organize material storage media) to the realities of the virtual environment. Shelves and wood look had nothing to do with the functionality of the application, they were used to make the metaphor more obvious. Apple later abandoned this skeuomorphic interface design.
Apple’s iBooks used a familiar and clear bookcase image for everyone to let the user know what he was looking for and help them establish an emotional connection.
An analogy is a comparison of two concepts (usually belonging to the same category), between which there is a partial similarity. Its main difference from metaphor is that the metaphor refers to a concept from a different category.
What to do :
Show the familiar in a new light
People draw analogies constantly - this is a natural way for us to know the world. Analogies allow us to see familiar objects and phenomena in a new light, which, in turn, suggests non-standard solutions to problems. This story is well illustrated by the history of the Nest thermostat, in the design of which an analogy was used. In fact, this design refers us to the classic Honeywell thermostat: round shape, temperature controlled by rotation. Nest had many other possible options for presenting the functionality, but they chose just that. Thanks to this, their thermostat looked "surprisingly familiar."
Classic Honeywell round thermostat (left) and Nest thermostat (right). New technologies are set out in a familiar to enjoyable way.
Help people learn new concepts
We don’t even realize this, but our brain constantly compares new concepts with what we already know well in order to better understand them. We are looking for similarities between past experiences and all new situations, which helps us sort out new products. Before Facebook appeared, a giant among social platforms that changes the very model of human communication and, possibly, changes the face of the media over time, MySpace took its place. MySpace was designed for the same audience and hit the market much earlier than Facebook. But he had one serious flaw: personal pages, in the opinion of many, looked strange. In addition, MySpace allowed the user to design personal pages to their taste. You can see the result below.
Typical user page on MySpace.
Facebook began to act, one might say, on the contrary. It used the analogy of a printed student card. Since many had to deal with a similar way of presenting data, most Facebook users found it very easy to understand and convenient.
Facebook used the student-card analogy for a virtual user profile.
Using different types of allegories, such as analogy and metaphor, to express meanings, you can more easily convey to the user what you want to say. Metaphors and analogies are not just useful tools to educate the user and help him, they are alchemical mechanisms that turn acceptable content into content that can affect people, and good products into outstanding products.
Metaphor
The essence of the metaphor is to use some concept from another semantic field to indicate what you are implementing in the design.
What to do :
Turn the unfamiliar into the familiar.
The metaphor helps explain a new, unfamiliar phenomenon through what the user already knows. The most famous metaphor for human-computer interaction and user experience design is the “desktop metaphor” by Alan Kay. She helped us move from entering commands on the command line to managing visual objects represented in digital form directly.
The first desktop on 1984 Mac OS, which brought fame to the new graphical user interface.
Create positive associations.
Using metaphors, you can evoke an emotional response. When Apple was working on the second generation of iMac, Steve Jobs and Joni Ive once walked in the garden and tried to imagine what the new model of the device would look like. Steve caught the eye of a sunflower, and he proposed making the second-generation iMac look like a sunflower. If you look at the picture below, you will notice that with its flexible leg, with which you can change the position of the screen, the device really resembles a sunflower.
Using the metaphor of the sunflower makes the iMac more human.
Persuade people
If you offer people an original product that is not similar to those that already exist, you need to describe it at least partially with the help of concepts that the audience understands well. Pinterest, which has won 10 million users in a record-breaking time for the social platform, is built on the note board metaphor. Users “attach” to themselves on the board the photos they found on the Web, and make up thematic collections. This metaphor inspires people to be creative.
What not to do :
Avoid primitive, literal metaphors
Choosing a good metaphor for design is very difficult. There is always a risk that you will make the wrong choice and everything will go head over heels. As we all know from experience, a bad metaphor can be confusing. One such example is Skrepysh from Microsoft. He gained fame as one of the most unsuccessful interface solutions ever offered to the general public, and was among the most unpopular features in the history of the franchise. Krepysh serves as a reminder to us that if you make the metaphor too straightforward, get too carried away with it, it starts to get on your nerves.
Microsoft's Strep is an annoying animated clip that appeared in a corner of the screen and distracted users from the workflow.
Don’t copy the real prototype blindly
from Apple’s iBooks — a great example of such a mistake. IBooks used a design simulating a bookcase, up to 3D shelves and wood-like textures. The bookcase metaphor was designed to help users transfer what they know about bookcases in reality (a place to store and organize material storage media) to the realities of the virtual environment. Shelves and wood look had nothing to do with the functionality of the application, they were used to make the metaphor more obvious. Apple later abandoned this skeuomorphic interface design.
Apple’s iBooks used a familiar and clear bookcase image for everyone to let the user know what he was looking for and help them establish an emotional connection.
Analogies
An analogy is a comparison of two concepts (usually belonging to the same category), between which there is a partial similarity. Its main difference from metaphor is that the metaphor refers to a concept from a different category.
What to do :
Show the familiar in a new light
People draw analogies constantly - this is a natural way for us to know the world. Analogies allow us to see familiar objects and phenomena in a new light, which, in turn, suggests non-standard solutions to problems. This story is well illustrated by the history of the Nest thermostat, in the design of which an analogy was used. In fact, this design refers us to the classic Honeywell thermostat: round shape, temperature controlled by rotation. Nest had many other possible options for presenting the functionality, but they chose just that. Thanks to this, their thermostat looked "surprisingly familiar."
Classic Honeywell round thermostat (left) and Nest thermostat (right). New technologies are set out in a familiar to enjoyable way.
Help people learn new concepts
We don’t even realize this, but our brain constantly compares new concepts with what we already know well in order to better understand them. We are looking for similarities between past experiences and all new situations, which helps us sort out new products. Before Facebook appeared, a giant among social platforms that changes the very model of human communication and, possibly, changes the face of the media over time, MySpace took its place. MySpace was designed for the same audience and hit the market much earlier than Facebook. But he had one serious flaw: personal pages, in the opinion of many, looked strange. In addition, MySpace allowed the user to design personal pages to their taste. You can see the result below.
Typical user page on MySpace.
Facebook began to act, one might say, on the contrary. It used the analogy of a printed student card. Since many had to deal with a similar way of presenting data, most Facebook users found it very easy to understand and convenient.
Facebook used the student-card analogy for a virtual user profile.
Conclusion
Using different types of allegories, such as analogy and metaphor, to express meanings, you can more easily convey to the user what you want to say. Metaphors and analogies are not just useful tools to educate the user and help him, they are alchemical mechanisms that turn acceptable content into content that can affect people, and good products into outstanding products.