Brief
Redesign a Fleet Management portal to have modern UX and aesthetic and include critical new functionality
Impact
By prioritizing user needs, the redesign introduced features that had previously been overlooked, such as customizable dashboards and real-time data reporting. The launch of Xcelerate was met with overwhelmingly positive customer feedback, reinforcing Element Corp’s position as an industry leader and enabling its continued growth in the fleet management space.
Motivations
The legacy fleet management platform was outdated, offering poor usability, a non-responsive interface, and limited functionality. Additionally, its aging technology stack could not support critical new features like real-time analytics and custom dashboards, both essential for fleet operators to optimize their business.
The re-design was to focus on Modernizing the UX & UI to align with Element’s brand and industry standards, Enhancing functionality to meet customer commitments and introduce new capabilities and Improving usability by streamlining workflows and optimizing key interactions.
About the project
Element Corporation, North America’s largest fleet management company, embarked on a major digital transformation following its acquisition of GE Fleet. A key strategic goal was to consolidate 2,300 customers under a single, modernized fleet management portal. However, none of the existing platforms met the needs of this consolidation, necessitating a complete redesign and rebuild. The result was Xcelerate—a new customer portal designed to deliver a best-in-class fleet management experience.
Discovery
We got walkthroughs of the current application and interviewed stakeholders to understand project needs. We conducted a Heuristic Evaluation of the application and had findings validated from interviews of members of the Customer Advisory Board where we captured pain points
Workshopping
Once the feature set was locked, we conducted a card-sorting exercise to re-organize the new features into sensible buckets and created a proposed Information Architecture
Workshopping
We conducted a workshop with Product Owners to identify a direction for the visual design by starting from a mood board and identified the feature set to be supported. This was all the carry forward and common features from the old Element and old GE products as well as new features.
Validation
We tested the proposed information architecture by running a Tree test with members of the customer advisory board.
Validation
A prototype of the application was put through a Usability test where Customer Advisory Board members were recruited as participants. Design updates were made to resolve identified issues.
Design changes
Product owners reviewed Usability Test findings and recommendations and the design team iterated the design for qualified items. In this example, the border matching the selected tab helped to resolve the issue of users not realizing the Vehicle and Driver details are tabs and accentuate the relationship between the two.
Visual Design Concepts
Based upon the inputs from the Product owners during the workshop and using initial wireframes of the dashboard, we created concepts to depict the design aesthetic for the new portal. Element corporation did not supply us with a branding guide so we referenced their website as a guideline.
Styleguide
A styleguide based upon the selected visual style capturing relevant details was created and supplied as part of the developer handover
Wireframes
All screens were annotated in detail to provide the necessary functional detail.
Wireframes
Detailed wireframes were produced for all features following the project plan, showcasing responsive behavior across 3 breakpoints.