A Design Problem

I found the following graph on www.wiscosurvey.com, the website of a company that specializes in software used in the collection and analysis of surveys.

[Scroll down to see our solution to this graph's design problems.]
Design Example Problem

My Analysis

As you can see, some of the information is obscured in this image. This is partly due to what appears to be a "tooltip," a useful feature for interactive designs in which help information is displayed when the mouse icon hovers over an item. However, the tooltip is not the only thing that is hiding the data. The left wall of the plot area, by design, hides the true values of everything in the "Agree Strongly" column when the graph is viewed from this angle. 3-D effects such as these often obscure the data and add no value whatsoever.

In addition to the loss of data, the 3-D effect on the lines makes it very difficult to accurately decode the information that isn’t hidden. For example, look at the "Meaningful Input" line (pinkish-purple) in the "Disagree" column. What is its value? I can’t tell for certain—can you? Notice also that the color of each line appears differently based on the angle of the line—sometimes light and sometimes dark. To easily follow the flow of data from one end of the line to the other, the line should look the same from end to end.

The primary problem with this graph, however, is that it is an inappropriate type. A line graph should usually be reserved to encode a change in values over time. None of these values are changing over time. The values from one category to the next (for example, from "Agree Slightly" to "Neutral") are discrete, not intimately connected, so it makes no sense to connect them with a line. A bar graph better in this case because it encourages us to focus on the differences between individual values.

The graph’s legend is extremely unclear. Since every line represents people’s opinions (agreeing or disagreeing to various degrees), what is the difference between someone agreeing with "Goals" and someone agreeing with "Agree with Goals?" The "Understanding" and "Priorities are Understood" categories offer similar ambiguity. Anyone attempting to read this graph—including myself—is forced to make their own determinations regarding the true meanings of the categories on the legend, a problem that, at its best, causes unnecessary work, and at its worst, could lead to miscommunication and invalid conclusions.

A Solution

The biggest problem in redesigning this graph was trying to determine the values. The 3-D appearance of the original graph made sure of that. Additionally, the values of the points that have been hidden by the tooltip or grid wall had to be estimated: In other words, I guessed. Here is my redesign:

Design Example Solution

The legend includes more terms and colors than one should normally use. However, because of the gradient nature of the bar colorings (blues for positive responses, reds for negative responses, and gray for neutral responses), a quick glance at the legend is likely to be all that anyone ever needs. Color is used to logically show the strength of a respondent’s opinion, ranging from highly saturated bars for the strongest opinions to less saturated bars as opinions approach the neutral position.

Just as anyone attempting to interpret the original graph would be forced to do, I had to make assumptions regarding the actual questions that the labels such as "Goals" represented. Although goals were not explicitly mentioned in all of the original labels, the labels all seemed to be related to goals, which led me to assume that this was a survey of "Employee Responses Regarding Company Goals."

The original version of this graph required extensive study to make sense of anything. The work involved in comparing values and looking for patterns was enough to discourage the most exuberant decision-maker. Conversely, anyone wanting to view this improved graph would understand its purpose almost instantly and be able to settle in to explore and compare the values. As with any good data visualization, our designs should encourage exploration, not stifle it.