También disponible en Español

Inf@Vis!

The digital magazine of InfoVis.net

Affordances
by Juan C. Dürsteler [message nº 72]

We call “Affordances” the possibilities that an object or environment offers (or appears to offer) in order to perform an action upon it. Man – machine interface design benefits from this interesting approach to perception.

The concept of “Affordance” was introduced by the great theorist of perception J.J. Gibson in order to designate the possibilities of action that an object or environment offers (or we perceive that it offers)

The classical example is that of the door (see the figures). Just by looking at it we can perceive clearly (or not) which way it opens. A handle-less door with a flat metallic plate located on the opposite side of the hinge surely will be quickly perceived as a door meant to be pushed open. We perceive that there’s nothing on the door to grab hold of in order to pull it towards you. Note that neither the door nor the panel is the affordance of the door. It is a property of the door, to be pushed open in this case. The plate is just an indicator of what the affordance is.

Figure 1: A door with a metallic plate makes you to perceive that the door is meant to be pushed open.
The affordance we perceive is that it surely will open by pushing the plate. 
Figure 2: In this case the handle of the door let us expect that we have to turn it in order to open the door. It's not clear if it's meant to be pushed or pulled open. Figure 3: In this door the handle clearly induces us to pull it towards us, without requiring any mechanism to unlock the door. 

Gibson, unlike many theorists of his time, considered that the way we perceive the world is oriented towards acting upon the environment. According to him, perception would be designed for action. This theory, that includes concepts like “ecological optics” and “direct perception” (see for example the article of Donald Norman on the topic ), clashed (and it still does) with the most classic approaches of traditional psychophysics.

But, theoretical discussions apart, what is interesting to us is that the concept of affordances gives birth to a clear principle for the design of man-machine interfaces: 

  • A good interface should have the appropriate perceived affordances to make the tasks that can be done with it evident for the user.

Donald Norman, in his famous book "The Design of Everyday Things", explains how the reinforced glass panels used for the shelters for railroad passengers that British Rail erected were shattered by vandals as soon as they were replaced. The situation changed when they decided to substitute the glass panels for plywood boarding. Although the force needed to break them was equivalent to that of the glass, the breakings stopped. Instead of smashing them, the vandals carved the wood or wrote on its surface. Glass allows us to see through it and can be shattered into a thousand pieces. In this “psychology of materials” the affordances of wood make it rather more appealing to write on or carve than to smash, concludes Norman.

To think in terms of Affordances allows us to focus on the actions that the user will perceive as feasible. In a topic like information visualisation and man-machine interface where the final goal usually is decision making (my shares are going down, so I sell them; I want go to the next page so I scroll it down), considering affordances as a key element for the design of an object, be it real or virtual, is very appealing. 

The other basic concept in order to design an object is the conceptual model. According to Norman, when we use a device, we build a mental model of the interaction that we perform with it. If the conceptual model produced by the designer does not coincide with the one that their users produce, something fails in the design.

My mental model of my video recorder is very simple, it only has the basic interactions necessary to watch a video and rewind it. The conceptual model of its designer appears to be rather complex and includes multiple (and cryptic) functions for the same key if you push it combined with others…Apparently all the home videos should be owned by experienced video editors…

The archetypical conceptual model in information visualisation is the visual metaphor. The visualisation of data by means of a system that relates its properties with others that are more familiar to us (like those of living organisms for example) simplifies the task of predicting behaviours a lot because we can infer them from the model that the metaphor refers to.

The interest of a conceptual model is that it confers consistency and coherence to the design. There’s nothing more frustrating like facing a button with a different purpose depending on the context in which you use it. 

Have you ever felt disturbed or even confused when paying for the car park by introducing your credit card into the same slot that previously swallowed the ticket?


See also the Bibliography of J.J Gibson. 

Links of this issue:

http://www.jnd.org/dn.mss/affordances-interactions.html  
http://www.infovis.net/printRec.php?rec=llibre&lang=2#DOET  
http://www.kyb.tuebingen.mpg.de/bu/people/astros/gibson.htm  
© Copyright InfoVis.net 2000-2014