top of page
Anchor 1
Asset 3.png

My garage for my account page

Exploration and Prototype for ACDelco, Buick, Chevrolet, and GMC

Research and website Exploration

Wire Frames

As a user, I want to maintain my searched vehicles within the eCommerce shopping experience.

 

As an authenticated user, I want vehicles stored within My Account to appear within the eCommerce shopping experience.

 

As a user, I want the ability to change the vehicle in context without removing the prior vehicle that I was shopping.

GARAGE-SMALL- 1-2-3-4.png
GARAGE -SMALL- 5-6-7-8-9.png
GARAGE-SMALL- 10-11.png

GENERAL REQUIREMENTS

  • Catalog, search results, and categories are filterable by YMM inputs or VIN, as well as complete fitment. 

  • In an authenticated state with 1 vehicle, the user will automatically be shopping for that vehicle upon page load.

  • In an authenticated state with multiple vehicles, the user will be automatically shopping for the default vehicle. 

  • Search results will be dynamic based on the vehicle (e.g. truck or sedan), category/product type (bed products will not show for the sedan)

  • Vehicle tile height will be dynamic based on the information shown.

  • Cookies will channel back and forth through the shopping journey until the user selects or adds a different or new vehicle (i.e. if the user enters trim within the product page, it will carry through within fitment back and forth until the user chooses to Edit).

  • If the User completes Full or Partial Fitment from the Marking Landing Page, the Shop Products CTA should move to Product Search Results. If the User completes Full or Partial Fitment from elsewhere within the experience, the component will refresh on the active page.

  • Authorability should be present when the ecommerce platform is updated.

Chevrolet My Garage testing

Unmoderated usability test on UserTesting with 15 participants

A usability test was launched to verify that users understand how to add, select, and delete authenticated and unauthenticated vehicles from My Garage as they browsed for parts and accessories.

Research Goal

​

  1. Test users’ understanding of navigating through different points of the parts & accessories shopping experience with a specific vehicle in context

  2. Understand user expectations of adding and removing unauthenticated vehicles and viewing authenticated vehicles associated with their GM account.

  3. Test if users can decipher the difference between searching with an authenticated and unauthenticated vehicle

  4. Test user understanding of viewing a vehicle in context

HIGH-LEVEL SUMMARY OF FINDINGS

Users understand the difference between unauthenticated and authenticated vehicle selections

​

All users were successful in adding a vehicle from the landing page: 

-Most users found it immediately

-One user noted that a scrollbar element to indicate scroll action

​

Users expected to see vehicles from their accounts appear in the account drop-down menu.

​

Users are aware that they are viewing Silverado products, but want more indication in the product description

​

Users understand how to add and delete a vehicle at different points in the purchasing experience

-(14) were successful in adding a third vehicle

testing - 1.png
testing - 2.png

Overall, was there anything surprising to you about this experience?

“When I signed in and my vehicle showed up in the drop down, I liked that.”
“I like that I don’t have to change pages to compare cost between products based on the vehicle selected”
“It’s a little surprising that the page stays on Exhaust Systems when the vehicle changes.”

Chevrolet my garage design revision

If we proceed with inactive states, how would they be shown?
Remove the radio button? Still have the field? Opacity?

Should unauthenticated vehicles of different brands show up here?
EX) I search for an Encore on Buick Accessories, move over to Chevrolet Accessories, should my Encore appear?

If we proceed with inactive states, how would they be shown? Would we display an error to go along with it?
EX) Do we establish a warning pattern? But make the container feel less inactive?

A_Home_Garage_Flyout-2.png

What should messaging say?
Could the CTA hyperlink have messaging that tells them to visit Buick shop by clicking on that link?

A_Home_Garage_Flyout-3.png
After Low fidelity prototype testing in Figma for Chevrolet, We created a High-quality prototype using the DSM library and created new components for My Garage flow for all brands: ACDelco, Buick, Chevy, and GMC  for Desktop and Mobile.

My garage Desktop screens

My garage Mobile screens