michel-cli-demo-recorder

Solid

Produce proof-of-execution demos of the Packmind CLI (`packmind-cli`) as terminal-styled images (colors and formatting preserved exactly), for embedding in a GitHub PR. Renders a crisp master SVG and rasterizes it to a PNG — the PNG is what you embed, because GitHub does not render SVG in PR/issue bodies. Use this whenever a dev task touches the CLI — new command, changed output, new flag, bug fix in terminal rendering — and the PR would benefit from showing the tool actually running. Trigger it when the user says "record a CLI demo", "show the command output", "add a terminal screenshot to the PR", "prove the CLI works", "capture the CLI", "demo the command", or whenever you finish CLI work and are about to open or update a PR. Default to running this for any PR whose diff includes CLI source, even if the user didn't explicitly ask for a screenshot — a CLI PR without a visual of the output is an incomplete deliverable.

AI & Automation 311 stars 18 forks Updated today Apache-2.0

Install

View on GitHub

Quality Score: 86/100

Stars 20%
83
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# CLI Demo Recorder Turn a local `packmind-cli` invocation into a polished, colored terminal **screenshot** that drops straight into a GitHub PR. The renderer writes a crisp master **SVG** and, by default, rasterizes it to a **PNG** next to it — the PNG is the artifact you embed, because GitHub refuses to render SVG in a PR/issue body (its image proxy rejects `image/svg+xml`). The companion to `michel-ui-demo-recorder` — that one records the browser UI; this one captures the terminal. ## When to reach for this skill - You just implemented or changed a CLI command/flag/output and are opening or updating a PR. - "Add a screenshot of the CLI to the PR", "show what the command prints", "prove it runs". - A bug was about terminal rendering (colors, alignment, truncation) and the fix needs visual evidence. - Anytime the PR diff includes CLI source (`apps/cli/`) — attach a demo by default; reviewers shouldn't have to clone and run it to see the output. The deliverable is one or more terminal-window images, each showing a fake prompt line (`user@host dir % <command>`) followed by the command's real, fully-colored output. The renderer emits **two files per demo**: a `.svg` master (crisp at any zoom, a few KB, exact-color — keep it as the source) and a `.png` rasterized from it. **Embed the PNG in the PR** — GitHub does not render SVG in PR/issue bodies, so an embedded SVG shows up broken. The PNG is what reviewers actually see. ## Why a skill exists for this Capturing colored CL...

Details

Author
PackmindHub
Repository
PackmindHub/packmind
Created
1 years ago
Last Updated
today
Language
TypeScript
License
Apache-2.0

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

AI & Automation Solid

michel-create-pr-with-screenshots

Best practices for creating GitHub pull requests that include inline images — CLI terminal screenshots (from cli-demo-recorder), UI screenshots/videos (from ui-demo-recorder), or any other visual artifact. Use this skill whenever opening or updating a PR that has visual artifacts to embed, or when images aren't rendering in a PR description. Also use it when asked "how do I add screenshots to a PR", "why isn't my image showing", or "embed a demo in the PR".

311 Updated today
PackmindHub
AI & Automation Solid

michel-ui-demo-recorder

Record polished UI demo videos and screenshots of a running web app using Playwright MCP — for client deliverables, release notes, feature walkthroughs, or bug repros. Produces an HD WebM video with chapter markers, a mandatory animated cursor overlay, and a mandatory subtitle bar that narrates each step (positioned deliberately so it never masks the UI being demonstrated), plus full-page screenshots at each step. Use this whenever the user asks to "record a demo", "create a screencast", "make a UI walkthrough video", "document this feature with video", "show the client how X works", "capture screenshots of the app", or anything similar — even when the user only says "make a video" or "take screenshots" in the context of a running frontend. Also use it when the user wants to demonstrate a workflow, generate marketing-quality footage of an app, or produce repeatable visual documentation.

311 Updated today
PackmindHub
AI & Automation Listed

screen-demo

Turn a raw screen recording (.mov/.mp4) into a polished 1-3 minute landscape product demo video. Free + local — uses ffmpeg + PySceneDetect for editing and mlx_whisper on the macOS host (over the SSH bridge) for multilingual transcription. No SaaS, no API keys. The user provides a recording and a prose description ("keep it 90s, hook in first 10s, money shot at 2:30, lo-fi vibe") plus an optional music file/URL; the orchestrating Claude runs prep, authors an EDL, renders the reel. Triggers on "make a demo video", "edit this screencast", "turn this recording into a demo", "product demo from screen recording", "screen-demo skill".

0 Updated 1 weeks ago
spikelab