MOTION STUDIES / 01—04

Small movements.
Clear responses.

Select, switch, open and close. A few places to feel how the components respond.

01 / SELECTIONTABS
Idea

A place to begin.

A few notes. A rough shape. Something worth trying.

Follow the selection.

A single line carries your place from one tab to the next.

02 / FEEDBACKSWITCH + BUTTON

Changes stay in this preview.

Change one thing.

A settled switch. A save button that keeps its shape.

03 / DISCLOSUREACCORDION

Make room.

Content opens in place, with a gentle change in height.

04 / CONTEXTDIALOG + SHEET

A little more context.

Overlays arrive softly and leave promptly. Focus returns with them.

NOTES TO SELF

A shared rhythm.

Quick feedback. A little more time for movement. No loops, bouncing panels or moving targets.

See the foundations
Feedback
160ms
Colour
280ms
Movement
440ms

These studies use the library components. Your device’s reduced-motion preference applies throughout. Saves are simulated and reset when you reload.