Animate UI

VerifiedStable

Animation conventions, easing curves, and transition patterns

v1.0.0·Prototyper·Animation

Comprehensive animation guide for Prototyper UI — five copy-paste patterns covering 95% of use cases, easing tokens, duration tiers, press feedback, overlay enter/exit, and accessibility-first motion design.

$curl -fsSL https://prototyper-ui.com/install.sh | bash -s animate-ui

$claude skill add https://prototyper-ui.com/install.sh animate-ui

What Your AI Learns

Five copy-paste patterns — overlays, dialogs, sheets, press, state transitions

Easing tokens — signature ease-out-fluid and 6 built-in curves

Duration tiers — 100ms instant to 350ms long, with decision rules

Per-component overlay class strings — ready to paste

Press feedback — exact scale values for buttons, menus, and controls

Accessibility — prefers-reduced-motion checklist for every pattern

Performance rules — only transform, opacity, clip-path

Prototyper UI

All Skills