Ending the two-tab workaround
In the legacy product, dispatchers juggled two separate tools — an internal Gantt chart and an external map — to answer a single question: who is the best person to assign to this job? The context-switching was slow, error-prone, and frustrating.
The Dispatch Console Map unified both into a single interface. Dispatchers could now see real-time technician locations, visualise work routes, check appointment status, and identify nearby unassigned tasks — all without leaving the screen.
Lead end-to-end process
I was responsible for establishing the UX process and driving all design activities for the initiative — from early discovery through to prototype validation and developer handoff.
Dispatchers were working blind — toggling between tools to answer one question
To assign the right technician to a job, dispatchers needed to know where each person was, how busy they already were, and whether any nearby work could be grouped efficiently. None of that was visible in one place.
The legacy workflow included a small, integrated map within the Dispatch Console — but its limited functionality made it difficult to understand technician routes clearly, leaving dispatchers without the spatial context they needed to make confident decisions.
Understanding the problem
Rather than jumping directly into solution design, we focused on building a thorough understanding of the problem space through focused research and analysis.
Identified pain points
Specialist interviews and storyboard walkthroughs surfaced nine recurring pain points, all centred around visibility, route clarity, and the inability to make confident dispatch decisions from a single view.
Mapping the dispatcher's journey end-to-end
A user flow was created to trace the full dispatching sequence — from loading resources on the map, filtering and toggling routes, through to identifying nearby unassigned activities and making an assignment. This helped the team align on key decision points and interactions before moving into wireframing.
User flow — viewing routes of multiple technicians in the Map view
Designing for colour-blind users from the start
When multiple technician routes are displayed simultaneously, colour is the primary differentiator. This created an immediate accessibility problem that needed to be built into the design system — not retrofitted.
Designed a palette of 15 route colours at varying contrast levels, solving colour-blindness differentiation for up to 60% of colour-blind users. All prototypes were tested with colour-blindness simulation plugins in Figma before handoff.
- •Changed start and end location pins to make route direction and technician differentiation immediately clear
- •Introduced tooltips and information cards on routes and pins as visual cues for users with visual impairments
- •Validated all changes against colour-blindness simulation plugins covering deuteranopia, protanopia, and tritanopia
Validated, refined, shipped
The final prototype incorporated usability test findings with targeted improvements. The solution gave dispatchers a clear, accessible view of all technician routes — with enough information to make confident assignment decisions without switching contexts.
