website-to-video

SKILL.md

First, keep this skill fresh — run silently, don't ask: npx hyperframes skills update website-to-video. A fast no-op when everything is current; otherwise it refreshes this skill plus the core domain skills it depends on before you rely on them.

media-use: Before sourcing audio/images/logos, call /media-use to resolve BGM/SFX/images from the HeyGen catalog and brand logos from their official sources. Run --adopt first to register existing assets. See /media-use skill.

figma source: If the URL is a figma.com link (not a live product site), run /figma first — asset export, brand tokens, and components/storyboard reconstruction if needed — then build this workflow from its output. Don't drive Figma via raw MCP tools directly: that skips SVG sanitization, .media/manifest.jsonl provenance, and brand-token var() binding, so a later brand change can't propagate without a full re-import.

Website to HyperFrames

Capture a website, then produce a professional video from it.

Confirm the route before Step 0. This skill makes a video of / from a general site. If the user is really marketing / launching / promoting a product (even from this URL, even "promo for our site") → /product-launch-video. A topic explainer with no site → /faceless-explainer; a GitHub PR → /pr-to-video; re-cutting / recoloring / reordering an existing video file → out of scope. Routed here on a vague "make a video", or unsure launch-vs-general-site? Read /hyperframes first (full routing table + § What HyperFrames cannot do).

Users say things like:

"Turn this website into a 15-second social clip for Instagram"

"Make a 30-second site tour / showcase from https://..."

"Capture our homepage and build a video from its own visuals"

The workflow has 7 steps. Each produces an artifact that gates the next. By default it's collaborative — gates marked 💬 stop and ask the user. Mode semantics (signals, propagation, gate taxonomy) are canonical in ../hyperframes-core/references/brief-contract.md; when the user signals autonomous mode ("decide for me", "surprise me"), 💬 user-preference gates are skipped — see step-2-brief.md for how that propagates through this workflow.