# Padhle — Launch Trailer Storyboard

> Premium startup commercial, **not** a software demo. Emotion over explanation.
> The goal: a CBSE student stops scrolling and thinks *"That looks sick. I need to try it."*
> Review gate: storyboard → scene stills → motion previews → final animation → sound → render.
> **Edit:** this storyboard supersedes the original 12-scene map; the emotional arc and the
> late-AI reveal are the new law. Audio is a second production pass — animate first.

## Narrative law

- **No AI mention before ~8–10s.** Lead with the problem and the outcome
  (*Understand faster. Study smarter.*), then reveal it's powered by AI.
- **The product is the hero.** Never show a full dashboard for more than 1s —
  Apple-iPhone detail shots: cursors, dropdowns, typing, badges, micro-hovers.
- **No real people, no stock footage.** Wireframe silhouettes, vector students,
  floating notebooks, books, pencils, school bags. Product stays the hero.
- **Strictly monochrome.** Black / white / light gray. The only hint of color is a
  tiny indicator on the currently selected subject (scene 9). No green accent.
- **Nothing static >1s.** Every shot has camera motion (push / pull / whip / drift).
- **Shot length 0.7–2s.** Constant rhythm alternation: close-up, wide UI, typography, UI detail.

## Emotion curve

```
😰 Stress  →  🤔 Curiosity  →  😲 "Whoa."  →  😊 Relief  →  🤯 Excitement  →  🚀 "I want this."
S1         S2               S3–S4           S5–S7          S8–S10          S11–S12
```

## Scene plan (built: ~39s @ 60fps, all seams hard cuts)

| # | Scene | File | Frames | Start (s) | Beats | Copy |
|---|-------|------|--------|-----------|---|------|
| 1 | **The Panic** | Panic.tsx | 180 | 0.0 | Heartbeat, paper storm (equations/diagrams/formulas/EXAM), camera shake, word slams | `EXAMS.` → `Too many chapters.` → `Too little time.` |
| 2 | **The Pause** | ThePause.tsx | 132 | 3.0 | White flash, silent lockup, tiny rotation, ambient particles | `meet` `Padhle.` `CBSE · Grades 6–12` |
| 3 | **The Promise** | ThePromise.tsx | 180 | 5.2 | Typography, three entries (pop / slide / rise), previous recedes to gray | `Understand faster.` `Study smarter.` `Stress less.` |
| 4 | **The AI Reveal** | AiReveal.tsx | 168 | 8.2 | Hard cut to black, spotlight pool, typewriter, terminal caret | `Your AI tutor.` `Built for CBSE.` `Grounded in your textbook.` |
| 5 | **Choosing Context** | ChoosingContext.tsx | 240 | 11.0 | Top bar drops, selector unfolds, cursor clicks ×3 (ripple + black pill + push) | `Grade 10` → `Science` → `Ch 2 · Photosynthesis` |
| 6 | **Asking** | Asking.tsx | 150 | 15.0 | Question types with caret, send button grows + glows, click | `Explain photosynthesis in simple words` |
| 7 | **The Answer** | Answer.tsx | 210 | 17.5 | Answer builds line-by-line, keyword highlight, diagram slides in, source badge | `Photosynthesis is how plants make…` `Source · Ch 2 · Photosynthesis` |
| 8 | **More Than a Chatbot** | More.tsx | 270 | 21.0 | Five cards, each enters differently (slide / rotate / scale / drop / slide-r), down arrows | `Learn` `Practice` `Quiz` `Revise` `Summarize` |
| 9 | **Subjects** | Subjects.tsx | 192 | 25.5 | Carousel of the 6 real subjects, hero card + tiny dot indicator + progress strip | `Mathematics` `Science` `History` `Language Arts` `English` `Geography` |
| 10 | **Relief** | Relief.tsx | 240 | 28.7 | Wireframe student, floating notes/pencil/bag, promise words return | `Understand faster.` `Study smarter.` `Stress less.` |
| 11 | **CTA** | Cta.tsx | 210 | 32.7 | Logo grows, text, start button fades with tiny bounce, arrow slides | `Your textbooks.` `Finally make sense.` `Start Learning →` |
| 12 | **End Card** | EndCard.tsx | 168 | 36.2 | Minimal lockup, gentle fade | `Padhle` `AI Tutor for CBSE Students` `Grades 6–12` |

Seams: 0.2s fades between scenes (whip/slide presentations can replace later).

## Scene 1 — The Panic (detailed beats)

```
0.00–0.35s  Black screen, heartbeat: two quick white thumps (ring + screen pulse).
0.20–1.10s  Paper storm: notebook cards fly at camera (math, biology, chemistry,
            exam dates, homework). Deterministic camera shake, accelerating scale,
            motion blur as cards pass the lens. Storm clears before the first slam.
1.20s       `EXAMS.` slams (176px, Montserrat 900) → cut flash at 1.6s (0.4s up).
1.73s       `Too many chapters.` slams (0.5s up) → cut flash at 2.23s.
2.37s       `Too little time.` slams (0.5s up).
2.87–2.97s  Freeze — everything drains to black.
2.97–3.00s  White exit flash → fades into Scene 2's silence.
```

Each slam is cut cleanly (fades out as the cut-flash masks it) — no ghost text
behind the next beat. Only fast, blurred, dimmed shrapnel streaks fly during the
words, so the slams always read on near-black.

Typography: white on black, slammed in with back-overshoot (HIT easing), slight
rotation drift, letter-spacing snap. Camera shake is deterministic (sum of sines)
so renders are repeatable.

## Review flow — DONE (all 12 scenes built and rendered)

1. ✅ Storyboard (this file)
2. ✅ Scene 1 — Panic → stills + `out/s1-panic.mp4`
3. ✅ Scene 2 — ThePause → stills + `out/s2-pause.mp4`
4. ✅ Scene 3 — ThePromise → stills + `out/s3-promise.mp4` (recede-to-gray verified)
5. ✅ Scene 4 — AiReveal → stills + `out/s4-ai.mp4` (typewriter + spotlight)
6. ✅ Scenes 5–12 — each in `src/scenes/`, preview at `out/s-<Scene>.mp4`
7. ✅ Master — `out/padhle-trailer.mp4` (39.0s @ 60fps, 1080×1920)
8. ⏸ **Next** — review the trailer; audio/sound design is the second production pass
   (currently silent — every scene was animated with motion-first in mind).