Reduced Motion

Screens that slide and scale usually help comprehension, because they show where something came from and where it went without anyone having to explain it. The problem was that the same movement does not land the same way for everyone.

People with a disorder affecting the inner ear's balance function feel genuine dizziness and nausea when a large part of the screen moves. People who get migraines find headaches worsened by a background scrolling at a different speed from the page. On the receiving end this is severe enough to make a product unusable, while on the building end the screen works fine, so it never registers as a defect.

The fix was to let the operating system carry the message. A user turns on reduce motion once in system settings, which spares them asking every product individually, and products read that flag and cut their movement back on their own.

The value set in the operating system gets read from the page. On the web the condition is called prefers-reduced-motion, and you write a separate set of rules that apply when it is on.

Reducing is not the same as removing. The fact that something changed state still has to come through, so the usual substitutions are three.

1. Trade position changes for opacity changes. A panel that slid in from the side fades in where it already is.
2. Drop scaling and rotation. Large areas of the screen moving is the main trigger, so small micro-interactions usually stay. A micro-interaction is the brief response attached to a small action.
3. Stop anything that loops on its own. A background scrolling at a different rate, a banner that advances by itself — movement the user never started.

Where to put the default is a decision too. The common approach is to ship the motion and reduce it for people who have the setting on, though some teams simply never use full-screen movement in the first place.

"Did anyone check what this screen transition does with reduced motion on?"

Asking whether the screen still works correctly under the setting.

"We're killing the parallax entirely under reduced motion and pinning the background."

The different-speed background effect gets removed conditionally.

"You said reduce, but it vanished completely and now I can't tell whether it saved."

Removing the movement also removed the signal that state had changed.

Pagedeck added this after shipping an effect where document cards rise into the list in sequence. With the setting on, Noa found the cards appearing all at once with no indication at all, so there was no telling whether the save had finished or the screen was half drawn. Theo reworked it to drop the position change and keep the fade. The item lives on the accessibility checklist, so it gets checked whenever a new effect goes in.