Setting the file. One moment.
Skill 18 · Hyperframes Animation
Subchapter 18.56
rules-index.mdMarkdown21 KBView on GitHub
Atomic motion recipes. Each lives at rules/<name>.md. Compose 2-4 per scene with a single paused timeline.
Stated once here so individual rules don’t repeat it. Every recipe in rules/:
window.__timelinesfromTo with explicit from-states (t=0 correct under seek; immediateRender: false when re-owning a target), absolute values — never relative += tweens; state readable as a pure function of timeline time, no mutable trackers;Math.random(), no Date.now() — index-derived pseudo-random and baked schedules only; finite repeats, never repeat: -1;width/height/top/left tweens are forbidden (use scale/translate proxies, masks, or anchored-layout-expand);items × stagger ≤ ~0.5s);transition on animated elements (they interpolate independently of seek and flicker) and hints compositors with will-change: transform where many tweens run at once;offsetHeight, getBoundingClientRect) at build time only in a single-scene composition — in a multi-scene montage, later clips may not be laid out yet: use authored CSS-matched constants;hyperframes-core (class="clip" + data-* timing) — rule snippets show mechanism DOM only, not the scene scaffold.A rule’s own Critical Constraints section lists only what is SPECIFIC to that rule beyond this contract.
blueprints-index.md — the scene-shape templates (this skill’s “blueprints”) that compose these rules into full shotstechniques.md — broader motion-design techniques (SVG path drawing, Canvas 2D, CSS 3D, kinetic type, variable fonts, compositing); a few rules cite ittransitions/ — scene-transition catalog (shared skill; story owns transition_in, the harness injects it)