SKILL.md
Animated Infographic
Build a designed infographic — icons, a few key numbers, short text, and simple shapes arranged with real visual hierarchy — then animate it in sequence so each element earns its moment. The craft is composition first, choreography second: a static layout that reads on its own, revealed in a staggered cascade that guides the eye exactly where you want it.
When to use
- Mixed-layout explainers: "X in 3 steps", "how it works", "by the numbers", a stat-card grid.
- Sequenced reveal of icon + stat + label + connector as a single designed scene.
- Pictogram/icon animation, count-up key numbers, flow connectors between steps.
This skill owns the composed infographic. For a chart that is the content (bar chart race, animated line/area, a graph driven by a CSV), use chart-animation — and compose its chart as one block inside an infographic here rather than rebuilding it.
The one rule: design the static frame first
A great animated infographic is a great static infographic that happens to move. Lay out and balance the full composition — every icon, number, and label in its final position — before adding a single keyframe. Animation then only controls when each already-placed element appears; it never decides layout. This prevents the most common failure: elements that fly to positions that were never designed, so the final held frame looks accidental.
Scope tightly: one central insight, 3–5 supporting data points, in 30–90s. More than five competing elements and the cascade reads as chaos.