demo-recorderlisted
Install: claude install-skill mozdowski/claude-skills
# Demo Recorder
Turn a running frontend app into a set of narrated demo videos. The workflow:
discover features → agree scope with the user → plan scenarios → generate
Playwright recording scripts → record per-scenario clips → emit a timed
narration script the user feeds to TTS for voiceover.
Design stance: **demo-first with light verification**. Every scenario script
asserts its flow's key business outcome. A recording that completes is a flow
that works; a broken flow fails loudly instead of producing a silently wrong
video. This is not a substitute for a real e2e suite — don't build one here.
Two tools, two jobs — don't mix them up:
- **Playwright MCP tools** (`mcp__plugin_playwright_playwright__*`): live
exploration during discovery, and selector verification while writing
scripts. They cannot record video.
- **Generated Node scripts** using Playwright's `recordVideo`: the actual
recordings. They live in the user's project, so demos are re-runnable after
UI changes without redoing this whole process.
## Phase 0 — Prerequisites
Check before promising anything:
1. Playwright MCP tools available (load via ToolSearch in one call:
`select:mcp__plugin_playwright_playwright__browser_navigate,mcp__plugin_playwright_playwright__browser_snapshot,mcp__plugin_playwright_playwright__browser_click,mcp__plugin_playwright_playwright__browser_type,mcp__plugin_playwright_playwright__browser_take_screenshot`).
If absent, tell the user to install the Playwright plugin and