interaction-motionlisted
Install: claude install-skill vmobifystudio/app-dev-team
# Interaction and motion
Motion has one job: **tell the user what just happened and where they are now**. Motion that decorates
costs battery, costs frames, and costs the users who cannot tolerate it.
## The durations
Do not invent a duration. Use the token, and use the shortest one that reads:
| Token | Use |
|---|---|
| `fast` 150ms ease-out | state feedback — press, toggle, ripple, checkbox |
| `base` 250ms ease-in-out | element enters or leaves within a screen |
| `slow` 400ms | full-screen transition, only when it carries spatial meaning |
Anything longer than 400ms is not motion, it is a wait — and a wait needs progress, not an animation.
## Feedback timing
| Elapsed | The interface owes the user |
|---|---|
| < 100ms | nothing — it feels instant |
| 100ms–1s | immediate visual acknowledgement that the input landed |
| 1s–10s | a determinate progress indicator if progress is knowable, an indeterminate one if not |
| > 10s | the ability to leave and come back, and a way to cancel |
A spinner with no cancel on a long operation is a trap; that is a reliability finding as much as a
design one.
## The rules
- **Motion must be interruptible.** A user tapping during an animation is answered immediately, not
after it finishes.
- **Position must be preserved.** An element that moves animates from where it was; an element that
is replaced cross-fades. Getting this backwards is what makes an interface feel arbitrary.
- **Respect reduce-motion.** `UIAccessibility.isRe