What problem does it solve?
This Skill gives a complete, deterministic workflow for turning a video idea into seekable, render-safe HTML+GSAP animations for HyperFrames.
Core Features & Use Cases
- Composition authoring in HyperFrames HTML: author scenes as HTML with
data-* timing attributes, GSAP timelines, and correct media/audio separation.
- Brand-aligned visual direction: enforce a design system by requiring
design.md (or guiding fallback to style presets) before writing any composition HTML.
- Production-grade motion + transitions: apply non-negotiable guardrails for entrances, scene transitions, timeline registration, and deterministic animation rules.
- Text, captions, and sync-ready overlays: integrate caption timing workflows, audio-reactive guidance, and typographic safety checks for readable video output.
- Quality assurance for agents: run lint/validate/inspect style checks and use the animation-map script to catch choreography and layout issues.
Quick Start
Use the hyperframes skill to produce a complete HTML video composition by following the step order in SKILL.md, starting with brand system selection and finishing with GSAP timeline registration.