Responsive gestures
“Truly fluid gestures are immediately responsive.” That sentence from Rauno Freiberg’s Invisible Details of Interaction Design is the whole section; the rest is what it rules out. A gesture can have a trigger threshold, but that does not license playing an animation from 0 to 1 once it is crossed. Responsive gestures track the finger from the first millimetre.
Feedback first, then commit#
His example is pinching a card. A naive implementation does nothing until a threshold, then zooms all at once. Rauno is fair to it: pinching enough to get the animation does not feel exactly broken. But the interface gives zero affordance that the card is pinchable when you move slowly, and the gesture is not satisfying to perform.
The better version applies the scale delta immediately, so the card grows under your fingers, and performs the animation once the threshold is passed. The first part is feedback; the second is the commit. Figure 2 puts both implementations under one pinch: drag slowly across the stage and watch which card answers first, then cross the threshold and let go.
function onPinchMove(scale: number) { card.style.transform = `scale(${scale})`}function onPinchEnd(scale: number) { if (scale > THRESHOLD) expand() else settle()}Interruptible means listening#
He finds the counterexample inside iOS. Navigating Settings does not feel as responsive as the App Switcher: a layer slides in from the right, which correctly says it can be dismissed by swiping left, but if you mistap and swipe back immediately the animation does not interrupt. You wait for it to finish. Same platform, same gesture vocabulary, a noticeable difference in how much the interface listens.
Emil Kowalski makes the same demand of pointers. In Train Your Judgement he compares two sidebar hover highlights, one fading in smoothly and one instant. Move the mouse quickly and the smooth one trails the cursor, “always one step behind.” The instant one tracks perfectly: “There’s no delay between your intention and the interface’s response.” Feedback that arrives after the threshold is not feedback; it is a result.
The input device is part of the gesture#
Rauno’s Scrolling section adds a variable. On most operating systems you can scroll any region even when its window is not active, which is great until another window scrolls by accident. With the Magic Mouse he can scroll one window, move the pointer over a second to click or find something, and the scroll events do not register there; scrolling is cancelled explicitly, by focusing another window.
With a traditional mouse like the Logitech MX Master 3, the first window’s scroll is hijacked by the second, and he finds it frustrating daily. The Magic Trackpad and Magic Mouse also unlock direct manipulation on the desktop, like adjusting a slider by scrolling over it in a single interaction.
Two habits follow. Wire the continuous part of a gesture to the continuous part of the input: scale follows pinch distance, offset follows drag, before any threshold logic runs. And make every in-flight animation interruptible by the gesture that started it, so a mistap costs one reversed motion rather than a wait.