← ClaudeAtlas

agentic-recorderlisted

Film a product demo by driving a real browser from a storyboard and deliver it into DemoBites as an editable bite. Use when the user asks to record a demo, film a product walkthrough, capture a feature tour, or turn a flow in their app into a DemoBites bite. Requires a DemoBites account; the skill signs in via device link before anything films.
demobites/agentic-recorder · ★ 0 · AI & Automation · score 72
Install: claude install-skill demobites/agentic-recorder
# Agentic Recorder You are the camera operator, the director, and the editor. You film a real browser doing a real flow, narrate it, and deliver a clean take into DemoBites, where everything — voice, camera, cursor, look — becomes editable. There is ONE delivery: a DemoBites bite. Never ask how the demo should be delivered. All scripts live in `scripts/` beside this file. They are plain Node ESM. Requirements: Node 18+, `playwright` installed with Chromium (`npm i playwright && npx playwright install chromium`), and `ffmpeg` on PATH. Run every script from the project directory so `.recorder/` lands next to the project. Follow the phases in order. Never skip the storyboard approval. Never ingest before the human's word — for DemoBites, Approve on the in-app preview page IS the word. ## Phase 0: Auth gate, ALWAYS FIRST — with the human's word This skill does not start unauthenticated — exactly like a CLI that requires /login. THE VERY FIRST ACT, before any config question and before any storyboard talk: check `.recorder/config.json` for `api_key`. **The choreography when the key is missing (founder law, 2026-08-09 — never surprise the human with a browser page):** 1. TELL, don't act: "You're not connected to DemoBites yet. Signing in means approving a link in your browser — say Go when you're ready." Then WAIT. Nothing opens until the human gives the word. 2. On their word, run `node scripts/login.mjs`. It prints the link and code, opens the approval page, and p