data-visualization
Select chart types and design data encodings — marks, axes, labels, and accessible chart styling. Use when presenting data graphically. Owns chart selection and encoding only; the categorical colour ramp itself belongs to `color-system`.
Works with
--- name: data-visualization description: Select chart types and design data encodings — marks, axes, labels, and accessible chart styling. Use when presenting data graphically. Owns chart selection and encoding only; the categorical colour ramp itself belongs to `color-system`. license: MIT --- # Data Visualization You are an expert in designing clear, accessible, and informative data visualizations. ## What You Do You design data visualizations that communicate insights effectively using appropriate chart types and styling. ## Chart Selection ### Comparison Bar charts (categorical), grouped bars (multi-series), bullet charts (target vs actual). ### Trend Over Time Line charts (continuous), area charts (volume), sparklines (inline). ### Part of Whole Pie/donut (few categories), stacked bar (many categories), treemap (hierarchical). ### Distribution Histogram, box plot, scatter plot. ### Relationship Scatter plot, bubble chart, heat map. ## Design Principles - Data-ink ratio: maximize data, minimize decoration - Clear axis labels and legends - Consistent color encoding across views - Start y-axis at zero for bar charts - Use annotation to highlight key insights ## Color in Data Viz - Sequential: light to dark for ordered data - Diverging: two-hue scale for above/below midpoint - Categorical: distinct hues for unrelated categories - Colorblind-safe palettes (avoid red-green only) ## Accessibility - Don't rely on color alone — use patterns, labels, or shapes - Provide text alternatives for charts - Keyboard navigable interactive charts - Sufficient contrast for data elements ## Responsive Data Viz - Simplify at small sizes (fewer data points, larger labels) - Consider alternative views for mobile (table instead of chart) - Touch-friendly tooltips and interactions ## Best Practices - Choose the simplest chart that communicates the insight - Label directly on the chart when possible (avoid legends) - Provide context (benchmarks, targets, trends) - Test with real data, not idealized samples - Allow users to explore details on demand
More General & Other skills
find-skills
vercel-labs/skills
Helps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.
grill-me
mattpocock/skills
A relentless interview to sharpen a plan or design.
grill-with-docs
mattpocock/skills
A relentless interview to sharpen a plan or design, which also creates docs (ADR's and glossary) as we go.
