docs/social-video-guide.md

# Codingo — LUNA Explainer Video: Production Guide

A complete, do-it-yourself plan for a short social-media video that shows off Codingo for your
final-year project. Your AI recruiter **LUNA** narrates and explains the recruitment pipeline, with
screen recordings of the (now polished) real app.

> You generate the actual video — this guide gives you the script, storyboard, exact tools, and
> settings. Nothing here needs code.

---

## 1. Format & scope

| Setting | Recommendation |
|---|---|
| Aspect ratio | **9:16 vertical** (Reels / TikTok / LinkedIn / Shorts). Also export a 16:9 version for YouTube if you want. |
| Length | **45–60 seconds** (attention drops fast on social). Optionally also cut a **15–20s teaser**. |
| Resolution | 1080×1920, 30fps |
| Vibe | Clean, premium, confident — "a real AI product." Calm tech music, captions on. |
| Structure | Hook → Meet LUNA → The 5-step pipeline → Proof (real app) → Call to action |

---

## 2. Which tool does what (read this first)

There's confusion about "Veo vs talking avatar" — here's the truth, because they do different jobs:

| Job in your video | Right tool | Why |
|---|---|---|
| **LUNA's face talking** (her exact photo, lip-synced to your script) | **D-ID** or **HeyGen** (photo/avatar mode) | These are built to make *one specific face* speak a script. Upload `LUNA.png`, paste the script, pick a voice → you get LUNA talking. |
| **Cinematic b-roll** (abstract "AI" shots, neural-network visuals, a modern office) | **Google Veo 3** (via Google Flow / Gemini) or **Runway / Pika** | Generative text-to-video. Great for 2–4s mood shots **between** sections. **Do not** expect Veo to make LUNA's exact face reliably speak your lines — that's not what it's for. |
| **The product itself** (the hero, the pipeline animation, a live interview, the dashboard) | **Screen recording** of your polished app | This is the backbone and the proof. Most of the video should be this. |
| **Voice** (if not using HeyGen's built-in) | **ElevenLabs** (most natural) | Or match the app's own voice, Microsoft `en-US-AriaNeural`. |
| **Edit / captions / music** | **CapCut** (free, fastest for social) or Premiere/DaVinci | Auto-captions, beat-synced cuts, export presets for each platform. |

**Recommended minimal stack:** HeyGen (talking LUNA) + your screen recordings + CapCut (edit). Add Veo
shots only if you want extra polish.

`LUNA.png` lives at `backend/static/images/LUNA.png` — that's the file you upload to the avatar tool.

---

## 3. The narration script (LUNA, first person — ~130 words, ~55s)

> Tone: warm, confident, professional. Pauses marked with "—".

**[Hook]**
"Hiring technical talent is slow, biased, and exhausting. — I'm LUNA, and I fix that."

**[Meet LUNA]**
"I'm an AI recruiter built into Codingo — and I run the entire hiring pipeline."

**[Pipeline — one line per step]**
"It starts when a recruiter posts a job. —
A candidate applies, and I instantly parse their CV — skills, education, experience. —
Then I run a real voice interview, asking role-specific questions and follow-ups. —
Every answer is scored against a live database of thousands of interview questions. —
And finally, I rank every candidate on the recruiter's dashboard — by skill match and performance."

**[Proof / CTA]**
"Faster. Fairer. Fully automated. — This is Codingo. The future of recruitment — and it's already here."

*(Need 30s? Keep Hook + the 5 pipeline lines + the last sentence.)*

---

## 4. Shot-by-shot storyboard

| # | Time | Script line | What's on screen | Source |
|---|------|-------------|------------------|--------|
| 1 | 0–4s | "Hiring … I fix that." | LUNA talking, centered, with a soft gradient background | HeyGen/D-ID (LUNA.png) |
| 2 | 4–8s | "I'm an AI recruiter … entire hiring pipeline." | Cut to the **landing hero** (dark, glowing LUNA), slow zoom-in | Screen recording |
| 3 | 8–12s | "It starts when a recruiter posts a job." | The **Post Job** form being filled / submitted | Screen recording |
| 4 | 12–17s | "A candidate applies, and I instantly parse their CV…" | **Apply** page → click "Parse Resume" → fields auto-fill | Screen recording |
| 5 | 17–26s | "Then I run a real voice interview…" | **Interview with LUNA** screen — LUNA avatar talking, waveform, a question appears, mic records | Screen recording (the star shot) |
| 6 | 26–34s | "Every answer is scored against a live database…" | The animated **"How it works"** pipeline section scrolling/playing; optionally overlay a Veo "data/AI" b-roll | App + optional Veo |
| 7 | 34–42s | "I rank every candidate on the dashboard…" | **Dashboard** with ranked candidates, scores highlighted | Screen recording |
| 8 | 42–55s | "Faster. Fairer… it's already here." | Back to LUNA talking; end card with "Codingo" logo + your name/uni | HeyGen + CapCut title |

**Pro tip:** record each app screen at high resolution on desktop, then reframe/crop to vertical in
CapCut with a slow Ken-Burns zoom so static screens feel alive.

---

## 5. Screen-recording shot list (capture these from the live app)

Record on the deployed Space (or locally) with a clean browser (no bookmarks bar, incognito):
1. **Hero** — load the homepage, let LUNA's glow animation breathe (3–4s).
2. **How it works** — scroll slowly so the 5 steps animate in.
3. **Post Job** — fill role/skills, hit submit (speed up 2× in edit).
4. **Apply + CV parse** — upload a resume, click parse, show fields filling.
5. **Interview** — start an interview; capture LUNA speaking (waveform active), a question, and the mic recording state. This is your money shot.
6. **Closing** — the score card with the glowing result.
7. **Dashboard** — the ranked candidate list.

macOS screen record: **Cmd+Shift+5**. Record system audio off (you'll add LUNA's voice + music in edit).

---

## 6. Music, captions, export

- **Music:** calm, modern, "tech product" — search CapCut/Epidemic Sound for "ambient tech / corporate inspire." Keep it low under LUNA's voice (-18 dB).
- **Captions:** auto-generate in CapCut, then fix LUNA/Codingo spelling. Big, bold, centered, one line at a time — most people watch muted.
- **Brand:** end card with the Codingo wordmark colors (indigo `#6366F1` → violet `#8B5CF6`, cyan spark `#22D3EE`) and "Final Year Project — <your name>, <university>".
- **Export:** 1080×1920, H.264, 30fps. Make a 16:9 1920×1080 version too for YouTube/LinkedIn landscape.

---

## 7. Tools & pricing (quick reference)

| Tool | Use | Cost |
|---|---|---|
| **HeyGen** | Talking LUNA (photo avatar + voice) | Free trial (watermarked, short); ~$24/mo Creator removes watermark |
| **D-ID** | Talking LUNA alternative | Free trial; ~$5.9/mo+ |
| **ElevenLabs** | Premium natural voice | Free tier (limited chars); ~$5/mo Starter |
| **Google Veo 3** (Flow/Gemini) | Cinematic b-roll only | Via Google AI / Gemini Advanced subscription |
| **Runway / Pika** | B-roll alternative | Free tier + paid |
| **CapCut** | Edit, captions, export | Free (Pro optional) |

**Cheapest path that still looks pro:** HeyGen free trial for 2–3 short LUNA clips + screen recordings
+ CapCut. If the watermark bothers you for the final post, one month of HeyGen Creator (~$24) covers it.

---

## 8. 60-minute production checklist

1. ☐ Generate LUNA's talking clips in HeyGen (paste script section by section; pick a warm female voice).
2. ☐ Screen-record the 7 app shots above.
3. ☐ Drop everything into CapCut on a 9:16 timeline; lay LUNA's voice as the spine.
4. ☐ Place talking-LUNA at the start/end, app recordings in the middle (follow the storyboard table).
5. ☐ Add music (low), auto-captions (fix names), and the end card.
6. ☐ Export 1080×1920; watch once muted to confirm captions tell the whole story.
7. ☐ Post. 🎬