This year, I was fortunate enough to enroll in San Francisco’s recently-implemented Free City program and spend a semester learning a language I’ve always wanted. American Sign Language (ASL) is a complex, naturally-evolving language that uses signs made by moving the hands combined with facial expressions and postures of the body.
As a designer, I was constantly impressed and surprised by the many parallels to visual iconography. ASL is a form of visual communication where variations in hand shape, location, and non-manual markers can change the meaning of a sign. Similarly, visual iconography uses shape, layout, and indicators to define an icon’s meaning.
For this exploration, I wanted to show examples of how American Sign Language is so surprisingly similar to visual iconography.
In linguistics, iconicity represents the conceived similarity between the form of a sign and its meaning. An iconic sign is one whose form resembles its meaning, whereas an arbitrary sign maintains the association between form and meaning solely by convention.
In ASL, not all signs reflect real life. Some are iconic symbols and some are symbols that represent a concept.
Similarly, in visual iconography, icons can be classified as resemblance or arbitrary. A resemblance icon depicts the physical object the icon is intended to represent, whereas an arbitrary icon only has meaning by convention.
ASL, like any language, is full of compounds. A compound sign represents a single concept by combining two or more individual signs. The resulting sign takes on a new meaning that’s different than its components. The following two examples show compound signs formed by a verb and a noun (though this isn’t always the case).
Similarly, some icons are combinations of two independent icons. Separately these icons express their own meaning, but together they take on a new form.
In ASL, an initialized sign is when an existing sign is combined with a manual alphabet letter that corresponds to the first letter of an English word. A group of related initialized signs use the same movement but with different letter hand shapes to specify their meaning.
For example, the signs for “family”, “class”, “team”, and “association” all use the same movement to describe a group of “something”. The clarifying variable in each sign is the alphabet-letter hand shape that defines what the group represents.
Shared pattern: Curved movement
Meaning: A group
Clarifying variable: Letter hand shape
The same pattern as initialized signs–a similar treatment plus some variable–can communicate relationships in visual iconography as well.
This is perhaps best illustrated through traffic signage. Warning signs, for example, all use the same equilateral triangle with a white background and thick red border to indicate a potential hazard (as agreed at the international Vienna Convention on Road Signs and Signals). The clarifying variable in each sign is the graphic in the middle that defines the focus of the warning.
Shared pattern: Triangle background / container
Meaning: A warning
Clarifying variable: Graphic / icon within the triangle
In signed languages, location is one of the five parameters that distinguish the meaning of a sign. Location refers to the specific location relative to the body that the hands occupy to form words. ASL uses 12 locations around the head, face, trunk, and arms to convey meaning of a sign.
For example, placement of a hand shape at specific locations on the head is used to indicate gender. Male signs are located towards the top of the head (a remnant concept of a baseball cap traditionally worn by boys), whereas female signs are located towards the chin (representing a tied bonnet traditionally worn by girls).
The same hand shape can have different meaning depending on the location relative to the head.
Similarly, in visual iconography, the placement of an icon reinforces its meaning. The same icon in one location can communicate a different message somewhere else. This is perhaps best illustrated in user interface design. Global and contextual actions can use the same icon in different places.
For example, Instagram uses the heart icon to represent “likes”, but its location on the page communicates its significance to the user. The same icon is featured both under an image where it captures likes (contextual) and also in the bottom tab bar where it represents a destination (global). Todoist uses the bubble icon to represent comment logging which can apply at the individual task level (contextual) or project level (global).
An integral part of ASL, non-manual markers consist of various facial expressions and body language that are added to hand shapes to create meaning. When conversing with someone, a signer uses these visual queues to supplement the sign and thus clarify their communicated message.
Just as the inflection of voice can impact the meaning of a spoken message, the use of a non-manual marker impacts the meaning of a signed message.
For example, eyebrow position and head orientation are used to indicate if the signer is making a statement or asking a question. Raised eyebrows and a forward head tilt indicate that a statement as a question. Without it, it’s simply a statement.
Similarly, in visual iconography, designers can use styling and markers to distinguish a certain meaning and avoid ambiguity. They are used to clarify meaning in a particular context.
For example, airplane lavatories are labeled with an lighted icon so passengers can see where it is. In addition to showing its location, these icons use added styling to show if it’s currently occupied. While the icon doesn’t change, an added “x” signifies that it’s currently in use. Similar logic can be shown with the no symbol added to any graphic to communicate “this is not allowed”.
Icons are everywhere. From street signs to mobile apps, they are often more meaningful than a word, sentence, or instructions in communicating information. Just as in signed languages, an icon with one additional variable can change its meaning completely.
American Sign Language and visual iconography use unique components to communicate information, as one is a naturally-evolving language while the other is a consciously-designed system. However, since they both cater to our vision-dominated perception of the world, it should be no surprise that these two disciplines share so much in common.
This article was originally published to the UX Collective on Medium.