BigHugger
sk Skill · heygen-com

hyperframes-keyframes

Use when a HyperFrames composition needs a punch-in, punch-out, zoom, reframe, Ken Burns treatment, camera move, visual match/whip handoff, or other seek-safe 2D/3D keyframes; also for GSAP, CSS keyframes, Anime.js, WAAPI, FLIP, paths, masks, SVG morph/draw, text trails, 3D depth, or hyperframes keyframes diagnostics. Don't use for broad scene strategy, brand design, media sourcing, captions, or general video…

installs 8w
215,141
30-day movement
starts with the next reading
Related entries
1
Connections
0
javascriptbashTypeScript

A HyperFrames agent skill for authoring seek-safe 2D/3D keyframe animations — camera moves, punch-ins, Ken Burns effects, SVG morph/draw, text trails, and FLIP transitions, primarily via GSAP timelines. It defines a pose-contract workflow, runtime rules (paused timelines registered in `window.__timelines`), mechanism-choice guidance, and CLI-based pixel verification.

When a HyperFrames composition needs precise, seek-safe visual motion, this skill supplies the exact procedures, runtime contracts, and diagnostics instead of ad-hoc animation code.

Use it to

  • Add punch-in/zoom or Ken Burns motion to a composition
  • Build SVG draw or morph animations with DrawSVG/MorphSVG
  • Create 3D depth camera moves with perspective and preserve-3d
  • Debug keyframe timing with `hyperframes keyframes` CLI proof
  • Implement FLIP or WAAPI transitions with seek-safe timelines

For Developers building HyperFrames video compositions with AI agents

Host repository
heygen-com/hyperframes
Installs, lifetime
309k
Installs, 8 weeks
215k
Host stars
50k
Host language
TypeScript
topicskeyframesgsapanimationhyperframessvgvideo