skip to content

Vestibular Safety

Parallax, zoom and large movement can trigger vestibular symptoms, so a system offers reduced alternatives such as fades rather than removing feedback. Asked because the OS setting is often ignored.

part ofDesign systems & UX foundationsoverview, primer and where to startread it →
on this pageshow

questions

4

In interface motion design, which kinds of movement most often trigger vestibular symptoms, and what makes them risky?

level: juniorimportance: must knowfreq 45%

answer

  1. eyes versus inner ear
  2. illusion of moving through space
  3. depth: parallax and zoom
  4. big, fast, spinning, looping
  5. motion the user did not cause

basics

~20 s

Parallax, zooming or scaling, large areas sweeping across the screen, spinning, and motion the user did not directly cause. They signal that the viewer is moving while the inner ear feels stillness, and that conflict can cause dizziness, nausea and headaches.

solid answer

~50 s

The vestibular system in the inner ear senses head movement and balance. When a large part of the visual field moves, especially with depth cues, the eyes report self-motion the inner ear does not feel, and for people with vestibular disorders that conflict can cause dizziness, nausea, migraines and hours of recovery. The riskiest patterns are parallax (layers moving at different speeds), zooming or scaling that suggests moving forward, large areas sweeping or rotating, spinning elements, and motion decoupled from the user's input, such as scroll-linked effects that move faster or in a different direction than the scroll. Risk rises with the share of the screen that moves, the speed and distance, repetition, and surprise. Colour and opacity changes, small local movement and content that moves exactly with a drag are usually far lower risk.

go deeper

for a junior

Recall the main triggers: parallax, zoom and scale, large-area movement, spinning, and motion the user did not cause, plus the eye versus inner-ear conflict behind them.

for a middle

Explain the factors that raise risk, such as area, depth cues, coupling to input and looping, and why colour or opacity changes are low risk.

for a senior

Show how you would rate an existing product's motion inventory, including maps, galleries and video, and decide which patterns need alternatives or should go.

for a principal

Discuss how a system bakes trigger awareness into its motion principles so risky patterns are caught at design review rather than after complaints.

## Why motion on a screen can make people ill The **vestibular system** in the inner ear senses head rotation, acceleration and balance. The brain constantly compares its signals with what the eyes see. When they agree, nothing happens. When the eyes report that the world, or the viewer, is moving and the inner ear reports stillness, the brain has conflicting evidence, and some people respond with dizziness, nausea, headaches or disorientation. People with **vestibular disorders** (from inner-ear conditions, migraine, concussion and other causes) can be affected severely: the Understanding document for WCAG 2.3.3 mentions nausea, migraine headaches and potentially needing bed rest to recover. Interface motion becomes a problem when it produces that conflict: when it makes the viewer feel they are moving through space. ## The common triggers | Pattern | Example on a real-estate listings site | Why it is risky | |---|---|---| | **Parallax** | The header photo of a house scrolls slower than the text over it | Layers at different speeds are a strong depth cue that suggests self-motion | | **Zoom and scale** | Tapping a thumbnail zooms the photo to fill the screen; a map flies in to a street | Growing imagery reads as moving forward | | **Large-area movement** | A whole panel of listings sweeps across the viewport | The more of the visual field moves, the stronger the self-motion signal | | **Rotation and spinning** | An auto-rotating 3D floor-plan viewer; a map that tilts and turns | Rotation is often cited as especially provocative | | **Motion decoupled from input** | Scroll-linked effects moving faster, slower or sideways relative to the scroll | The movement does not match what the user's hand is doing | | **Looping or auto-playing motion** | A slow-zoom slideshow of listing photos; a looping drone video behind the search box | It continues whether or not the user wants it, with no chance to look away and recover | ## What raises or lowers the risk Several factors change how provocative a given animation is: - **Size**: a moving icon is not the same as a moving background. Area matters more than almost anything else. - **Speed and distance**: long, fast travel is worse than short, slow travel. - **Depth cues**: parallax, zoom and perspective suggest movement through space rather than objects moving within a flat page. - **Direction relative to input**: motion that tracks a finger exactly during a drag is expected; motion that moves differently from the scroll is not. - **Repetition and duration**: a single brief transition is easier to tolerate than a loop that never ends. - **Surprise**: motion the user did not trigger cannot be braced for. Lower-risk changes include **colour and opacity changes**, small local movement such as a checkmark drawing inside a button, and a short fade. WCAG's definition of motion animation reflects this: it excludes changes of colour or opacity that do not change the perceived size, shape or position of an element. ## How a design system uses this Knowing the triggers lets a system classify motion before it ships: 1. **Inventory** every animated pattern, including scroll effects, maps, galleries and video backgrounds, not just component transitions. 2. **Rate** each one against the factors above: area, depth cues, rotation, coupling to input, looping. 3. **Decide** which patterns need a reduced alternative and which should not exist at all. Decorative parallax on a listing page is hard to justify; a zoom into a photo may be worth keeping in full-motion mode with a gentler alternative. The point is not that motion is dangerous in general. Most interface motion is harmless to most people. The point is that a small set of patterns causes real harm to a real group of users, and those patterns are predictable. ## Common misconceptions - That only flashing content is an accessibility risk. Flashing is a separate seizure concern; vestibular reactions come from movement. - That slow motion is always safe. A slow parallax or slow zoom that fills the screen can still produce the conflict. - That motion the user triggered cannot be a problem. Scroll-linked parallax is triggered by the user and is one of the most cited triggers. - That affected users are a tiny edge case. Vestibular disorders are not rare, and major operating systems ship a system-wide reduced-motion setting that people can turn on.

  • Why is a slow-zoom slideshow of listing photos a concern even though each zoom is gentle?
    It combines several risk factors: zoom is a depth cue that suggests moving forward, the image fills a large area, and the effect starts on its own and loops. Gentle speed lowers the risk of a single cycle but does not remove it, and a user who is affected cannot brace for or escape motion that repeats until they leave the page.
  • Is dragging a map with a finger a vestibular trigger?
    Usually much less so, because the map moves exactly with the user's hand, so the motion is expected and matches the input. The risk returns when the map continues moving on its own, such as a long momentum glide, an automatic fly-to that zooms and rotates, or a tilt into perspective the user did not ask for.

It is like reading a book in a moving car: your eyes say the world is still while your inner ear feels movement, and the mismatch makes some people sick. Screen motion creates the reverse mismatch, with eyes reporting movement the body does not feel.

saying these in an interview costs you the question

  • Thinks flashing is the only motion-related accessibility risk.
  • Assumes slow animation is always safe regardless of size or depth.
  • Believes motion the user triggered, such as scroll parallax, cannot harm them.
  • Treats a colour fade and a full-screen zoom as equally risky.
  • Dismisses vestibular disorders as too rare to design for.
open as a page

For a design system's reduced-motion mode, why should most animations get a gentler alternative instead of simply being removed?

level: middleimportance: must knowfreq 44%

basics

~20 s

Much motion carries information: where a panel came from, that an action worked, that content is loading. Removing it all hides that information. Swapping travel, zoom and parallax for fades or clear instant changes keeps the meaning without the trigger.

open as a page

Under WCAG 2.2, how do 2.2.2 Pause, Stop, Hide and 2.3.3 Animation from Interactions differ in the motion they cover?

level: middleimportance: should knowfreq 40%

basics

~20 s

2.2.2 (Level A) covers motion that starts automatically, lasts over five seconds and runs alongside other content: users need a way to pause, stop or hide it. 2.3.3 (Level AAA) covers motion triggered by interaction: it must be possible to disable it unless essential.

open as a page

A real-estate listings site claims to honour the operating system's reduced-motion setting, yet users with vestibular disorders still report nausea. How do you find and fix the gaps?

level: seniorimportance: should knowfreq 32%

basics

~20 s

Walk the product with the setting on and list everything that still moves. Typical gaps: scroll effects, maps, embedded video and slideshows outside the component system, reduced variants that only shorten durations, and platforms that honour the setting inconsistently.

open as a page