Reducing motion need not remove the identity or hide the headline. Agree a static or restrained state that preserves the information and composition. A supplier should demonstrate the normal and reduced-motion journeys, not simply switch every animated element to invisible.
Who should use this acceptance brief
Design-led websites with decorative animation. Use this as a scoped website handover task. Where real system evidence is required, teaching examples are not a substitute.
Source-bound platform fact
The prefers-reduced-motion media feature reports a user preference for reduced non-essential motion. The appropriate alternative still needs design and interaction review. MDN: reduced motion · Checked 16 October 2026.
Filled teaching example
Synthetic example, not a client case. Finite inputs, expected decisions and counterexamples follow; no live integration is claimed.
On narrow screens, scroll to read the complete table.
| Input / case | Check basis | Expected decision |
|---|---|---|
| reduce | static composition | identity visible |
| no-preference | normal approved motion | normal |
| unknown setting | conservative preview | static proposal |
Run the acceptance exercise
- List decorative movement separately from essential state feedback.
- Approve a still frame and ensure text and actions remain visible without the timeline running.
- Test the setting before load and after a preference change in the supported browser.
Interpret the result and retain evidence
The fixture chooses a proposed presentation state; it is not a media-query implementation. Capture both actual browser states at the same width and compare content visibility, focus and composition. Do not claim an animation was preserved just because its DOM node remains in a hidden layer.
Limits before implementation
No authorisation to alter MadRaven’s existing homepage or animations. Not a full accessibility or performance certification.
Replay the finite example
Save both files in one folder and run with Node22.13 or newer. The example sends no network requests and changes no account or site. Filled inputs and expected outputs · Inspectable functions
node decision-check.mjs reduced-motion-brand-acceptance.json