Visual Storytelling (Bundle)
This is the entry point for the Visual Storytelling pipeline. It installs 7
component plugins and an orchestrator agent.
Pipeline
Brief -> Ingest -> Clean -> Select -> Deliver
- Brief (
storytelling-requirements): Structured intake producing audience,
Big Idea, questions with communication goals, data sources, delivery target.
- Ingest (
datasource-connectors): Load from CSV, JSON, API, SQL, Excel,
Parquet with error handling and encoding detection.
- Clean (
data-preparation): Profile, clean, aggregate, pivot, quality-check.
- Select (
visual-vocabulary): Map each question's communication goal to
the right chart type using the visual vocabulary catalog.
- Deliver: Render to the chosen format:
delivery-ascii-dashboard -- terminal/plain text (78-char aligned)
delivery-svg-markdown -- GitHub-compatible static SVG (D3.js patterns)
delivery-html-dashboard -- interactive HTML (Apache ECharts v6)
Orchestrator Agent
The visual-storytelling agent runs the full pipeline. Invoke it with a data
source, a rough request, and a delivery target. It produces a structured brief,
delegates to each pipeline step, and runs a CSAR QA loop on the output.
Component Skills
Each component has its own detailed SKILL.md. This bundle skill is a routing
layer; the real specs live in the components:
| Component |
SKILL Path |
storytelling-requirements |
skills/storytelling-requirements/SKILL.md |
datasource-connectors |
skills/datasource-connectors/SKILL.md |
data-preparation |
skills/data-preparation/SKILL.md |
visual-vocabulary |
skills/visual-vocabulary/SKILL.md |
delivery-ascii-dashboard |
skills/delivery-ascii-dashboard/SKILL.md |
delivery-svg-markdown |
skills/delivery-svg-markdown/SKILL.md |
delivery-html-dashboard |
skills/delivery-html-dashboard/SKILL.md |
When to Use Which Delivery
| Need |
Format |
Why |
| GitHub README |
SVG |
No JS execution on GitHub |
| Terminal output |
ASCII |
Universal, no rendering needed |
| Interactive exploration |
HTML |
Tooltips, zoom, legend toggle |
| Static docs / reports |
SVG |
Crisp at any scale, inline in Markdown |
| Presentations |
HTML |
Open in browser, full-screen |
| Offline / no CDN |
SVG or ASCII |
No external dependencies |
1---2name: visual-storytelling3description: Bundle plugin: installs the complete Visual Storytelling pipeline (brief, ingest, clean, select, deliver). See component SKILLs for detailed specs.4---56# Visual Storytelling (Bundle)78This is the entry point for the Visual Storytelling pipeline. It installs 79component plugins and an orchestrator agent.1011## Pipeline1213```text14Brief -> Ingest -> Clean -> Select -> Deliver15```16171. **Brief** (`storytelling-requirements`): Structured intake producing audience,18 Big Idea, questions with communication goals, data sources, delivery target.192. **Ingest** (`datasource-connectors`): Load from CSV, JSON, API, SQL, Excel,20 Parquet with error handling and encoding detection.213. **Clean** (`data-preparation`): Profile, clean, aggregate, pivot, quality-check.224. **Select** (`visual-vocabulary`): Map each question's communication goal to23 the right chart type using the visual vocabulary catalog.245. **Deliver**: Render to the chosen format:25 - `delivery-ascii-dashboard` -- terminal/plain text (78-char aligned)26 - `delivery-svg-markdown` -- GitHub-compatible static SVG (D3.js patterns)27 - `delivery-html-dashboard` -- interactive HTML (Apache ECharts v6)2829## Orchestrator Agent3031The `visual-storytelling` agent runs the full pipeline. Invoke it with a data32source, a rough request, and a delivery target. It produces a structured brief,33delegates to each pipeline step, and runs a CSAR QA loop on the output.3435## Component Skills3637Each component has its own detailed SKILL.md. This bundle skill is a routing38layer; the real specs live in the components:3940| Component | SKILL Path |41| --- | --- |42| `storytelling-requirements` | `skills/storytelling-requirements/SKILL.md` |43| `datasource-connectors` | `skills/datasource-connectors/SKILL.md` |44| `data-preparation` | `skills/data-preparation/SKILL.md` |45| `visual-vocabulary` | `skills/visual-vocabulary/SKILL.md` |46| `delivery-ascii-dashboard` | `skills/delivery-ascii-dashboard/SKILL.md` |47| `delivery-svg-markdown` | `skills/delivery-svg-markdown/SKILL.md` |48| `delivery-html-dashboard` | `skills/delivery-html-dashboard/SKILL.md` |4950## When to Use Which Delivery5152| Need | Format | Why |53| --- | --- | --- |54| GitHub README | SVG | No JS execution on GitHub |55| Terminal output | ASCII | Universal, no rendering needed |56| Interactive exploration | HTML | Tooltips, zoom, legend toggle |57| Static docs / reports | SVG | Crisp at any scale, inline in Markdown |58| Presentations | HTML | Open in browser, full-screen |59| Offline / no CDN | SVG or ASCII | No external dependencies |