It’s clear that animated SVGs are a benefit to any UI. But there are certain applications where video would be better, such as realistic videos or photographic representations. Thus, we suggest using a combination approach: use animated SVGs where necessary; static SVGs for all image assets; compressed video for any tutorial / demonstration / lifestyle video that needs to be included in the app.
Animation should only be used where it has meaning and doesn’t distract the user from completing the task they set out to do. Michael Villar suggests testing this by disabling animations – then, if the flow feels broken, the animations add value.
Animation should also have longevity – it needs to remain just as delightful or helpful for a long time and through repeated use.
Done correctly, animation can greatly improve UX. It can transform an app from a sequence of static boxes into a dynamic set of experiences that both attracts and retains users.