marketing-demo

Record product demos and walkthrough videos using ply screenshots, ffmpeg stitching, or Remotion compositions.

31|5|Updated Mar 12, 2026
One-click install
npx skills add https://github.com/MoizIbnYousaf/marketing-cli --skill marketing-demo-moizibnyousaf
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: marketing-demo
Source: https://github.com/MoizIbnYousaf/marketing-cli/tree/main/skills/marketing-demo
Command: npx skills add https://github.com/MoizIbnYousaf/marketing-cli --skill marketing-demo-moizibnyousaf

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Creating product demo videos for landing pages, social media, and email campaigns normally requires video editing skills and tooling that marketers and developers lack, leaving products without visual marketing assets. ## Core Features & Use Cases - Quick Demo Mode: Capture screenshots with ply and stitch them into MP4s or GIFs with ffmpeg, with presets for hero videos, social squares, and email-optimized GIFs. - Polished Demo Mode: Build branded Remotion compositions with intro, demo scenes, transitions, and CTA outros using your brand colors and fonts. - Shot Planning & Storytelling: Plan shot lists with duration rules per demo type and apply storytelling principles like outcome-first openings and text overlays for muted autoplay. - Use Case: You just shipped a new feature and need a 15-second hero video for your landing page plus a square clip for Instagram. This skill captures the screens, stitches the footage, and outputs both formats to marketing/demos/. ## Quick Start Record a 15-second hero demo video of my app at localhost:3000 for the landing page and also export a square version for social media.

Frequently Asked Questions about marketing-demo

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

FAQPage Schema
How do I record a product demo video for my landing page?▼

Plan a shot list of key screens, capture each with ply screenshots, then stitch them into an MP4 with ffmpeg at 1280x800. For branded output with transitions and text overlays, use the Remotion mode instead.

How to convert screenshots into a demo video with ffmpeg?▼

Use ffmpeg with -framerate 0.5 on sequentially named screenshots and libx264 encoding to produce an MP4. The skill includes commands for scaling, padding, GIF conversion, and square social crops.

Should I use ffmpeg or Remotion for product demo videos?▼

Use ply plus ffmpeg for quick, rough demos stitched from screenshots. Use Remotion when you need polished marketing output with branded intros, animated text overlays, transitions, and CTA outros.

What video format works best for email campaign GIFs?▼

Email GIFs should be 600px wide, 3-8 seconds long, and under 2MB. The skill generates them with an ffmpeg palette-optimized filter chain to keep file size small while preserving quality.

Why does my Remotion render fail and how do I fix it?▼

Remotion render failures usually come from Node versions below 18, GPU issues, or missing image paths. Try --gl=angle or --gl=swangle flags and verify all Img src paths exist before rendering.

How long should each shot be in a product demo video?▼

Shot duration depends on demo type: 0.5-1s for quick overviews, 2-3s for feature demos, 4-5s for walkthroughs, and 1-2s for social clips. Keep total demos under 60 seconds unless adding chapter breaks.