# Ludo slides guide

> How to build 16:9 decks in Ludo style: a pt type ramp sized for real rooms, chart colour order from the token ramp, safe margins, and dark versus light slide rules.

Source of truth: `apps/ui/tokens/ludo.tokens.json` v0.1.0. Served from https://ui.ludo.computer/guides/slides.md. Generated 2026-07-26. Self-contained: every value is inline, no images required.

Ludo decks get shown on 75 in boardroom panels, washed-out meeting-room projectors and compressed video calls. Design for the worst of the three at once.

## Use these tokens

```text
Canvas                 16:9. PowerPoint / Keynote canvas 960 x 540 pt (13.33 x 7.5 in), or 1920 x 1080 px.
Typeface               Geist (sans), Geist Mono (figures)
Font weights           400 body, 500 headings, 600 emphasis. Cap is 600. Never lighter than 400 on projection.

Light slide surface    #FFFFFF or #FAFAFA background, #09090B text, #3F3F46 secondary text
Dark slide surface     #09090B background, #FAFAFA text, #A1A1AA secondary text
Brand purple           #825FFF   large type and shapes only (4.17:1 on white, fails 4.5:1 body-text AA)
Purple on dark         #A589FF   readable purple for dark slides (7.22:1 on #09090B)
Purple, readable       #7351EF   small accents on light slides (5.06:1 on white)
Accent yellow          #FFD059   highest-energy highlight (13.66:1 against #09090B)
Accent green           #67E8AA   (12.98:1 against #09090B)
Secondary pink         #F76CAF   decorative only on light slides (2.72:1 on white)

Chart categorical order  1 #825FFF  2 #FFD059  3 #F76CAF  4 #67E8AA  5 #C8B6FF
                         6 #3FB6C4  7 #5B6CFF  8 #FF8A5B  9 #B45FD4  10 #A8D86A
Chart sequential ramp    #EDE7FF -> #C8B6FF -> #A589FF -> #825FFF -> #5A3FD0 (ordered data only)

Transitions            200 to 300 ms, cubic-bezier(0.4, 0, 0.2, 1). 500 ms absolute maximum.
```

## Layout

- Safe margin: keep all content inside a 5% border on every edge (48 pt on a 960 x 540 canvas, 64 px at 1920 x 1080). TVs used as meeting displays still overscan, and heads block the bottom edge in real rooms. Basis: SMPTE ST 2046-1 (93% action safe, 90% title safe).
- One message per slide. Maximum 5 to 6 text lines, roughly 30 to 40 words.
- Tables: 4 columns by 6 rows maximum, minimum 20 pt cell text. Anything denser moves to the leave-behind PDF.
- Footer: slide number bottom-right at 14 to 18 pt, #3F3F46 on light slides. Optional "Ludo Leisure Suite" bottom-left. Keep the footer inside the safe margin.
- Sizing basis (ANSI/AVIXA V202.01 DISCAS): character height >= farthest viewer distance / 150. On a 75 in panel (image height 934 mm, so 1 canvas pt renders at about 1.73 mm), 24 pt type serves viewers to about 4.5 m and 32 pt to about 6 m. The legacy shorthand: farthest viewer no more than 6x image height for presentation content.

## Type

| Role | Size | Weight | Notes |
|---|---|---|---|
| Section divider | 54 pt | 500 | One line, one thought |
| Slide title | 40 pt | 500 | Sentence case, real claim, not a label |
| Body | 28 to 32 pt | 400 | 32 pt if the room runs past 4.5 m |
| Absolute body floor | 24 pt | 400 | Nothing the audience must read goes smaller |
| Kicker / label | 20 pt | 600 | Short, for chart titles and tags |
| Data labels | 20 pt | 500 | On-chart values |
| Source footnote | 18 pt | 400 | The only text allowed under 24 pt |

- Never set 16 px web body copy on a slide. It converts to roughly 12 pt on the canvas and is illegible past 2 m.
- Geist 400 is the lightest weight that survives projection. Headings 500, emphasis 600, nothing heavier.

## Colour

- Design to 7:1 contrast or better (ISO 9241-303 preferred level). A projector quoted at 3000:1 delivers roughly 10:1 to 30:1 effective contrast in a 300 to 500 lux meeting room.
- Zinc-on-zinc hierarchy dies on projectors. Keep at least 3 ramp steps between text and background: #3F3F46 on #FAFAFA works (10.01:1), #71717A on #F4F4F5 does not survive ambient light.
- #825FFF measures 4.17:1 on white: fine for 40 pt titles and shapes, fails for body-size text. Use #7351EF (5.06:1) for small purple accents on light slides.
- Cheap DLP projectors shift #825FFF toward blue and desaturate it. Never encode meaning in purple versus pink alone; the pair converges under projection. Always pair colour with a direct label.
- Chart series take the categorical order 1 to 10 exactly as listed above, starting at #825FFF. Use the sequential purple ramp only for ordered magnitude data (heatmaps, ranked bins), never for categories.
- Semantic status on slides: success text #047857, warning text #B45309, error text #B91C1C on light backgrounds. The raw semantic fills (#10B981, #F59E0B) fail as text on white (2.54:1 and 2.15:1); use them as shapes with dark labels.

### Dark versus light slides

- Light slides (white or #FAFAFA background) for bright rooms, projectors and daytime boardrooms. Ambient light lifts dark backgrounds to muddy grey and crushes their contrast.
- Dark slides (#09090B background) for dim rooms, screen-shared calls and product-heavy decks where UI screenshots sit on dark chrome.
- Dark slide palette: text #FAFAFA (19.90:1), secondary text #A1A1AA (7.76:1), purple #A589FF (7.22:1), highlight #FFD059 (13.66:1), pink #F76CAF (7.31:1, usable on dark).
- Pick one mode per deck. Alternating light and dark slides reads as a projector fault.

## Interaction

- Transitions: 200 to 300 ms with cubic-bezier(0.4, 0, 0.2, 1), 500 ms maximum. Prefer a plain cut or fade.
- No continuous or looping animation. It steals attention at 6 m and remote viewers on compressed video drop the frames anyway.
- Never let motion carry meaning. Every build state must also read as a static slide, because PDFs, printouts and screenshots strip the animation.
- Reveal builds sparingly: one build chain per slide at most, using the 50 ms stagger token rhythm if elements enter in sequence.

## Do / Don't

- Do hold a 24 pt floor and set body at 28 to 32 pt. Don't reuse 16 px web styles, which land near 12 pt.
- Do keep everything inside the 5% safe margin. Don't run text or logos to the slide edge.
- Do put one message on each slide with at most 6 lines. Don't paste paragraphs from the proposal.
- Do use the chart ramp in order from #825FFF and label series directly. Don't invent new chart colours or rely on a legend across the room.
- Do use #A589FF for purple text on dark slides and #7351EF for small purple text on light slides. Don't set body-size #825FFF on white (4.17:1 fails AA).
- Do pick light slides for bright rooms and dark slides for dim rooms, one mode per deck. Don't mix modes.
- Do cite only approved proof points: 900K+ attendance at the Sydney Royal Easter Show, 500+ devices, 3 million transactions, 99.9% operational uptime, 400,000+ map sessions, 89% self-service (Ekka 2025). Don't put any other Ludo metric on a slide.
- Do write titles as claims in sentence case, Australian English. Don't use em dashes or the word "guest" (say "visitor").

## Checklist before shipping

- [ ] 16:9 canvas, all content inside the 5% safe margin
- [ ] No text under 24 pt except 18 pt source footnotes
- [ ] Body 28 to 32 pt, titles 40 pt at weight 500, nothing heavier than 600
- [ ] Contrast 7:1 or better between text and background on every slide
- [ ] Charts use the categorical order starting #825FFF, or the sequential purple ramp for ordered data, with direct labels
- [ ] No meaning carried by colour alone or by animation
- [ ] One mode (light or dark) across the whole deck
- [ ] Every metric traces to the approved proof-point list
- [ ] Deck still reads correctly exported as a static PDF
- [ ] No em dashes; Australian English; "visitor" never "guest"