Starting state
24 routes to plan. Where do you start?.
24
187
78%
2
North
Refrigerated12 stops
Assigned
South
East
West
Select a route
Showcase · UX Process · 02 of 03
How I turn ambiguity into structure.
I work at the intersection of business goals and user needs - where messy requirements become coherent, scalable experiences.
§ Scenario
The brief.
A VP of Operations needs dispatchers to stop juggling four disconnected tools. Goal: one unified platform for 200+ fleet managers, by Q3.
Composite scenario drawn from real enterprise fleet management patterns — generalised to focus on the methodology, not the client.
01 / 05 · Solution Space
Two sides. Oneoverlap.
Every project starts with two forces pulling in different directions. Users want one thing. The business needs another. Most teams pick a side. The skill is finding where both win.
User pain points
“Every vehicle on the map, all the time.”
- 40 min wasted on 4 tools
- Alerts buried across systems
- No unified fleet view
— the context is the work.
Business goals
“One platform for the whole fleet, by Q3.”
- Reduce 4 licenses to 1
- +15% route efficiency
- Less fleet downtime
— the budget is the constraint.
The overlap
Users want live data on every vehicle. The business can't afford the $8k/month bill that comes with it. Neither side wins on its own.
Active routes update in real-time. Parked vehicles refresh every five minutes.
The overlap is a reframe: “all or nothing” becomes “which ones matter right now.” Users get a unified view of what's moving; the business pays for live data only where it changes a decision. 80% cost reduction, 95% satisfaction.
You know what to build. Now — how to organize it.
02 / 05 · Functional Clusters
The right information at theright moment.
Users don't care which part of the software data comes from. They need the right information at the right moment to make a decision.
Watch how much data hides behind that one question. This is why “just combine the tools” never works.
“Assign Driver A with a matching vehicle to Route North.”
Driver Management
Driver A.
- Availability: Is Driver A free right now?
- Hours remaining: Regulations limit driving time today
- Current location: Are they near the starting depot?
Fleet Health
matching vehicle.
- Vehicle type: Refrigerated? Heavy cargo? Standard?
- Operational status: Is it in maintenance right now?
- Fuel & range: Can it complete the full route?
Routing
Route North.
- Stops & distance: 12 stops, 180km total
- Cargo type: Determines which vehicle is needed
- Time windows: Delivery slots that constrain the sequence
Structure exists. Now — how do users move through it?
03 / 05 · User Flows
Same data, three differentexperiences.
You know what data exists. Now: in what order does the user encounter it? The same data, structured three different ways, creates three completely different experiences.
Compare the three approaches side by side. One won.
Trade-off
All at once.
Complete but overwhelming. The operator needs 40 seconds to orient — information without hierarchy is noise.
Trade-off
Step by step.
Clean but rigid. The user can't see how choosing Route A affects which drivers are available. They'll go back and forth.
Recommended
Progressive narrowing.
Mirrors how fleet managers think: “What's the route? What fits? Who's available?” Each choice removes irrelevant options.
Progressive narrowing won because it matches the decision sequence fleet managers already use. The other two either overwhelm (all data, no hierarchy) or isolate (clean steps, no cross-reference). This flow structure defines the wireframe in Step 4.
Flows are mapped. Now — what does a screen look like?
04 / 05 · Wireframing
From flow toscreen.
The flow says: Route → Vehicle → Driver, narrowing with each choice. Now it needs to become a screen that 200+ fleet managers can use under pressure. Watch the planning cockpit assemble - three linked panels, one decision flow.
Follow the three states below - each click narrows the options until “Assign” is one tap away.
Route selected
Eligible vehicles appear.
Map highlights the route. Detail panel shows constraints and matching vehicles with “Assign driver” buttons.
24
187
78%
2
North
Refrigerated12 stops
Selected
South
East
West
Route NorthSelected
Refrigerated08:00–14:00
Vehicle 7
Refrig.
Assign driver →
A modal appears
Covering the cockpit.
The driver list opens in a dialog. Route constraints, map, vehicle details — all hidden behind the overlay.
24
187
78%
2
North
Refrigerated12 stops
Selected
South
East
West
Assign Driver to Vehicle 7×
Driver A
SelectDriver C
SelectRoute constraints not visible
Three calls that defined the cockpit.
Map-List-Detail triad.
Industry-standard pattern for logistics tools. Three linked panels: route list drives selection, map provides spatial orientation, detail panel holds the assignment workflow. Selection in any panel cross-highlights the others.
Constraint chips over hidden metadata.
Cargo type, time windows, and violations are visible as badges on each route — not buried in a detail view. Fleet managers scan, not read. Color-coded status (green/amber/red) provides instant triage.
Exception-driven review.
Healthy routes collapse. Violations surface with red borders and inline alerts. Managers don't inspect 24 routes — they fix the 2 that need attention. The KPI bar's violation count is the entry point.
Wireframes commit to an interaction model. But “concrete enough” doesn't mean correct.
The layout is committed. Does it actually work?
05 / 05 · Test & Iterate
Three hypotheses.One didn't come back.
Three hypotheses went into testing. Two came back green. One didn't.
I design what gets tested. Researchers run the sessions. I decide what the results mean for the architecture.
Hypothesis · 01
The Map-List-Detail triad will match fleet managers’ mental model.
Hypothesis · 02
A modal dialog for driver assignment will keep the workflow focused.
Hypothesis · 03
Constraint chips will enable faster triage than text descriptions.
See what the usability tests revealed.
Five steps. One system. What does it all add up to?
Epilogue · Beyond screens
What the process producesbeyond screens.
The briefing said 40 minutes across four tools. The unified planning cockpit delivers one system, one login, one decision flow — and the cascade of changes that follows from that single architectural call.
Logins per plan.
Down from four. One unified cockpit replaced four disconnected sign-ins.
Faster planning.
Forty minutes down to roughly eight. Same accuracy, ~80% faster.
Data freshness.
Manual refresh swapped for live feeds on active routes — no more thirty-minute stale reads.
Violations caught.
Constraint conflicts surface at planning, not after dispatch — pre, not post.
Why the same five steps transfer.
The fleet dispatch scenario is a vehicle for the methodology — the same five steps run on automotive HMI, fintech onboarding, R&D knowledge tools. What changes is the data; the architectural thinking holds.
Five steps. Transferable.
Fleet dashboard, automotive HMI, fintech platform — the scenario changes, the thinking doesn't.
Shared understanding.
Scalable IA. A system of decisions that survives team turnover.
Architecture feeds systems.
Clusters become component scopes. Flows become state machines. Layout patterns become templates.
§ Continue
Five steps. One system. Transferable.
Two more showcases follow — the system itself, and where the line moves when AI joins the team.
— structural judgment is the job.