LynkedUpPro_CRM/marketing/product-film/README.md

LynkedUp Pro — Product Film (Remotion)

Flagship ~5-min marketing film, composed from real app screenshots + animated brand beats. See docs/superpowers/specs/2026-05-30-product-film-design.md for the design.

Workflow

1. Capture the app (dark mode). From the repo root, start the CRM:

   npm run dev          # serves http://localhost:5173
   

   Then in this folder:

   npm install
   npx playwright install chromium   # first time only
   npm run capture                    # writes public/captures/*.png
   

2. Preview in Remotion Studio:

   npm run dev
   

3. Render:

   npm run render        # -> out/lynkedup-pro-film.mp4
   

Notes

• public/captures/ and out/ are gitignored (local artifacts). Re-run npm run capture to refresh.
• The capture script navigates within the SPA (history pushState) rather than reloading per route, because the CRM keeps auth in memory only — a full reload would log out and redirect to /login.
• Music: drop a royalty-free track at public/audio/music.mp3 and set HAS_MUSIC = true in src/components/AudioTrack.tsx.
• Voiceover: captions ship now; the VO script lives in the design spec §5 (record later, drop onto the same timeline).
• Does not modify any CRM code — it only screenshots the running app.