#dashboard
#tracking
#webapp
#Figma
Vehicle Live Tracking
Vehicle Live Tracking
In this case study, I present the design process and outcome of building a user-friendly vehicle live tracking feature. The feature was developed for delivery managers and company principals to track delivery vehicle in real time.
In this case study, I present the design process and outcome of building a user-friendly vehicle live tracking feature. The feature was developed for delivery managers and company principals to track delivery vehicle in real time.
#dashboard
#analytics
#webapp
#Figma
Country
Indonesia
Year
2024
My Role
Designer
Background & Context
Our client was struggling with delivery vehicle tracking. Delivery managers relied on manual updates through driver chats, which often led to incomplete information, route inefficiency, and even fraudulent reporting. The need for a centralized, real-time system became urgent to improve transparency and delivery performance.
Users
Delivery managers
Monitor daily operations, track multiple vehicles, ensure delivery timeliness.
1
Delivery managers
Monitor daily operations, track multiple vehicles, ensure delivery timeliness.
Goals
1
Enable real time tracking of vehicles.
1
Enable real time tracking of vehicles.
2
Provide visibility into each vehicle’s status (idle, engine off, working on delivery).
2
Provide visibility into each vehicle’s status (idle, engine off, working on delivery).
3
Allow managers to review journey history and delivery points for accountability.
3
Allow managers to review journey history and delivery points for accountability.
Research & Discovery
The discovery phase involved conversations with delivery managers and company stakeholders. The main findings were:
1
Tracking via driver chat was unreliable and time-consuming
1
Tracking via driver chat was unreliable and time-consuming
2
Managers needed a way to check vehicle status at a glance without calling drivers
2
Managers needed a way to check vehicle status at a glance without calling drivers
3
Delivery points often handled multiple orders, which required clear grouping in the interface
3
Delivery points often handled multiple orders, which required clear grouping in the interface
4
Route inefficiency was a recurring pain point due to lack of historical journey data
4
Route inefficiency was a recurring pain point due to lack of historical journey data
Problem Statement
Delivery managers lacked a reliable tool to track vehicles in real time, resulting in inefficiency, fraud, and lack of transparency. A solution was needed to provide live visibility, vehicle status, delivery point information, and journey history.
Design Process
Making Vehicle Status Transparent
A vehicle list with clear indicators (Working on Delivery, Idle, Engine Off) eliminated guesswork for managers who previously had no clarity on a driver’s true activity. Instead of relying on driver updates, the dashboard consolidates vehicle status data in real-time. This directly solved the issue of fraud and inaccurate reporting.
Making Vehicle Status Transparent
A vehicle list with clear indicators (Working on Delivery, Idle, Engine Off) eliminated guesswork for managers who previously had no clarity on a driver’s true activity. Instead of relying on driver updates, the dashboard consolidates vehicle status data in real-time. This directly solved the issue of fraud and inaccurate reporting.
Vehicle list with status
Finding the Right Vehicle Quickly
Adding search and filter functions addressed the challenge of scanning through dozens of drivers manually.
Finding the Right Vehicle Quickly
Adding search and filter functions addressed the challenge of scanning through dozens of drivers manually.
Vehicle list filter
Scaling View from Macro to Micro
Multi-level map views (from national, regional, city, down to route-level) solved the problem of fragmented visibility. This allowed delivery managers to monitor fleets at a national scale, compare regional activity, and then drill down into specific cities or routes, ensuring consistency and control across the entire country.
Scaling View from Macro to Micro
Multi-level map views (from national, regional, city, down to route-level) solved the problem of fragmented visibility. This allowed delivery managers to monitor fleets at a national scale, compare regional activity, and then drill down into specific cities or routes, ensuring consistency and control across the entire country.
Nation-wide view map
Detailed region view map
Route-level view map
Replacing Verbal Updates with Visual Routes
The live tracking map displayed routes, start and end points, and delivery stops. When a journey ended, the system showed the full historical route, giving managers verifiable visibility instead of unreliable chat updates. At a national scale, this allowed managers to spot deviations, compare route adherence across provinces, and use journey history for reviews, evaluations, and compliance.
Replacing Verbal Updates with Visual Routes
The live tracking map displayed routes, start and end points, and delivery stops. When a journey ended, the system showed the full historical route, giving managers verifiable visibility instead of unreliable chat updates. At a national scale, this allowed managers to spot deviations, compare route adherence across provinces, and use journey history for reviews, evaluations, and compliance.
Nation-wide view map
Turning Reports Into At a Glance Insights
A trip summary card (distance traveled, time, completed deliveries) reduced the need for manual recap, helping managers make faster decisions.
Turning Reports Into At a Glance Insights
A trip summary card (distance traveled, time, completed deliveries) reduced the need for manual recap, helping managers make faster decisions.
Trip summary
Trip summary details
Solving the Timeline Problem
Managers often needed to investigate delays. The interactive timeline allowed them to replay trips, speeding up root-cause analysis of late deliveries.
Solving the Timeline Problem
Managers often needed to investigate delays. The interactive timeline allowed them to replay trips, speeding up root-cause analysis of late deliveries.
Trip summary
Clarifying Ambiguous Statuses
Tooltips and hover interactions provided detail (e.g., idle duration, engine-off time), solving confusion between short breaks vs. vehicle downtime.
Clarifying Ambiguous Statuses
Tooltips and hover interactions provided detail (e.g., idle duration, engine-off time), solving confusion between short breaks vs. vehicle downtime.
Trip summary
Trip summary details
Testing & Iteration
Usability Testing Findings:
1
Delivery details were requested directly on the map instead of separate reports.
1
Delivery details were requested directly on the map instead of separate reports.
2
Managers also wanted delivery point information to include an order list.
2
Managers also wanted delivery point information to include an order list.
Changes Implemented:
Added delivery info popups on map points, including delivery order lists linked to each stop.
Added delivery info popups on map points, including delivery order lists linked to each stop.
Store Details
Delivery Order Details
Impact & Outcomes
1
Real-time visibility improved operational efficiency.
1
Real-time visibility improved operational efficiency.
2
Fraud cases from manual reporting decreased significantly.
2
Fraud cases from manual reporting decreased significantly.
3
Delivery managers reduced time spent checking with drivers via chat.
3
Delivery managers reduced time spent checking with drivers via chat.
4
Route monitoring allowed optimization, reducing fuel costs and delivery times.
4
Route monitoring allowed optimization, reducing fuel costs and delivery times.
5
National-level monitoring enabled supervisors to ensure consistency across regions.
5
National-level monitoring enabled supervisors to ensure consistency across regions.
6
Increased trust and transparency between managers and drivers.
6
Increased trust and transparency between managers and drivers.
The project successfully delivered a tool that transformed vehicle monitoring from manual reporting to a data-driven, real-time system with national-scale visibility.
The project successfully delivered a tool that transformed vehicle monitoring from manual reporting to a data-driven, real-time system with national-scale visibility.
Tools
Figma
