Project Overview

Client: Reformation, sustainable, slow fashion
Industry: e-Commerce Apparel
Project Timeline: May 2023 – Oct 2023 & Aug 2025 – Nov 2025 (revisit)
My Role: UX/UI Designer, UX Researcher
Tools: Figma, FigJam, Maze, Notion, Qualtrics

The Challenges & Purpose

Reformation’s mobile browser introduced friction at the worst moments- lagging loads, lost favorites, and broken shopping flows that snap the visual salient to a successful shopping purchase. This project reimagined Reformation's experience as a native app centralizing product discovery, favorited items, checkout, and orders and returns.

The Final Product & Impact

A fully immersive shopping app that replaces fragmented and buffering pages with a seamless shopping journey that centralizes discovery, checkout, and post-purchase flows.

My Role & Responsibilities: Sole Product Designer & UX Researcher

1. Led user research, usability testing, and iterative prototyping

2. Streamlined discovery, checkout, saved items, and post-purchase flows (online vs. in-store purchases & returns)

3. Built and scaled reusable design systems

Duration

While this project began in late 2023, it has remained an evolving body of work – iterated over time to reflect my growth as a product designer. Each revision showcases how my design decisions matured alongside ongoing research, evolving best practices, and the development of scalable component libraries.

TL;DR

Designed a mobile app for Reformation that streamlined discovery, favorites, and post-purchase flows- reducing friction and supporting more intentional, sustainable shopping.

The Design Process

Inch By Inch, It’s a Cinch!

The design process acted as my guardrails by transforming scattered ideas and information overload into clear, intentional solutions. As I progressed in each stage, I clearly delineated which processes were conducive towards understanding the user while building out the most comprehensive mobile app.

Discovery 🪩

Research Methodologies

During the research phase, I audited the existing interface, conducted a competitive analysis of premium apparel brands, and interviewed Reformation shoppers to uncover key pain points, motivations, and feature needs.

Examine Thyself 🔍

Identifying Areas for Improvement

In order to develop effective features for Reformation’s mobile app, I audited Reformation’s mobile web experience to identify performance and usability issues, then benchmarked those findings against competitor apps to support app-specific opportunities.

Exploring the Competition 🕵🏻‍‍️‍️ ️

& Finding The Best Features In Other Apps

As I pored over some of the most popular shopping apps that are on par with Reformation’s style and shopper demographic, I noticed certain features that completely leveled the game with online shopping. So, with pen in hand, I check marked which features would incorporate intuitive functionality without missing Ref’s quintessential ethos.

User Surveys 📊

Figuring Out What The Users Want

Surveys captured insights from 16 participants about their experiences browsing (mobile vs web), product discovery, purchasing (in-person vs online), post-purchase behavior (returns, customer support), which informed the following in-depth interview questions.

I found strong alignment in how users discover products – most relied on curated collections, new arrivals, and social inspiration – but notable differences emerged during the decision and purchase phases. Some participants preferred browsing online but completing purchases in-store to assess fit and fabric, while others relied heavily on reviews via influencers.

& Respective Findings

Notable Insights:

"Browsing feels enjoyable when I don't have to overthink about where I want to save my items or digging through my settings for specific features. Everything is just there."

"Saved items remind me that if I still want it now, and not just then, I should definitely get it."

• Over 80% of participants report exposure to Reformation via social media platforms, notably Instagram and TikTok

• 81% of participants primarily browse Reformation on mobile device

• 63% of participants reported purchasing at least one item from saved items

• 64% of participants rely on reviews (via social media) to inform purchase decision due to Ref's lack of review section

• Over 60% of participants have returned Ref item, with 80% via mail/online and only 20% in-store

• 38% of participants have reached out to customer support (RefLove) regarding returns because experienced difficulty accessing returns portal

• 62% of participants expressed frustration in finding order history

• 31% of participants experienced dissatisfaction with disjointed tracking updates

• The biggest reason for returns is due to sizing inconsistency

TL;DR: Prioritization of a wishlist and quick checkouts on a mobile format were essential to maintaining the visual thread to completed shopping purchases and thereby driving sales.

User Interviews 🗒️

I conducted user interviews with 6 participants who have shopped at Reformation as well as adjacent, apparel lines (Aritzia, Sezane, Madewell, COS, etc). The long-form interviews helped reveal each participant's motivations and pain points when shopping online and helped lay the foundation for my user persona.

& Respective Findings

Affinity Diagram

Define 💭

User Persona

"I want a capsule closet with timeless pieces."

One of the most important aspects of research is understanding and personalizing user needs to enhance and streamline their shopping experience. By identifying user behavior and pain points, I could avoid common pitfalls and design a beautiful, intuitive, and immersive experience – one that keeps users engaged and skips any buyer’s remorse.

Card Sorting

Do All Users Think The Same?

I conducted a closed card sorting with 12 participants, asking them to organize 37 cards into 7 predefined categories. Most participants grouped the cards in ways consistent with familiar mobile clothing app patterns, which provided a strong foundation for the sitemap and overall information architecture.

Information Architecture & Site Map

Creating a Blueprint for Ref's Mobile App

I created a site map of the overall layout of Ref's mobile app to help crystallize the necessary features and navigation which would serve as the groundwork during the design process.

Ideation 💡🎨

Sketches & Wireframes 🖊️

From Pen & Paper to Digital Mock Ups

Pen to paper sketches were the best way for me to ground my designs and then use as a springboard once I was able to convert them into wireframes and prototypes. From there, I iterated directly on the prototypes.

UI Design Guide & Color Palette 🎨

Expanding Beyond Ref's Black-&-White (Monochromatic) Theme

For typography, I paired modern and classic typefaces, like SF Pro Display, Crimson Pro, and Georgia, to reflect Reformation’s timeless minimalism, anchored by a warm, burnished brown text color. A neutral palette of beiges, grays, and soft pastels supports seasonal versatility, while a custom component library ensures scalable, brand-aligned UI across the app.

Then Comes Mid-to-Hi-fi Wireframes

Translating my sketches into wireframes showed me how feasible some of my initial sketches are and allowed me to revise any ideas before moving forward with the prototyping process.

Develop & Launch 🎨 🚀

The Beta-Testing Phase

First Round of Usability for Prototype 1.0

Initial sketches and wireframes evolved into high-fidelity prototypes through continuous iteration. Each pass refined the experience further, ensuring every detail aligned with Reformation’s standard of elegance and usability.

Usability Testing🥼

Conducted Maze usability testing to compare Reformation’s mobile web flow against my prototype, uncovering friction and engagement gaps to guide final refinements.

Key Insights from Usability Testing

• Engagement increased by 48%, with users staying on the mobile prototype an average 2 minutes longer

• Order completion occurred 3 minutes faster

• All participants were able to navigate to Order History with minimal confusion compared to mobile browser

• Users felt most excited upon finding Reformation on their discovery pages, usually Instagram or Tiktok.

• Decision hesitation often occurred when comparing similar items without side-by-side context.

• Post-purchase features (returns, RefCycle, and RefLove) increased trust, even when users didn’t use them immediately.

How These Insights Informed the Final Prototype

• Incorporated more detailed product information (material & care, sustainability impact)

• Incorporated multiple wishlists for users to better organize saved items

• Clearer post-purchase pathways, such as nestling Order History, Order Tracking, Returns/Exchanges in user's profile tab

Refined End-to-End Journey (Post-Testing)

Optimize 🎯

Launch & Test of Prototype 2.0 🎬

This final iteration incorporated user feedback from the second round of usability testing and also reflects my continuous pursuit of refinement, where each tweak was driven by intention and a desire to elevate the user experience without compromising Reformation’s brand essence.

Click to try app prototype! 📱

Reflections

Key Takeaways

What Did Reformation Teach Me About Designing for (Retail) Shoppers?

One of the biggest issues of online shopping is maintaining the visual thread when users click on one product and then the next. Each link, or lack of, is a crucial, decision point between a completed purchase (revenue for the business, anticipation for the user) or an abandoned cart (lack of conversion and disappointment, respectively). So, contrary to the idea of mindless scrolling that tends to permeate tech spaces, the human mind is preoccupied with about 6k+ thoughts per day (most of them the same), and as a designer I have to ask myself, "Why does my product deserve your attention?" Concurrently, "what is your purpose for using my product?" I believe these are two salient questions to reach the core of any product design challenge.

The biggest pain points I encountered while working on Reformation were the current one-dimensional wishlists that felt more like a dumping ground for "ooh this is cute, maybe I'll look at it later," to which my research revealed that only 20% of users actually revisited the things they saved in their current wishlist. So I wanted to focus on, "How do I promote intentional shopping without overwhelming the users?" So, I alleviated this pain point by offering users the ability to create and title their wishlists according to their needs and preferences. What I found was that users utilized this function by 78% and revisited 41% more – that's a huge win!

On to the second pain point: obtaining readily available information versus getting in touch with customer service. During my first round of usability testing, I found that users weren't content with the sparse amount of information pertaining to Ref's clothes. Potential shoppers wanted more robust descriptions of these capsule items they were about to drop 100s of dollars on- where was the material sourced; what does the fabric feel like; what are the care and instructions; how's the sizing guide, is it all encompassing?" And while users do utilize RefLove, Ref's customer service line, most users cited feeling lazy, and even dread, at the thought of having to find Reformation's customer service line and then sending them an email which would most likely be buried in their already overflowing inbox of reminders and other miscellaneous newsletters. And if users can't have their questions answered, why would they want to buy the product? It's important to keep in mind these are your conscious, sustainable shoppers who want to be met in a world of fast fashion.

What I'd Continue

I'm very thankful that I've been able to revisit Reformation throughout the years to edit and improve upon my designs and continue to grow (as you can see, it's been quite a journey!) Nonetheless, if given more time and the chance to collaborate directly with Reformation and their designers, I'd love to expand on the checkout flow. As of right now, it's only a semi-interactive screen where users can add and delete items in cart, but I want to explore more how users actually complete the purchase- what are some hesitations that cause users to leave cart, what are some actions that will urge users to complete purchase?