Idioms vs Metaphors in the digital world
The battle for clarity
We all use idioms and metaphors everyday, they are effective literary tools used to communicate through abstract phrases and expressions. An idiom is a group of words established by usage as having a meaning not deducible from those of the individual words (Examples: barking up the wrong tree, once in a blue moon, see the light ). A metaphor is an expression representative or symbolic of something else, especially something abstract. (Example: “He broke my heart.” Your heart isn’t literally broken; you’re just feeling hurt and sad.)
The use of visual idioms and metaphors is commonplace in UI design. Metaphors from the physical world were ubiquitous within skeuomorphic design patterns and remain widely used to communicate the function of interface controls. Metaphors can be an efficient tool for communication if the user of a system shares the same culture, experience, and language as the designer. Metaphors can also limit the visual language of a system by imposing the parameters of the physical world on digital products.
Idioms have also been used since the beginning of direct manipulation user interfaces and continue to be widely used today. Well defined idioms effectively communicate their purpose through usage. An idiom can fail if it’s purpose is not clear through affordance and its functionality is not memorable to the user. An effective idiom should require one usage to be remembered and understood. So which is the most effective tool for clear communication with your users? Let’s take a closer look.
Idiomatic design
Idiomatic design is based on formulaic language idioms such as “kick the bucket”, “beat around the bush” or “it’s raining cats and dogs”. These phrases are absorbed and understood because they are distinctive and memorable not because they are literally associated with the action that they are describing. All idioms must be learned but effective idioms need to be learned only once. Most of what human beings know they learn without understanding. Some examples are faces, social interactions, attitudes and melodies. We don’t require an understanding of why facial features are arranged in a specific way in order to recognize someone’s face. We recognize and remember human faces without effort. The mouse is another great example of an effective idiom. The mouse has no physical affordance to indicate it’s purpose or function and has no parallel in the mechanical world. However, learning how to use the mouse is effortless and memorable. There are no tutorials for using the mouse. We have no reference for the mouse, we don’t understand the technical functionality of the mouse, but we use the mouse once and are proficient. This is idiomatic learning.
Examples: nested folders, windows, title bars, close boxes, screen-splitters, hyperlinks, drop-downs, scroll bar, and radio buttons
Pros:
- The human mind has the ability to learn and retain idioms easily.
- Non-metaphorical visual and behavioral idioms are not limited by references to the physical world.
- New idioms can be created to solve problems as they are encountered.
Cons:
- Idioms can fail if they are not obvious and memorable.
- Idioms require the initial effort of learning something new with no reference.
- Idioms do not provoke established associative connections.
Metaphoric design
Metaphoric design depends on a user’s understanding of references from the physical world to denote the function of interface controls. Visual metaphors such as trash cans, scissors and floppy disks are 2D representations of 3D objects from the physical world used to communicate the purpose of an interface control. Metaphors can expedite the learning process for users by associating the affordance of common physical world objects with the interface controls of the digital world. This method is dependent on the assumption that the user of a system has the same understanding of these physical objects as the designer. This assumption can fail if the user has a different perspective than the system designer. For example, a user born in 2001 may not recognize the floppy disk as a metaphor for saving because the floppy disk was antiquated before they began using computers. Cultural and linguistic differences can also cause visual metaphors to fail. The power of the metaphor is dependent on the mental model of the user.
Examples: trash cans, scissors, floppy disks, cogs, paper clips, magnifying glasses, wrenches, and shopping carts
Pros:
- Metaphors can reduce anxiety and cognitive taxing by presenting familiar references.
- Metaphors can speed up learnability by relying on users understanding of the physical world.
- Metaphors can be processed quickly due to their familiar visual form.
Cons:
- Metaphors are limited by the number of common physical world references available for association.
- Metaphors can fail if the user of a system does not share the same culture, experience, and language as the designer.
- Metaphors can limit the visual language of a system by imposing the parameters of the physical world on digital products.
Conclusion
So is it the idiom or the metaphor that wins the battle for the most effective communication tool? The answer is dependent upon context. There are situations when a metaphor will prevail due to it’s familiar reference, visual affordance, and it’s incorporation into Jakob’s Law (Jakob’s Law — Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know. You can simplify the learning process for users by providing familiar design patterns). And there are situations when the idiom will be the most efficient tool because of it’s inherent malleability, lack of physical world parameters and easy learnability. The key to using the appropriate tool is knowing the difference between the idiom and the metaphor and understanding the strengths that each offer. When employed strategically, idioms and metaphors can work in harmony to create the ideal user experience.
Thank you for reading.
Connect with me
📖 Medium
💎 Dribbble
📄 Linkedin
References 👇
