For this project our customer required Live Traffic services to be phased into the in-vehicle infotainment system, which was a feature from Garmin’s previous products. Since from the customers’ specification there were several guideline need to be followed, as one of the UX designers of this project, I supported to redesign the Live Traffic feature to meet customers’ requirements.
Background
Live Traffic service is a feature that has been released from Garmin's early navigation products. When a driver is driving during navigation, the in-vehicle infotainment system can provide live traffic data from Garmin’s 3rd-party partner. The feature provides the following service:
-
Pop out side windows showing the road condition ahead and the alternative route recommendation.
-
Displaying traffic lines with different colors indicating different traffic conditions on the map.
The side windows showing the road condition and the alternative route
The different colors of traffic line covering on the roads
The Challenge
From the kick-off of this project, we had several meetings with our customer and found some issues from the previous Live Traffic design:
-
The original design of the traffic line was hard to identify.
-
The alternative route recommendation was not obvious for the user to know that is clickable.
-
Based on the customers’ specification there should be a traffic settings page allowing the user to customize the traffic features.
Design Process and the Outcome
A Minimalist Design for the Traffic Line
I first conducted a competitive analysis for different live traffic lines displaying (Google, KaKao, Navitime, Baidu, etc), and discussed with the engineering team the possible way to display traffic lines based on current development resource.
I found that the original design of the traffic lines was not popped out from the map was because the coloring of traffic lines and the remaining part of the map were both vivid. The principles were developed for designing the traffic lines in a more minimalist manner:
-
The coloring of the traffic lines should be popped out comparing to the other part of the map.
-
For the traffic lines covering on the navigation route should be with borders and thicker, hence to let the driver to easily distinguish between the traffic lines on navigation route and those on the other part of the maps.
I also created the following wireframe based on the principles and delivered to GUI teams’ references for the visual design.
The concept of displaying the coloring of traffic lines
More Intuitive Operation for Alternative Route Recommendation
I redesign the alternative routes recommendation in the side window:
​
-
Change the wording to a more direct expression – asking the user to change to a faster route or not.
-
Added [OK]/[Cancel] buttons below to make it clear that what actions the user can take.
The road condition alerts and the alternative route recommendation on the side windows
Customized Traffic Settings
A new traffic settings page was designed for the user to customize the live traffic features, including switching on/off the live traffic services or the criteria for the alternative route recommendation alert.
The customized traffic settings page
Considering other Use Cases
The final UI flow documentation was also considered several use cases, for example how do we help the user to deal with the network error when using live traffic service.
The wireframes of the UI flows showing one of the use cases for network error handling
The Result and Reflection
From the beginning there was a gap between the engineering team and customers' understandings of the live traffic requirement, causing the system development didn’t meet customers’ specifications and needed to be re-design and might cause the schedule delay.
​
I discussed and communicated with the customers and the internal engineering team very frequently to design the UI of live traffic features, also balancing between the customers’ requirements, Garmin original design, and usability.
​
After the UX team discussed with different stakeholders and the rapid response to the customer with the design proposal, we finally had compromised design solutions with the customer and let the engineering team can continue to implement the feature on schedule.
​
The customer also appreciated our close and instant collaboration for the development of the feature.
Redesign for the Live Traffic Service
More selected projects
