Demos as Code
Treating the demo as a committed artifact: agent-authored storyboards, deterministic browser replay, multi-language and per-prospect renders from one recording.
Demos as code: commit the storyboard, render the video
A recording is a performance you own and maintain. A spec is text you can diff, review, regenerate, and hand to an agent. That decides everything downstream.
Agent-friendly app instrumentation: data-testid and beyond
Whether an agent can script your UI is decided in your codebase. The instrumentation playbook that pays off for tests, agents, and demo capture at once.
Letting a coding agent make your demo video
A coding agent can explore your app and write the demo storyboard. Driving the browser live is the one thing it must not do, and here is exactly why.
Deterministic browser automation for video capture
A test that flakes just reruns. A demo that flakes ships the stutter. The eight-variable checklist for making one browser flow render the same pixels twice.
MCP servers for media generation: the agent-to-render interface
A media render runs for minutes; an MCP tool call times out in sixty seconds. How to design the agent-to-render interface so the video survives the gap.
Multi-language product demo videos from one recording
Localizing a demo doesn't mean re-shooting it five times. Keep one recorded take, swap the words, and do the honest math on where each locale really costs you.
Personalized demo videos at scale: the template-render pattern
A merge field with the prospect's name is not a demo that shows their data. Three depths of personalization, priced honestly for a fifty-prospect batch.
Reproducible demo renders: byte-for-byte, on purpose
You pinned the browser so it paints the same pixels every run. The MP4 still differs. Here is why, and the reproducible-builds discipline that closes it.
Reviewing video and media diffs in pull requests
A pull request has nothing to say about a video: git renders it as 'Binary files differ.' Here is how to make a media change a reviewer can actually approve.
Selectors that survive a redesign
A demo pinned to nth-child and hashed CSS classes breaks the day a designer touches the layout. Here are the selectors that outlast a redesign.
Storyboard design patterns for demos as code
When the demo is a JSON file, authoring becomes a design-patterns problem: the moves that keep a storyboard readable, and the smells that wreck it.
Testing demos like code: golden files and drift gates
Your code has a test suite; the demo video of it has a filename and a vibe. Golden-file testing closes that gap, once you pick the right layer to freeze.
Versioning media assets in git: LFS, committed, or external
Git can diff a storyboard forever for free and chokes on the MP4 it renders. Where that binary lives — committed, LFS, or nowhere — is a real decision.
Video-as-code tools: Remotion, Revideo, editly, vhs — and real-UI capture
Remotion and Revideo draw every frame, editly stitches clips, vhs replays a terminal, real-UI capture films your product. Five models, one map.