Data visualization

Problem Context

• The task involves quantitative, categorical, temporal, ordinal, or relational data where visual pattern recognition is useful.
• Users may need to compare categories, spot trends, inspect anomalies, understand distributions, see relationships, or communicate evidence.
• Visualizations can mislead when axes, units, baselines, aggregation, sampling, filters, color meaning, and missing data are hidden.
• Interactive charts may include tooltips, selection, legend filtering, brushing, zooming, drilldown, annotations, and data table exports.
• Charts need alternatives for keyboard users, screen-reader users, low-vision users, and users who need exact values.

Selection Rules

• Choose Data visualization when the user's primary task is seeing a pattern, relationship, trend, distribution, ranking, magnitude, or anomaly.
• Use table when exact values, row comparison, export, auditing, or editing records is primary.
• Use map view when geography, distance, route, or spatial density is the primary organizing axis.
• Use activity log when the question is what happened, when, by whom, and to what object.
• Use summary box or card-like metric when a single number is the main fact and visual pattern across data is secondary.
• Use dashboard layout when multiple coordinated visuals and controls need a page-level monitoring arrangement.
• Use chart drilldown when the user must move from aggregate marks to lower-level data while preserving analytic context.
• Match chart type to question: time trend, category comparison, relationship, distribution, composition, ranking, flow, or uncertainty.
• Disclose scale choices, aggregation, filters, data freshness, missing data, and uncertainty near the chart.
• Avoid Data visualization when the visual encoding is decorative, when data volume is too small to reveal a pattern, or when exact record work is the real task.

Required States

• Default chart with title, question, data scope, axes, units, legend, source or freshness note, visible filters, and data alternative.
• Selected mark, focused mark, tooltip open, tooltip dismissed, annotation visible, legend item highlighted, and table row synchronized states.
• Filtered, grouped, faceted, sorted, normalized, compared-to-target, and highlighted-series states.
• Loading, empty data, no matching data, missing values, partial data, stale data, sampled data, and permission-limited data states.
• Axis baseline visible, non-zero baseline disclosed, log scale disclosed, truncated scale disclosed, and percentage or index normalization disclosed states.
• Small-screen state where axes, labels, legend, selected point, and data alternative remain reachable.
• Keyboard navigation through chart controls, selected marks, legend filters, annotations, and table alternative.
• Export image, export data, copy insight, and share-link states when the chart is used for reporting.

Interaction Contract

• Each visible mark is derived from the current dataset, filter scope, aggregation, and scale; visual marks and table values must agree.
• Axes, ticks, labels, legends, and annotations explain the mapping between data fields and visual encodings.
• Tooltip and selected-point detail expose exact value, unit, series, category, time, aggregation, source scope, and missing-data status when relevant.
• Legend filtering, metric switching, normalization, brushing, zooming, and sorting update the marks, axes, annotations, summary, and table alternative together.
• Color is never the only way to communicate category, state, threshold, or anomaly.
• Non-zero baselines, log scales, normalized percentages, samples, excluded outliers, and stale data are disclosed before users interpret magnitude.
• Keyboard and assistive-technology users can move through data points or use a synchronized table/summary to get equivalent information.
• Chart exports preserve title, scope, source, filters, timestamp, axes, legends, and disclosure notes.

Implementation Checklist

• Define dataset schema: fields, types, units, category labels, time grain, aggregation, missing values, sample size, source, update timestamp, and permission scope.
• Define visual encoding: chart type, x field, y field, color field, size field, grouping, sort order, scale type, baseline, legend, annotations, and responsive behavior.
• Implement selected-point detail, tooltip, keyboard-accessible data table, legend highlighting, metric switch, normalization disclosure, filter scope, and export metadata.
• Model empty, no-match, loading, stale, partial, missing-value, inaccessible-color, truncated-scale, and narrow-viewport states.
• Test with long labels, negative values, zero values, outliers, missing months, dense points, small screens, high contrast mode, keyboard navigation, and screen-reader summaries.
• Keep chart, textual summary, tooltip, annotations, and data table generated from the same filtered dataset.
• Include chart source, last updated time, aggregation, filters, unit, and caveats close enough to the visual that they are not lost when shared.
• Use a proven charting or visualization library for production chart scales, axes, legends, responsive layout, and interaction semantics.

Common Generated-UI Mistakes

• Using decorative charts that do not answer a data question.
• Choosing a chart type that mismatches the data relationship.
• Hiding axes, units, baseline, scale type, or aggregation.
• Using color alone for category, status, threshold, or anomaly.
• Truncating an axis or using a log scale without disclosure.
• Providing exact values only in pointer hover tooltips.
• Letting legend, filters, annotations, and table values drift out of sync.
• Showing stale, sampled, missing, or normalized data without caveats.

Critique Questions

• What data question does this visualization answer better than a table, map, activity log, or summary metric?
• Can users identify the chart type, dataset scope, axes, units, scale, baseline, aggregation, filters, and source?
• Do color, size, position, shape, and order each map to a clear data field?
• Can users inspect exact values with keyboard and screen-reader paths, not only hover?
• What happens with outliers, missing data, stale data, no data, long labels, small screens, and high contrast mode?
• Would table, map view, activity log, summary box, dashboard layout, or chart drilldown better fit the task?