Visual Perception — Series Wrap Up And Key Ideas

Posted: 27 May 2014 05:30 AM PDT

For a couple of months now I’ve been running a series on visual perception and some of the design principles that arise from it. The series completed last week, but I wanted to offer something of a summary today to highlight what I think are the key points from the entire series.

First credit where credit is due. While I’d like to tell you all the ideas in the series were mine, they mostly come from couple of books I’ve read.

The first is Visual Thinking for Design by Colin Ware, which I relied on for the first two posts in the series on bottom-up and top-down visual perception. I’ve relied on it in the past as well to cover mostly the same subject.

The second book is Visual Language for Designers by Connie Malamed and I’ve been mentioning it through much of the series. It also contributed to the two posts above and I relied on it exclusively for the remainder of the series, which follows closely with the chapters in the book.

vVisual Language and Visual Thinking Book Covers

The Series

Here’s the series in its entirety in case you missed any of it.

As I was writing my way through the posts above, I noticed several ideas and concepts emerging.

Visual perception works in two directions and each side influences the other as well as everything in between
Primitive features like color and shape attract attention
The schemas and mental models of the viewer set context
Working memory is aptly named as it does a lot of work and reducing how much work it has to do is an important goal

Visual Perception

At one end of visual perception is the external. Our eyes take in our environment through the fovea, which can only focus on a very small area at any given time. To see more of our visual surroundings our eyes must alternate between very quick movements (saccades) and fixations. This occurs so fast we’re not consciously aware it’s happening.

At the other end is the internal. It’s the memories we hold from what we’ve seen and experienced before. Our memories organize information into structures called schemas and mental models to helps us make sense of the world.

In between sits working memory, which has to hold information, process it, interpret it, and synthesize the new with existing information. Working memory is aptly named because it does a lot of work.

Both ends of visual perception influence the entire process. You might interpret information based on how it looks or how well it fits into your internal structures. Both ends contribute to whether information (both verbal and visual) is synthesized and how.

As designers we can also influence the entire process, by understanding more about how it works and doing what we can to complement nd work with perception at any point and in either direction.

Primitive Features

Information that moves from the external to the internal is bottom-up processing. Much of what occurs when our eyes move about and fixate happens prior to cognition. It happens on an unconscious level.

It’s instinctual and likely a survival mechanism. We need to be able to quickly distinguish a friend from an animal that sees us as dinner. To survive we need to notice and identify things as fast as possible. Our eyes are attracted to different characteristics of the objects around us.

We call these characteristics primitive features and the main ones that capture our attention include, size, shape, color, motion, orientation, and depth.

When we emphasize one or more of these features we make elements stand out and attract attention. Each of these (and other) features contribute to the visual weight of an element, which is another way of saying how much the element attracts the eye. Varying these characteristics helps us create structure, which leads to contrast and similarity, hierarchy, flow, balance, and other design principles.

Comparing the difference and sameness of primitive features and visual weight across elements conveys meaning about the elements and communicates information to the viewer.

Schemas and Mental Models

Information that moves from the internal to the external is top-down processing. We’ve seen a lot throughout our lives and we’ve taken in all sorts of information both verbal and visual. We can store it all, but we have difficulty retrieving it.

To help us retrieve information when we need it, we organize it into structures in memory. These structures help us identify new information and make sense of it.

It’s why when I say stop sign you probably see an image of a red, octagonal shape. You’ve seen enough stop signs to have them structured in memory with red and octagonal. The next time you see a red shape with eight sides you likely recognize a stop sign even before reading the word stop. Even if the word isn’t there, you probably still know to stop.

The schemas and mental models we build create a context for all the new information we come across. If you and a friend experience the same scenes and events and come away with different interpretations, it’s because you have different schemas and mental models that influence what you see.

Working Memory and Cognitive Load

Working memory is where we map our surroundings and where we separate figure from ground as an entry into a composition. It's where we identify shapes by searching long-term memory for anything similar to the shapes our senses take in. It’s where we process and interpret and synthesize new information

Working memory can only hold about four or five bits of information at a given time and it can only hold those bits for a few seconds.

It takes great effort for working memory to process information. The amount of effort is called cognitive load. The more load the more difficult it is to process the information. Anything we can do to reduce cognitive load (don’t make me think) will make communication more efficient and more effective.

The majority of posts in this series were techniques for reducing cognitive load depending on the type of information you’re trying to convey.

Emphasize primitive features to move processing from working memory to pre-attentive visual processing
Organize and structure information into chunks so working memory has less bits of information to process
Reduce elements to their essential to remove visual noise and lessen what needs processing. A silhouette and a photograph can both communicate person, but the silhouette does so much more efficiently
Add meaningful visual detail that complements abstract concepts and creates emotional appeal
Align the structure of your information in similar ways to how your viewers have structured similar information in memory in order to help them interpret and integrate the new

Again most of the posts in this series are about how to reduce cognitive load based on different types of information. If you take nothing else from this series, take this one thing. Then read through some of the posts again or for the first time to get the details on how.

Summary

Visual perception is a 2-way flow of information. What’s present at either end and what occurs in either direction influences the whole process. Designers can work with both external and internal stimuli to help guide viewers through a design and make the information easier to comprehend.

On the external side we emphasize some of the features of elements to attract attention to them. We organize elements and information through these features to make everything easier to process. We reduce the irrelevant visual noise and add back meaningful visual detail to do the same.

On the internal side we try to align our design with how we think viewers store related information. We design within the context of our viewer’s schemas and mental models. At times we purposely break from these structures in order to add interest and create tension that wants to be resolved.

At either end of the process we have some measure of control over how our designs are seen and how the information contained in them is processed, interpreted, and synthesized.

I hope you’ve enjoyed this series on visual perception and don’t mind the repetition of today’s summary. I’ve covered a lot of information these last few weeks and have hopefully reinforced the key points today.

Download a free sample from my book Design Fundamentals.

The post Visual Perception — Series Wrap Up And Key Ideas appeared first on Vanseo Design.