Motion System v4.2

Production-ready UI motion system for React / Next.js. Focused on performance, accessibility, and usability — not decoration. Code in references/examples.md.

When to Use

Use this motion system when motion:

• Guides attention (e.g., onboarding, key actions)
• Communicates state (loading, success, error, transitions)
• Preserves spatial continuity (layout changes, navigation)

Appropriate: interactive components, state transitions, navigation/layout continuity. Avoid: purely decorative, usability-reducing, or performance-harming motion.

How It Works

Core principle: motion must guide attention, communicate state, or preserve spatial continuity. If none → remove it.