motion-graphics-promo
Installation
SKILL.md
motion-graphics-promo
After Effects-quality motion, authored as HTML/GSAP compositions and rendered deterministically with HyperFrames. You get editable source, exact native-screen fidelity and a reproducible render, which a hand-keyed After Effects project does not give an agent.
Source study: Higgsfield AI, "AI Created Every Motion Graphic in This Video" (YouTube W3-RIZ-Ps64, 11:33, Sep 2026), inspected at 720p with contact sheets, plus the pacing of a 4-minute official SaaS product overview. Use them for grammar and pacing only. Never reuse their pixels, music, voice, logos or UI.
1. Brief before motion (lock the story first)
The tutorial spends its first minutes turning a brief into asset choices and a storyboard before anything moves. Do the same, in five lines:
- Audience and moment: who is watching, on which platform, sound on or off.
- One product, two jobs, one next step: the viewer should remember exactly that.
- Proof inventory: real screenshots and screen recordings you actually have, with source build/date. Anything not in this list cannot appear on screen.
- Palette and type: the brand's own identity. Borrow the reference's contrast level (bold condensed type over saturated fields), not its exact colors.
- Aspect: design vertical (1080x1920) as its own composition; don't crop landscape.