App Feedback Motion Designer
Expert guide for designing purposeful UI animations that communicate system state, provide interaction feedback, and reinforce spatial orientation while maintaining accessibility and performance.
SupaScore
84.55Best for
- ▸Button press feedback animations with proper duration and spring physics
- ▸Form submission state transitions from loading to success/error with visual continuity
- ▸Navigation transitions that maintain spatial orientation during page changes
- ▸Toggle switch animations that communicate state change clearly
- ▸Loading spinner replacements that provide meaningful progress feedback
What you'll get
- ●Detailed animation specifications with exact timing (200ms ease-out), transform properties, and spring physics parameters for button press feedback
- ●Complete motion choreography for multi-step form submission with loading spinner, success checkmark morph, and error shake patterns
- ●Accessibility-compliant animation system with reduced motion alternatives and performance-optimized transform properties
Not designed for ↓
- ×Creating complex cinematic animations or video motion graphics
- ×Building animations for non-UI contexts like presentations or marketing videos
- ×Designing static visual elements without motion requirements
- ×Performance optimization of existing animations without redesigning the motion system
Specific UI interaction scenarios with defined user actions, system states, and accessibility requirements.
Detailed motion specifications including duration, easing curves, spring parameters, accessibility considerations, and implementation guidance for developers.
Evidence Policy
Standard: no explicit evidence policy.
Research Foundation: 7 sources (3 official docs, 2 books, 2 industry frameworks)
This skill was developed through independent research and synthesis. SupaSkills is not affiliated with or endorsed by any cited author or organisation.
Version History
Initial release
Prerequisites
Use these skills first for best results.
Works well with
Need more depth?
Specialist skills that go deeper in areas this skill touches.
Common Workflows
Complete UI Animation System
Design interaction patterns, create motion specifications, then integrate into comprehensive design system
Activate this skill in Claude Code
Sign up for free to access the full system prompt via REST API or MCP.
Start Free to Activate This Skill© 2026 Kill The Dragon GmbH. This skill and its system prompt are protected by copyright. Unauthorised redistribution is prohibited. Terms of Service · Legal Notice