Rafi Wirana

Design Engineer

Dynamic Text

The art of change lies not in what moves, but in what stays still.

I've spent countless hours watching users struggle with interfaces that demand too much mental energy, their eyes darting back and forth trying to figure out what actually changed. Most interfaces treat text updates like a complete replacement—old text disappears, new text appears, wasting cognitive energy and breaking reading flow.

Dynamic text takes a different approach. It recognizes that in most updates, only a small portion actually changes. "Build is running" becomes "Build is complete"—but why animate the entire phrase when only "running" → "complete" carries the new information? A diffing algorithm isolates the meaningful change and lets everything else stay perfectly still. When I first implemented this, the difference was immediate. Users stopped pausing, simply understood what changed, and moved forward. The best interfaces become invisible, and by animating only what matters, this approach maintains clarity across constant updates while reducing cognitive fatigue.

Morph (default)

Build is queued

Slide Up

Build is queued

Slide Right

Build is queued

Fade

Build is queued

Scale

Build is queued

Typewriter

Build is queued

Add this to your project

Get started in seconds with detailed setup instructions.

Get Started
Copy link