Demo Vid

Demo video pipeline for fleet repos. Records narrated walkthroughs of any webapp by orchestrating Playwright, speech-mcp TTS, and FFmpeg composition.

Quick Install

uvx mcpb install sandraschi/demo-vid-mcp

What You Can Do

• Generate a video: demo_vid_generate(repo="chitchat") — auto-starts the target webapp, records it, adds voiceover, composes MP4
• Draft a script: demo_vid_script_draft(repo="chitchat") — reads the README and generates a narration script
• Browse the depot: Categorized gallery of produced videos with inline player, rebuild, delete, and insert into repo README
• Chat about it: Built-in chat with personalities, example prompts, and local LLM integration (Ollama/LM Studio)

Tools

Tool	Description
demo_vid_generate(repo, theme="dark")	Full pipeline: auto-start target webapp → record (Playwright) → voiceover (speech-mcp) → compose (FFmpeg) → MP4. theme="light" forces the target webapp's light mode for bright demos (default "dark" matches fleet identity).
demo_vid_script_draft(repo)	Generate a narration YAML from the target repo's README and webapp page structure
demo_vid_script_validate(yaml)	Validate a narration script's structure and timing
demo_vid_list(repo?)	List produced videos with metadata
demo_vid_refine(name, feedback)	NOT YET IMPLEMENTED — edit narration.yaml directly and re-run generate
demo_vid_help	List all tools and usage

Webapp

Page	Purpose
Dashboard	Backend status, KPI cards, pipeline overview
Depot	Categorized gallery with inline player, rebuild, delete, insert buttons
Generate	Select target repo by category → generate
Choreography	Visual script builder — 11 step types, global options, YAML preview
Chat	SOTA chat with personalities, localStorage, example prompts, LLM integration
Settings	LLM provider probe (Ollama/LM Studio), model selection, persistence
Logs	Ring-buffer log viewer with level filter and search
Help	6-tab reference: overview, architecture, tools, config, fleet, troubleshooting

Autostart

demo_vid_generate automatically starts the target repo's backend and Vite frontend before recording. Zombie-kills stale processes first. No manual setup — the pipeline scans for start.ps1 and webapp/ directories.

Themes

Recording is dark-mode by default (fleet identity). Pass theme="light" to record a bright demo — the capture script forces the target webapp's theme class (handles both .dark toggling and persisted localStorage light-mode keys) before navigation, per chat_skills_prefab_standard.md §7.1.

Fleet Services

Required: speech-mcp (voiceover), Playwright (recording), FFmpeg (composition). Optional: blender-mcp (3D titles), OBS-mcp (human-in-video), stems-mcp (music), vfx-mcp (effects).

Ports

Backend: 11134, Frontend: 11135, speech-mcp: 10909. See WEBAPP_PORTS.md.

Documentation

Doc	Contents
Installation	All install methods, prerequisites
Configuration	Env vars, config options
Tool Reference	All available tools
Development	Contributing, local setup
Troubleshooting	Common issues

Requirements

• Python 3.13+ with uv
• FFmpeg (for composition)
• speech-mcp (for voiceover)
• Playwright (for recording, auto-installed)

License

MIT