GLOBAL TIRE COMPANY
GLOBAL TIRE COMPANY
PLATFORM REDESIGN & MIGRATION
FOCUS AREAS
UX DESIGN
DESIGN SYSTEM
UI DESIGN
SALESFORCE
TEAM
PROJECT MANAGER
BUSINESS ANALYST
SOFTWARE DEVELOPER
UX LEAD
UX DESIGNER
The Dealer Portal for a leading tire company serves as an exclusive platform for authorised tire dealers to purchase tires in bulk. Functioning as an e-commerce hub, this portal streamlines the tire procurement process, providing a seamless and efficient solution for authorized dealers to manage their orders.
Business
Requirements
Migrate the current portal to Salesforce using a blend of Salesforce out-of-the-box (OOTB) and custom components. Modify the Salesforce Lightning Design System (SLDS) to align with the brand, ensuring a cohesive and visually appealing user interface. The objective is to enhance functionality, optimise user experience, and maintain brand consistency within Salesforce.
Design Audit
The initiative began with a thorough design audit of the existing platform, prioritising the improvement of user-friendliness and simplification of the interface. Our focus was centred on analysing the platform through the lens of user goals. Listed below are the key insights discovered during this audit.
CUMBERSOME NAVIGATION
PROBLEMS IDENTIFIED
The navigation consists of an overwhelming number of options causing cognitive overload. Secondary calls-to-action (CTAs) are presented upfront, contributing to a cluttered user experience.
RECOMMENDATIONS
Group similar tabs together for a more intuitive navigation. Place secondary CTAs within sections for context and flow. Remove redundant CTAs to declutter the interface, creating a streamlined and efficient navigation system.
PROGRESS INDICATORS
PROBLEMS IDENTIFIED
The platform lacks progress indicators, leaving users uninformed about their steps and progress, creating uncertainty within the system.
RECOMMENDATIONS
Introduce a comprehensive progress indicator to inform users about their current step and total steps involved. This enhances user confidence and efficiency, leading to a more user-friendly experience.
PAGE LAYOUT
PROBLEMS IDENTIFIED
The existing page layout suffers from excessive white space, contributing to a less than optimal user interface. Additionally, the displayed information lacks intuitiveness, making it challenging for users to comprehend the on-screen data effectively.
RECOMMENDATIONS
Streamline the layout by reducing unnecessary white space and reorganise information in a more intuitive manner. This will contribute to a clearer and more user-friendly presentation of data on the screen.
Project Workflow
We began by mapping the current information architecture and categorising similar tasks for clarity.
After redesigning user flows for efficiency, we collaborated with the Solution Architect and Development Team. Together, we identified implementable solutions using existing Salesforce themes, determining the use of out-of-the-box components and custom components.
Design System
We adapted the Salesforce Lightning Design System to harmonise with brand guidelines, ensuring a unified approach to functionality and aesthetics. This comprehensive design system includes essential elements such as colours, typography, icons, and feedback principles. It serves as a foundation for maintaining a consistent and visually cohesive user experience across all aspects of the platform.
Wireframing
Initial wireframes were crafted to visualise user flows and page layouts, aiming to enhance the platform's intuitiveness and usability. Trying out multiple iterations aided in discovering the possibilities outcomes in which the content could be displayed.
UX/UI Improvement
After assessing the entire platform, some key improvements were identified. The improvements could be implemented on a global level of the platform. These design approaches helped in laying down the groundwork for the overall system redesign.
Streamlining Navigation
To enhance user experience, we revamped the menu by categorising similar items together, ensuring a more intuitive structure. Less crucial elements were relocated within user profile or other suitable locations, and redundant tabs were eliminated for a simplified and more efficient navigation system.
BEFORE
AFTER
Progress Indicator Enhancement
Previously lacking a clear progression indication, users had no visibility into the number of steps required to complete a task. By introducing progress bars, users now have a visual representation, providing insight into the total steps and their current position in the task completion process. This helped in enhancing user awareness and overall engagement.
BEFORE
AFTER
Optimised White Space Utilisation
The page layouts are strategically designed to optimise white space, ensuring users can access essential information and functions at a single glance. This approach enhances user flexibility by providing a comprehensive view of pertinent elements on the page.
BEFORE
AFTER
Visual Design
After meticulously defining the user flows and tailoring SLDS components to meet the project's specific needs, we transitioned to translating wireframes into visual mockups. These mockups were subsequently transformed into interactive prototypes, complete with micro-interactions, which effectively simulated a functional platform.
Learnings
Throughout the project, I gained valuable insights into utilising Salesforce and the Lightning Design System effectively.
I acquired proficiency in leveraging out-of-the-box (OOTB) and custom components to enhance platform functionality.
Moreover, the experience provided valuable lessons in collaborating with a cross-functional team, fostering effective teamwork and communication.
Other Projects
Please open my portfolio on your desktop.
The phone screen doesn't do justice to it.
Thanks!
