skills.rest
aiappsgbb
aiappsgbbOFFICIAL
Explore all skills by this author →
GitHub

auto-demo-producer

Produces narrated video demos of web applications from a script and URL.

5|2|Updated Apr 28, 2026
Search Tags:#playwright#ffmpeg#narration#edge-tts#screencast#browser recording#video demo
One-click install
npx skills add https://github.com/aiappsgbb/awesome-gbb --skill auto-demo-producer
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: auto-demo-producer
Source: https://github.com/aiappsgbb/awesome-gbb/tree/main/skills/auto-demo-producer
Command: npx skills add https://github.com/aiappsgbb/awesome-gbb --skill auto-demo-producer

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires edge-tts, playwright, ffmpeg, python, pip, and includes references (resource) components.

What problem does it solve?

This Skill removes the time-consuming effort of manually scripting, recording, and editing narrated demo walkthroughs for web applications.

Core Features & Use Cases

  • Narrated demo scripting: Converts a structured scene-based script into narration-aligned timelines.
  • Automated browser recording: Drives headless Chromium with Playwright to capture the exact user flows for each scene.
  • Video assembly pipeline: Uses ffmpeg to merge browser video with edge-tts narration into a polished MP4.
  • Use case: Produce a professional 1–5 minute product demo for a customer or stakeholder from a single target URL and a short feature outline.

Quick Start

Ask the Skill to create a demo for your web app by providing the target URL and what you want shown, and specify a desired voice and duration.

Frequently Asked Questions about auto-demo-producer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automatically generate a narrated video demo from a web app URL?▼

To generate a narrated video demo, provide a target web app URL and a scene-based script. The pipeline uses Playwright for browser recording, edge-tts for voice synthesis, and ffmpeg to assemble a narrated MP4.

Can I automate screencast recording with text-to-speech narration for product walkthroughs?▼

Yes, automated screencast recording with text-to-speech narration is supported. The process drives headless Chromium to capture user flows and aligns edge-tts generated audio with the video timeline to produce product walkthroughs.

Do I need to install Playwright and ffmpeg to produce browser recordings?▼

Yes, you need Playwright and ffmpeg installed, along with edge-tts and Python. These dependencies handle headless browser automation, video codec assembly, and voice generation to output the final H.264 MP4 file.

What's the best way to script a multi-scene web application demo automatically?▼

The best way to script a multi-scene web application demo is to define a structured scene-based script outlining user flows. The system converts this into narration-aligned timelines for automated browser recording and video assembly.

Can I configure the voice and duration for automated web app demos?▼

Yes, you can configure the voice and duration for automated web app demos. When requesting the video, specify your desired voice and target duration to customize the edge-tts narration and recording timeline output.

Why does my automatically generated screencast output as an H.264 MP4 file?▼

Your automatically generated screencast outputs as an H.264 MP4 file because ffmpeg assembles the Playwright browser recording and edge-tts narration into this standard format, ensuring a polished and widely compatible video demo.

Related Skills

Explore More Content & Communication Skills→
msrv-techmsrv-tech
41

web-session

Manage 1C:Enterprise web client sessions via Playwright MCP.

Community
Advanced
cowwoccowwoc
101

shrink-doc

Compress documentation while preserving YAML frontmatter and execution equivalence.

Community
Advanced
jianshuojianshuo
114

wjs-localizing-video

Transcribe, translate, optionally dub, and burn subtitles for videos.

Community
Advanced
gerald-icagerald-ica

openscreen

Record screens and edit videos with timeline-based tools for WebM export.

Community
Intermediate