A press is 100 milliseconds
Why the down half of a click is faster than the up.
·3 min read
Two halves
A click is two events that we design as one. The pointer goes down, and a moment later it comes up. Most buttons animate both halves on the same curve for the same time, and most buttons feel slightly late.
The down half is a reflex. You have already decided; the interface only has to agree with you, and anything slower than about 100ms reads as a gap between your finger and the screen. The up half is a consequence. It can take longer, and it reads better when it does.
Press and hold
200ms down, 200ms up
100ms down, spring up
What I use now
Down in 100ms on a plain curve, to 97% of the size. Up on a stiff spring with no overshoot, which lands in about a quarter of a second but feels instant, because it leaves at full speed.
Wide things press less. A card that shrinks by 3% moves its edges by several pixels and looks as if it is falling away from you, so anything wider than about 220px goes to 98.5%.
When not to
Keyboard presses don't scale. Nobody is looking at the key they pressed, and a list whose rows each shrink as you arrow through them reads as noise. Focus moving is the feedback.