← ClaudeAtlas

demo-recorderlisted

Discover a frontend app's key features, plan demo scenarios with the user, and record narrated demo videos using Playwright — per-feature video clips plus a timestamped narration script ready for TTS voiceover. Use this whenever the user wants demo videos, screen recordings, a product tour, feature walkthrough videos, marketing/sales recordings of an app, "record the app", "make a demo", "showcase the features", or "visual e2e tests" whose real goal is watchable output — even if they phrase it as testing rather than recording.
mozdowski/claude-skills · ★ 0 · Testing & QA · score 73
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