Transforming the E2E Shipment tracking experience
The multimodal journey feature is crucial for efficient logistics and competitive advantage, offering comprehensive tracking across transportation modes. Effective design ensures an intuitive, user-friendly interface, enhancing satisfaction and reducing errors. Prioritizing this feature addresses market demand, matching competitors who already offer it, and is expected to drive significant ROI and improve market positioning.
Prem Kishor ⋅ 5 min read
My responsibility
As a UX designer, I spearheaded the redesign of the "Multimodal Shipment Journey" platform to resolve usability issues and enhance user experience. This critical project, part of the 2023 roadmap, focused on streamlining the upcoming list page revamp. By meticulously addressing designs and use cases, we ensured that this major USP feature would drive significant ROI for the business.
Team
1 Product Designer II
1 Product Manager
Timeline/Dates
3 Weeks, 2023
Core responsibilities
Product Design, Visual Design, Research
Design Strategy
1. Discovery and Research
-
UX Audit
-
Competitive Benchmarking
-
Referred Analytics & Heat-maps
2. Design
-
High-Fidelity Wireframes
-
Final Designs
3. Testing
-
User Testing
-
Reiteration
Problem Statement
The existing platform does not support multimodal shipment journeys and is plagued by usability issues, including poor navigation, unclear tracking information, and a lack of intuitive design elements, leading to user frustration and inefficiencies.
Old Design Interaction Video
Note: This video was captured after incorporating a few changes from the new designs, while keeping the existing pages live during the soft launch for current users.
Research
UX Audit
Other Key Insights from UX Audit
-
Users must manually scroll to locate the active and color-coded map location.
-
Information on shipment delays, early arrivals, or on-time status is missing, often ignored in email updates.
-
The map lacks a legend to explain the meaning of different lines.
-
Manual milestones are not clearly highlighted, causing confusion with automated tracking milestones.
-
Port calls are displayed like other milestones, cluttering the tracking events screen.
-
ASI pings and geo-pings are merged and repeated, causing confusion between auto-fetched milestones and activities.
-
Waypoint information only shows location names, not their categories.
-
Zoom in and out features are unavailable on the map.
-
During road movement, the active icon blends with the green land color on the map.
-
Overall visual hierarchy is poorly structured.
Competitive Analysis
Competitive analysis conducted among four major competitors.
Focused Analysis: Conducted a competitive analysis among four major competitors, identifying two as particularly mature in technology and design. GOCOMET and MOVEMENT Project 44.
Key Insight: The analysis highlighted the importance of maintaining design consistency.
Advanced Design: The mature competitors featured dynamic designs that effectively showcased information as it became available.
Iconography: plays a very vital role, as all the info in textual format is difficult to club.
Designs
Major design considerations & Why?
Complete Redesign of Tracking Detail Page for Enhanced Efficiency and Consistency:
During the revamp of the list page, I proposed a complete redesign of the tracking detail page, rather than merely updating the tracking events. This approach not only resolved numerous existing issues but also improved overall efficiency. By consolidating and aligning the design with the list view, I ensured a more consistent and streamlined user experience.
Wireframe & Prototype in just 2 mins!
I facilitated quick changes from wireframes to final designs, significantly improving the implementation process, by precisely designing local components and ensuring stakeholder approvals at each stage.
The final design featured a streamlined navigation system, a more intuitive layout for shipment tracking, and enhanced visual design elements to improve usability.
Key Features included:
-
Automatic indication of the active location without requiring manual effort.
-
The direction of shipment movement is now clearly visible at a glance. (Top to Bottom)
-
A simplified, hierarchical navigation menu.
-
Clear and accessible shipment tracking information with visual indicators.
-
Intuitive design elements and interactive components to guide users through the process.
Only Tracking events section
Newly designed detail Page with "Tracking events section"
Design Specifications
Port calls: Port calls are scheduled stops a ship makes at different ports during its journey. These stops are for loading or unloading cargo, refuelling, maintenance, and other necessary tasks. in some few cases it's important and in few it's not.
Port & Station Calls use-case
Efficient map
I measured all edge cases for the map to enhance its efficiency and functionality. My goal was to ensure the map was intuitive and served a crucial purpose, making shipment tracking comprehensive without adding unnecessary layers.
Shipment Moving in expected path
Shipment Path Deviated
Completed: Ocean - AIS ping with “Date Stamps”
Live designs.
Other Pages of the "Detail Page"
Bonus Screens!
Details
Order/Product
Documents
Notes
Results and Impact! 🎉
23% Increase in demand for multimodal paid feature.
-
User satisfaction scores improved by 30%, based on post-launch surveys.
-
The clarity of shipment tracking information was enhanced, leading to a 25% reduction in user inquiries (Support tickets) regarding shipment status.
-
Overall navigation efficiency increased, by making all consistent changes in list page revamp exercise simultaneously.
Learnings & Future Scope
-
Importance of User-Centered Design: This project highlighted the importance of user-centered design in addressing usability issues. Continuous user feedback and iterative testing were crucial in creating an effective and intuitive platform.
-
Adaptability and Flexibility: Showcased the need for designs to be adaptable and flexible to accommodate various user preferences and contexts, ensuring a more inclusive and accessible product.
-
Future Enhancements: Some design changes have not yet been incorporated due to technical challenges but are planned to be part of next year's roadmap.
