Proof Pack · All families
Devon Park × Tilt · Ops Dashboard
Tilt, One Screen To Run The Day
An ops team flying blind across five tools got one realtime dashboard, built and documented, that runs the floor.
Tilt moves freight, and its dispatch team ran the day from five browser tabs and a group chat. I designed and built one dashboard around the three numbers that actually decide a shift, and shipped it with the docs to own it.
Client
Tilt, logistics startup
Engagement
Design and build, ten weeks
Stack
TypeScript, React, a typed API, and tests
What shipped
42
Tests Written
1
Dashboard Shipped
1
Runbook Delivered
Delivered across a focused ten-week engagement, end to end.
Build log
The work at a glance
$ git log --oneline --stat
- Where We Started
Dispatch watched five dashboards and a chat to answer one question: what needs attention right now. Nothing agreed, and refreshes were manual.
+ What We Changed
One screen, three live numbers, and a single attention queue. Built on a typed API with tests, so it is correct and stays correct.
~ What We Measured
I documented what I built and shipped. Throughput and on-time rates live in Tilt's own analytics, so those stay with them.
--stats 10 week engagement 1 dashboard shipped 42 tests written 1 runbook delivered
The Challenge
Five tabs, one question, no answer
Tilt's dispatchers are fast, but the tools fought them. Truck status lived in one tool, exceptions in another, ETAs in a third, and the real coordination happened in chat. To answer the only question that matters on a shift, what needs me right now, someone cross-checked five screens and trusted their gut. The brief was to make that question answerable in a glance, and to build it so it would not rot.
Source Material
I worked from a week on the floor with dispatch, the existing tools and their APIs, the chat logs where the real work happened, and the team's own definition of an exception.
Artifact 01
A week of dispatch chat, tagged by the decision behind each message
Artifact 02
The five old tools, mapped to the one question they could not answer
Artifact 03
The typed data model the dashboard is built on
Realtime
A motion study stands in for the live dashboard updating on the floor.
The Approach
I built the one screen that answers it
I found the three numbers a dispatcher actually steers by, designed a single screen around them, and built it properly: a typed API, real tests, and an attention queue that surfaces only what needs a human. Then I wrote the runbook, so the team extends it without me. It is not a prototype; it is the thing they run the floor on.
1
Spent a week on the floor with the dispatch team.
2
Found the three numbers a shift actually steers by.
3
Designed one screen and a single attention queue.
4
Built it on a typed API with real test coverage.
5
Shipped it with a runbook the team owns.
The Evidence
The dashboard, in production
What I designed and shipped. Operational outcomes live in Tilt's own analytics, not mine.
The Tilt dashboard as dispatch runs it: three live numbers up top, a single attention queue below, and only what needs a human surfaced.
Data Map
How five tools and a chat became one typed source the dashboard reads from.
The Screen
Three live numbers, one attention queue, one question answered in a glance. Everything else is one click away, not in your face.
Built To Last
A typed API, forty-two tests, and a runbook. The team ships changes against it without calling me, and it stays correct.
What I Did Not Measure
Throughput, on-time rate, and cost sit in Tilt's analytics, not mine. I document what I built; the results stay with the client.
Reflection
One screen the floor actually runs on
Dispatch runs the shift from one screen now, and the team ships against it without me. The dashboard, the data model behind it, and the lead's note below are the record of the work.
“Devon shipped the one screen we actually run the floor from. It is fast, it is correct, and we extend it ourselves.”
Head of Operations, Tilt
Inside the System
Built on a real Divi 5 design system
Every color, type size, spacing step, and component on this page is a named Divi 5 variable or preset. Change one and the whole story restyles, so making it yours is an edit, not a rebuild.
Design Variables
Change one color or type scale in the Variable Manager and the entire page follows. Nothing here is hardcoded, so your rebrand takes minutes.
Element Presets
Mastheads, proof rails, evidence frames, quote panels, and buttons all run on named presets. Restyle one and every match updates with it.
Rows That Stay Even
Card rows hold equal heights no matter how long your content runs. Paste your real copy and the layout keeps its shape on every screen.
Ready For Your Story
The sample case study, labels, and images are isolated for clean swaps. Drop in your own work without untangling a single style.