Demo Preparation Skill

Read .hackathon/DEMO-SCRIPT.md, .hackathon/IDEA-FINAL.md, and .hackathon/STATE.md.

No gate — this skill can be used at any phase. It's designed to be used early and often.

The Demo Formula

Hackathon demos that win follow this structure:

1. The Hook (15 seconds)

State the problem in a way that makes the audience nod. Use a specific, relatable example.

• "Every day, compliance teams spend 4 hours scanning documents for keywords. They're reading the same 50-page PDFs looking for 8 specific terms."

2. The Solution (15 seconds)

One sentence on what you built. Don't explain how — show it.

• "We built Paperwork AI — upload a document, and it reads, highlights, and extracts everything in seconds."

3. The Live Demo (60-90 seconds)

This is the core. Walk through the primary flow:

• Start from a clean state (shows it's real, not pre-loaded)
• Each step should produce a visible, impressive result
• The "wow moment" should be in the first 30 seconds
• Show AI doing something that's obviously hard/tedious for humans
• Use real-looking data (not "test123")

4. The Impact (15 seconds)

Connect to the metric. Make it tangible.

• "For our compliance team alone, this could save 20 hours per week — time that goes back to actually reviewing cases instead of scanning for keywords."

5. The Close (15 seconds)

What's next? What would this look like in production?

• "This is a prototype, but the core pipeline works. Next steps: integrate with our document management system and expand the keyword library."

Total: ~2 minutes. Never go over time.

Fallback Strategy

Every demo needs a fallback plan:

• Level 1: Live demo from deployed app
• Level 2: Live demo from localhost
• Level 3: Screen recording of the demo flow
• Level 4: Screenshots with narration

Record Level 3 BEFORE the demo session. Even if the live demo works perfectly, the recording exists as insurance.

Demo Environment Checklist

Create .hackathon/DEMO-CHECKLIST.md with the following. Every item should be verified before the demo session:

Machine setup:

• Browser zoom set to 125% for screen-sharing visibility
• Use incognito/private window (no extensions, no autofill, no cached state)
• Bookmarks bar hidden
• All notifications silenced (OS, Slack, email)
• Screen resolution set to common projector-friendly res (1920x1080)
• Only demo-relevant tabs open, in the correct order

Application state:

• Demo reset script created and tested (scripts/demo-reset.sh — seeds DB, clears storage, places sample files)
• Run the reset script immediately before the demo
• Test data pre-loaded (realistic names, realistic documents, not "test123")
• Any large assets (PDFs, images) cached locally — don't depend on upload speed during demo

Network:

• Test on the actual network you'll demo from (VPN, captive portals, firewall)
• If deployed: verify the deployed URL loads (not just localhost)
• If localhost: have ngrok or similar ready as a backup

Recording:

• Screen recording made of full demo flow as backup
• Recording saved locally (not just in cloud) in case of network issues

Rehearsal:

• Full dry-run completed at least once at actual demo speed
• Tab switching order rehearsed (no fumbling between windows)
• Know exact wait times for async operations (OCR processing, etc.) and have narration to fill

Demo Script Document

Update .hackathon/DEMO-SCRIPT.md:

---
owner: [pm-name]
status: draft → review → locked (before demo)
version: [increments with each update]
last-modified: [timestamp]
---

# Demo Script — [Project Name]

## Presenter: [name]
## Time Limit: [X minutes]
## Demo URL: [deployed url or localhost]

## Pre-Demo Checklist
- [ ] App deployed and accessible
- [ ] Test data loaded / clean state prepared
- [ ] Screen recording made as backup
- [ ] Browser tabs pre-loaded (no typing URLs live)
- [ ] Font size increased for projector visibility
- [ ] Notifications silenced on demo machine

## Script

### [0:00 - 0:15] Hook
SAY: "[exact words]"
SHOW: [title slide or landing page]

### [0:15 - 0:30] Solution
SAY: "[exact words]"
SHOW: [app interface]

### [0:30 - 1:30] Live Demo
DO: [step-by-step actions]
SAY: [what to narrate during each step]
WAIT: [where the app needs processing time — fill with narration]
HIGHLIGHT: [the wow moment — call attention to it]

### [1:30 - 1:45] Impact
SAY: "[exact words with metric]"
SHOW: [results or analytics if available]

### [1:45 - 2:00] Close
SAY: "[exact words]"

## If Something Goes Wrong
- If upload fails: use pre-uploaded document, say "we have a document already in the system"
- If processing hangs: switch to recording, say "let me show you what happens"
- If completely broken: narrate over screenshots

Output

• Updated .hackathon/DEMO-SCRIPT.md
• Reminder to create screen recording
• Update STATE.md
• Log to changelog