Enhancing the Path to Purchase

ROLE: LEAD PRODUCT DESIGNER

Customer Journey

Customer Journey

Opportunities

Through the user journey we determined three areas of opportunity: personalization, disovery and ux enhancement. We then determined which part of the path to purchase these opportunities would touch and prioritized based on effort.

Opportunitites

Favorites

For our initial MVP we wanted to quickly introduce the user to the favoriting system. We introduced a common practicing favoriting experience where the user clicks the heart icon and is prompted to sign in/up in order to view their favorites. Although users could access their favorites in their account, through user testing we found that users were uninterested to create accounts and often abandoned the sign in experience. Instead, they cheated the system and added everything to the shopping bag in order to save their favorites. With that in mind we iterated on the idea to improve the favorites experience.

favorites

After testing, we allowed changed the experience to allow users to save their favorites without signing in. Favorites were simply cached in the session. In addition instead of making them abandon the browsing experience, we decided to display the latest additions to favorites in the mini bag side panel. Here users can quickly access their latest favorites from the session and still have the opportunity to view all their favorites in their account.

favorites-2

Quick Add to Bag

We created a quick idea of what we wanted the experience to be. We had certain goals in mind: it should be for desktop only as users are often browsing a large array of products. Users should be able to select size and color and quickly add to bag.

We wanted an elegant solution that did not interfere with the shopping experience, but instead enhanced and brought delight into it.

After creating this prototype, we ran several user tests, remote and guerilla testing with friends, family and coworkers. We ran into a few issues. The major one is that we did not solve for large amount of sizes and/or colors. This solution only covered ideal scenarios but created frustration instead of delight for a large amount of products.

quickview-1
quickview-2

After testing we decided to approach the problem differently. We wanted the quick add to bag to be of equal (not lesser) value than the quickview so we placed them next to each other to avoid hierarchal competition.

 We also enlarged the cell real estate with a transparency over the product. This way, the user can still maintain a relation to the product they're viewing, but we can also accomodate for large amount of color/size variations.

 In this version the user is also doing less work. No need to continuously click a carousel of sizes until they find the one they need. They are quickly presented with the ones they need and can quickly add to bag.

Buy Online Pick Up In Store

One of the largest struggles of the retail business is reaching both online and in-store customers. We introduced the Buy Online, Pick Up In Store feature to bring these two customers together. In our initial discovery we interviewed users to find out where they were starting their in-store exploration. The experience starts and remains in the product detail page. We tested a few variations with regards to the placement of the module and the most successful was the one where the user can see right away that the option is available but is never distracted from the online experience. The user can quickly see if a product is available in store and simply 'Buy Online & Pick Up'.

They can always change their mind in the shopping bag and throughout the checkout process. We also presented them with options to have someone else pick up their order. Once they finish their journey we continue to provide assistance through real time email notifications until the order is picked up.

page 25

Improving Search UI

Through discovery we wanted to create an exploratory search experience that guided the user through our products. We began with a search takeover experience where the experience is completely focused on search. The user had a chance to browse top categories and popular search items, but they were taken away from the content they were previously looking at. We ran user tests before implementation with competitive sites and saw that users understood the changes that were occurring.

After going live, we A/B tested and interviewed users and we found that this approach created a lot of confusion for desktop users but not as much for mobile/tablet users. On desktop, a lot of users thought that they were in a different experience and not search and the quick change was daunting and cumbersome.

For our second design iteration we went back to the form field approach for desktop but still maintained the product and category recommendations. This implementation proved to a lot more successful and easier to use.

search

Creating Hierarchy With a New Highlight Color

The Saks brand and UI identity prides itself in simplicity and sophistication. Keeping the UI palete to black, white and grey has always elevated the brand given the experience a sleek and minimal look.

However as we continue to enhance functionality and UX on our web and app platforms, the need for a highlight color has survaced in order to translate user actions and new interactions. In exploring highlight colors for the brand, we wanted to choose one that translated well into the intervace without interrupting the experience. In addition it needed to be complimentary to the Saks branding and not compete with the primary palette. 

Screen Shot 2017-09-06 at 11.42.26 AM

We explored a few different palettes that were complimentary to black and white and found that gold was the one that tranlated the best. However, as Gilt being the newest brand to join the HBC family, we had to make sure that it did not conflict with its identity. Thus we landed on a softer, more muted gold that added sophisitcation. This new color was a key element in creating a lot of UI hierarchy for many of our web and app elements. It helped create better and more elevated experiences. It's also allowed us to add a different dimension to our designs that were lacking before.

Screen Shot 2017-09-06 at 11.43.37 AM