Communicate Efficiently By Reducing Realism

Posted: 28 Apr 2014 05:30 AM PDT

The world around us contains a lot of visual noise. It’s great to see, but all that visual information has to be processed even the parts we’re not interested in. You can help speed processing by removing noise and reducing realism.

The last few weeks we’ve been looking at visual perception and the design principles that arise from it. Today’s agenda is about how reducing realism can speed visual processing and improve comprehension.

As I’ve mentioned a few times, this series comes mainly from the book Visual Language for Designers by Connie Malamed.

Simplicity Speeds Processing

You have the option with every graphic you create and every site you design of choosing an aesthetic somewhere on the scale between hi-fidelity photorealism and a lo-fidelity abstraction that lacks details and realism.

Which is best depends on the message you’re trying to communicate and the characteristics of the audience you’re attempting to reach. As you can guess from the title of this post, we’re going to focus on the lo-fi abstract here. There are some good reasons for using graphics with reduced realism.

They lead to quicker comprehension
They strengthen the impact of a message
They focus attention on the essential details
They’re useful in giving explanation to beginners and general audiences

Because there are less details to take in, reducing realism leads to more efficient visual processing. Less details make it easier to find and process important information. Less information to process means less information needs to be held in working memory, which leads to less cognitive load.

People can identify objects in line drawings as easily as they can identify the same objects in photographs

Irrelevant information that might otherwise delay processing is removed. The data becomes easier to process and integrate with data held in long-term memory.

When our eyes first look at a graphic we scan it for primitive features and then for complex information. When designers reduce realism much of the complex information is removed. That makes it quicker and easier to find the primitive features.

Our brains do some of this anyway. They remove the non-essential in order to focus on the essential and they store minimal representations of the information taken in. By reducing realism in our designers we’re complementing the natural process.

Because we’re removing details, the primitive features we choose to emphasize have greater impact on the message being conveyed. It’s important to choose how many and which features to emphasize as well as how much emphasis is given to them. Some details are less realistic than others.

Hard shadows are less realistic than soft shadows
Smooth surfaces are less realistic than rough surfaces
Sharp contours are less realistic than transitions
Geometric shapes are less realistic than natural shapes

How to Reduce Realism

Reducing realism in a design is a process of selective abstraction. You focus on the essential message and remove extraneous details that don’t contribute to the essential. The end result is an idealized version of the real thing.

Viewer’s fill in missing details from prior held information. They’ll fill in the details from the schemas and mental models they hold and use those details to help recognize what the idealized versions represent.

How might we remove details?

Remove Visual Noise

Reality isn’t perfect. I’m sure you’ve learned that by now. Our visual environment contains dirt and scratches, dust and smudges, and all sorts of imperfections. Removing these imperfections from an image leads to the perception that the image is less realistic.

Adding imperfect details adds realism, but also distracts from the message. When visual noise is present a person may focus on unintended patterns. Accidental patterns and inessential details make the essential and meaningful harder to find. By removing visual noise we increase the signal-to-noise ratio of our design.

A few things to avoid if you want to stay away from visual noise include:

high-contrast surface textures
gradated regions of color
illusions of depth
detailed or patterned backgrounds

We can minimize visual noise by reducing extreme variations in textures, by using flat and uniform areas of color, by using less shading, and reducing any interference from backgrounds.

Use Silhouettes for Quick Perception and Comprehension

A silhouette shows the form of an object through outline, shape, and a uniform color. There is no detail otherwise. The shape of the object is enough to recognize it. When the silhouette is a faithful representation of the object it leads to quick perception and comprehension.

Shape, gesture, and context allow you to create expressive silhouettes even with the lack of detail. It becomes the visual equivalent of a generalization and conveys the sense that all objects of a type are represented by the silhouette.

Because they have few features they can be hard to perceive at times. It’s possible the shape is difficult to distinguish from its background making it difficult to determine figure/ground relationships.

You can help in figure/ground recognition by keeping backgrounds simple and formless. Don’t allow negative space to encroach on the silhouette. You can also decrease the size of the silhouette as smaller objects are typically seen as figure.

Use Iconic Forms for Faster Communication

Iconic forms are more than shape and contour. They can use features such as lines and color to capture essential characteristics of objects and concepts. Icons are highly distilled and stylized representations of something.

The meaning of icons must often be learned or deduced and many are culturally dependent. Once learned, icons promote cognitive efficiency. They minimize visual processing and their meaning tends to be more memorable.

Context is a strong contributor to the meaning of icons. For example several concentric curved lines could represent a rainbow, wireless service, or an rss feed.

Some iconic forms resemble objects and have meaning. Others have an associative value and are considered symbols. Interaction Design Professor, Yvonne Rogers suggests a system for user interface design that categorizes icons by how they depict the concept they represent.

Resemblance icons — are direct likenesses of the objects they represent. (camera icon for a camera app)
Exemplar icons — depict a common example of the class of objects they represent. (trowel and rake to represent gardening)
Symbolic icons — convey a concept at a higher level of abstraction than the object depicted. (cracked wineglass to indicate something is fragile)
Arbitrary icons — have no relationship to an object or concept and their association must be learned. (computer on/off power button)

Icons quickly communicate and are easily remembered. They work well for things like maps and signs were quickness of understanding is important and for reference material where remembering is important.

Use Line Art to Evoke Closure

Our brains can quickly determine linear features in an image, design, or scene. When scanning an object most of our visual activity occurs at the edges or contours. This suggests an outline is enough to convey meaning.

We can reduce realism through line drawings that focus on an object’s outline. With just a few line strokes, a bit of tonal value, and depth cues, both shape and essential details can be communicated.

The gestalt principle closure tells us that when we look at an arrangement of individual elements we look for a single recognizable pattern made from all of them. We organize the individual lines into whole shapes.

Line art appears simple, but can communicate a great deal of information. Lines are good at depicting the human figure and work well for technical drawings or explanatory graphics. They provide the necessary details and omit everything else. Line drawings are effective as illustrations in documentation and textbooks. They work well in infographics and they work well in assembly instructions.

People can identify objects in line drawings as easily as they can identify the same objects in photographs, but the line drawing works better when it comes to making the information memorable.

Line drawings should focus on the essential and remove any visual noise. They should also capture contours and prominent features. Viewers will then add their own knowledge of real world objects to interpret what they see.

Reduce Quantity for Greater Visual Impact

As I’ve mentioned a few times,the real world contains a lot of complex visual information. Reducing the quantity of information in our designs reverses what we naturally see and reduces the perception of realism.

If we limit the number of images, lines, shapes, and other elements, we allow visitors to focus on the essential. By reducing how many elements are present we reduce what needs to be visual processed and keep working memory from being overwhelmed. This lowers cognitive load and means less information needs to be integrated and stored.

Limiting the number of elements present increases the visual impact of those that are present. Each stands out more giving it a greater ability to communicate than if it had to compete for attention.

Remove what can be removed. Ge rid of visual noise for quicker and clearer communication. Organize what needs to stay. Viewer’s will see fewer groups than they will elements, reducing the perceived quantity of objects.

Summary

There’s a lot of noise in our visual environment and it takes time and effort to process all that information. Some can get lost and viewers might spend too much time and effort processing mostly irrelevant information.

Designers can reduce cognitive load and aid comprehension by removing the less than relevant details. We can reduce the realism in our designs to help speed visual processing.

By reducing visual noise, making use of silhouettes, icons, and line art, and reducing the amount of elements in a design, we can save visitors time and effort as they take in our work. The result is a design that quickly and effectively communicates and is more easily understood by those who encounter it.

Next week we’ll continue with some talk about how we can make abstract information more concrete through diagrams and other graphics.

Download a free sample from my book Design Fundamentals.

The post Communicate Efficiently By Reducing Realism appeared first on Vanseo Design.