animate

To add purposeful UI motion, analyze the target feature for opportunities to clarify feedback and state changes, then propose a cohesive animation plan using CSS transforms and opacity. This improves usability and guides user attention without distraction.

Design principles for entrance and transition animations dictate that motion should clarify feedback, emphasis, and transitions. Apply subtle animations across interaction flows to reduce cognitive load and confirm user actions like form submissions.

To handle prefers-reduced-motion accessibility considerations, ensure proposed entrance, hover, and state-change animations respect user settings. Design motion that provides timely feedback while adhering to accessibility guidelines and performance budgets.

Yes, you can use CSS transforms and opacity for micro-interactions across web and mobile apps. These properties allow you to implement lightweight UI feedback and state-change animations that clarify transitions within performance budgets.

You should avoid motion design when it distracts from core tasks or fails to clarify feedback and transitions. Motion should reduce confusion and cognitive load; if an animation does not guide user attention or confirm an action, it should be omitted.

Yes, this animate Skill works for feature design reviews and UI component behavior planning. It identifies motion opportunities across interfaces and proposes implementation strategies for entrance, hover, and state-change animations that improve usability.