183 lines
8.4 KiB
Markdown
183 lines
8.4 KiB
Markdown
# CHECK – Ensure visual integrity
|
||
|
||
CHECK covers all aspects of ensuring visual integrity in reports and presentations.
|
||
|
||
_Ensuring visual integrity_ means that reports and presentations present
|
||
information in the most truthful and the most easily understood way by avoiding
|
||
misleading visuals.
|
||
|
||
This chapter covers avoiding manipulated axes and visualization elements, using the
|
||
same scales, and showing data adjustments.
|
||
|
||
1. [Avoid manipulated axes](#ch-1-avoid-manipulated-axes)
|
||
2. [Avoid manipulated visualization elements](#ch-2-avoid-manipulated-visualization-elements)
|
||
3. [Avoid misleading representations](#ch-3-avoid-misleading-representations)
|
||
4. [Use the same scales](#ch-4-use-the-same-scales)
|
||
5. [Show data adjustments](#ch-5-show-data-adjustments)
|
||
|
||
## CH 1 Avoid manipulated axes
|
||
|
||
Charts serve as a means to visually compare numerical values. Manipulated axes
|
||
defeat this purpose of explaining actual interrelations.
|
||
|
||
## CH 1.1 Avoid truncated axes
|
||
|
||
![Figure CH 1.1: Avoid truncated axes](img/ch-1.1.png)
|
||
|
||
Charts with value axes not starting at zero (“cut” axes) are not “wrong”
|
||
in and of themselves, but the message to be visually conveyed then does
|
||
not correspond to the numerical values upon which the chart is based.
|
||
Therefore, value axes should generally start at zero, see Figure CH 1.1.
|
||
|
||
One exception to this rule exists: charts with indexed data (e.g. if the value for the index period is set to 100%) with only small variances from 100%. Here “zooming in” on the variances could be of greater value than indicating the absolute values (starting at zero). In this case, position the category labels at the 100% line in order to avoid misinterpretations.
|
||
|
||
## CH 1.2 Avoid logarithmic axes
|
||
|
||
![Figure CH 1.2: Avoid logarithmic axes](img/ch-1.2.png)
|
||
|
||
_Avoid logarithmic scales_ because they do not allow the visual
|
||
comparison of values, see Figure CH 1.2. In business, very few
|
||
applications for logarithmic axes exist (e.g. comparing growth rates of
|
||
different stocks in percent).
|
||
|
||
## CH 1.3 Avoid different class sizes
|
||
|
||
![Figure CH 1.3: Avoid different class sizes](img/ch-1.3.png)
|
||
|
||
If the categories represent ordered classes of elements (e.g. age
|
||
classes) as used for the visualization of distributions in histograms,
|
||
use class sizes of identical width (e.g. ten years). Otherwise, true
|
||
visual comparability is impossible, see Figure CH 1.3.
|
||
|
||
## CH 2 Avoid manipulated visualization elements
|
||
|
||
Displaying values differing by orders of magnitude can be challenging. Use
|
||
creative solutions instead of clipping visualization elements or cutting value
|
||
axes.
|
||
|
||
## CH 2.1 Avoid clipped visualization elements
|
||
|
||
![Figure CH 2.1: Avoid clipped visualization elements](img/ch-2.1.png)
|
||
|
||
Similar to “cut” axes, clipped visualization elements such as broken
|
||
columns make visual comparisons impossible, see Figure CH 2.1.
|
||
|
||
## CH 2.2 Use creative solutions for challenging scaling issues
|
||
|
||
![Figure CH 2.2: Use creative solutions for challenging scaling issues](img/ch-2.2.png)
|
||
|
||
Creative visualization elements can be used to compare extreme values,
|
||
e.g., displaying data in two-dimensional or even three-dimensional
|
||
visualization elements allows the comparison of values differing by
|
||
orders of magnitude, see Figure CH 2.2.
|
||
|
||
This rule must be clearly separated from the rules of section CH 3 “[Avoid misleading representations](07-check.md#ch-3-avoid-misleading-representations)” where area and volume visualizations are used improperly.
|
||
|
||
## CH 3 Avoid misleading representations
|
||
|
||
Graphical representations are misleading if the visual impression for the
|
||
observer differs from the underlying values.
|
||
|
||
## CH 3.1 Use correct area comparisons, prefer linear ones
|
||
|
||
![Figure CH 3.1: Use correct area comparisons, prefer linear ones](img/ch-3.1.png)
|
||
|
||
Using two-dimensional representations (areas of circles, icons, or
|
||
emblems) for the visualization of data is only valid, if the size of
|
||
these areas corresponds to the underlying values. The visual perception
|
||
will be misleading if the diameters of circles or the heights of icons
|
||
represent the values, see Figure CH 3.1.
|
||
|
||
## CH 3.2 Use correct volume comparisons, prefer linear ones
|
||
|
||
![Figure CH 3.2: Use correct volume comparisons, prefer linear ones](img/ch-3.2.png)
|
||
|
||
Similar to areas, the visual perception will be misleading, if the
|
||
(one-dimensional) diameters or the (two-dimensional) areas of
|
||
three-dimensional visualization elements (spheres, cubes, etc.)
|
||
represent the values, see Figure CH 3.2. Even if their volumes represent
|
||
the values, it is hard to perceive them properly. Prefer linear
|
||
comparisons instead.
|
||
|
||
## CH 3.3 Avoid misleading colored areas in maps
|
||
|
||
![Figure CH 3.3: Avoid misleading colored areas in maps](img/ch-3.3.png)
|
||
|
||
Different colored areas can be helpful to visualize the precipitation per
|
||
square meter or the population density. However, do not use colored
|
||
areas for the visualization of non-area-related figures such as market
|
||
shares or return on sales. Position columns or bars of identical scale
|
||
in maps instead. By the way, pie charts also work well here (an
|
||
exception to the EX 2.1 “[Replace pie…”](04-express.md#ex-21-replace-pie-and-ring-charts) because they can be placed precisely at one point, like a
|
||
city (see Figure CH 3.3).
|
||
|
||
## CH 4 Use the same scales
|
||
|
||
Proper visual comparison requires the usage of identical scales for identical
|
||
measure units, or – if this is not possible – a clear indication of the
|
||
difference. If possible, use a consistent scaling concept for the complete
|
||
report or presentation material.
|
||
|
||
## CH 4.1 Use identical scale for the same unit
|
||
|
||
![Figure CH 4.1: Use identical scale for the same unit](img/ch-4.1.png)
|
||
|
||
If presenting more than one chart of the same unit on one page, use the
|
||
identical scale for these charts, see Figure CH 4.1. In extreme
|
||
situations identical scales might not be desirable. In these exceptional
|
||
cases the use of scaling indicators (see [CH 4.3](07-check.md#ch-43-use-scaling-indicators-if-necessary)
|
||
and [UN 5.2](09-unify.md#un-52-unify-scaling-indicators)) can be helpful.
|
||
|
||
## CH 4.2 Size charts to given data
|
||
|
||
![Figure CH 4.2: Size charts to given data](img/ch-4.2.png)
|
||
|
||
Using identical scales in multiple charts can be demanding if the values
|
||
in the charts differ by orders of magnitude. A good solution is adapting
|
||
the chart size to the given data, see Figure CH 4.2.
|
||
|
||
## CH 4.3 Use scaling indicators if necessary
|
||
|
||
![Figure CH 4.3: Use scaling indicators if necessary](img/ch-4.3.png)
|
||
|
||
There are several ways to overcome challenging scaling problems. _Scaling indicators_, such as *scaling lines* and *scaling areas* indicating the same numerical height (typically a power of 10) in all charts are helpful to assist in comparing multiple charts (of the same unit) with different scales, see Figure CH 4.3.
|
||
|
||
This guide suggests a _semantic design_ for scaling lines and scaling areas, see UN 5.2 “[Unify scaling indicators](09-unify.md#un-52-unify-scaling-indicators)”.
|
||
|
||
## CH 4.4 Use outlier indicators if necessary
|
||
|
||
![Figure CH 4.4: Use outlier indicators if necessary](img/ch-4.4.png)
|
||
|
||
Certain values that are very big in comparison to other values are called
|
||
outliers. If an outlier is not important for business, e.g. a big
|
||
relative variance of a small value, then it is not appropriate to scale
|
||
the whole chart to this outlier. Therefore, use _outlier
|
||
indicators_ for unimportant outliers, see Figure CH 4.4.
|
||
|
||
This guide suggests a _semantic design_ for outlier indicators, see UN 5.3 “[Unify outlier indicators](09-unify.md#un-53-unify-outlier-indicators)”.
|
||
|
||
## CH 4.5 Use magnifying glasses
|
||
|
||
Another way to assist in scaling problems is to use “_magnifying glasses_” for zooming in on a part of a chart with a bigger scale. Use an appropriate visualization element to mark the part of a chart to be zoomed in and to link it to a second chart displaying the zoomed part on a bigger scale.
|
||
|
||
## CH 5 Show data adjustments
|
||
|
||
For longer time series, currency and inflationary effects can bias the visual
|
||
impression, hiding the real development of business.
|
||
|
||
## CH 5.1 Show the impact of inflation
|
||
|
||
![Figure CH 5.1: Show the impact of inflation](img/ch-5.1.png)
|
||
|
||
Making inflation effects transparent helps avoid misinterpretations of
|
||
time series visualizations, see Figure CH 5.1.
|
||
|
||
## CH 5.2 Show the currency impact
|
||
|
||
![Figure CH 5.2: Show the currency impact](img/ch-5.2.png)
|
||
|
||
Similar to inflation effects, the adjustment of currency effects can help
|
||
to avoid misinterpretations, see Figure CH 5.2.
|
||
|
||
[← Increase information density](06-condense.md) | [Apply semantic notation →](09-unify.md)
|