screen-recording

npx skills add github/awesome-copilot --skill screen-recording --agent copilot

Same command for any agent — swap --agent for claude-code, codex, cursor.

# Screen Recording Create animated GIF demos that show a feature or workflow in action — with annotations, variable timing, and proper pacing. Useful for PR descriptions, documentation, and release notes. ## When to Use This Skill Use this skill when you need to: - Record a multi-step UI interaction as an animated GIF - Create a demo showing before/after behavior - Build annotated walkthroughs for documentation or release notes - Show a bug reproduction or fix in action ## Prerequisites ```bash pip install playwright Pillow imageio numpy scipy mss -q playwright install chromium ``` ## Core Workflow ### 1. Capture frames Use Playwright to step through the interaction and capture each frame: ```python from playwright.async_api import async_playwright async def record_frames(url, steps, width=1400, height=900): """ steps: list of dicts with 'action' (async callable taking page) and 'name' (frame filename) """ async with async_playwright() as p: browser = await p.chromium.launch() page = await browser.new_page(viewport={"width": width, "height": height}) await page.goto(url, wait_until="networkidle") for step in steps: if step.get("action"): await step["action"](page) await page.wait_f

pip install playwright Pillow imageio numpy scipy mss -q
playwright install chromium