Part C - Social Aspects

Icons

Describe the nature of icons and their history
Address some of the myths about icons
Describe the importance of meaning in interpreting icons

History | Stylization | Myths | Meaning | Exercises



Some of the oldest forms of communication have been signs and symbols.  Signs and symbols have appeared in literature, religion, film, music, and computing. 

The symbols that is of particular interest to HCI are icons.  Icons are small graphical symbols that interact with our perception.  They are present on both computer screens and keyboards.  They are an integral part of user interfaces and have been in use with displays since bitmapped GUIs became widely available.  They are abundant in computer gaming.  We find them on desktops, in toolbars, in menus, and in the form of sprites in digital games.

Rob Williams of Nokia gives this short overview of icons in relation to mobile phones.

In this chapter, we examine the history of icons, some myths associated with them, and the influence of culture on their meaning.  We discuss the details of designing computer icons in a later chapter. 


History

The origin of icons may be found in prehistoric sources.

Artistic Sources

Cave Drawings

Archeologists have discovered finger flutings from the Upper Paleolithic Age between 40,000 and 10,000 years ago before the rise of agriculture (the most important event since the last Ice Age).  Finger flutings are impressions left by fingers on soft surfaces.  They are a form of prehistoric art. 

finger flutings

Cave Drawings - Finger Flutings
(source: Sharpe and Van Gelder Wikipedia 2007 CC-BY)

Finger flutings are not obvious symbols, but rather intuitive forms of human communication.  They are open to a variety of meanings and interpretations.

Petroglyphs

Petroglyphs are images carved into rock faces.  They are found world-wide.  The oldest are dated to about 10,000 years ago.  Some are forms of communication that pre-date writing.  Some have deep cultural and religious significance. 

petroglyph

Petroglyphs in Gobustan, Azerbaijan 10,000 BCE
(source: RetlawSnellac Wikipedia 2008 CC-BY-SA)

One of the interesting features of petroglyphs is that they show some commonality across different cultures.  This observation suggests that there may be a genetically inherited structure of the brain similar to universal grammar.  Such controversial explanations are grounded in Jungian pschology, which studies the integration of unconscious forces underlying human behavior through symbols of unconscious experience. 

Logograms, Phonograms, and Ideograms

Logographic systems include the earliest writing systems.  Logograms are graphic representations of the smallest meaningful units of language.  We use them in modern shorthand to represent numerals and mathematical symbols (1 - one, 2 - two, + - plus, $ - dollar). 

Phonographic systems describe auditory forms of communication.  Phonograms are graphic representations of the smallest meaningful units of speech.  We find them in alphabets and the Japanese syllabic scripts called kana

Ideographic systems describe conventional forms of communication.  Ideograms are graphic representations of ideas or concepts.  We find them in Chinese characters and modern-day emoticons.

Hieroglyphs

Hieroglyphs are idealizations of graphical figures of animals or objects that were used during the agricultural period.  Hieroglyphs were originally used by Sumerians to record products and handicrafts.  Egyptians used hieroglyphs in two distinct ways: as ideograms and as phonograms. 

hieroglyphs

Hieroglyph from the Graeco-Roman Period
(source: NaySay Wikipedia 2006 CC-BY-SA)

Cuneiform

Cuneiform evolved from hieroglyphics between 3400 and 1000 BCE.  Cuneiform originated in Sumeria as a pictographic system of writing.  The following sequence shows the evolution of the cuneiform sign SAG for head:

evolution of cuneiform

Evolution of Cuneiform
(source: Tdi k Wikipedia 2008 CC-BY-SA)

Cuneiform was in use over 35 centuries until the 1st century CE.  There are no Cuneiform systems in current use.

Consonant Alphabets

The Semitic alphabets adapted Egyptian hieroglyphs to write consonant values.  The first Canaanite states to make extensive use of the alphabet were the Phoenician city-states.  These were maratime states at the centre of a vast trading network throughout the Mediterranean. 

The Aramaic and Greek alphabets evolved from the Phoenician alphabet.  The Aramaic evolved in the 7th centruy BCE as the official script of the Persian empire and appears to be the ancestor of all modern Asian alphabets.  The Arabic descended from the Aramaic.  The Greeks borrowed the Phoenician alphabet and added vowels by the 8th century BCE to create the first true alphabet.  Vowels form the nucleus or peak of syllables of spoken languages. 

Latin Alphabet

The Latin alphabet replaced cuneiform in the Roman era.  The evolution of the letters from Arabic sources is traced in the table below:

history of the alphabet

Latin, Greek, Phonecian, Hebrew, Arabic
(source: AnonMoos Wikipedia 2007 CC-BY-SA)

The relationship between the 22 hieroglyphics that represent consonants and the letters of the alphabet can be found in the Transliteration Table of Hieroglyphic Consonants and Letters of the Alphabet

Chinese Languages

The Chinese languages also have pictorial beginnings.  The languages belong to the Sinitic family and have a unified writing system.  The characters can be classified into six categories: pictograms (4%), simple ideograms, compound ideograms, phonetic loans, phonetic compounds and derivative characters.  The characters may be traced back to hieroglyphics.

sinitic languages

Chinese Languages
(source: Wu Yue Wikipedia 2004 CC-BY-SA)


Stylization

Icons are more stylized than the typical graphical repesentations that have evolved with language.  Unlike language, the realism of an icon is not that important.  Realistic representations may detract considerably from the principal function of an icon; that is, a form of communication at the perceptual level.  In other words, stylization is an important aspect of icon design. 

Signage

Road Traffic Signs

Road signs are an excellent example of icons.  They must be understood by international travellers regardless of cultural background. 

This need for cross-cultural interpretability resulted in the 1968 adoption of international standards for road signs.  The international treaty known as the Vienna Convention on Road Signs and Signals standardized the signing system for road traffic. 

The Vienna convention defines the requirements for Stop Signs as

  • an octogonal shape with white lettering on a red background
  • a circular shape with blue or black lettering on a white or yellow background

Stop signs currently in use in the UK, France, Italy, Germany, Poland now look like:

   United Kingdom Stop     France Stop     Italy Stop     Germany Stop    
   Poland Stop     Quebec Stop     HongKong Stop     Morocco Stop    

Comparison of European Traffic Signs
UK, France, Italy, Germany, Poland (source: Wikipedia CC-BY-SA, CC-BY-SA, CC-BY-SA, PD, PD)

The countries that have signed on or ratified the Vienna Convention are:

Vienna Road Traffic 1968
Signatories to the 1968 Vienna Convention on Road Traffic (source: Alinor Wikipedia 2010 CC-SA)

The countries that have not signed on or ratified the Vienna Convention follow the earlier 1949 Geneva convention on Road Traffic.  The countries that signed on or ratified this earlier convention were:

Geneva Road Traffic 1949
Signatories to the 1949 Geneva Convention on Road Traffic (source: Wikipedia 2009 PD)

Transportation Signs

In 1979, the American Institute for Graphic Arts (AIGA) published 50 signs for use by transportation agencies in coomunication with passengers and pedestrians:

   escalator up     escalator down     information     tiolets     water transportation     rail transportation     air transportation     bus  

Some Common Symbols and Signs for Transportation Applications
(source: AIGA)

These icons are available for use by all, free of charge.  Additional symbol are available free of charge at the Noun Project.


Myths

The nature and purpose of icons is often misunderstood.  Myths about icons include

  • icons replace words?
  • icons are no better than words?
  • icons make products easier to use?
  • icons must be obvious?
  • icons are pictures?
  • icons are photographs?

Icons Replace Words

In some cases, words are better than icons.  Often icons combined with words are better than icons alone.  Icons and words are not mutually exclusive. 

Icons are No Better than Words

Icon interfaces are better for users unfamiliar with the product or occasional users.  Textual interfaces may be fast but have long learning curves.  Icons interfaces can be combined with menus and even scripting languages to provide the best of all worlds.

Icons Make Products Easier to Use

Replacing words with icons does not automatically create ease of use.  Icons may be poorly designed and actually make products more difficult to use.  Good design, not icons, makes products easy to use.

Icons Must be Obvious

Being obvious is not the most important aspect of an icon.  It is impossible to find obvious icons that express complex concepts.  It is acceptable for the user to have to study icons for a product before using the product.  Once learned, the icons should be easy to distinguish and understand. 

Icons are Pictures

Icons are pictograms and ideograms.

no dogs allowed

Pictogram and Ideogram
(source: Connum Wikipedia 2008 PD)

Icons are Photograpghs

Icons are not like photographs.  Icons are meant to be viewed in a glance, not studied in detail.  Too much detail makes them less understandable.  Icons are often stylized representations.

pictographs

Pictograms
(source: Tkjd2007 Wikipedia 2008 PD)


Meaning

The meaning of an icon is not completely determined by the icon itself.  Understanding its meaning necessarily involves some inferences by the observer.  These inferences are culturally influenced.  In other words, appreciation of the observer's culture matters when it comes to icon selection. 

An observer understands the meaning of an icon from three distinct sources

  • the icon itself
  • the context within which the icon appears
  • the observer's knowledge of the context and the icon

knowledge to meaning

Context

The context within which the icon appears can make quite a difference.  An icon's meaning depends upon

  • adjacent icons
  • labels or other text
  • other objects in the vicinity

The same icon has different meanings in different contexts:

Consider the third symbol in the following two sets of five symbols:

11 12 13 14 15 TABLE

We read the first row as a set of numbers and the second row as a single word.  Note that the symbols for the third member of each set are identical.

Now consider the meanings of the following three symbols:

Icon Context Meaning
gabriel Hallway door

Hospital
Woman's washroom

Gynecology
bat Movie theatre

computer animation program
projection room

show animation
first aid Highway sign

Restaurant menu

Grocery store in the United States

Grocery store in the United Kingdom
Restaurant

beverages

coffee

tea

Knowledge

The observer's knowledge of the icon and the context influences the icon's meaning.  The meaning depends upon

  1. how the observer filters perception of the icon and the context
  2. how the observer completes the image

Perception

We only perceive a small fraction (about 1/1000 of 1%) of what impinges upon our visual sense.  Our perception filters what we see by

  • what we know
  • what is important to us

What we know enables us to complete the meaning of what we observe.  What we know is hard-wired into our long-term memory and extremely difficult to change.  Recall the description of long-term potentiation in our notes on Sensation, Perception, and Attention

Completing the Meaning

Our completion of the meaning of an image is affected by

  • our interest and curiosity
  • our own knowledge
  • what our reasoning interprets and infers from the image
  • how our emotions affect our interpretation

For instance, what does the following symbol mean for you?

swastika

What Does This Symbol Mean? (source: Fibonacci Wikipedia 2009 PD)

The swastika is a symbol that is thousands of years old.  It is the highly stylized representation of two geese chasing one another in the eternal cycle of death and rebirth that dates back to the Indus Valley civilization of Ancient India and Ancient Greece of Classical Antiquity.  The original swastika is either right-facing or left-facing with its arms in horizontal and vertical orientation.

hindu swastika

Hindu Swastika (source: Masturbius Wikipedia 2006 PD)

indus valley seals swastika

Indus Valley Seals (source: Fitzgerald Wikipedia 2009 CC-BY-SA)

The origin of the swastika has been traced back to basket weaving cultures.  It is the design created by the edges of reeds in a square basket-weave.  It has been found on pottery discovered in the ancient ruins of Troy.

The swastika gained popularity in Western cultures as a popular symbol of luck in the early 20th century.  It was identified as a specifically Indo-European symbol associated with the migrations of Proto-Indo-Europeans, remote ancestors that linked German, Greek, and Indo-Iranian cultures.  The symbol was also known for its use by the indigenous Navajos (American Indians).  The symbol appeared in many non-politcal Western designs from the 1880s to the 1920s.  The left-facing swastika has been the WAN symbol in Chinese script since the 7th century CE and is called the manji character in Japanese.

native american basketball team

Native American Basketball Team 1909 (source: Fitzgerald Wikipedia 2009 PD)

The swastika is considered sacred in some Indian religions.  It usually means good luck or eternal life. 

Altering the Meaning of an Icon

Near the end of the 19th century German nationalists started to use the swastika to depict a long German history with Aryan/Indian origins.  By the end of the century, the symbol was on nationalist publications and the official emblem of the German Gymnasts League. 

In 1920, Adolf Hilter sought a new flag that would serve effectively as a poster.  He described the Nazi flag as follows:

"In red we see the social idea of the movement, in white the nationalistic idea, in the swastika the mission of the struggle for the victory of the Aryan man, and, by the same token, the victory of the idea of creative work, which as such always has been and always will be anti-Semitic." (pg. 496-497)
The Nazis made their flag the German flag from 1933 to 1945. 

Although the German government has outlawed the use of the swastika as a symbol of Nazism, modern neo-Nazis and White Supremacists continue to use it.  Its meaning remains closely tied to the Nazi period in the popular imagination.

Because the Nazis succeeded in attaching an overwhelming stigma to the right-facing swastika, some people have tried to salvage its original meaning by associating the original meanings with different orientations and the mirrored left-facing form. 

Since our knowledge is hard-wired into long-term memory, it is extremely difficult to dissociate the Nazi meaning of the swastika in Western society from its original meaning.


Exercises




Previous Reading  Previous: Culture Next: Character Sets and Fonts   Next Reading


  Designed by Chris Szalwinski   Copying From This Site   
Logo