To Skip Navigation Press Enter.Link to the Color Usage Site Home Page
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 Guidelines Aerospace
Color Science Utilities Site Map
Link back to the CURL Home Page

On This Page:   • The Graphics Problem   • Optimizing Data Density in Graphics  • A Last Word About Cost

This page discusses design of applications in which large quantities of data need to be displayed simultaneously. This part of the design process concerns analysis of data needs.

Early in the graphic design process, the team of domain and human factors experts that is designing the application needs to come up with a plan for good utilization of the users' cognitive resources. This needs to be considered at the same time as other aspects of data planning, prior to any design of the actual graphics.

The Graphics Problem Back to the top of the page.

The graphics problem under consideration here is sometimes referred to as clutter: So much data needs to be simultaneously displayed that the user can't easily locate and read the information needed for decision making.

High luminance contrast is essential for high legibility , but guidelines requiring that all text and symbols have maximum luminance contrast restrict the designers options for good attention management. 

Section of an air traffic control display, showing aircraft symbols, and airspace features (ranges, navigation fixes, etc.). All of the symbols are black against the white background, producing a cluttered display.

Example: In this ATC display the data are too dense for the graphic design. Urgent information is intermixed with context information with equal graphic emphasis.

The Options

One can reduce cognitive demands of the high data density by visually de-emphasizing some of the data, increasing the display size, or removing some of the data.

Optimizing Data Density Back to the top of the page.

First, considerable effort should be put into maximizing the usable data density by de-emphasizing the less urgent data. From a human factors viewpoint, it is preferable to the other two methods. The process involves two steps:

1) Prioritizing the data classes into an importance/urgency hierarchy and
2) Using graphic techniques to give the urgency layers the appropriate perceptual prominence.

In this approach less urgent data are not moved or deleted but visually de-emphasized so they can continue to provide context for the more urgent data, which can then stand out and capture the users' attention.

Designing with urgency layers. First, the design team prioritizes the data types of the initial inventory according to their need for immediate consideration by the operator (urgency or threat-level). This urgency hierarchy takes into account such factors as magnitude of the hazard, the time required to develop a solution, and priorities set by the organization. Dynamic data elements may move up and down through the hierarchy as their urgency and importance changes. The domain experts on the design team provide the detailed knowledge of procedures; the human factors experts provide knowledge of potential human performance problems and good design practice.

Section of an air traffic control display, showing aircraft symbols, and airspace features (ranges, navigation fixes, etc.). Less urgent symbols have reduced luminance contrast. More urgent have higher luminance contrast attracting the users' attention.
Larger Image New Window.
A simplified hierarchy for the air traffic control display at left is shown below. In a complete hierarchy each of the levels may have subtypes that merit distinct graphic treatment. Another ATC design is described in Reynolds (1992, 1994).

Sample ATC Data Hierarchy
1. Urgent aircraft (approaching hazard, declared emergency)
2. Hazard area variables (weather, terrain)
3. Focal aircraft ("own" aircraft)
4. Context aircraft (not hazard for "own" aircraft)
5. Context lines, symbols (boundaries, airways, navaids)
6. Context area variables (own vs. other sectors)

After the urgency hierarchy has been constructed the designers can proceed to design graphics that establish the corresponding perceptual hierarchy. Several graphics techniques are available.
More about Creating Perceptual Layers .

Less Desirable Methods Back to the top of the page.

The above process has the advantage of simultaneously displaying all of the data, but under some circumstances the data densities may remain unusably high. At that point one can further reduce the data density by either increasing the display size or removing some of the data. Both have usability costs.

Removing data. Only as a last resort should part of the data be removed. They can be permanently removed, but they were presumably included in the initial inventory for a reason. Alternatively they can be moved to a separate display or separate data page of the same display.

If a spatially separate display is available some of the data can be relocated, but the user must then mentally integrate two sets of data that map to the same space and time in the world. This increases cognitive workload, may lack precision, and introduces opportunities for error.

If some of the data are moved to a separate graphics page for successive viewing on the same display there are further cognitive workload and safety costs. The user has to maintain a monitoring strategy and manipulate the display controls.

Increase the graphic scale. The scale of the graphic can be increased to spread the data over a larger area. In most cases there is a fixed window size for the graphic, so increasing the scale means showing only part of the original graphic at a time. The user must move the window over the desired portion of the original. This navigation can range from effortless to impossible, depending on the users' tasks and viewing conditions, the available interaction equipment, and the quality of the interface design. This approach also forces the user to maintain a monitoring strategy and manipulate the display controls.

A Last Word About Cost Back to the top of the page.

In complex applications the data inventory and urgency hierarchy construction can be expensive in time and money, requiring sophisticated domain and human factors expertise. However, the resulting data hierarchy can provide a rational basis for the graphics and interaction designs, both in the initial design phase and in revisions after usability testing. Fixing usability problems that are only discovered late in the development process is usually more expensive.

Related Topics:
go to this page
Designing a Graphics Page (Checklist)
go to this page Creating Perceptual Layers

About This Site

| Design Process | Color Graphics Topics | Color Tool | Guidelines | Aerospace | Color Science | Utilities

  Site Curator: Richard Mogford | Responsible NASA Official: Richard Mogford | Privacy Statement

NASA Logo     Ames Research Center Logo     Human Systems Integration Division Logo