HyperFrames CLI

Everything runs through npx hyperframes unless project instructions specify a local wrapper. Obey the local wrapper exactly. Requires Node.js >= 22 and FFmpeg.

Workflow

1. Scaffold — npx hyperframes init my-video (or capture from a URL)
2. Write — author HTML composition (see the hyperframes-core skill)
3. Lint — npx hyperframes lint
4. Validate — npx hyperframes validate (runtime errors + contrast)
5. Visual inspect — npx hyperframes inspect
6. Preview — npx hyperframes preview opens Studio, the timeline editor where the user can manually edit anything (not just watch). Review there, then ask before rendering.
7. Render — pick the variant:
   • Iterate: npx hyperframes render --quality draft
   • Deliver: npx hyperframes render --quality high --output out.mp4
   • CI / cross-host repro: npx hyperframes render --docker --strict --output out.mp4
   • Cloud (long / large): npx hyperframes lambda render ./my-project --width 1920 --height 1080 --wait (see Lambda below)

Run lint, validate, and inspect before preview. lint catches missing data-composition-id, overlapping tracks, and unregistered timelines. validate loads the composition in headless Chrome and reports runtime console errors plus WCAG contrast issues. inspect seeks through the timeline and reports text spilling out of bubbles/containers or off the canvas — and, when a *.motion.json sidecar is present, verifies motion intent (entrances firing under seek, stagger order, in-frame, liveness) against that same seeked timeline.