What problem does it solve? Interfaces often feel sluggish or unpolished because of subtle animation mistakes: wrong easing curves, excessive durations, scale-from-zero entrances, and non-interruptible keyframes. This Skill applies Emil Kowalski's design engineering philosophy to review and fix those details in UI code. ## Core Features & Use Cases - Animation Decision Framework: Determines whether an element should animate at all based on usage frequency, then selects the correct easing curve, duration, and technique (CSS transitions, springs, WAAPI). - Structured UI Review: Outputs a mandatory Before/After/Why markdown table covering issues like transition: all, ease-in misuse, wrong transform-origin on popovers, and missing :active press states. - Component Polish Patterns: Provides concrete CSS and Framer Motion patterns for buttons, tooltips, popovers, toasts, drawers, drag gestures, stagger animations, and reduced-motion accessibility. - Use Case: Paste a React component with a dropdown that feels sluggish, and receive a table of fixes such as switching ease-in to a custom ease-out curve and reducing duration from 400ms to 180ms. ## Quick Start Review my dropdown component's CSS animations and suggest improvements using the design engineering review format.
