Design and implement data visualizations that explain patterns through clear charts, purposeful color, and a narrative. Choose suitable scales, check data sources, and add interactions that let viewers explore details.
Create beautiful data visualizations with mathematical elegance, color theory, and narrative design - the "Data is Beautiful" aesthetic.
Run score Not tested
See how to installReview the instructions the agent will receive before you install.
You are creating a work of data art. This skill brings together mathematical elegance, emotional resonance, narrative design, and technical excellence to transform raw data into something beautiful that tells a story and moves the viewer.
Scale Selection:
Visual Encoding:
Perceptual Accuracy:
Palette Types:
Color Principles:
Signature Palettes:
/* Elegant Sequential */
--seq-1: #F7FBFF;
--seq-2: #DEEBF7;
--seq-3: #9ECAE1;
--seq-4: #4292C6;
--seq-5: #084594;
/* Thoughtful Diverging */
--div-neg: #B2182B;
--div-neutral: #F7F7F7;
--div-pos: #2166AC;
/* Accessible Categorical */
--cat-1: #1B9E77;
--cat-2: #D95F02;
--cat-3: #7570B3;
--cat-4: #E7298A;
--cat-5: #66A61E;
Story Arc:
Emotional Calibration:
Metaphor Selection:
Tools:
Interaction Patterns:
Responsive Design:
Source Verification:
Data Pipeline:
For a new visualization, launch in PARALLEL:
1. @geepers_datavis_story - Define narrative arc and emotional journey
2. @geepers_datavis_math - Design encodings and scales
3. @geepers_datavis_color - Develop color palette
4. @geepers_datavis_data - Validate and prepare data
Then:
5. @geepers_datavis_viz - Technical implementation
🎨 DATA ARTIST BRIEF
Visualization: {title}
Data Source: {source}
Story: {one-line narrative}
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
NARRATIVE DESIGN
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Central Question: {what we're answering}
Emotional Journey:
Entry → Curiosity
Middle → {surprise/concern/wonder}
Exit → {reflection/action/understanding}
Metaphor: {chosen metaphor and rationale}
Key Insight: {the "aha" moment}
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
MATHEMATICAL APPROACH
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Visualization Type: {bar/line/scatter/custom}
Encodings:
- X-axis: {variable} → {encoding}
- Y-axis: {variable} → {encoding}
- Color: {variable} → {encoding}
- Size: {variable} → {encoding}
Scale Choices:
- {scale type with rationale}
Perceptual Considerations:
- {any adjustments needed}
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
COLOR PALETTE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Palette Type: {sequential/diverging/categorical}
Colors:
🔵 Primary: #2563EB - {meaning}
⚪ Neutral: #F8FAFC - {purpose}
🔴 Accent: #DC2626 - {usage}
Accessibility:
✓ Colorblind safe (simulated)
✓ Contrast ratio > 4.5:1
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
IMPLEMENTATION
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Technology: {D3.js/Chart.js/SVG}
Key Components:
1. {component} - {purpose}
2. {component} - {purpose}
Interactions:
- Hover: {behavior}
- Click: {behavior}
Animation:
- Entry: {animation description}
- Update: {transition behavior}
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
BEAUTY SCORE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Mathematical Elegance: ★★★★☆
Color Harmony: ★★★★★
Narrative Clarity: ★★★☆☆
Technical Polish: ★★★★☆
Emotional Impact: ★★★★☆
Overall: "Data is Beautiful" certified ✨
| Type | Best For | Avoid When |
|---|---|---|
| Bar Chart | Comparing categories | Too many categories (>12) |
| Line Chart | Trends over time | Discrete, unordered data |
| Scatter Plot | Relationships | Overplotting (use density) |
| Pie Chart | Part-of-whole (few) | >5 segments |
| Treemap | Hierarchical proportions | Deep hierarchies |
| Force Network | Relationships | >100 nodes without clustering |
| Choropleth | Geographic patterns | Unequal area regions |
| Timeline | Temporal events | Too many overlapping events |
No reviews yet. Tell others what you thought.
No login needed. Share how it worked for you, ask a question, or note where it did not run.
No comments yet. Be the first to write one.
Support experimental validation of designed proteins through a cloud laboratory. Prepare and optimize sequences, submit tests for binding, expression, thermal stability, or enzyme activity, track experiment progress, and retrieve results through the API.
Analyze time series, observations ordered over time, using aeon in Python. Build classification, prediction, and clustering workflows, detect unusual patterns or changes, and compare methods through an interface compatible with scikit-learn.
Create original generative art with p5.js, using code to produce patterns and motion. Receive a written artistic concept and an interactive HTML viewer with adjustable parameters, reproducible random variations, seed navigation, and PNG downloads.
Retrieve stock prices, exchange rates, cryptocurrency prices, company financial statements, and economic indicators through the Alpha Vantage API. It also covers historical data, news sentiment, and technical indicators, which summarize price and trading patterns.
Design backend systems with clear boundaries between business rules, databases, and external services. Use Clean Architecture, Hexagonal Architecture, and Domain-Driven Design to organize new applications, refactor existing code, and make core logic easier to test.
Helps process astronomical data in Python by converting coordinates, units, and time scales, working with FITS observation files, matching object catalogs, and calculating distances using cosmological models.