
Data Visualization Narrative Designer
Transform data into compelling visual stories with intelligent chart selection and narrative design
What You Can Do
This skill analyzes your raw data and automatically recommends the best chart types, generates design specifications, and creates data-driven narratives that tell the story behind your numbers. You'll get publication-ready visualization briefs with interactive code, accessibility-optimized design specs, and key insights extracted from your dataset—no design experience required.
Features
Claude analyzes data shape and dimensions to suggest optimal visualizations (bar, line, scatter, heatmap, etc.)
Color palettes, typography, layout, sizing, and responsive breakpoints tailored to your brand
Key patterns, outliers, and narratives Claude discovers directly from your dataset
Sequences related visualizations into cohesive data stories for presentations and reports
Export-ready D3.js, Vega-Lite, or Plotly specifications ready to embed in web apps
WCAG-compliant specs with alt text, color-blind safe palettes, and semantic structure
Headlines, captions, and commentary that guide viewers through your data story
Example Output
Input: CSV with monthly sales by region and product
Claude Output:
Chart 1: Sales Trend (Line Chart)
- X-axis: Month (Jan–Dec)
- Y-axis: Total Revenue (USD)
- Color: Brand gradient #06B6FF → #7C3AED
- Insight: "Revenue grew 34% YoY, with a dip in August due to seasonal factors."
- Code: Vega-Lite JSON specification
Chart 2: Regional Breakdown (Stacked Bar)
- Categories: East, West, Central regions
- Insight: "East region is our growth leader (42% of total), while Central underperforms (18%)."
- Interactive hover: Show dollar amounts and % of total
- Accessibility: High-contrast colors for colorblind viewers
Narrative Brief: "Your Q4 surge was driven by product launches in the West region. The Central market presents untapped opportunity—consider targeted campaigns."
Exports: D3.js source code, interactive HTML embed, static PNG options at 2x/3x resolution, Figma design file with components
What's Included
- SKILL.md: Core skill with analysis workflows, chart decision trees, and design templates
- Data analysis checklist: Step-by-step guide to prepare and validate your dataset
- Chart selection matrix: Quick reference for matching data types to visualization types
- Design specification template: Reusable format for colors, typography, and layout
- Code templates: Starter Vega-Lite, D3.js, and Plotly snippets
- Narrative prompts: Questions Claude uses to extract insights and craft captions
- Accessibility checklist: WCAG compliance verification for all outputs
- Example datasets: Sample CSV files and expected outputs for practice
Who It's For
- Data analysts and business intelligence professionals creating dashboards and reports
- Data journalists publishing data-driven stories and explainers
- Product managers and executives presenting metrics to stakeholders
- UX/UI designers building data visualization components for web and mobile apps
- Researchers and academics communicating findings through visual narratives
Best For
- Designing dashboards and data-driven reports from CSV or JSON data
- Creating multi-visualization stories and presentations with narrative flow
- Generating interactive web visualizations with auto-generated code
- Building accessible, brand-compliant data visualization systems
- Publishing data journalism pieces and explainer articles with supporting charts







