Turn Motion and Animation Findings into Accessibility Tickets

Motion findings become fixable when the ticket names the moving component, whether users can pause it, and what happens for people who request reduced motion.

Use this guide for autoplay carousels, animated panels, parallax effects, flashing content, loading animations, auto-updating regions, and motion triggered by hover, focus, or scrolling.

Open this motion finding in the generator

What to capture from the finding

Moving component: carousel, ticker, parallax section, animated drawer, loading state, toast stack, video background, or live preview.
Trigger: autoplay, page load, scroll, hover, focus, route change, form update, or user action.
Control available: whether pause, stop, hide, close, reduced-motion, or manual navigation is present and keyboard-operable.
Timing and persistence: how often content moves, updates, flashes, or disappears, and whether it lasts more than five seconds.
User impact: interrupted reading, lost focus context, vestibular discomfort, missed content, or blocked task completion.

Ticket structure

Title:
[Severity] Page or component: moving content cannot be paused, stopped, hidden, or reduced

User impact:
Explain what becomes difficult when content moves, flashes, or changes while the user is reading or operating the flow.

Evidence:
- Page or flow:
- Moving component:
- Trigger and timing:
- Available controls:
- Keyboard or screen reader path:
- Reduced-motion behavior:
- Actual result:
- Expected result:

Likely WCAG references to verify:
- 2.2.2 Pause, Stop, Hide, when moving, blinking, scrolling, or auto-updating content starts automatically and lasts more than five seconds.
- 2.3.1 Three Flashes or Below Threshold, when content flashes rapidly.
- 2.3.3 Animation from Interactions, when motion triggered by interaction cannot be disabled.

Acceptance criteria:
- Users can pause, stop, hide, or reduce non-essential motion before it interrupts the task.
- Motion controls are visible, keyboard-operable, and have clear accessible names.
- Focus does not move unexpectedly and focused content is not replaced while users interact with the component.
- The component respects prefers-reduced-motion for non-essential animation and preserves access to the same information.

Paste your motion or animation note into the generator when you want this structure drafted from raw audit text.

Example conversion: autoplay carousel

Raw note:
Homepage carousel auto-rotates every 4 seconds. There is no pause button. Keyboard focus can land on slide links while the current slide changes.

Developer ticket:
[High] Homepage hero carousel: auto-rotating slides cannot be paused

User impact:
Keyboard and screen reader users may lose context while reading or tabbing through carousel content because the active slide changes automatically.

Evidence:
- Component: homepage hero carousel
- Trigger: autoplay on page load
- Timing: slide changes every 4 seconds
- Current control: previous and next buttons only
- Keyboard path: Tab into carousel links and controls
- Actual result: slide content changes while focus remains inside the carousel
- Expected result: users can pause rotation before interacting with carousel content

Likely WCAG references to verify:
- 2.2.2 Pause, Stop, Hide
- 2.1.1 Keyboard

Acceptance criteria:
- The carousel exposes a visible pause/play control before or within the carousel controls.
- The pause/play control is keyboard-operable and has an accessible name that reflects the current state.
- Auto-rotation stops while keyboard focus is inside the carousel or when the user activates pause.
- Manual previous/next controls still work after auto-rotation is paused.

Example conversion: scroll animation ignores reduced motion

Raw note:
Product comparison cards slide and fade in on scroll even when macOS Reduce Motion is enabled. The animation is not essential to understanding the content.

Developer ticket:
[Medium] Product comparison: scroll-triggered animation ignores reduced-motion preference

User impact:
People who request reduced motion still receive non-essential movement while reading the comparison, which can distract or cause discomfort.

Evidence:
- Component: product comparison cards
- Trigger: scroll into viewport
- User preference: prefers-reduced-motion: reduce
- Actual result: cards slide and fade in with motion
- Expected result: cards appear without non-essential movement when reduced motion is requested

Likely WCAG references to verify:
- 2.3.3 Animation from Interactions
- 2.2.2 Pause, Stop, Hide, if the animation repeats or auto-updates

Acceptance criteria:
- Non-essential slide, parallax, and transition motion is disabled or substantially reduced when prefers-reduced-motion is active.
- The same content remains visible and readable without relying on the animation.
- Focus order and reading order do not change between motion and reduced-motion states.

Common fix directions

Pause before interaction: give users control before moving content steals attention or changes context.
Respect reduced motion: keep information available, but remove non-essential movement for users who request it.
Do not hide the only route: pause, stop, or reduced-motion states must not remove links, form controls, or key content.
Keep controls named by state: a toggle should expose names such as Pause carousel or Play carousel, not only an icon.
Retest the whole component: carousel, ticker, and animation libraries often need keyboard, focus, timing, and reduced-motion checks together.

Paste-ready input for the generator

Motion or animation finding:
Page or flow:
Moving component:
Trigger and timing:
Available pause/stop/hide controls:
Keyboard or screen reader path:
Reduced-motion behavior:
Actual result:
Expected result:
Relevant selector or library:
Retest notes:

Open the accessibility ticket generator and paste this structure with the audit note.