Principles of Good Interface and Screen Design 265

Step 3: Principles of Good Interface and Screen Design 265

Restrict information-carrying dimensions. Restrict the number of information-

carrying dimensions depicted to the number of data dimensions being illus- trated. Displaying one-dimensional data in a multidimensional format is percep- tually ambiguous. With multidimensional data, changes in the physical area of the surface of the graphic do not produce an appropriate proportional change in the perceived area. Examples of multidimensional formats used to display one- dimensional data would be different-sized human bodies to indicate populations or different-sized automobiles to indicate the number of cars. Often the impres- sion on the viewer is that the change is actually much greater than it really is. This problem can be avoided if the number of information-carrying dimensions on the graphic is restricted to the number of data dimensions being illustrated.

Employ data in multiple ways. Whenever possible, employ data in multiple ways.

Parts of a graph can be designed to serve more than one purpose. A piece of data may at the same time convey information and also perform a design function usually left to a nondata element. Some examples are

A grid to aid readability of a bar chart, instead of being inscribed on the graphic background, may be positioned within the bars themselves, as illus- trated in Figure 3.74.

■■ The size of what is being measured can be conveyed through the size of the graphical element, the intensity through color or level of shading.

Graphics can be designed to have multiple viewing depths. The top level pro- vides an overall view, each succeeding level an ever-increasing closer view. They may be also designed to have different viewing angles or lines of sight.

The danger in employing data in multiple ways is that it can generate a graphical puzzle. A sign of a puzzle is that the graphic, instead of being inter- preted visually, must be interpreted verbally. Symptoms of a puzzle are frequent references to a legend to interpret what is presented and extensive memorization of design rules before one can comprehend what is presented. By contrast, a well- designed multiple-function graphic permits a quick and implicit transition of the visual to the verbal.

Figure 3.74: A piece of data (line in the bars) performing a nondata function.

266 Part 2: The User Interface Design Process

Maximize data density. In graphics, more is better than less—the greater amount of information displayed, the larger the number of visual comparisons that can be made, improving comprehension. This is true because the eye can detect large amounts of information in a small space. Simple things belong in a table or in the text.

Data density of a graphic can be maximized in two ways: enlarging the data matrix or shrinking the graphic. Enlarging the data matrix involves displaying as much information as possible. If the graphic becomes overcrowded, techniques such as averaging, clustering, smoothing, or providing summaries can reduce the number of elements to be displayed. Shrinking the graphic means reducing it in size, but screen resolution may impose limitations on how much shrinking can be performed.

If visual differentiation in the types of data being displayed is necessary, use simple coding methods in the areas being depicted. Elaborate schemes or pat- terns can be eye-straining and can actually impede the flow of information from the graphic to the viewer. Some possible coding alternatives include

Varying shades or densities.

Labeling with words.

Varying colors. Avoid unnecessary embellishment. All pieces of a graphic must tell the viewer something new. An unnecessary embellishment is “chartjunk.” It does not add

anything new to the graphic’s meaning. It is decoration or noise that hinders assimilation of the message being communicated. Nondata elements and redun- dant data are forms of chartjunk. Three other kinds are vibration, heavy grids, and ornamentation.

A grid carries no information, contributes noise, and focuses attention away from the data. An excessively heavy grid can even mask the data. Grids should

be suppressed or eliminated so they do not compete with the data. When a grid serves as an aid in reading or extrapolating, it should, of course, be included. Its tendency to overwhelm can be reduced by constructing it with delicate lines or muted colors and placing it behind the data.