animation-reverse-engineering

# Animation Reverse-Engineering → Production Port > Source & upstream: [scriptscrypt/animation-reverse-engineering](https://github.com/scriptscrypt/animation-reverse-engineering) — improvements land there first. Turn a motion reference into faithful production code via a measured, frame-level pipeline instead of eyeballing. **Eyeballing a video at 1× lies about easing, stagger order, overlap, and timing** — always dissect first. ``` acquire → overview → dissect → analyse → (prototype) → port → verify → document ``` ## Phase 0 — Classify the animation Before anything, decide which species you're studying. It changes the analysis checklist and the port architecture: | Species | Driven by | Examples | Port shape | | --- | --- | --- | --- | | **Timeline choreography** | Time (mount, trigger) | Page entrances, text sweeps, staggered lists, modals | Keyframes, springs, delays, `AnimatePresence` | | **Interaction-driven** | User input (drag, scroll, hover) | Scrubbers, sliders, pull-to-refresh, scroll scenes | One progress value → property mappings + derived discrete state | Hybrids exist (an interaction that *triggers* timelines — e.g. release-to-reset rewinds). Classify each layer separately. ## Phase 0.5 — No reference yet? Help the user discover one If the user wants a great animation but has no reference link, don't invent motion from scratch — send them hunting and offer this shortlist (full list, search phrases, and capture tips in `references/discovery.md`): - **[6...