Interface motion earns its place when it explains a relationship. A panel that grows from the button you pressed tells you where to look when you close it. A list item that slides up to become a header tells you it is the same object, not a new one.

The test

Ask what the animation would say if it were a sentence. "This came from there." "This is still that." "That is gone and is not coming back." If it says nothing, it is decoration, and decoration on a control is noise the user has to filter every single time.

If you cannot write the sentence, cut the animation.

Duration follows from the sentence. A relationship that is obvious can be stated quickly, around 150 milliseconds. A relationship that changes the whole screen needs 300 to 400 to be legible. Anything past half a second is the interface talking over the user.

And when they ask you to stop

Respect reduced motion, and respect it properly. It does not mean removing feedback; it means removing movement. Cross-fade instead of slide. Keep the meaning, drop the travel. A person who gets motion sick from your interface is still trying to use your interface.

Written by Raion