Chapter 2 – Our Vision is Optimized to See Structure

​Johnson, J. (2014). Designing with the mind in mind: simple guide to understanding user interface design guidelines (2nd ed.). Boston: Elsevier.

This Chapter covers the design principles developed in the early 20th century by a group of German psychologists call the Gestalt principles. The core theory of the principles is that the part of our brain that is responsible for sight, also orders the world as shapes rather than disconnected lines and edges. The basic theory of this has been maintained in modern neurophysiology (Johnson, 2014, p. 13).  Johnson describes the most important of Gestalt principles for UI design are the following; proximity; similarity; continuity; closure; symmetry; figure/ground; and common fate. Proximity is the relative distance between shapes which determines how we see them and organise them into groups, in his example Johnson uses the image bellow to where in we see the stars in rows or columns based on their proximity horizontally or vertically respectively. 

​Similarity is when objects appear to be visually similar or identical they seem to be grouped together, this can work to the detriment of proximity if one wishes to group to distinct objects multiple times, as is seen in Johnson’s example of Elsevier.com where the text is more grouped with the other text than the fields and vice versa. However proximity can also be used to prevent the grouping as seen in the Mac OS Print menu where the text and drop-down menus are visually linked to each other rather than there visual counterparts due to the separation between them.  

Continuity is how our brains are able to infer and deduct how an obscured object continues despite being unable to see it as a whole, this is used rather often in visual illusions.In Johnson's example we connect the red lines together and same with the blue lines and surmise that they have been blocked by the white circle rather than all four having emerged separately from its edge. 

​Closure is closely tied with continuity as our brains try to close broken shapes so that they may be seen as a whole. Symmetry we try to break down complex shapes into combinations of multiple simple shapes. Figure/Ground is the visual break between the foreground and the background, uniquely this principle can also be determined visual as well as by the intent of the viewer. Similar to when in a conversation other noise in the environment can be called background noise, the foreground is determined by what information is more valuable to the viewer.  Common Fate concerns moving objects where in objects moving in a similar way become visually linked.