Goal: Redesign the My Place for Parts B2B site to meet shareholder needs
Timeline: 4 months
Deliverables: User research, Hi-fi mockups, Interactive prototype
Tools: Figma
Role: I led the UX research and design for this project
Overview
My Place For Parts is a company that specializes in parts designed specifically for this professional service dealer. Their platform integrates a shop management system and a digital e-commerce catalog for automative shops to easily find, order, and receive parts and supplies. I was was asked with helping design their v3 site to look more aesthetic, while also updating workflows to be more friendly. The images to the right show what the My Place For Parts site looked like beforehand.
Research
I performed a competitive analysis to better understand other shop management systems. I looked at 4 major competitors and focused our attention on how they help users search, find, and order automative parts. I found that all of them had the ability to search for a generic part in a search bar, but most required users to select a vehicle before they could search for a part. This is to ensure that the part fits the vehicle. Additionally, the order of these parts varied from site to site but could all be accessed in a Parts Catalog, which housed the many different accessories, tools, and supplies.
Design and Iteration
After my research, I designed hi-fidelity wireframes in Figma. I focused on simplifying the sites, navigation, adding a vehicle, and the search and results pages, as these features were prioritized by the client. I then handled the designs off to our development team to build them out. My Place For Parts is currently conducting usability testing on the v3 site with users to better understand what is and isn’t working. Once the design team receives these results, they will iterate on workflows and designs accordingly.
Site Navigation
We made sure to include multiple ways for users to access the Parts Catalog. We included it as a top level navigation item, as well as the page the user is taken to immediately after adding a vehicle. We also included ways for the user to access their previous orders and vehicles from both the dashboard, as well as the top level navigation..
Add a Vehicle
Our research showed that in order for users to find parts that fit their car, they first need to select a vehicle. Most competitors had this feature in the header, which makes it easy to find on a website, but we were concerned about how much space this would take up on our already crowed header. We decided on including the Add a Vehicle flow in a dropdown, which can be accessed by clicking on the Add Vehicle button. This gives the user plenty of space to enter in this information, and makes it easy to find. From here, users can add a vehicle by either the Year/Make/Model, License Plate, or VIN. This gives the user a few options on how they can enter in this information. The order of these options can also be customized by selecting the Customize Search button at the top of the drop down.
Search and Results
In the automotive industry, body shops can charge customers for both a part and the labor associated with installing that part. We wanted to make it easier for users to navigate the parts catalog so they can quickly find the correct part for their vehicle, as well as the labor associated with that part. The current system had labor as a seperate search field from parts. We updated the design of this feature to include them all in the same place, and revamped the UI to match the v3 branding.