by Alan Ho
An important element of designing User Interfaces (UI) is the arrangement of the graphical elements and controls.
One of the strategies that I employ to guide my design is Gestalt1 theory, a set of concepts from the fields of late 19th-century philosophy and psychology.
From the German language, Gestalt stands for configuration, integral structure or form2. It is a structural combination of particular features that is not a simple sum of constituent parts, but has properties of its own. The central notion behind this principle is that people tend to order experiences in a manner that is regular, orderly, symmetric, and simple. In a nutshell, humans look for patterns in mental processing. The better this pattern is organized, the easier and faster the design is perceived.
According to Gestalt psychologists, there are five main laws of groupings3 that we can apply to heuristics evaluations. These evaluative guides help designers build efficient and effective digital artifacts which in turn help our users understand the presented information, further enhancing their productivity. The use of Gestalt laws also blends nicely with Gerhardt-Powals' principles4 in reducing users cognitive resources in assimilating display data, and therefore enhancing human-computer interaction performance. In a nutshell, it can be explained by the following: Lesser cognition loads(leads to) better user performances (leads to) user satisfaction (leads to) wider acceptance.
The five Gestalt principles are as follow:Proximity
The closer objects are to one another, the more likely people are to mentally group them together.
People link together parts of the visual field that are similar in color, lightness, texture, shape, or any other quality
People perceive elements flowing in a uniform or fluid direction, rather than making an abrupt turn.
People prefer complete forms to incomplete forms. This tendency allows us to perceive whole objects from incomplete and imperfect forms. While it is not always possible to have complete closures to design elements, it is always advisable to associate them in patterns whereby users can easily associate to.
Leads people to group together objects that move in the same direction.
Central to the approach of Gestalt psychologists is the law of prgnanz, or simplicity. This general notion, which encompasses all other Gestalt laws, states that people intuitively prefer the simplest, most stable of possible organizations.
Simple as the above points may seem, they are often overlooked in practice due to lack of focus and constraints during development. Personally, I have used them as a useful heuristic tool to converge or optimize options during the design thinking/generation process.
Here is an illustration on where I've applied this technique in a generic design scenario:
The addition of this step in the design process strengthens the preliminary wireframe design and helps to reduce the number of iterations, from refinement checks to re-definition of interaction elements.
I like to include Gestalt heuristics prior to any workflow analysis since violations of Gestalt laws are easy to identify as well as fix. An advantage to applying Gestalt heuristics early in the design stage is that the skeletal structure of the design layout can be fixed early, therefore setting a solid foundation for workflow (re)design, building, and analysis. Applying Gestalt heuristics later in the design process is often more expensive due to the cost of updating the growing number of interaction elements and workflows in each successive design iteration.
In summary, my approach is to incorporate a timely qualitative tool (Gestalt heuristics) into the design framework (which may differ between individuals or organizations) to set the stage early for building better, more robust designs.
I believe that many designers consciously or sub-consciously consider and employ Gestalt principles at some point or another in their process. Are there other methods you employ in evaluating the layout of your design?
2 Mildner, V., The Cognitive Neuroscience of Human Communication. 2008, New York, New York: Taylor & Francis. 384.
3 Agrawala, M., Graphic Design and Gestalt Principles. 2009, University of California: Berkeley, California. p. 35.
4 Gerhardt-Powals, Jill, Cognitive engineering principles for enhancing human-computer performance. 1996, International Journal of Human-Computer Interaction 8 (2): 189-211.