Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2
Poor Graphic
Drawbacks
The first step in the process of creating a better version of the provided graphic was the detailed analysis of the graphic and its drawbacks considering the discussed design principles.
Preattentive Processing
Through the very bad Data-Ink-Ratio and lot of Chart Junk the Preattentive Processing [Healey et al., 2005] is heavily affected:
- The embedded bodies/heads of doctors and other professionals distract the viewer's eyes from the main information. Thus it is hard for the first-time viewer to quickly understand the information content of the diagram.
- The descriptions of the both data samples (Office-based nonsalaried physicians versus Male professional technical and kindred workers) are not clearly placed in the graphics and cannot be preattentively associated to the data series.
- Especially the data series of the technical workers is not really presented by clear data bars because of the worker pictures on top using the same color as the bars (both black). Thus the different salary values can optically not clearely be differentiated against each other.
Lie Factor
.... textual description ....
- One of the biggest drawbacks the provided graphic incorporates is its high Lie Factor. As can be seen in the redesigned graphic using a linear time-scale the original graphic uses the Lie Factor to hide the fact that the distributions of the salaries are exponential not nearly linear as the viewer guesses by looking at the original graphic.
- By changing the time scale multiple times within the same diagram, the viewer is confused and is potentially not able to directly discover the lie.
Chart Junk
.... textual description ....
- The embedded stilistic pictures of doctors and other professionals are really unnecessary Chart Junk.
- The time scale is labeled with full year marks. This can be reduced to only using the last two digits as the first two ones don't change over the whole time-scale.
- The black background of the ... data series is making it more difficult for the viewer to recognize the presented information.
Data-Ink Ratio
.... textual description ....
- A lot of color is used just for separating the two data series from each other.
- As mentioned above, the stilistic pictures of doctors and other professionals add a high amount of ink to the diagram which do not contain much additional information.
Color Coding / Color
- The use of few colors for clearly separating the different data series within the same diagram makes sense. The provided graphic uses black and white for the two data series which results in a graphic with high contrast. The drawback of this approach is that the viewer is distracted from recognizing the main content information to the contrast spots which do not contain the real information.
Aesthetic-Usability Effect
...
- Bad aesthetic: graphic has a bad usability (difficult to read) because of chart-junk, lie-factors and no use of colors.
Improvements
- Used a linear time scale to show the exponential growth,
- Additional usage of a line chart to better visualize the higher growth of doctors salary,
- Removed the chart junk (pictures of doctors and other professionals, and 4-digit years) which results in a better data-ink-ratio,
- Grouped the legend into a single block,
- Added a y-axis scale on both sides, because of the high width of the new graphic,
- improved Aesthetic-Usability Effect due to usage of colors.
Redesigned Graphic
Resources
[Hoffmann et al., 1997] Roald Hoffmann, Vladimir I. Minkin, Barry K. Carpenter, Ockham's Razor and Chemistry, HYLE--International Journal for Philosophy of Chemistry, Vol. 3 (1997), Retrieved at: October 24, 2005, http://www.hyle.org/journal/issues/3/hoffman.htm
[Mark Boulton, March 06, 2005] Journal, Aesthetic-Usability Effect http://www.markboulton.co.uk/journal/comments/aesthetic_usability_effect/
[Pedroza, 2004] Carlos Pedroza, The Encyclopedia of Educational Technology, San Diego State University. Access Date: 21 October 2005, http://coe.sdsu.edu/eet/articles/visualperc1/start.htm
[Rosenholtz et al., 2005] Ruth Rosenholtz, Yuanzhen Li, Jonathan Mansfield, and Zhenlan Jin. Feature Congestion: A Measure of Display Clutter. http://web.mit.edu/rruth/www/Papers/RosenholtzEtAlCHI2005Clutter.pdf
[Truong, 2005] Donny Truong, “Universal Principles of design” Access Date: 21. Oktober 2005 http://www.visualgui.com/index.php?p=1
[Tufte, 1991] Edward Tufte, The Visual Display of Quantitative Information, Second Edition, Graphics Press, USA, 1991.