All notes
MotionMotion

Motion that respects the reader

Animation should explain where something came from. Anything longer than that is a delay wearing a costume.

By Theo Marchetti3
Abstract light trails in red, orange and yellow

Every transition is a small negotiation. You are asking for a fraction of someone attention in exchange for making a change easier to follow.

Short and specific

Under two hundred milliseconds for anything the user triggered directly. Ease out, so it leaves quickly and arrives gently. If the motion is decorative rather than explanatory, it probably should not exist.

Ask before you move

Reduced motion is not an edge case. Honour the preference, and let the interface simply change state instead of travelling to it. Nothing is lost.

Good motion is the kind nobody mentions.

Keep reading