← ClaudeAtlas

hyperframes-keyframeslisted

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 planning.
NafisRayan/100x-Agent-Toolkit · ★ 1 · AI & Automation · score 64
Install: claude install-skill NafisRayan/100x-Agent-Toolkit
# HyperFrames Keyframes Keyframes are a pose contract: visible states, continuous subject identity, seek-safe runtime, verified pixels. Use `hyperframes-animation` for broad scene recipes. Use `hyperframes-cli` for full command docs. Use `references/keyframe-patterns.md` only when choosing implementation mechanisms, not visual style. ## Creator editing boundary Keyframes own visual motion, not clip assembly. Source-range hard cuts, trim, splice, and reorder belong to `/hyperframes/hyperframes-core`: author one media element per kept range, place it with `data-start` and `data-duration`, and select its source offset with `data-media-start`. Adjacent ranges make a hard cut. A crossfade uses overlapping clips on different tracks plus visual opacity keyframes; sound fades use `/hyperframes/hyperframes-audio`. | Creator request | Truthful mechanism | | --------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Punch-in / punch-out | Keyframe `scale` with `x`/`y` or percentage translation on a non-timed visual/crop wrapper inside the