UI & UX Design
Interactive Prototype
- Managed team meetings to ensure alignment and progress throughout the project
- Led presentations to communicate design concepts and progress to stakeholders
- Delivered a high-fidelity prototype, incorporating user insights and business needs
How It All Started
It all began with a call from Kevin W. Fullerton, the driving force behind PartingOut, a dual-sided marketplace for used automotive items. Kevin’s vision was clear: to create an online experience that mimics the in-person negotiation of buying and selling car parts. The categories ranged from autos to tractors and motorcycles, where sellers post entire vehicles and buyers make offers on specific parts. Kevin’s passion was evident, and his brief laid out the challenge: the buyer’s journey needed a transformation.
The global auto parts market is expected to grow significantly, with projections indicating a compound annual growth rate (CAGR) of 6.1% from 2024 to 2032.
In today's fast-paced digital marketplace, user experience plays a critical role in the success of e-commerce platforms. Parting Out, a family-owned business selling used automotive parts, sought to transform its online buyer experience. Despite its unique marketplace model, where all vehicles are listed and individual parts can be requested be reaching out to the sellers, users struggled to navigate the platform, leading to high drop-off rates and lost sales opportunities.
Recognizing the need for a comprehensive redesign, Kevin reached out to revamp Parting Out’s entire offer-to-purchase flow to simplify negotiation experience of buying and selling car parts. This initiative required a thorough understanding of the target audience, primarily non-tech-savvy vintage car enthusiasts, and an in-depth analysis of the existing user journey.
What makes PartingOut Unique?
Kevin’s vision for PartingOut is to create a virtual U-Pick-a-Part experience, allowing buyers to find and negotiate for hard-to-find vintage auto parts by searching entire vehicles rather than sifting through individual listings.
The challenge lies in simplifying the search and navigation process to minimize user frustration and boost engagement.
Project Overview
PROBLEMS
- Users struggled to search for car parts, leading to frustration and high drop-off rates.
- Confusion arose as users couldn’t easily distinguish whether they were buyers or sellers.
- The unclear bid process made negotiations and purchasing difficult.
- Many users abandoned the site before contacting sellers due to challenges in finding parts or doubts about the site's credibility.
- The platform's appearance and functionality led to perceptions of it being unreliable or "sketchy."
GOALS / OBJECTIVES
- Boost traffic by 20% with an improved user experience and streamlined navigation.
- Simplify search and navigation to reduce frustration and increase engagement.
- Clearly define buyer and seller roles to minimize confusion and enhance the user journey.
- Develop an intuitive bidding process to facilitate negotiations and transactions.
- Enhance platform design to build user confidence and encourage more transactions.
OUTCOME
The PartingOut redesign led to significant improvements in user engagement and satisfaction, showcasing the impact of user-centered design. Key achievements are highlighted in the case study below.
Our Design Process
Diving Deep into Discovery
To revamp PartingOut, we began by deeply exploring the user experience to identify their struggles and needs. We conducted extensive interviews and surveys with a diverse group of 14 buyers and sellers, revealing that users were overwhelmed by irrelevant listings and struggled with confusing navigation, unclear language, and a complex buying process.
Utilizing affinity mapping and user journey maps, we visualized these pain points, guiding us toward a more intuitive redesign.
Uncovering the User's Pain Points
Participant A's Journey:
Navigating Through Frustration
Beginning the Journey: Finding a Radio for a 1989 Cadillac Brougham
Participant A struggled with spelling "Brougham," which impeded locating the right car model, setting a frustrating tone for their experience.
Endless Scrolling:
The Challenge of Limited Filtering Options
With 177 pages and limited filtering options, finding the specific part felt like searching for a needle in a haystack, severely impacting user experience.
Role Confusion: Buyer or Seller?
Participant A mistakenly tried to list a part for sale instead of searching for one, indicating a need for clearer role differentiation on the platform.
Offer Conditions: Lost in Translation
Confusion over what details to include in the "offer conditions" section led to hesitation and frustration.
Unexpected Audio Feedback:
The Startling Honk
Just as he navigated through these challenges, he was startled by a loud honking sound signaling a counteroffer. This jarring audio added to his discomfort, affecting his overall experience.
Cumbersome Messaging System:
Overwhelming Pop-ups
Intrusive pop-ups and confirmation messages overwhelmed Participant A, making communication cumbersome and disjointed.
Metrics and Satisfaction
Task Completion:
10 minutes
User Satisfaction:
Low (2/5)
Errors Made:
(3) - Spelling error, wrong role selection, misunderstanding offer conditions.
Participant B's Journey:
Tackling the Interface
Starting Off:
Confusion with Registration
Participant B initially misunderstood the need to sign up for a new account, causing delays and setting the stage for a challenging session.
Struggling with Search:
The Radio Button Dilemma
Confusion over selecting the correct radio button for filtering results slowed their progress and added to their frustration.
Unclear Descriptions: What to Include?
Participant B faced uncertainty with the description field, unsure about the expected details, which led to hesitation.
Offer Process: Lack of Guidance
The lack of guidance on suggested price ranges for offers left the participant unsure about appropriate amounts, impacting the user journey.
Messaging System: Persistent Issues
Persistent issues with the messaging system included confirmation messages replacing useful information, complicating communication.
Metrics and Satisfaction
Task Completion:
15 minutes
User Satisfaction:
Low (2.5/5)
Errors Made:
(4) - Registration error, search confusion, description misunderstanding, interface issues
Identifying Patterns in the Users’ Experiences
To make sense of the data we had collected, we turned to affinity mapping - a technique that helped us to systematically organize and prioritize user insights. By grouping related observations and feedback, we uncovered common themes and patterns:
- Navigation Challenges:
Users found the platform's navigation confusing, making it difficult to locate specific parts quickly.
- Navigation Challenges:
Users found the platform's navigation confusing, making it difficult to locate specific parts quickly.
- Communication Barriers:
Many users experienced difficulties communicating with sellers, often leading to misunderstandings and delays.
- Navigation Challenges:
Users found the platform's navigation confusing, making it difficult to locate specific parts quickly.
- Communication Barriers:
Many users experienced difficulties communicating with sellers, often leading to misunderstandings and delays.
- Inconsistent Listings:
The presentation of parts was inconsistent, with some listings lacking essential information such as condition, compatibility.
- Navigation Challenges:
Users found the platform's navigation confusing, making it difficult to locate specific parts quickly.
- Communication Barriers:
Many users experienced difficulties communicating with sellers, often leading to misunderstandings and delays.
- Longer Purchase Timeline:
Finding, purchasing, and receiving parts took longer than expected, contributing to user frustration.
- Longer Purchase Timeline:
Finding, purchasing, and receiving parts took longer than expected, contributing to user frustration.
- Navigation Challenges:
Users found the platform's navigation confusing, making it difficult to locate specific parts quickly.
- Communication Barriers:
Many users experienced difficulties communicating with sellers, often leading to misunderstandings and delays.
- Information Needs:
Users needed clearer information upfront, including detailed part specifications, pricing transparency, and seller ratings.
- Information Needs:
Users needed clearer information upfront, including detailed part specifications, pricing transparency, and seller ratings.
- Information Needs:
Users needed clearer information upfront, including detailed part specifications, pricing transparency, and seller ratings.
- Navigation Challenges:
Users found the platform's navigation confusing, making it difficult to locate specific parts quickly.
- Communication Barriers:
Many users experienced difficulties communicating with sellers, often leading to misunderstandings and delays.
- Information Needs:
Users needed clearer information upfront, including detailed part specifications, pricing transparency, and seller ratings.
- Information Needs:
Users needed clearer information upfront, including detailed part specifications, pricing transparency, and seller ratings.
- Price Negotiation:
While some users frequently negotiated prices, others were unaware of the possibility or found it challenging to do so effectively.
- Price Negotiation:
While some users frequently negotiated prices, others were unaware of the possibility or found it challenging.
Learning from the Competition
We conducted a thorough competitive analysis of platforms like eBay Motors, RockAuto, and LKQ Online. Each competitor had its strengths and weaknesses. For instance, eBay Motors had structured but overwhelming listings, RockAuto offered simplicity but chaos, and LKQ Online catered to both individual consumers and businesses with options like new and used auto parts. This analysis highlighted opportunities for PartingOut to stand out by integrating the best features from these platforms while addressing their shortcomings.
Giving and Receiving Value
In our journey to redesign PartingOut, we constantly asked ourselves "How might we" questions to frame our design challenges and opportunities. This approach allowed us to think creatively and empathetically, ensuring that our solutions addressed real user needs. Here are some of the key "How might we" questions that guided our design process:
- How might we instill trust?
- How might we facilitate conversation?
- How might we guide users?
- How might we ensure everybody, including the buyers, sellers, and product owners were receiving value?
Our Proposed Solution
The new PartingOut platform is focused on improving access to vintage car parts. It features a concise, human-centered onboarding experience which allows users to understand the purpose of the site, and how to use it. Additionally, the redesign includes:
A simple, non-invasive sign-up process that doesn’t ask buyers to give their addresses.
Instructions to ensure accurate searching for the make/model/year of the car they are looking for.
A detailed product listing page, with clear instruction on how to find what they need.
A renovated, interactive chatting feature between buyers and sellers for direct communication.
A simplified purchase to offer system.
By teaching the user how to use the site, creating transparency to gain user trust, and streamlining the process of finding the right seller, part, and price, the redesign eliminates the confusion and distrust that users currently experience.
Challenges We Encountered
- The project had a tight timeline of only three weeks, requiring efficient prioritization and rapid iteration of design concepts.
- Insufficient / indirect communication with developers made it difficult to confirm the feasibility of certain design elements and align them with business requirements.
- Some necessary design changes were deemed infeasible due to backend requirements, such as maintaining specific buttons for invoice management and tracking purposes.
- Ensuring that innovative design ideas were practically implementable within the existing technical framework was challenging.
- Integrating new design solutions into the current platform without disrupting existing functionalities required careful planning and adaptation.
Redesigning the Buyer’s Journey
Armed with insights, we reimagined the buyer’s journey. Our one goal which summarized all of the objectives was simple: ensure the user always knew the next step. We revamped the information architecture, creating a seamless flow from landing page to purchase. Clear, concise UX writing replaced jargon, guiding users effortlessly. We introduced a robust search function, filters, and a streamlined negotiation and messaging flow, making the path to purchase intuitive and engaging. We crafted a user persona which would also help to guide and prioritize our design decisions.
Refining & Simplifying the Information Architecture
Designing The Future
We brought our vision to life through detailed prototypes. Interactive wireframes illustrated the new buyer flow, from discovering a part to making an offer. We conducted usability testing with real users, iterating based on their feedback. The results were overwhelmingly positive, with users praising the clarity and ease of use. Visuals like wireframes and clickable prototypes provided a tangible sense of the improved experience.
Low-Fidelity Wireframing
The initial phase of our design process focused on low-fidelity prototypes, which allowed us to sketch out the basic structure and layout of the redesigned platform. These wireframes were created using simple tools and focused on:
- Navigation Flow: Mapping out how users would move through the site, from the homepage to product search, details, and checkout.
- Key Features: Placement of essential elements such as the search bar, product categories, and user account options.
- Basic Layout: Arranging the major components of each page to ensure a logical and user-friendly experience.
Mid-Fidelity Prototypes
In the mid-fidelity stage, we enhanced our wireframes to include more detailed elements and interactions. This phase involved:
- Interactive Elements: Adding clickable components to simulate user interactions like searching for parts, filtering results, and adding items to the cart.
- Design Consistency: Implementing a consistent design language with placeholder content, ensuring that all elements aligned with our brand guidelines.
- Feedback Integration: Incorporating user feedback from the initial testing of low-fidelity prototypes to refine navigation, layout, and key features.
High-Fidelity Prototypes
The final phase involved creating high-fidelity prototypes, which were polished, interactive representations of the final product. This stage included:
- Visual Design: Applying the final design elements such as color schemes, typography, and high-quality images to create an aesthetically pleasing interface.
- Advanced Interactions: Simulating real user interactions, including dynamic search results, detailed product pages, and a smooth checkout process.
- User Testing: Conducting comprehensive usability testing with the high-fidelity prototypes to gather feedback on the overall user experience and make final adjustments.
Enhanced and Guided Navigation
After noticing during our batch of tests right from the conception to the testing stage for our mid-fidelity prototypes, we noticed that buyers tend to input keywords that might not bring what they’re searching for. So we decided to implement #5 (Error Prevention) and #10 (Help and Documentation) of the Usability Heuristics, to help guide the users while searching, and also to prevent potential errors.
Prioritization of information shown on the results card, to let users properly filter, and visually identify the product that cater to their needs and requirements. Quick View feature for quick access to product specifications w/o going through multiple pages.
Clear and Trustworthy Call-to-Actions
We identified that users often hesitated to engage due to unclear instructions and uncertainty about the next steps. To address this, we redesigned the CTAs to be more explicit, user-centric, and enhance user trust. These CTAs provide clear, actionable instructions, reducing user uncertainty and encouraging interaction. By making the buttons visually distinct and easy to locate, we fostered a sense of transparency and trust, ultimately improving user satisfaction and engagement.
The sellers are mandated to post real-time images, up to 4, to give the buyer a good view of the product, and this also helps reduce the possibility of stock images.
The descriptions are more lengthy and contain information needed by the buyers. They’re also able to see how soon the seller will respond to them, and are able to choose who to speak to depending on how urgent the part is needed.
Prioritization of information shown on the results card, to let users properly filter, and visually identify the product that cater to their needs and requirements. Quick View feature for quick access to product specifications w/o going through multiple pages.
Rule #3: User Control and Freedom
We gave users the flexibility to message sellers to confirm part availability or starting price before making an offer. This adheres to a usability principle - “User Control and Freedom”, ensuring that users can gather all necessary information, negotiate effectively, thus fostering a seamless and confident buying experience.
Offer details are also shown prominently on the page to avoid the need for scrolling through chats to find offer information.
Introducing a photo-sharing feature, where buyers and sellers are able to share images of parts or requirements to prevent errors.
Scroll here
An Intentional and Guided Landing Page
No more confusing landing page, no more confusions on the next step to take. We redesigned the landing page to reassure users of the service provided with enhanced UX Writing, whilst also giving them guided directions and tips on how to use the website effectively, and with ease.
Taking the Prototype for a Spin
With wireframes and interactive prototypes in hand, we conducted usability testing with real users. This was our opportunity to see how the redesigned platform performed in real-world conditions. Feedback was invaluable, allowing us to fine-tune the design for maximum effectiveness and user satisfaction.
Results from Our Journey
Our efforts paid off with tangible improvements. Users found the redesigned platform more accessible, with clearer language and a more intuitive buyer flow. The prototype demonstrated a significant leap forward in user experience, setting the stage for future enhancements.
The redesigned PartingOut platform now offers a smoother, more engaging experience for buyers and sellers alike. By focusing on information architecture, buyer flow, and UX writing, we transformed a complex process into an intuitive journey. The result is a marketplace where users can navigate, negotiate, and finalize purchases with ease—a true testament to the power of thoughtful UX design.
Reflections
Through this project, I learned how to work through the challenge of real-world constraints which has equipped me with the confidence to manage stakeholders and align the team toward a mutual goal. This experience has led to several invaluable takeaways:
- Project Constraints: Faced with time and manpower limitations, we focused on prioritizing essential features while advising future improvements to stakeholders.
- Collaboration with Developers: Regular meetings with developers were crucial for aligning our design with technical feasibility, integrating necessary back-end functionalities, and ensuring that critical details like shipping and policy information were accurately represented in the user interface.
- Putting Users First: By dedicating extra time to ensure our product was user-friendly, we uncovered areas where users were getting stuck, thanks to thorough testing with end users. This process not only improved site navigation but also ensured we delivered a more intuitive final product