data-visualization

# Data Visualization A chart is **read by people and executed by you**. This skill turns "make it look good" into a procedure with checks, so the result is right by construction rather than by taste. **The method here is design-system-agnostic.** Nothing in the procedure, the form heuristic, the six checks, or the mark specs is specific to one product. A design system supplies a small set of *parameters* (its ramps, a categorical order, a diverging pair, a status palette, a texture, its surfaces, its filter components); the method consumes them unchanged. A **validated default palette** is the reference instance, fully specified in `references/palette.md`. To target your brand, read that file's structure and substitute its values — touch nothing else. > The single most important habit: **the color part is computable, so compute it.** > Never eyeball whether a palette is colorblind-safe — run `scripts/validate_palette.js`. ## The procedure — do these in order Color comes LAST. Most bad charts pick colors first. 1. **Pick the form.** What is the data's job — magnitude, identity, polarity, a single headline, change-over-time? The job picks the chart type, and sometimes the answer is *not a chart* (a stat tile or hero number). → `references/choosing-a-form.md` 2. **Assign color by the job it does.** Categorical (identity), sequential (magnitude), diverging (polarity), or status (state) — each has one rule. Assign categorical hues in fixed order, never cycled. → ...