Claude Video Screenshot

claude-video-screenshot — Web Capture for Video Production

Pre-Flight

Check Playwright is installed:

source ~/.video-skill/bin/activate
python3 -c "from playwright.sync_api import sync_playwright; print('Playwright ready')"

If not installed:

source ~/.video-skill/bin/activate
pip install playwright && playwright install --with-deps chromium

Single Screenshot

Capture a web page at video-native dimensions:

source ~/.video-skill/bin/activate
python3 scripts/web_capture.py \
  --url "https://example.com" \
  --output capture.png \
  --viewport 1920x1080

Options:

• --url "..." — URL to capture
• --output capture.png — Output file path
• --viewport WxH — Browser viewport size (default: 1920x1080)
• --full-page — Capture entire scrollable page (not just viewport)
• --element ".css-selector" — Capture a specific element only
• --transparent — Transparent background (omit page background)
• --hide ".ads,.cookie-banner,.popup" — CSS selectors to hide via display:none
• --wait N — Wait N seconds after page load before capture
• --wait-for ".selector" — Wait for a specific element to appear
• --device "iPhone 15 Pro" — Emulate a device (100+ presets)
• --dark-mode — Emulate dark color scheme preference
• --locale en-US — Set browser locale
• --timezone "America/New_York" — Set browser timezone

Video-Native Presets

Use --preset for common video dimensions:

Batch Capture

Capture multiple URLs at once:

source ~/.video-skill/bin/activate
python3 scripts/web_capture.py \
  --urls urls.txt \
  --output-dir ./captures/ \
  --viewport 1920x1080 \
  --hide ".cookie-banner"

The urls.txt file contains one URL per line. Output files are named after the URL slug.

Browser Recording

Record a browser session as video:

source ~/.video-skill/bin/activate
python3 scripts/web_capture.py \
  --record \
  --url "https://example.com" \
  --output recording.mp4 \
  --viewport 1920x1080 \
  --duration 10

Uses Playwright's record_video_dir to capture the browser session. Useful for tutorial videos or documenting web interactions.

Options:

• --record — Enable video recording mode
• --duration N — Recording duration in seconds
• --scroll — Auto-scroll the page during recording
• --scroll-speed N — Pixels per second for auto-scroll (default: 200)

Ken Burns Animation

Convert a screenshot into a zoom/pan video:

source ~/.video-skill/bin/activate
python3 scripts/web_capture.py \
  --url "https://example.com" \
  --output capture.png \
  --viewport 1920x1080 \
  --ken-burns \
  --ken-burns-duration 5

Or apply Ken Burns to an existing image:

python3 scripts/web_capture.py \
  --ken-burns-image existing.png \
  --ken-burns-duration 5 \
  --ken-burns-direction zoom-in \
  --output kenburns.mp4

Ken Burns options:

• --ken-burns — Auto-create Ken Burns video after screenshot
• --ken-burns-image FILE — Apply Ken Burns to existing image
• --ken-burns-duration N — Animation duration in seconds (default: 5)
• --ken-burns-direction zoom-in|zoom-out|pan-left|pan-right — Animation direction

FFmpeg command used internally:

ffmpeg -loop 1 -framerate 60 -i capture.png \
  -vf "scale=8000:-1,zoompan=z='zoom+0.001':x='iw/2-(iw/zoom/2)':y='ih/2-(ih/zoom/2)':d=DURATION*60:s=1920x1080:fps=60" \
  -t DURATION -c:v libx264 -pix_fmt yuv420p kenburns.mp4

Device Emulation

Common device presets (Playwright has 100+):

python3 scripts/web_capture.py --url "..." --device "iPhone 15 Pro" --output mobile.png

CSS Injection

Hide unwanted elements before capture:

python3 scripts/web_capture.py --url "..." --hide ".ads,.cookie-banner,.popup,.newsletter-modal" --output clean.png

For custom CSS injection:

python3 scripts/web_capture.py --url "..." --inject-css "body { font-size: 24px !important; }" --output styled.png

Integration with Video Workflow

Screenshots can be used as:

• Overlay on video via edit sub-skill PiP overlay
• Slideshow source — capture multiple URLs, concatenate as slideshow with transitions
• Ken Burns source — zoom/pan animation from static capture
• Tutorial B-roll — browser recording for product demos
• Thumbnail background — screenshot + text overlay

Safety Rules

1. Run bash scripts/preflight.sh for output path validation
2. Respect robots.txt and site terms of service
3. Do not capture login pages or authenticated content without user consent
4. Clean up temporary browser recording files

Reference

Load references/web-capture.md for Playwright API details, device presets, and FFmpeg Ken Burns formulas.