> * Confirmation of a user action
Also making the UI more live by doing a small animation on hover (or focus change) for those of us who still use mice and keyboards.
This helps distinguish clickable/interactive elements from static ones, and helps with discoverability.
Highlighting a row/column heading in a table under the cursor, or a border around a clickable element, etc goes a mile towards making the UI snappy, responsive, and human.
For that, you shouldn't disguise interactive elements as static ones. To begin with ;)
https://stripe.com has a lot of animations in their landing page, just fyi
I like them. They are quite subtle.
agree, i think as long as not everything in the page is moving like crazy, these little animations still looks good
I agree, although otoh we’ve seen a ton of gratuitous motion all over mobile/desktop/web UIs which is totally irrelevant.
Hopefully this trend will pass much like the Photoshop layer effects (bevel emboss, drop shadow, etc) which were everywhere in the late 90s early 00s.
> We shouldn't use them on:
I’m thinking back to my school days, where my fellow students had non-tiling animated gifs as the background image of their Geocities accounts.
* Loading indicator - from a UX perspective we are used to this so having a non-animated loading is weird. I think gmail used to do it but that was back in the mid 2000s.
* Confirmation of a user action - if I have sent an email then a sound and/or animation can feel good. It is not necessary but sort of adds a magic to the application.
* Where the animation is useful in explaining something, for example, an explanation of balancing trees.
We shouldn't use them on:
* Static "non-app" information pages / landing pages etc.
* As a button icon pre-action. E.g. the word SUBMIT sliding from side to side would be annoying!