What problem does it solve? Interfaces often feel sluggish or unpolished because of subtle animation mistakes: wrong easing curves, excessive durations, incorrect transform origins, and non-interruptible keyframes. This Skill encodes Emil Kowalski's design engineering philosophy to catch and fix those invisible details in UI code. ## Core Features & Use Cases - Structured UI Reviews: Audits animation and interaction code against a checklist covering easing, duration, transform-origin, stagger, and press feedback, outputting a Before/After/Why markdown table. - Animation Decision Framework: Guides whether to animate at all, which easing curve to pick, how long it should run, and when to use springs versus CSS transitions. - Component-Level Guidance: Covers buttons, popovers, tooltips, gestures, clip-path patterns, performance rules, and reduced-motion accessibility via seven reference documents. - Use Case: Paste a dropdown component with transition: all 300ms ease-in and receive a table of concrete fixes, such as switching to ease-out at 150-250ms and setting the transform origin to the trigger. ## Quick Start Ask the assistant to review your React or CSS component's animations and interaction polish using the design engineering checklist.
