0055: Motion in the Monitor
On this page
Status: accepted. It adds to 0023's list of places the app moves.
Context
Paper keeps motion to a few places where it says something: a share's wire, the boot sequence, a row opening, a switch thrown. The Monitor is mostly data that changes while you watch: requests arriving, a trace opening, a chart over a day. Moving that data, rather than decorating it, helps the eye follow what changed. Motion that runs on its own or bounces would make a screen you leave open tiring.
Decision
The Monitor's screens, Requests' traces and Home's Monitor sections may move in these places only, each driven by real data or a click:
- Live arrivals: a new request, canonical line or Needs a look item slides in, and the rows below move down with it. Bursts are capped at about four animated a second; the rest appear in place. A new row's lamp pulses once.
- Charts drawing in: on first show, bars grow from zero, the waterfall's bars grow from their start in the order they started, lines and bands draw left to right, heatmap cells fade in by column, and gauges and meters fill to their value. Changing a range or zoom moves marks to their new place; it doesn't redraw them.
- Numbers: a count, average or percentile counts up to its value once when it changes.
- Selection: the active tab's pill slides to the tab, content cross-fades with a 4 px rise, a row expands into its group, and folded stack frames open by height.
- The dependency map: with live data, a small pulse travels an edge for each call, at most four a second per edge.
Durations are 120 to 500 ms, eased out or sprung without visible overshoot. Nothing loops while the data is still. With reduced motion, every one of these is an instant change or a 120 ms fade, and the map shows a count instead of pulses.
Alternatives
- No motion beyond the existing list keeps the app quieter, but a live list that jumps, or a chart that pops in whole, loses the eye.
- A charting library's animations would bring motion the rules don't allow and colors outside Paper's tokens.
Consequences
- Every chart and live list carries its own reduced-motion path, and tests cover both.
- The list in CLAUDE.md grows by these, and any new motion still needs a reason of this kind.