January 8, 2014

by Julie Riederer, Research Consultant, Sachs Insights

Before working as a research consultant in user experience, my research was devoted to the academic world, specifically cognitive psychology. The mental processes underlying the way we think, learn, and remember play a huge role in how we interpret and interact with websites. This past fall, I had the pleasure of attending the “Human Mind and Usability” course at Nielsen Norman Group’s Usability Week Conference in San Francisco, CA. In addition to serving as a refresher in basic cognitive principles, the course was also an exciting opportunity to discuss implications for usability. The following piece includes examples of how perception principles shape how we encounter and understand stimuli.

The Gestalt Principles, a set of theories highlighting how context affects perception (and why we interpret stimuli as a whole, rather than the sum of their parts), demonstrate how visual details can impact cognition, and thus how minor nuances in design can affect how users engage with websites.

Here are a select few Gestalt principles and their implications for usability:

The Law of Closure:

Object fragments are put together in wholes rather than perceived in parts. For example, in the image below, we “see” two triangles as opposed to separate shapes and images.

Usability Implication: We “fill in the gaps” and find visual components on websites that utilize this principle (such as logos, images) slightly more visually interesting and appealing. (Example: The Sachs Insights logo demonstrates how one “fills in the gaps” and sees two faces instead of one.)

The Law of Proximity:

We tend to think of items that are near each other as “related.” For example, we see two distinct groups of circles in the following image:

Usability Implication: Consider the “white space” between areas on a page and lines of text—especially the space between labels and entry fields, as closer proximity can assist with completion. (Example: the proximity of the text to entry fields identifies the related content users are expected to fill in.)  

The Law of Similarity:

We perceive items that appear similar as related. For example, in the following image we see two columns of circles and two columns of triangles:

Usability Implication: Similar (if not identical) shapes, colors, and font (size and type) impact how users perceive content. (Example: The consistencies of the font size, shape, and color within the following site areas help make them distinct. In addition, icons within a Twitter feed help users quickly identify different types of tweets.)  

These examples are intended to shed light on the bigger picture: cognition affects how users perceive content. Many of the usability challenges observed in research are avoidable if designers have a greater awareness and sensitivity to how people process information. Given the increasing importance and complexity of interaction design (e.g., cross-cultural content, responsive design), it would benefit those who work in these fields to familiarize themselves with cognitive principles. Furthermore, it would be an asset to interaction design programs to integrate cognitive psychology courses into their curricula.