Icons (Something for someone)

11 November 2018


An Icon is "something (a UX/GUI element) that stands for something (else) for someone (the user)" from Terry Rankin

An interface, digital or analogical, lives between boundaries a cognitive environment. The necessary resources for comprehension and appropriate response are brought by the user. This includes linguistic capabilities, previous experiences, expectations, cultural precondition and much more. However, the designer of the system has space to define connection and relations within those boundaries as well as redefine the user mental model.

Xerox Star 8010 Xerox Star 8010 Interfaces (1981) from the Digibarn Computer Museum.

Software doesn't always allow for natural mapping and relies on conventions. Natural mapping occurs when the connection between a control and its subordinate is visible, direct and natural. Control and controlled element are near each other; they have a shape that resembles each other in an iconic or metaphoric way, they are similarly placed in the surrounding space.

Fiat Panda dashboard detail Fiat Panda dashboard detail from the User Manual from the fiat club Europe., note how (most of ) the warning lights are positioned near the physical position in the real car.

Arbitrary mapping is a design decision when no convention is present, or it is outdated (a volume knob is a convention that originates from a technological solution witch constraints do not apply anymore) and natural mapping is not possible or not advisable an arbitrary connection has to be made.

The connection includes grouping and structuring and categorising elements. Behind arbitrary mapping, there might be ergonomics reasons(being able to control a big machine from a single point), as well as economic reasons (modular controls, a limited number of elements).

A convention can have multiple origins, socially constructed, or cultural underpinning:

  • Nature: a "sea" pictogram might include waves, and a "tree" pictogram will resemble a three (a pine three can represent Christmas, but that has more to do with tradition).

  • Tradition: e.g. the long dress characterises the female bathroom pictogram.

  • Technological evolution: the file/folders paradigm is derived from the way documents were stored at the time the first computer GUI started to appear, i.e. (papers sheets grouped in folders grouped in metal cabinets)

Xerox Star 8010 Xerox Star 8010 Evolution of the "file" icon (1981) from the Digibarn Computer Museum.

Xerox Star 8010 More Xerox Star 8010 icons (1981) from the Digibarn Computer Museum.

Torah Icons The "file" icon on modern computer systems is what it is because of the frame of reference of who developed those systems in the first place. The concept and limitations of "page" were already obsolete for most of the files even back in the 1980s as it relates to the physical "printed" medium, conceptually a computer file is more similar to a Scroll or Roll, with less defined length and boundaries. We can only imagine what icons a "Babylonian" developer would have used. from icons8.com

Text and icons work together, icons alone can have unpredictable performances.

«the command expressed by the word “print” has only one meaning, but understanding an icon is more cognitively complex.» from Cognitive Modelling of Icon Comprehension, Philippe Dessus & Daniel Peraya

If an icon representing an object often is intended to be understood by metonymy and connected to the action that that object enabled (to print a file).

Polisemic? citation from Cognitive Modelling of Icon Comprehension, Philippe Dessus & Daniel Peraya

Matching the graphical representation to a software function is challenging and raises some cognitive problems for the user as the relation is not univocal.

The use of tooltips or the necessity to include tags to explain an icon system paradoxically shows the difficulty of icon identification and point at the challenge of creating a full proof icon system.

learning The recall process involves cognitive effort from of the user, the mental model and prior knowledge will determine if the recognition is successful.

If an interface skips the “learning” phase (not making sure that only one meaning is associated with an icon), it’s entirely up to the user to perform the semiotic conversion, with unpredictable results.

Decoding Fragmentation and inconsistency in icon systems are indeed a source of usability problems, the matter of designing new icons should not be considered lightly, and is all too often approached only as an esthetical problem.

Computer Icon ≠ Semiotics Icon

Icons in interfaces do not necessarily respond to the semiotics definition of "icon":

  • Icon, which resembles its referent (such as a road sign for falling rocks).

  • Index, which is associated with its referent (as smoke is a sign of fire).

  • Symbol, which is related to its referent only by convention (π as 3.1415926535897932384).

from E. Britannica

So, per definition only a minimal number of computer icons are semantically characterised as icons.

But most of icons systems will eventually mix Indexes, Symbols as well as the logical relation between the icon and what is being represented. The Metonymy, Synecdoche, and Metaphor are the main logical operation behind icons system.

"Metaphor is the dreamwork of language and, like all dreamwork, its interpretation reflects as much on the interpreter as on the originator. The interpretation of dreams requires collaboration between a dreamer and a waker, even if they are the same person; and the act of interpretation is itself a work of the imagination. So too understanding a metaphor is as much a creative endeavour as making a metaphor, and as little guided by rules." from Donald Davidson's "What Metaphors Mean."

The "folder" and "document" icons use (used? you could argue that most young users are more familiar to the file structure of a computer than the physical archive of a library) the metaphor to transpose attributes from a familiar context/object to an unfamiliar one.

"Lakoff and Johnson characterise metonymy as a subset of metaphors: “using one entity to refer to another that is related to it.” and Synecdoche as a “special case” of metonymy, in the usual sense of “the part stand(ing) for the whole." from Terry Rankin

These three "logic links" often blurry with each other and the same icon could indeed imply a different semiotic notion depending on the context. Ideally, an icon set should use a limited and consistent set of "logic links" so that the familiar "icons" can indeed help the user decoding the unfamiliar ones for transposition and re-application of the same rule.

logic links The physical resemblance is only sufficient recognise the original item (appearance of the driving light in a 1930 car), for a modern observer this icon is turning in to a symbol, only recognisable as part of a system that requires learning. This happens thanks to either repetition or obsolescence of the original icon (e.g. floppy disk as "save"). text in the picture from Yvonne Rogers*


go back home