Motion
Motion in Koder UI — index over 3 sub-specs: physics (principles + springs + reduced-motion), easing-duration (tokens), transitions (pattern catalog). Material parity broken into 3 discoverable pages.
Spec — Motion (index)
Facet *isual*do Koder Design. Material parity: https://m3.material.io/styles/motion.
Motion in Koder UI is documented as 3 discoverable sub-specs. Pick the one that matches your task:
| Sub-spec | What it covers |
|---|---|
motion/physics.kmd |
Principles, performance budget, forbidden patterns, *educed-motion contract* and *pring tokens*(Material 3 Expressive — stiffnessdampingmass) |
motion/easing-duration.kmd |
5 *uration tokens*(motion-instant → motion-long) and 5 *asing curves*(ease-standard, ease-decelerate, ease-accelerate, ease-emphasize, linear) |
motion/transitions.kmd |
7 *ransition patterns*(fade, scale, slide, container transform, shared axis, push/pop, cross |
Quick decision
- Animation *nterruptible*mid-flight (drag, fling) → spring tokens in
motion/physics.kmdR4 - Deterministic timed transition → duration + easing in
motion/easing-duration.kmd - Screen
toscreen or modal entry → pattern catalog inmotion/transitions.kmd
Every animation MUST honor the reduced-motion contract — see motion/physics.kmd#R1.