Torrid Holdings, Inc.

Mobile & Website Redesign

 

Torrid Holdings Inc. (CURV) is an American apparel and accessories retailer, particularly known for its plus-size clothing for women. The company was founded in 2001, initially as a subsidiary of Hot Topic, and later spun off to become Torrid, LLC. The company sells its products through its e-commerce platform and physical stores.


Project Overview

Problem

The Product Landing Page (PLP) and Product Description Page (PDP) had a high bounce rate and low engagement, due to users feeling overwhelmed, frustrated, and confused.

Goal

How might I create a PLP and PDP experience that is digestible, intuitive, and allows the user to feel in control and confident to move along the shopping flow?

Impact

  • Putting the user in control of their filtering and shopping experience

  • Creating an immersive layout with a 3-grid layout on PLP

  • Improving information hierarchy and alignment on PDP

  • Updated existing features such as Select Fit Model and Product Filtering to be more accessible for the user

 

Details

Role

UX Designer | UI Designer | UX Researcher

Timeline

8 Months (Agile)

Scope

Product Description Page (PDP), Product Landing Page (PLP), Cart, and Checkout

Client Team

Project Manager | Web Analyst | Product Owners | UX Designer

Methods

Problem Definition | Wireframing | Prototyping | User Personas | A/B Testing | Usability Testing

My Design Process

 

Discover

 

Step 1: Understanding the Interface

  • Perform a site/page audit

  • Note down features and tools with high interaction using heat mapping through ContentSquare

  • Understand present features that are underutilized and determine opportunity points and next steps

 

Step 2: Understanding User Patterns

User Interviews & Usability Studies

  • Interview 7 Torrid customers from all different loyalty groups

  • 30 min zoom customer sessions

  • Task: Start from Homepage and checkout a pair of jeans you would think will fit you perfectly!

  • Analyze patterns in user behavior on PLP and PDP

Data Analysis

Existing analytics and testing showed that the site already offered helpful features the user was requesting, however they were under-utilized due to poor UX/UI.

 

Step 3: Synthesize Findings

  • 5/7 of the users mentioned that they heavily use the filter functionality, but found the current interaction frustrating, comparing it to other sites

  • Many users mentioned the site feels outdated and too marketing heavy

  • Useful information was found below the fold, causing users to hunt for information or miss it entirely

  • Existing features needed to be revisited to create a more appealing and intuitive interface and experience

Through observations and findings, I crafted a user persona. She became the north star of the decision and design process.

 

Define

 

Ideation Before Creation

  • Now knowing user pain points, a feature prioritization matrix helps better understand where to focus the scope

  • Competitor analysis of both desktop and mobile flows gave clarity on industry best practices, talking through aspects that are favorable and unfavorable while navigating

  • Pen to Paper - sketching down design solutions before getting into low fidelity wireframing is my favorite method!

Small tweaks can make the biggest difference… and there were many!

 

Before and After of ‘Filter’ Experience

Updated individual drop down filters to an “always-exposed” filter on the left side of the PLP

  • This increased visibility of the products itself by reducing any covered content with filters are interacted with

  • User could now access all available filters upon scroll, and be able to find her desired products easily

No more “More Filters” needed with new UI:

  • Through research, we found that ‘Online Exclusive’ and ‘Fabric’ were commonly used, but hidden under a dropdown

  • With the new structure, there were no hidden filters, allowing all tools to be accessible by the user

Removed marketing banner to keep relevant information ‘above the fold’.

  • User sees the information they are seeking without having to scroll or hunt for it

 

Before and After of Select Fit Model PDP

This design change resurfaced the select fit model experience and increased user engagement with the feature... providing a more digestible, usable, and intuitive interaction.

With product fit and confidence being the users biggest goal, positive feedback from this design change felt like a big win!

What is ‘Select Fit Model’?

  • A unique feature catered to women of all shapes and sizes

  • Users are able to select the model to see the product on different body shapes and sizes, allowing them to configure their experience based on what relates most to them

 

Test

 

Testing and validating our designs with users.

  • We ran internal usability tests early on to understand where some of the problem areas were.

  • After designing each new concept we tested them side by side with the existing design to validate that our design was functional and intuitive.

Below is the summary of functionality updates for the new PLP:

  • Filters visible on the left side with sticky functionality as customer scrolls down the PLP.

  • Exposed ‘Sort by’ and ‘Category’ filters.

  • Single apply categories design with radio button and multiple apply categories designed with checkboxes.

  • 3 product grid vs 4 product grid

Learning from A/B Test Results

The A/B test results showed the desktop 3-product grid PLP version yield a higher AOV (+1.3%), RPV (+1.12%), UPT (+.7%), as well as overall +12% filter engagement vs. control, and 4 product-grid PLP.

 

Our Solution

Based on research findings we…

  • opted for the 3-product grid for a more immersive scrolling experience

  • expanded filters by default to increase usability and access to a commonly used feature

 

Deliver

 

Documentation and Continuous Agile Delivery

  • Documentation includes notes, annotation, and walkthroughs that will help give context to the designs, understand the thought process, expected actions.

  • Working with the developers and making necessary pivots based on timelines and feasibility

Accomplishments

What was the final outcome, and impact of this project?

  • Putting the user in control of their filtering and shopping experience

  • UX improvements for all platforms resulted in a 18% engagement increase and reduction in bounce rate

  • Creating an immersive layout with a 3-grid layout on PLP

  • Improving information hierarchy and alignment on PDP

  • Updated existing features such as Select Fit Model and Product Filtering to be more accessible for the user

What I learned as a designer:

  • The user is our north star, always.

  • The importance of documentation. For future projects, I hope to keep an organized iteration library to better refer back to previous versions of designs

  • Building a component library while designing, especially for projects with no design system in place

  • Collaborate with developers earlier in the process


While you’re here…