demo-workflow

Coordinate artifact pipelines to generate product demo videos with timing data.

2|Updated Feb 19, 2026
One-click install
npx skills add https://github.com/llama-farm/demofly-claude --skill demo-workflow
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: demo-workflow
Source: https://github.com/llama-farm/demofly-claude/tree/main/plugins/demofly/skills/demo-workflow
Command: npx skills add https://github.com/llama-farm/demofly-claude --skill demo-workflow

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates the end-to-end creation of polished product demos by orchestrating a deterministic artifact pipeline from context discovery to final video and narration, eliminating ad-hoc setup and ensuring consistent demos.

Core Features & Use Cases

  • Artifact pipeline coordination: context.md, proposal.md, script.md, demo.spec.ts, and video artifacts
  • Context sharing and onboarding: unified product understanding to speed up demo creation
  • Timing extraction: uses extract-timing.js to produce timing.json and drive narration stitching
  • Beat-based script format: connects narration beats to Playwright actions for precise timing
  • Playwright recording templates and configuration: standardized testing and video capture
  • Sub-agent delegation: parallel exploration and orchestration of multiple agents to accelerate workflows
  • Documentation and templates: centralized reference for artifact formats and conventions

Quick Start

Follow the Demo Workflow reference to initialize the end-to-end artifact pipeline for a target product and produce a complete demo with timing data

Frequently Asked Questions about demo-workflow

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

FAQPage Schema
How do I automate product demo video creation with Playwright?

Automate product demo creation by running a deterministic artifact pipeline that uses Playwright to record web app interactions, extracts timing data, and stitches video with narration. This eliminates manual screen recording and ad-hoc scripting.

What is a beat-based narration script for web app demos?

A beat-based narration script connects specific voiceover segments to Playwright actions, ensuring precise timing synchronization. This format maps dialogue directly to UI interactions, driving automated media assembly for product demonstrations.

How do I generate timing data for synchronized demo narration?

Generate timing data by running extract-timing.js on Playwright test recordings to produce timing.json. This file captures execution timestamps, driving the automated stitching of audio narration with video artifacts.

Can I use this demo workflow for sales pitches and onboarding videos?

Yes, the workflow supports sales pitches and onboarding videos by orchestrating context discovery, scene proposals, and Playwright recording templates into polished media artifacts. It standardizes product demonstrations across web apps.

Does the demo pipeline require managing multiple agents?

No, managing multiple agents is optional. The pipeline supports sub-agent delegation for parallel codebase exploration and orchestration to accelerate workflows, but a single agent can execute the standard artifact sequence.

What are the limitations of using a deterministic artifact pipeline for demos?

The deterministic artifact pipeline enforces a fixed output order—context, proposal, script, spec, and media—meaning deviations require manual intervention. It relies strictly on Playwright MCP for automation, limiting browser compatibility.