While working on this project, we collaborated with UX researchers and the GM Product team.
After researching and building wireframes in Axure, we created a UI prototype for Desktop and Mobile in Sketch Tool.
To create a prototype easily and consistently with other pages on the website, we created a foundational library and master file that included small and big components, symbols, logos, and imageries to the DSM library.
Objective:
Design a user-friendly website for purchasing GMC parts and accessories online.
Target Audience:
The target audience for the GMC parts website is primarily GMC vehicle owners looking to purchase parts for their vehicles. The website should also be accessible to individuals who are not familiar with GMC vehicles but need to purchase parts for a GMC vehicle for any reason.
Research:
Before starting the design, the UI designer should conduct research on the user's needs and preferences. Here are some questions to consider:
- What are the most popular GMC vehicle models and the parts they require?
- What are the most common reasons people purchase GMC parts?
- What are the current pain points of purchasing GMC parts online?
- What are the best practices for designing an e-commerce website?
Based on the research, we created user personas to guide the design process. And created wireframes in Axure for better interaction and comments from the team including Project managers and stakeholders. We also included a technical writer in this process to add the necessary copy to the pages.
USERFLOW FOR PARTS AND ACCESSORIES WEBSITE


Wireframes




DESIGN
The design should be simple, intuitive, and visually appealing.
Here are some design considerations for the GMC parts website
01
Navigation
The navigation menu should be simple and easy to use. The designer can use categories such as "Brakes," "Engine," "Exterior," "Interior," "Suspension," and "Transmission" to help users find the parts they need quickly.
04
Shopping cart
The shopping cart should be easy to access and use. The designer can include features such as the ability to save items for later and to apply promo codes.
02
Search Bar
A search bar should be prominently displayed on the homepage for users who know exactly what they are looking for.
05
Checkout process
The checkout process should be simple and straightforward. The designer can include features such as guest checkout, multiple payment options, and order tracking.
03
Product Listing
The product listings should be clear and easy to read. The designer can include product images, descriptions, prices, and customer reviews.
06
Responsive Design
The website should be responsive and accessible on all devices, including desktops, laptops, tablets, and smartphones.
DSM LIBRARY
Fonts, Colors, Buttons, and Icons


Master File components



