Visualization Director
The department head for data communication within the data-science domain. Routes visualization questions to the right specialist, defines the learning order, and resolves conflicts between analytical clarity, rendering scale, and narrative pull.
The organizing principle for the whole subdomain is inherited from chart-selection: a visualization begins with a message, not a chart type, a library, or a framework. Every child skill assumes the message is already articulated; if it is not, start there.
Routing Table
When a visualization question arrives, classify it and route accordingly:
| Question Pattern |
Route To |
Why |
| "Which chart for this message?", chart-type choice, redesign a misleading chart |
chart-selection |
Chart-type selection + design principles |
| Accessibility of a chart, colorblind-safe palette, WCAG compliance |
chart-selection |
Owns the accessibility checklist + Wong palette |
| Anti-patterns (truncated axis, dual-axis, 3D, rainbow maps) |
chart-selection |
Owns the honesty rules |
| "Build a dashboard", real-time / streaming views, embedded analytics |
interactive-dashboards |
Live, multi-view, in-product delivery |
| "This is slow / crashes", millions of points, WebGL/WebGPU, Canvas vs SVG |
interactive-dashboards |
Rendering-by-data-volume decision |
| Library / framework choice (ECharts, Recharts, Visx, deck.gl, Vega-Lite, Plotly) |
interactive-dashboards |
Owns the 2026 library landscape |
| "Tell a story with this data", scrollytelling, a report or presentation narrative |
data-storytelling |
Narrative structure + annotation-as-message |
| Sequencing charts into an argument, guided reveal, one-message-per-slide |
data-storytelling |
Ordering and pacing of a data narrative |
| "Make this chart", generic |
chart-selection first |
Message + chart type before anything else |
Multi-Skill Questions
Some questions need more than one skill. Load them in this order:
chart-selection — settle the message and the per-chart form first.interactive-dashboards — choose renderer, framework, and interaction model for delivery.data-storytelling — sequence and annotate the charts into a narrative.
This order is intentional: a fast, scalable dashboard of the wrong chart is still wrong, and a beautiful narrative built on a misleading chart amplifies the error. Correct form precedes delivery precedes narrative.
Example multi-skill question: "Build an interactive dashboard that walks execs through why revenue dropped."
chart-selection → pick the diagnostic charts (waterfall for the bridge, small multiples by segment) and annotate the drivers.interactive-dashboards → Recharts/ECharts by data volume, linked filters, progressive disclosure (overview → drill-down).data-storytelling → order the views as a narrative, one message per view, with a guided-reveal path for the presentation.
Curriculum Order
For learning or progressive loading:
- Chart Selection (foundation) — how to translate a message into an honest, accessible chart. Prerequisite to everything else: you cannot scale or narrate a chart that does not communicate.
- Interactive Dashboards (application) — how to deliver charts at scale and interactively, choosing the renderer by data volume and the framework by fit.
- Data Storytelling (synthesis) — how to sequence charts into an argument that holds attention and lands a decision.
Level Progression
- Foundational: Chart Selection
- Intermediate: Interactive Dashboards
- Advanced: Data Storytelling
- Not yet built: geospatial visualization, animation/transitions as explanation, notebook-native EDA visualization
Conflict Resolution
When child skills give contradictory guidance:
| Conflict |
Resolution |
Reason |
interactive-dashboards wants WebGL for scale, but chart-selection needs the chart screen-reader accessible |
Keep SVG/Canvas with a downsample or aggregation; add an alternative data-table view if forced to WebGL |
Accessibility is a floor, not a trade; aggregate before you abandon it |
data-storytelling wants a dramatic reveal that relies on a truncated axis |
Narrative loses; re-stage the reveal with annotation on a zero-baseline chart |
An honest chart that surprises beats a misleading one that dazzles |
interactive-dashboards favors a dense multi-series view, chart-selection flags overload (>5 series) |
Highlight-one-gray-the-rest, or small multiples, inside the dashboard |
Density is not the same as legibility |
chart-selection picks a static form, but the data streams in real time |
Escalate to interactive-dashboards for the live variant of the same chart family |
The message stays; the delivery changes |
General rule: Message > honesty > accessibility > scale > interactivity > polish. When in doubt, protect the reader's correct understanding before the engineering.
Scope Boundaries
This director handles: all data-communication questions — chart-type choice, design and accessibility, dashboard construction, rendering at scale, library/framework selection, and data storytelling.
Escalate to the orchestrator when:
- The underlying numbers need statistical validation before they are shown (Statistical Analysis)
- The data must be cleaned or reshaped before it can be plotted (Data Wrangling)
- A model's outputs are being visualized and need evaluation context (Modeling)
- The visualization exposes fairness or representational-bias concerns (Frontier — responsible-ai)
- The question spans multiple subdomains and needs orchestrator-level coordination
For the subdomain map, the 2026 library landscape at a glance, and the rendering-by-volume cheat sheet, see references/quick-reference.md.
1---2name: visualization3description: Direct the visualization subdomain — route a data-communication need to the right specialist: single-chart messaging, at-scale or interactive dashboards, or narrative data storytelling. Use when the user needs to choose a chart, build a dashboard, render large data, or tell a story with data. Resolves conflicts between clarity, scale, and narrative.4---56# Visualization Director78The department head for data communication within the data-science domain. Routes visualization questions to the right specialist, defines the learning order, and resolves conflicts between analytical clarity, rendering scale, and narrative pull.910The organizing principle for the whole subdomain is inherited from `chart-selection`: **a visualization begins with a message, not a chart type, a library, or a framework.** Every child skill assumes the message is already articulated; if it is not, start there.1112## Routing Table1314When a visualization question arrives, classify it and route accordingly:1516| Question Pattern | Route To | Why |17|-----------------|----------|-----|18| "Which chart for this message?", chart-type choice, redesign a misleading chart | `chart-selection` | Chart-type selection + design principles |19| Accessibility of a chart, colorblind-safe palette, WCAG compliance | `chart-selection` | Owns the accessibility checklist + Wong palette |20| Anti-patterns (truncated axis, dual-axis, 3D, rainbow maps) | `chart-selection` | Owns the honesty rules |21| "Build a dashboard", real-time / streaming views, embedded analytics | `interactive-dashboards` | Live, multi-view, in-product delivery |22| "This is slow / crashes", millions of points, WebGL/WebGPU, Canvas vs SVG | `interactive-dashboards` | Rendering-by-data-volume decision |23| Library / framework choice (ECharts, Recharts, Visx, deck.gl, Vega-Lite, Plotly) | `interactive-dashboards` | Owns the 2026 library landscape |24| "Tell a story with this data", scrollytelling, a report or presentation narrative | `data-storytelling` | Narrative structure + annotation-as-message |25| Sequencing charts into an argument, guided reveal, one-message-per-slide | `data-storytelling` | Ordering and pacing of a data narrative |26| "Make this chart", generic | `chart-selection` first | Message + chart type before anything else |2728### Multi-Skill Questions2930Some questions need more than one skill. Load them in this order:31321. `chart-selection` — settle the message and the per-chart form first.332. `interactive-dashboards` — choose renderer, framework, and interaction model for delivery.343. `data-storytelling` — sequence and annotate the charts into a narrative.3536This order is intentional: a fast, scalable dashboard of the *wrong* chart is still wrong, and a beautiful narrative built on a misleading chart amplifies the error. Correct form precedes delivery precedes narrative.3738**Example multi-skill question**: "Build an interactive dashboard that walks execs through why revenue dropped."391. `chart-selection` → pick the diagnostic charts (waterfall for the bridge, small multiples by segment) and annotate the drivers.402. `interactive-dashboards` → Recharts/ECharts by data volume, linked filters, progressive disclosure (overview → drill-down).413. `data-storytelling` → order the views as a narrative, one message per view, with a guided-reveal path for the presentation.4243## Curriculum Order4445For learning or progressive loading:46471. **Chart Selection** (foundation) — how to translate a message into an honest, accessible chart. Prerequisite to everything else: you cannot scale or narrate a chart that does not communicate.482. **Interactive Dashboards** (application) — how to deliver charts at scale and interactively, choosing the renderer by data volume and the framework by fit.493. **Data Storytelling** (synthesis) — how to sequence charts into an argument that holds attention and lands a decision.5051### Level Progression52- **Foundational**: Chart Selection53- **Intermediate**: Interactive Dashboards54- **Advanced**: Data Storytelling55- **Not yet built**: geospatial visualization, animation/transitions as explanation, notebook-native EDA visualization5657## Conflict Resolution5859When child skills give contradictory guidance:6061| Conflict | Resolution | Reason |62|----------|-----------|--------|63| `interactive-dashboards` wants WebGL for scale, but `chart-selection` needs the chart screen-reader accessible | Keep SVG/Canvas with a downsample or aggregation; add an alternative data-table view if forced to WebGL | Accessibility is a floor, not a trade; aggregate before you abandon it |64| `data-storytelling` wants a dramatic reveal that relies on a truncated axis | Narrative loses; re-stage the reveal with annotation on a zero-baseline chart | An honest chart that surprises beats a misleading one that dazzles |65| `interactive-dashboards` favors a dense multi-series view, `chart-selection` flags overload (>5 series) | Highlight-one-gray-the-rest, or small multiples, inside the dashboard | Density is not the same as legibility |66| `chart-selection` picks a static form, but the data streams in real time | Escalate to `interactive-dashboards` for the live variant of the same chart family | The message stays; the delivery changes |6768**General rule**: Message > honesty > accessibility > scale > interactivity > polish. When in doubt, protect the reader's correct understanding before the engineering.6970## Scope Boundaries7172**This director handles**: all data-communication questions — chart-type choice, design and accessibility, dashboard construction, rendering at scale, library/framework selection, and data storytelling.7374**Escalate to the orchestrator when**:75- The underlying numbers need statistical validation before they are shown (Statistical Analysis)76- The data must be cleaned or reshaped before it can be plotted (Data Wrangling)77- A model's outputs are being visualized and need evaluation context (Modeling)78- The visualization exposes fairness or representational-bias concerns (Frontier — responsible-ai)79- The question spans multiple subdomains and needs orchestrator-level coordination8081For the subdomain map, the 2026 library landscape at a glance, and the rendering-by-volume cheat sheet, see `references/quick-reference.md`.
npbuilds