„Animation is not about making your app cool. It’s about providing your users with the experience they expect.“ – Nick Babich
The first topic of my 7 parts blogpost series is animation. There are several purposes of animation in apps.
1 show status
It is helpful for the user to see the current status of what’s happening in the app. Examples include showing a „loading indicator“, a „pull to refresh“ animation or an animation that indicates a problem.
2 navigation and transitions
Animated transitions explain changes in the screen and provide valuable context. When a button changes its function (e.g. a play button turning into a pause button or the change in the example below) it can be helpful to animate this transition so that the user understands why there is a change. You can also use them to show the visual hierarchy between objects. This example (source) shows several transitions where the state changes:
3 visual feedback
This might be the most important animation because a lack of visual feedback can be really confusing. First of all, we want to make controls appear tangible and when they are tapped we need to provide a visual feedback to reassure the user that tapping it actually worked and then visualize the results of the action.
This GIF (source: Material Design) shows buttons responding to a user’s tap:
via Tumblr http://ift.tt/2CDo2cL