Masking by Patterns

Use the category links below to navigate this web site. All site pages can also be accessed with the site map.

Design Process

Color Graphics Topics

Color Tool

Color Guidelines

Aerospace

Color Science

Utilities

Site Map

MASKING BY PATTERNS

On This Page: • Examples of Pattern Masking • Research on Masking • Reducing Masking

Surrounding patterns can reduce the legibility of symbols and text. There are several different perceptual phenomena that involve interference among adjacent pattern elements. Some have been referred to collectively as pattern "masking." For designers of graphics the message is that one must be very cautious in use of patterned background fields and wary of closely spaced symbols.

Examples of Pattern Masking

	Patterned backgrounds . Background patterns (hatching, textures) with high luminance contrast can interfere with the legibility of symbols. All of these backgrounds reduce legibility relative to the isolated text (center panel, top figure).
	Text Problems . Problems internal to text and symbols can reduce legibility. In the top panel of this figure two overlapping text labels interfere with each other, making both less legible than the unencumbered text in the middle panel. The text in the bottom panel is too tightly packed horizontally. Less extreme reduced spacing can also hinder legibility.

Research on Masking

Most recent research on interference among patterns has been based on analyses of the patterns in the spatial and temporal frequency domains. As in other research on spatial vision the stimulus patterns have often been periodic patterns or visual noise. The phenomena studied have mostly involved detection of a low-contrast target signal (a particular component of the pattern) in the presence of a higher contrast masking pattern. In very simple terms, the general conclusion has been that thresholds for detecting the signal are elevated by masking patterns that have spatial frequencies and orientation and temporal characteristics similar to the signal. While some of the interference likely due to interaction of local features of the signal and masking pattern, at least part of the masking is thought to involve more global processes.

In design of graphic displays we are less concerned with detection of the presence of a pattern and more concerned with discrimination of suprathreshold symbols. This task involves legibility of differences of local features of the symbols. For these purposes the most direct level of explanation is in terms of interaction of the local features of the masking and symbol patterns. Some of these local effects can be easily seen in magnified images of the above examples:

Close up looks at text with dotted and linear backgrounds. The close up shows how the background combines with the text elements to create new patterns.

The dot elements of the background textures combine with the strokes of the text to form new elemental patterns. In the worst cases (upper left, lower right) the elements of the texture pattern are about the same size as strokes in the individual letters. Even the sparser patterns interfere.

In the "Text Problems" figure above, the same local shape distortion is at work in the top panel. In the bottom panel a second problem, known in reading research as "crowding," also occurs. Letters that are close but not touching are harder to read than properly spaced text.

Reducing Masking

Both research and practical experience indicate that legibility problems due to masking can be reduced by several means. Lowering the luminance contrast of the background texture can help. However, the reduction must be substantial and some patterns still interfere--in this map of Death Valley compare the legibility of "Stove" to that of "pipe" in "Historic Stovepipe Well" and "Interp" to "tive" in "Salt Creek Interpretive Trail."

Larger fonts on finer textures are more legible, but this has obvious costs in terms of the information densities that can be achieved. In dynamic displays such as moving maps in which the symbols move over the background patterns in unpredictable ways, the font restrictions may impose unacceptable constraints on the overall design. In these cases it may be best to avoid use of textured backgrounds altogether.

A park map that displays text over a variety of background types including dotter patterns, color variation, andlinear elements. See the adjoining text for more details.

Larger Image

overlapping text elements can be differentiated with the use of different colors. Here red overlapping text allows black text to stand out and be read.

Text with lower lumincance contrast linear pattern backgrounds can provide better readability.

Lower luminance dotted backgrounds do not interfere with black textual elements as much as higher luminance dotted backgrounds.

A closeup of of lower luminance dotted and linear backgrounds against black text. the lower luminance elelments do not create or interfere with the textual patterns.

In this revised figure increasing the luminance difference between the texture pixels and symbol pixels restores the contours that define the symbols' distinctive features. Even at this reduced contrast the lower right pattern interferes somewhat with legibility of the symbols.

Higher luminance linear background overcome by removal of the background around the text.

The local effects of the background texture can be reduced or eliminated by removing the texture locally.
More on background infills Last Resorts: Outlining / Infills.

Removal of the high luminance contrast dotted background around text can allow for better readability.