Experiment 006

Motion as opt-in

Activate all components in both variants. Where does the skeleton shimmer stop when reduced motion is enabled?

Motion implementation pattern

A · Opt-outB · Opt-in

Motion in base styles with per-component reduced-motion overrides — one override is missing.

Reduced motion disabled · in variant A

1 · Accordion

Panel content appears with a 450 ms height transition.

2 · Switch

Off

3 · Loading button

4 · Toast

Draft saved.

5 · New component: skeleton card

Added later: variant A deliberately omits its reduced-motion override, while variant B defines the animation only within the opt-in motion rule.

Instrument

For each variant, trigger all four interactive components and sample running document.getAnimations() on each of 50 frames. The skeleton shimmer remains active.