cli-demo-generator

CLI Demo Generator

Generate professional animated CLI demos with ease. This skill supports both automated generation from command descriptions and manual control for custom demos.

When to Use This Skill

Trigger this skill when users request:

• "Create a demo showing how to install my package"
• "Generate a CLI demo of these commands"
• "Make an animated GIF of my terminal workflow"
• "Record a terminal session and convert to GIF"
• "Batch generate demos from this config"
• "Create an interactive typing demo"

Core Capabilities

1. Automated Demo Generation (Recommended)

Use the auto_generate_demo.py script for quick, automated demo creation. This is the easiest and most common approach.

Basic Usage:

scripts/auto_generate_demo.py \
  -c "npm install my-package" \
  -c "npm run build" \
  -o demo.gif

With Options:

scripts/auto_generate_demo.py \
  -c "command1" \
  -c "command2" \
  -o output.gif \
  --title "Installation Demo" \
  --theme "Dracula" \
  --width 1400 \
  --height 700

Script Parameters:

• -c, --command: Command to include (can be specified multiple times)
• -o, --output: Output GIF file path (required)
• --title: Demo title (optional, shown at start)
• --theme: VHS theme (default: Dracula)
• --font-size: Font size (default: 16)
• --width: Terminal width (default: 1400)
• --height: Terminal height (default: 700)
• --no-execute: Generate tape file only, don't execute VHS

Smart Features:

• Automatic timing based on command complexity
• Optimized sleep durations (1-3s depending on operation)
• Proper spacing between commands
• Professional defaults

2. Batch Demo Generation

Use batch_generate.py for creating multiple demos from a configuration file.

Configuration File (YAML):

demos:
  - name: "Install Demo"
    output: "install.gif"
    title: "Installation"
    theme: "Dracula"
    commands:
      - "npm install my-package"
      - "npm run build"

  - name: "Usage Demo"
    output: "usage.gif"
    commands:
      - "my-package --help"
      - "my-package run"