Entry 24 · the alphabet of motion

X

X-axis

Horizontal travel — the axis of journey, of left and right.

CSS @keyframes · xaxis

The long entry

X-axis motion narrates progress. Left-to-right reads as forward in left-to-right languages; right-to-left in others. Moving an element along X is the most common animation primitive in modern UI: the slide, the carousel, the page transition. Almost every interaction begins by deciding which way along X the user is going.