Catalog

Guideline Catalog

Browse visualization guideline records with sections, labels, and references.

781 records

Page 7 of 33

  1. Choose small multiples instead of animation for temporal trend analysis

    For trend analysis over ordered time, prefer a small multiples layout on multidimensional scatter views to improve fidelity and mitigate tracking and replay errors for analysts.

    • purpose:select
    • basis:empirical
    • task:trend
    • time:ordered-time
    • structure:small-multiples:use
    • +4

  2. Choose solid 3-D volume rendering instead of floating 3-D surface rendering

    For 3-D rendering of 2-D quantitative data, prefer volume-style 3-D rendering on line or bar charts to improve aesthetics and mitigate low-preference floating-surface forms for viewers judging chart appropriateness.

    • purpose:refine
    • basis:empirical
    • lever:encoding
    • communication:resonance
    • quality:aesthetics
    • +1

  3. Co-locate the point estimate with the uncertainty display

    For fast decisions in compact timeline views that show both a point prediction and predictive uncertainty, use a spatially co-located point estimate on the uncertainty display to improve fidelity and mitigate false precision for novice mobile users.

    • purpose:refine
    • basis:empirical
    • chart:timeline
    • operator:uncertainty
    • reading-mode:overview
    • +3

  4. Color annotations to match the data they describe

    For explaining map patterns that readers can explore in any order, use annotation colors that match the data colors on the map to improve readability and mitigate annotations overshadowing the data for readers scanning across the page.

    • purpose:refine
    • basis:heuristic
    • chart:map
    • quality:readability
    • lever:text-annotation
    • +3

  5. Color panels by their narrative role

    For relate tasks in multi-panel charts where measures push an outcome in opposite directions, use role-based color on the panels to improve readability and mitigate ambiguous panel roles for readers following a deliberate sequence.

    • purpose:refine
    • basis:heuristic
    • task:relate
    • structure:small-multiples
    • quality:readability
    • +3

  6. Color-code words by semantic group

    For time-constrained topic-understanding tasks, use semantic color coding on word-cloud text to improve insight and mitigate monochrome blending for viewers scanning grouped topics.

    • purpose:refine
    • basis:empirical
    • chart:word-cloud
    • data:text
    • quality:insight
    • +3

  7. Combine topical relevance with visual saliency in annotation selection

    For contextual explanation over ordered time, use combined annotation selection on stock line charts to improve insight and address the tradeoff between topical relevance and visually grounded callouts for readers using article-linked graphics.

    • purpose:refine
    • basis:empirical
    • time:ordered-time
    • chart:line
    • lever:text-annotation
    • +3

  8. Communicate chart interaction context with visible text and status messages

    For interactive filtering and monitoring, use visible relationship text and programmatic status messages on charts that change other page content or receive external parameters to improve accessibility and mitigate ambiguous state changes for screen-reader users.

    • purpose:refine
    • basis:accessibility
    • quality:accessibility
    • lever:interaction-access
    • communication:context
    • +1

  9. Compute aggregates at the task interval for average comparisons

    For average-comparison tasks over grouped time intervals, use discrete per-interval aggregate encoding on time-series charts to improve fidelity and mitigate errors caused by continuous aggregation for viewers comparing grouped results.

    • purpose:refine
    • basis:empirical
    • task:compare
    • scope:grouped-result
    • time:time-interval
    • +3

  10. Connect visual interfaces directly to analysis models

    For impact analysis of computational policy models, use interactive analysis controls on user-facing visual interfaces to improve insight and mitigate postprocessing-only review for analysts handling large automated outputs.

    • purpose:refine
    • basis:empirical
    • quality:insight:use
    • lever:interaction-access
    • communication:workflow
    • +1

  11. Constrain hue when optimizing a semantic categorical palette

    For repeated categorical encoding, use hue constraints on nominal color palettes in existing chart or map designs to improve readability and mitigate loss of semantic color associations for analysts and designers.

    • purpose:refine
    • basis:empirical
    • data:categorical
    • quality:readability:use
    • lever:encoding
    • +2

  12. Crop retargeted graphic designs around the highest-importance region

    For distributing a single-result graphic design to a new aspect ratio, use importance-based cropping on a single-view layout to improve fidelity and mitigate loss of titles and key visuals for designers adapting one design to many sizes.

    • purpose:refine
    • basis:empirical
    • task:distribute
    • scope:single-result
    • structure:single-view
    • +3

  13. Cue each shown object or action in the narration

    For ordered-time narrated visuals, use synchronized narration on dynamic displays to improve fidelity and mitigate missed objects or actions for viewers learning an unfamiliar process.

    • purpose:refine
    • basis:empirical
    • time:ordered-time
    • temporal-pattern:dynamic
    • quality:fidelity:use
    • +1

  14. De-emphasize related categories with a less saturated version of the same hue

    For charts that highlight one category against related background marks, prefer lower saturation within the same hue on the background marks to improve hierarchy and mitigate false category breaks for readers who should read those marks as one family.

    • purpose:refine
    • basis:heuristic
    • quality:fidelity
    • lever:encoding
    • polish:hierarchy
    • +3

  15. Define every metric, variable, calculation, and data source next to the chart

    For chart reading and interpretation, use nearby explanatory text on charts and data interfaces that introduce named or derived measures to improve accessibility and address misleading or undefined metrics, variables, calculations, and sources for readers who need definitions ready and convenient.

    • purpose:refine
    • basis:accessibility
    • quality:accessibility:use
    • lever:text-annotation
    • communication:context

  16. Define potentially overlapping variables explicitly

    For multi-variable narrative visualization, use text annotation on labels or legends to improve fidelity and mitigate ambiguous readings for readers comparing potentially overlapping groups.

    • purpose:refine
    • basis:empirical
    • quality:fidelity:use
    • lever:text-annotation
    • data:categorical
    • +2

  17. Define technical terms and thresholds on the display

    For communicating uncertainty on labels, legends, or captions, use operational definitions and familiar wording to improve fidelity and address term misinterpretation for readers outside the field.

    • purpose:refine
    • basis:empirical
    • quality:fidelity:use
    • lever:text-annotation
    • component:label:use
    • +3

  18. Define the core message before choosing chart, color, and text details

    For early-stage explanatory design, use a clear core message as the decision rule on charts still under development to improve readability and address retrofitted messaging for lay viewers.

    • purpose:refine
    • basis:rhetorical
    • quality:readability
    • lever:chart-family
    • communication:workflow
    • +1

  19. Demonstrate interactions before asking readers to explore

    For interactive narrative views, use interaction cues and tacit tutorials on controls to improve readability and address hidden functionality for novice readers.

    • purpose:refine
    • basis:empirical
    • lever:interaction-access
    • quality:readability:use
    • literacy:novice
    • +2

  20. Depict means with points instead of bars

    For reporting a mean in a single summarized quantitative result, avoid bar encoding on charts depicting averages to improve fidelity and mitigate within-the-bar misinterpretation for readers who may infer likely values from the display.

    • purpose:refine
    • basis:empirical
    • scope:single-result
    • chart:bar:avoid
    • data:quantitative
    • +2

  21. Describe the encoded measure directly in the color key

    For explanatory reading of a color-encoded chart, use direct measure labels in the color key to improve readability and mitigate extra abstraction for readers interpreting the scale.

    • purpose:refine
    • basis:heuristic
    • quality:readability
    • lever:text-annotation
    • component:legend:use

  22. Describe visually apparent relationships in text

    For interpretation of chart-level findings, use text annotation on charts with visually apparent trends, clusters, patterns, outliers, or significant statistical findings to improve accessibility and mitigate purely visual inference for screen-reader users.

    • purpose:refine
    • basis:accessibility
    • quality:accessibility
    • lever:text-annotation
    • component:annotation:use
    • +3

  23. Design the color key with endpoints and even intervals

    For ordered choropleth legends, use a color key with scale endpoints, evenly spaced intermediate values, and a center on diverging scales to improve readability and mitigate confusing legend decoding for readers interpreting map colors.

    • purpose:refine
    • basis:heuristic
    • chart:choropleth
    • component:legend:use
    • quality:readability
    • +2

  24. Differentiate similarly bright lines with dashes or line width

    For line charts with similarly bright series colors, prefer line-style variation on series marks to improve distinguishability and mitigate overlap confusion for readers with color-vision deficiency.

    • purpose:refine
    • basis:heuristic
    • chart:line
    • quality:accessibility
    • lever:encoding
    • +2