Site Motion Excellence Director

Use this skill before adding substantial motion to a website or app.

Workflow

1. Identify the brand, route, audience, and first user task.
2. Define the first read before animation.
3. Name the motion job: orient, reveal, explain, confirm, compare, express brand, or convert.
4. Pass the still-frame gate.
5. Write a beat sequence: setup, trigger, primary move, secondary support, hold, final state.
6. Choose the lightest runtime that preserves the intent.
7. Specify reduced motion in the same pass.
8. Implement only after the spec is clear.
9. Verify with browser screenshots, mobile, reduced motion, and video/frame proof.
10. Score with the excellence gate.

Runtime Rules