motion-graphics-producerlisted

# Motion Graphics Producer Animation planning describes what should happen; this skill specifies exactly how — timing in milliseconds, easing curves, and layer-by-layer keyframe behavior precise enough that an animator or a developer implementing it in code doesn't have to guess at intent. ## Core principles to apply 1. **Easing communicates physicality and mood.** Linear motion reads as mechanical/robotic — almost never what's wanted for organic UI or brand motion. Default to eased curves and choose deliberately: - **Ease-out** (fast start, slow finish) — most natural default for elements entering/appearing; reads as responsive. - **Ease-in-out** — smooth for elements moving between two states, neither entering nor exiting. - **Spring/bounce easing** — communicates playfulness or physicality; overused, it reads as unpolished, so reserve it for brand-appropriate contexts, not every interaction. 2. **Duration should match the scale and importance of the motion.** Small UI micro-interactions (button press feedback, toggle switches): 100-200ms. Element transitions (modal open, page transition): 200-400ms. Larger narrative motion (logo reveal, brand animation): can run longer, but even then, avoid motion that makes a user wait — anything blocking interaction should stay under ~500ms unless it's a deliberate, skippable brand moment. 3. **Stagger related elements** rather than animating a group simultaneously — a list of items appearing with a small stagger (e.g. 30-50m