← All work

demotale

An npm CLI that turns one Playwright walkthrough into a video, a gif or docs stills of your web app — and re-records it in CI when the UI changes.

demotale demo

Problem

Product demos go stale the moment the UI changes. Screen recordings are manual, hard to redo, and the README gif is always a version behind.

What AI does

demotale is built for humans and coding agents. A scenario is a plain Playwright test in demo/*.demo.ts, so an agent can write and fix it. After install, npx demotale agent-guide gives agents version-matched instructions instead of steps invented from memory. The recording itself is deterministic: no LLM in the loop.

Demo

Playwright walks the clicks, text on screen explains each step. You choose the artefact: demotale video (mp4 with subtitles), demotale gif, or demotale images N for docs stills of the real UI.

Result

One walkthrough, three things you can ship, and all of them stay current: the same scenario runs in CI and re-records when the product changes. No microphone, no account, no upload. Published as @pesuto/demotale on npm, Apache-2.0.