How to make a dashboard with Claude, plus a 3D data film prompt

Transform my data into a polished 3D data film designed to hold attention and land one clear insight.

Use the data I’ve attached or pasted with this message. If there’s no data, ask me for it and stop. Otherwise, don’t ask questions. Make the calls yourself and tell me what you chose.

Defaults (change one only if I’ve said otherwise in this message):
- Format: 16:9. If I mention a reel, TikTok, Shorts or vertical, use 9:16.
- Length: about 45 seconds. If I ask for something short, make an 8-second cut (hook plus end card).
- Colours: chosen to fit the topic. If I name brand colours or a brand, use those.
- Audience: a general audience who has never seen this data.

STEP 1: FIND THE STORY
- Work out what the data is about and who would care. Clean it up and calculate everything in code. Never estimate or round in your head.
- Choose 3–4 headline metrics and the 2–3 most surprising facts: a peak, a collapse, a turnaround, an outlier, or a big gap between groups.
- The film should be built around ONE main insight. Write it as a single sentence before you design anything.
- Every number shown must match the data exactly. Never invent data. If something is missing, leave it out.

STEP 2: INVENT A WORLD (this is the wow)
- Don’t make a 3D chart. Turn the data into a physical world that belongs to its topic, where each record becomes an object you can see.
- Choose the metaphor from the shape of the data:
    - Over time: things grow, fill, or pile up (rising water, a forest growing, a city lighting up)
    - Stages or a funnel: objects flow through and drop out (marbles through gates, light through filters)
    - Places: real or stylised terrain with activity rising out of it
    - Categories: groups that physically sort, stack, or orbit
    - People or events: small figures or objects doing the actual activity
- Examples of the kind of thinking wanted: a coffee shop’s sales as cups stacking into towers for each hour of the day; podcast downloads as sound waves rippling across a globe; a library’s checkouts as books flying off shelves; solar output as panels tilting and glowing as the sun moves.
- Scale wow: if there are thousands of records, show every one of them (use instancing) and pull the camera back so the viewer feels the size. If there are only a few, make each one a large, detailed hero object.
- Before building, tell me the concept in two lines, then build it.

STEP 3: STORY STRUCTURE
- 0–3s: the hook. The most impressive motion happens immediately (a cascade, an assembly, a burst). Assume the viewer gives you 2 seconds.
- Build: the data plays out. Speed through the dull stretches and slow down at the important moment.
- Reveal: slow-motion or a short pause right before the key insight, then a particle burst, flash of light, or camera push.
- End: a wide pull-back showing the whole finished world, then an end card with the insight sentence and the main number.
- 2–4 captions in total. Each is one short plain sentence with one highlighted number.

STEP 4: DESIGN RULES
- Hierarchy: one focal point at a time. Anything that isn’t the subject is dimmer, smaller, or blurred by depth fog.
- Colour: a dark, rich background (not pure black), one dominant colour, and one accent used only for the insight. Colours stay fixed, with no cycling or rainbow gradients. Never rely on red and green alone to carry meaning; also use brightness or shape.
- Type: one clean sans-serif. Big numbers use tabular digits. At most 3 type sizes. Text must be readable on a phone.
- Layout: keep text inside safe margins (about 5% on each side; for 9:16, away from the top and bottom 12%). Nothing overlaps or falls off-screen.
- HUD: the headline metrics are visible the whole time, count up in sync with the action, and land exactly on the true totals.
- A bottom label or badge whose style suits the topic.
- Motion: ease everything (no linear moves), stagger groups, add a little overshoot when things land. The camera moves slowly and steadily with no sudden cuts.
- Light: soft key light plus rim light, gentle shadows or ambient occlusion, and additive glow sprites on the focal objects.
- Restraint: no legends, watermarks, “sample data” notes, or explanation paragraphs on screen.

STEP 5: BUILD
- One self-contained HTML file (publish it as an artifact if you can). Three.js r128 from cdnjs. Everything else inline.
- Deterministic timeline: the whole scene is a pure function render(t), with seeded randomness, so scrubbing to any moment always looks the same.
- Player bar that fades out when idle: play/pause, scrubber, restart, fullscreen. It autoplays and loops.
- Keep it smooth: instanced meshes or point shaders for large counts, no garbage created per frame, and above about 20,000 records draw a representative sample while the HUD shows true totals.
- Respect prefers-reduced-motion by offering a calmer camera.

STEP 6: QA BEFORE SHOWING ME
- If you can run a headless browser, render about 8 frames across the timeline and look at them. Otherwise, walk through the timeline in code and check each moment.
- Fix clipped or overlapping text, hidden focal objects, empty or boring frames, unreadable labels, and counters that don’t end on the real totals.
- Then show me the film and two lines: the concept and the insight.