Using Icons in Multimedia

Docstart.GIF (816 bytes) CliIndex.GIF (675 bytes) DevIndex.GIF (1183 bytes) MgrIndex.GIF (743 bytes) HFIndex.GIF (839 bytes)

Developer - Previous Page Human Factors - Previous Page

Icons are small pictorial symbols used on computer menus, windows, and screens representing certain capabilities of the system. An icon may be any symbol, image or pictograph used to represent a concept, idea or physical object. Their application provide the following benefits:

  1. They can support of the extensive human ability of pattern recognition.
  2. They can offer language independence to use of products in different countries.
  3. They reduce required space for information presentation.
  4. They offer a certain level of aesthetic appeal.

However, the design of icons for a device has to be carried out with care if they are to be effective. Attributes of good icons are described under the following headings:

Easy association with the message
An icon can represent a function or feature in a number of ways. There are a number ways in which an icon can represent its underlying concept. These are: 'resemblance', 'exemplar', 'symbolic', or 'arbitrary'.

Resemblance
icons present a direct or analogous image of the function or concept itself. Thus, the road sign for "falling rocks" presents a clear resemblance of the roadside hazard. The trash can on the Macintosh desktop is another example of an icon resembling its function.
Exemplar
icons provide examples to represent their meaning such as a knife and fork used in the public information sign to represent "restaurant services". The image shows the most basic attribute of what is done in a restaurant i.e. eating.
Symbolic
icons are used to convey the underlying referent that is at a higher level of abstraction than the image itself e.g. the picture of a wine glass with a fracture to convey the concept of fragility.
Arbitrary
icons bear no relationship to their intended meaning so the association must be learned e.g. the bio-hazard sign consisting of three partially overlaid circles. Note that arbitrary icons should not be regarded as poor designs, even though they must be learned. Such symbols may be chosen to be as unique and/or compact such as a red no entry sign with a white horizontal bar, designed to avoid dangerous misinterpretation.

Distinguishable from other symbols

Where a range of icons are needed for related functions, similarity between icons can be useful. For example, if an up arrow is used to indicate the movement of a selection bar upwards through a menu list, then a down arrow will be taken to mean movement downwards through the list. However, if too many similar symbols are used for different functions, this can cause confusion. For example, three clock symbols are shown on a teletext handset: one to display the time, one to set a time when a page is displayed and a third to cancel that time.

Not overly complex
A common problem with icon design is excessive complexity. An icon may be designed on a large scale which is then hard to recognise when reproduced on a smaller scale on a key-top. In a teaching exercise to design icons for telephone functions that HUSAT occasionally carries out, delegates or students often draw complex icons that would need to be greatly simplified to be practical. As well as being distinctive, icons which are not too complex are also more easily reproduced on different displays at varying scales and resolutions. Thus, after initial design, an icon should be constructed using the size of pixel grid e.g. 18x20, in which they will be displayed. Also by proving redundancy within an icon, this will make it more distinguishable. As shown below the use of the hair bow emphasises that one person is a child and the other an adult:

Can be combined to represent interrelated concepts
By making a good choice of icon elements, they provide a rich symbolic language. If one can learn the meaning of the basic elements, the combined elements become more self-explanatory. For example, using the VCR 'play' symbol (a right facing arrow) to represent standard play speed, two arrows gives an indication of a faster speed.

Suitable for different cultures and uncontroversial
Some symbols may be inappropriate for certain cultures. For example, the red cross symbol for medical facilities is not used by Moslem populations. Similarly, a Œthumbs upš symbol, representing OK, is regarded as a crude gesture in certain countries. Furthermore, the use of images which use exclusively gender specific representations should not be used.

Accords with international or accepted standards
Where existing standards and conventions exist, these should be used in preference to creating new icons unless there is reason to be believe that an icon will not be understood. For example, the TV icons for brightness, colour and contrast control are widely used and so alternatives are unlikely to replace them in the foreseeable future. Icon standards for IT are now being established by bodies such as the ISO committee ISO/IEC JTC 1/SC/18.

Fallacies
Finally some common fallacies about icons are: that the designer can use icons to totally replace words, that icons necessarily make products easier to use, and that an icons must be perfectly obvious in order for them to be good ones.

Developer - Next Page

Page 31 of 52

Human Factors - Next Page

Page 31 of 53

 

Docstart.GIF (816 bytes) CliIndex.GIF (675 bytes) DevIndex.GIF (1183 bytes) MgrIndex.GIF (743 bytes) HFIndex.GIF (839 bytes)

Copyright EMMUS 1999.
Last updated: September 27, 1999.