reshoot

Demos that stay current.

Script a task in your app once. reshoot records it as a captioned MP4 and a README GIF, checks that the result really appeared, and keeps the script beside your code. When the UI changes, run it again: the same story, freshly recorded.

Before and after a UI change, from one storyboard. Watch the 21-second social cut.

• Re-record, don't redo. The demo is a storyboard.toml of clicks, typing, captions and the result that should appear. Run it after every UI change.
• Checked, not just captured. Each run confirms that the result you named appeared, such as a saved item or a search match, and stops on the exact step whose control or label no longer matches. It scans the frames for email addresses, keys and, on macOS, faces before you share anything.
• Your agent can drive it. Skills for Claude Code and Codex write the story from your app, and a GitHub workflow records it again when the app changes and opens a pull request with the new video.

Try it in a minute

uv tool install 'reshoot[browser]'
reshoot init demo                # a made-up notes app and its storyboard
reshoot preview demo/reshoot.toml

Once Chrome is up, the preview takes seconds and ends with what it made:

Done in 13 s: 3 of 3 result checks passed · scan: 6 items, 0 flagged · not accepted yet.
  video  demo/takes/runs/RUN_ID/takes/demo-final.mp4
  GIF    demo/takes/runs/RUN_ID/takes/demo-final-readme.gif
  review demo/takes/runs/RUN_ID/review.html

This is a preview, smaller and quicker than a final. When it looks right, record the final:
  reshoot run demo/reshoot.toml

reshoot runs on macOS or Linux with Python 3.11+, ffmpeg and Chrome or Chromium, plus Tesseract on Linux; installation covers each platform. The CLI tutorial shows the part only reshoot does: change the app, watch the story stop on the beat that broke, fix one line, and compare the new recording with the old one.

Or let your agent make it

Open Claude Code or Codex in your app's repository, or in an empty folder if you only have a running app, and paste:

Make a short demo with reshoot.
Read https://github.com/mumit/reshoot/blob/main/guide/agent-quickstart.md
and follow its setup and creation workflow.

Target: the app in this repository.
Choose one useful task with a clear visible result. Use synthetic demo data.
Produce a short captioned MP4 and a README GIF. Keep the recording source in
demo/ so it can be updated later.

Inspect a preview, then record a fresh final and open both exports for review.
Ask only for permissions or missing details needed to proceed.

Change Target: to a URL, or to a macOS app and its window, if there's no source. Add a task if you have one: "Show creating a project and finding it by search."

What to expect, from trials on four new apps:

• Time: 2 to 3 minutes in Claude Code, 5 to 9 in Codex.
• Files: the agent writes demo/ and its skills, in .claude/skills/ or .agents/skills/, and leaves your README and other files alone.
• Permissions: it may ask to install reshoot and ffmpeg, and in Codex to run Chrome outside the sandbox.
• At the end: it opens the MP4 and GIF, and you reply "accept" or ask for changes, such as shorter captions. Nothing is published.

The story is a file

[[beat]]
id = "search"
caption = "Find the matching note"
hold = 2.0
[[beat.action]]
type = "type"
target = {css = "#q"}
text = "bike"
[[beat.expect]]
type = "text"
target = {css = "#list li"}
contains = "Pick up the bikes"

reshoot types into the real page with a visible cursor, shows the caption, and holds on the result so people can read it. When the app renames #q, the run stops on that beat: type target {css = '#q'} matched 0 elements. Fix the target and run again; the comparison shows the same beats with the same results.

Keep it current

Record a final, watch it, and accept it once. That writes demo/accepted/, a small record to commit with demo/:

reshoot run demo/reshoot.toml
reshoot accept demo/latest

After the app changes, record again and compare with the accepted run before accepting the new one:

reshoot run demo/reshoot.toml
reshoot compare demo/accepted demo/latest --out demo/comparison.json
reshoot accept demo/latest

Or let CI do it: the GitHub workflow records the demo when the app changes on main and opens a pull request with the new video, GIF and a beat-by-beat comparison. A broken story fails on its beat and opens nothing.

How it differs

What it records

Use made-up demo data. Platforms and tested limits lists what runs where.

Skills for Claude Code and Codex

The first-demo prompt installs them. To install them yourself, run reshoot skills claude --directory . or reshoot skills codex --directory . in the project, and add --replace after an upgrade. In Claude Code, the plugin installs all ten: these three, plus seven supporting skills for planning, recording, editing, privacy checks and CI:

/plugin marketplace add mumit/reshoot
/plugin install reshoot@reshoot

The agent quickstart has follow-up prompts for refreshing and reviewing, and the skill catalog describes each skill.

Where next

Why reshoot exists

I made the launch video for photosearch this way, and pulled the tools and what I learned into reshoot. A demo takes work to make. Keeping its story beside the app makes that work pay off again every time the product changes.

The original notes recording and its source files are still here.

Contributing

New pitfalls, skills and fixes are welcome. See CONTRIBUTING.md for how to work on it and ROADMAP.md for what's planned.

License

MIT. See LICENSE.