skills.rest
mmnavarr
mmnavarrCOMMUNITY
Explore all skills by this author →
Website𝕏@mxlcolmGitHub

ce-demo-reel

Capture visual demo evidence as GIFs or screenshots for pull request descriptions.

Updated May 11, 2026
Search Tags:#pull request#evidence#gif#demo#screenshot#vhs#terminal recording
One-click install
npx skills add https://github.com/mmnavarr/harness --skill ce-demo-reel-mmnavarr
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ce-demo-reel
Source: https://github.com/mmnavarr/harness/tree/main/skills/ce-demo-reel
Command: npx skills add https://github.com/mmnavarr/harness --skill ce-demo-reel-mmnavarr

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Pull requests for UI changes, CLI features, or any observable behavior often lack visual proof, forcing reviewers to check out branches and run code themselves. This Skill automates capturing real product usage as GIFs, terminal recordings, or screenshots and uploading them to a public URL for PR embedding. ## Core Features & Use Cases - Automatic project and change detection: Classifies the repo as web-app, CLI tool, library, or desktop app from package manifests, and classifies the change as motion or states to recommend the right capture tier. - Four capture tiers: Browser reels via agent-browser screenshots stitched with ffmpeg, terminal recordings via VHS, styled screenshot reels via silicon, and static PNG screenshots as a universal fallback. - Secret-safe recording: Enforces rules to keep credentials out of recorded frames, including VHS Hide/Show blocks and pre-upload secret scanning. - Preview and upload pipeline: Uploads artifacts to litterbox for a 1-hour preview, then promotes to permanent catbox hosting or saves locally after user approval. - Use Case: After shipping a new settings page, invoke the Skill to record the page in action, stitch the frames into a GIF, upload it, and receive a public URL ready to paste into the PR description. ## Quick Start Ask the agent to record a demo GIF of the new feature on this branch and give you a URL for the PR description.

Frequently Asked Questions about ce-demo-reel

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

FAQPage Schema
How do I record a GIF demo of a CLI command for a pull request?▼

Use VHS terminal recording: write a .tape file with the commands, typing speed, and terminal dimensions, then run it through the capture pipeline to produce a GIF. The Skill generates the tape, runs VHS, and uploads the result to a public URL.

How do I add screenshots or a demo to a GitHub PR description?▼

Capture the feature in action using browser screenshots or a terminal recording, upload the artifact to catbox for a permanent public URL, and embed the returned URL as an image in the PR description. The Skill handles capture, upload, and returns the URL.

What tools are needed to record terminal sessions as GIFs?▼

Terminal recording requires VHS (charmbracelet/vhs). Screenshot reels need silicon plus ffmpeg and ffprobe for stitching, and browser reels need agent-browser with ffmpeg. The preflight command checks availability and suggests brew install commands for missing tools.

How do I keep API keys and secrets out of screen recordings?▼

Set real credentials inside a VHS Hide block before the visible demo, never re-export them on screen, and avoid pages showing tokens or auth headers. The Skill scans artifacts for credential patterns before upload and requires recapture instead of blurring if any leak.

Why does my stitched GIF fail to render inline on GitHub?▼

GitHub's inline render limit is 10 MB. The stitch command auto-reduces oversized GIFs by dropping middle frames and re-stitching, and warns when output exceeds the 5 MB preferred target. Reducing frame count or dimensions also helps.

When should I skip capturing demo evidence for a change?▼

Skip evidence when the diff is docs-only, markdown-only, config-only, CI-only, test-only, or a pure internal refactor with no observable output change. The Skill detects these cases in its target discovery step and exits early with a clear reason.

Related Skills

Explore More Software Engineering Skills→
wangx7wangx7

using-git-worktrees

Create isolated git worktrees for feature development without modifying active branches.

Community
Advanced
Gorillaa-ai-orgGorillaa-ai-org

pr-submit

Create and submit GitHub pull requests from the current branch.

Official
Advanced
jonaseck2jonaseck2
2

test

Run the Släktforskning test suite across unit, component, and Tauri e2e tiers.

Community
Intermediate
thisisryanswiftthisisryanswift
2

ce-demo-reel

Capture GIFs, terminal recordings, and screenshots of UI or CLI behavior for PR evidence.

Community
Advanced