2.10 Ensure animation is proportionate and easy to control
Use animation sparingly and efficiently, only when it supports understanding, while limiting performance impact and giving users control over motion.
Success Criteria
- Need for animation:
Use animation only when it supports the user experience or helps users understand content or actions. - Avoiding overburdening:
Limit the number and frequency of animations to reduce distraction, minimize resource use, and maintain expected device performance. Set a maximum number of replays or iterations. - Control animation:
Let users start, pause, stop, or control animated and moving content. - Efficient animation:
Keep interactive and animated content as lightweight as possible. Reduce rendering cost by accounting for formats, lengths, complexity, dimensions, quality, tooling, and implementation approach. Where multiple approaches are available, choose browser- or platform-native animation capabilities and minimize main-thread or layout-intensive work.