All work 08 / 08 · Live Orders Dashboard

Race-day energy for order data.

A realtime order leaderboard inspired by MotoGP timing screens — live rankings, position-change choreography, and enterprise-grade legibility under thousands of updates a minute.

Role
Design & engineering
Timeline
2023
Stack
React · WebSockets · FLIP animation · Virtualization
Status
Live on office screens

01Problem

Realtime dashboards usually fail in one of two ways: they update so fast they're unreadable, or they're throttled so hard they're not really live. This one needed to run on a wall, all day, and make a sales floor glance up when something changed.

02Approach

  • MotoGP grammar. Position numbers, gap-to-leader, and overtake flashes — a visual language people already read at 300km/h, borrowed for orders per minute.
  • FLIP choreography. Rank changes animate as physical overtakes: measure, invert, play. The eye tracks who moved without reading a single number.
  • Update batching. WebSocket bursts coalesce into one choreographed reflow per second — live enough to feel instant, calm enough to stay legible.
  • GPU-only motion. Transforms and opacity exclusively; the board holds 60fps on a five-year-old TV stick.

03Impact

60fps
Under thousands of updates/min
All-day
Wall display, zero babysitting
Instant
Read-at-a-glance rank changes

04Lessons

Delight in enterprise software isn't decoration — it's information design with a pulse. People trusted the board because the motion meant something, every time.