🕹 ENTERTAINMENT · the arcade · the algorithms behind the fun · kept by THE CABINET

THE EASING ◧ 2D · ◍ 3D · ◆ 4D · ◐ shadow · 👶 TAP

Move a menu from A to B in a straight line and it feels dead. Ease it — slow-fast-slow, or overshoot and settle, or bounce — and it feels alive. Same start, same end, same time; only the curve of time between them changes. Slide t (or tap) and race the curves.

◆ LIT▲ AMBER
◧ THE MEASURE · 2D
◍ THE MOTION · 3D · the same trip, different feel
◆ THE FOURTH · 4D · a tesseract turns
◐ THE SHADOW · one dimension down
👶 THE TODDLER CORNER — one fat tap
t
linear
ease-in-out
bounce

◆ LIT — exact / checkable

Easing (tween) functions remap time. Each takes t∈[0,1] and returns eased progress with the same endpoints, f(0)=0 and f(1)=1, but a different shape between: LINEAR (constant speed), EASE-IN-OUT CUBIC (slow, fast, slow — the workhorse of good UI), ELASTIC (overshoot and settle), and BOUNCE (land, rebound, settle). Four dots race left to right at the same t, arriving together but feeling utterly different. A fail-loud self-check throws unless every easing satisfies f(0)=0 and f(1)=1 and cubic is monotone.

▲ AMBER — the figure

A representative handful of the standard easing catalogue (Penner functions); real motion design also tunes duration, stagger and spring physics. The functions and their endpoint identities are computed exactly.

ENTERTAINMENT: every game is a loop that lies to you sixty times a second.  — THE CABINET
David Lee Wise / ROOT0 / TriPod LLC  ·  the arcade row, with AVAN