Project: Store Mode

Platform: iOS and Android

The Challenge: Home Depot wanted to create a brand new experience for both b2c and b2b users when they are shopping in store.

Role: Lead UX Architect

Solution

Ultimately this project was a full end to end brand new app experience. Store mode transforms the current app into a simple, clean, and easy to read version that becomes a companion for the in store shopper. This was a real collaborative group effort between ux, product, and engineering - throughout our explorations we have had to pivot a lot due to technology restraints.

Onboarding

Due to Store Mode being so different and possibly jarring from our core app experience, we needed to design a way to let the user understand that they are entering store mode as well as how to exit the mode. Another known issue we have is that the current store wi-fi is slow, so we also needed to make sure we raise awareness to the user that they may have to check the wifi or switch to their provider to continue using the app.

Homepage and navigation

Our guiding principle for this experience is that it needs to be large and easily accessible to navigate while shopping in the store. With that in mind, we decided to go with a “remote control” design for our homepage, which focuses on the main aspects of what a user utilizes while shopping in store.

Due to how many different users that we know use the app, including store associates, we also needed to solve how the user can toggle between modes.

Lists

Our current list experience is outdated and confusing to use. With this redesign we emphasized the map my list feature as well as a larger call out for the aisle and bay of said items. Another new feature we’ve added is that we converted the users cart into a list while they are in the store. We wanted the cart to still be accessible while in this view, without the opportunity to purchase.

Search and Out of Store Navigation

We created a more robust search experience for store mode, with wanting to emphasize barcode, image scan and voice search. As well as we again, wanted to really elevate the aisle and bay when searching to create an easier way of finding where items are in the store.

For out of store navigation, we have revamped our bottom navigation to give store mode it’s own spot. We also created a teaser page if a user taps on that tab when out of store or if their location services are turned off.

Navigation Flow

In it’s ideal state, we wanted the user to be able to transfer between tech stacks seamlessly whether if they were using the core app or store mode. This was the flow to document all of the navigation points throughout the experience we would have to map for.