WEBSITE REDESIGN, navigation redesign, ux design, interaction design, visual design

Retail UX Program

PLATFORM: Website, mobile, App

Request access to my impact studies @ Google here

BACKGROUND

UX PROCESS

In the year 1 pilot, I tested different design processes with our 8 initial pilot customers. Over the years, I iterated our process to adapt to changing needs during COVID to declining spending in 2022.

UX process learnings :

• early strategic alignment of cross-functional stakeholders

• clear roles & responsibilities helped improve execution velocity

• prioritization is integral to balance managing design ops and execution excellence

IMPROVING THE SHOPPING JOURNEY

Identifying the problem

J.crew saw decreasing revenue and low mobile conversion. The team’s initial hypothesis was that the site has upper funnel problems with findability and search. After a quick audit of the navigation, I acknowledged the navigation, search, and filters did have areas of improvement.

However, I ran an exploratory user research test with my UXR partner. We discovered that the bigger problem was the lower funnel: users were unable to add items to cart on product pages and the user journey from cart to checkout was unclear.

DEFINING THE USER JOURNEY

To align our product stakeholders earlier, I co-created a critical user journey with the agency product managers and UX team to highlight the highest area of opportunity to prioritize. We shared this with our J.Crew UX and product stakeholders for signoff.

BRAINSTORMING, ITERATING, & TESTING

I led a brainstorming session with Deloitte’s design and product teams to gather ideas. Our squad explored different layouts and co-created wireframes to share with eng for feedback. During the iterative process, I coached the junior UXD through design decisions and helped her upskill on visual design quickly.

In collaboration with the UXD, I co-created low and medium fidelity wireframes on Figma, adopting the J.Crew design systems. When high fidelity mocks were ready, I collaborated with my UXR partner and created interactive Figma prototypes to conduct usability studies on 5 shoppers.

CLEAR USER GUIDANCE

The product detail page was redesigned to focus on clarifying the next steps of the shopping user journey. Decision decisions were made to visually educate users to understand that they have to select a size to add an item to the bag. In most cases, error states would add friction, but in our case, error states and tool tips helped guide our user to the cart.

REDUCING OVERLOAD

Modals are overlays that direct users to focus on important information. Here, visual UI reduced cognitive load.

CART-TO-CHECKOUT

Visual design was utilized to drive users from bag to checkout. Our team updated item card designs, utilized white space and drop shadows to show visual hierarchy on the bag page. In checkout, I reduced the number of form fields to reduce friction, allowing users to checkout on mobile quicker.

Project was a collaboration between Google, J.Crew, and Deloitte.