# Demo Video

> Turns screenshots or a description into a narrated product demo video, with a story arc, designed scenes and an FFmpeg build script.

Demo Video is a Claude Code plugin from Alireza Rezvani's claude-skills collection. Its skill has your agent work like a video producer: it picks a story structure, designs one scene per idea, writes the narration, and builds a demo video, product walkthrough, teaser or GIF from your screenshots or a plain description.

What you can do with it
- Turn before-and-after screenshots into a 30-second demo to post
- Make a 15-second teaser from a single hero screenshot
- Show off a CLI tool with terminal-style scenes, no screenshots needed
- Get a product walkthrough or feature showcase with a voiceover

How it works
- Picks a structure: the classic demo (hook, problem, magic moment, proof, invite), problem-solution, or a 15-second teaser
- Designs each 1920x1080 scene as HTML with one focus, a dark background and a set colour language, typography and animation timing
- Writes narration one idea per scene, sized to each scene's length, with a choice of edge-tts voices
- Saves everything to a demo-output folder: the scenes, narration files, a scenes.json manifest and a build.sh that screenshots the scenes with Playwright, voices them with edge-tts and joins them with crossfades in FFmpeg into output.mp4

Good to know
- Rendering needs Playwright, edge-tts and FFmpeg. Without them you still get the scenes, narration and build script to run yourself or take into any video editor
- Scenes are rendered as still frames joined with crossfades, not screen recordings
- No account or API key
- Install it in Claude Code with /plugin marketplace add alirezarezvani/claude-skills, then /plugin install demo-video@claude-code-skills
- A community project, MIT licensed. The skill was contributed to the collection by vaddisrinivas, the author of framecraft

- Type: Plugin
- Made by: alirezarezvani
- Category: Media
- Formats: Claude plugins
- Version: 2.14.1
- Website: https://github.com/alirezarezvani/claude-skills/tree/main/engineering/demo-video
- Source: https://github.com/alirezarezvani/claude-skills/tree/HEAD/engineering/demo-video
- Page: https://pluginboard.ai/plugins/demo-video

## Works with

- Claude
- GitHub Copilot
- Claude Code
- OpenClaw

## Install

### Claude

In Claude (web or desktop): Customize → Plugins → Add → Add marketplace, enter alirezarezvani/claude-skills, then add demo-video

### Claude Code

In Claude Code:

```text
/plugin marketplace add alirezarezvani/claude-skills
/plugin install demo-video@claude-code-skills
```

---
From Pluginboard (https://pluginboard.ai).