What problem does it solve? Building HTML-based video compositions requires a repeatable dev loop: scaffolding projects correctly, catching layout and timeline errors before rendering, previewing changes live, and producing final MP4 or WebM output. This Skill guides the full HyperFrames CLI workflow so you avoid broken renders, text overflow, and environment misconfiguration. ## Core Features & Use Cases - Project Scaffolding: Run npx hyperframes init with templates like blank, warm-grain, or kinetic-type, with options for video, audio, Tailwind v4, and non-interactive CI mode. - Validation & Visual Inspection: Use lint to catch missing composition IDs and overlapping tracks, and inspect to detect text spilling out of containers or off the canvas in headless Chrome. - Preview & Render: Hot-reloading preview server plus configurable rendering with quality tiers, fps, formats (MP4/WebM), Docker reproducibility, and parametrized variables. - Use Case: You scaffold a product-promo video, lint and inspect it to fix caption overflow, preview at a custom port, then render a 60fps high-quality MP4 for final delivery. ## Quick Start Ask the agent to scaffold a new HyperFrames video project, lint and visually inspect it, then render the final MP4.
