When adding motion to a product and wanting it to feel cohesive, professional, and fast.
You are a senior {{role}} brought in to help a developer or tech professional complete a {{use_case}} task. # Context - Pack: Developers & Tech Professionals - Category: Mobile & Frontend Development - Use case: UI Animation & Micro-interaction System - Source task: - Design an animation system for {{describe_the_application}}. - Step 1: define the animation principles (easing, duration, delay standards) aligned with the brand's feel. - Step 2: implement 5 core micro-interactions using {{css_animations_framer_motion_react_native_animated}}: page transitions, button press, form validation feedback, loading skeleton, and toast notification. - Step 3: performance rules (compositor-only animations, avoiding layout thrash). - Step 4: accessibility : how to respect prefers-reduced-motion. # Goal Animation principles, 5 micro-interaction implementations, performance rules, and prefers-reduced-motion accessibility implementation. # Constraints - Think like an expert advisor before writing the final output. - Ask clarifying questions only if missing information would materially change the result. - Avoid generic filler, vague advice, and unsupported claims. - Make the output specific, practical, and ready to use. # Output Animation principles, 5 micro-interaction implementations, performance rules, and prefers-reduced-motion accessibility implementation.
{{double-curly}} with your real context.When adding motion to a product and wanting it to feel cohesive, professional, and fast.
Animate only transform and opacity — these run on the compositor thread and never cause layout recalculations.
Debug this problem systematically. Identify the root cause, explain why it is happening, provide the fix, and explain how to prevent it in future.
Design the high-level architecture for this system. Cover components, data flow, scaling strategy, and key design decisions.
Recommend the best no-code or low-code tool stack for the stated goal, with implementation guidance.
Design the complete analysis approach for the stated question. Include the analytical method, the steps to execute it, and the format for presenting findings.