Style Up
UX Case Study

Style Up

Client
UX Case Study
services
Interaction Design & User Research
project scope
Mobile App Concept

This case study was focused on rapid prototyping. At the end of one week, I delivered an interactive paper prototype of a mobile app that solved customer pain points in the fashion / retail sector.

Project Goals

My goal was to develop an app that would help users cut through all the noise to find products that matched their unique preferences and style. I come from an apparel design background and over the past several years I have witnessed how online shopping and social media have rapidly changed the retail sector. I was particularly interested in how people follow trends, where / how they shop, what drives them to make purchases, and pain points they encounter along the way. 

User Research

Sample Size: 5 participants

When writing the interview questions I started with a longer question guide so I could cover different aspects of the fashion / shopping experience. I also kept the questions broad to identify key pain points that would lead me to what problem to focus on for the project.

Potential users of the app would be tech savvy and looking for a tool to simplify their life and save time. With this in mind, I targeted women ages 20 - 55 for our user demographic. I interviewed users from varying backgrounds and ages so there would be multiple personas represented in the discovery. In the first couple interviews I learned that asking for specific examples helped the users to provide more detail on their experiences. This led to more insight on their actual behaviors instead of just learning about their preferences. 

Interview Questions & Topic Map

Synthesis

After the first three interviews I started to see some common trends in user experience and possible pain points. I drew a rough Topic Map, which I used to refine the questions down before interviewing the next group of participants. Afterwards I began the synthesis process by writing down key insights from each user to prepare for the affinity map. 

Affinity Map

Key I statements from synthesis were: 

  • I keep things for a long time
  • I look to my friends, family, and people around me for style inspiration
  • I am price and need motivated
  • I want clothes that fit
  • I like shopping but it can be stressful
  • I like to think about my purchases before buying 
  • I care about sustainability and quality
  • I have more success online when looking for something specific
  • I go shopping in a retail store as an event / activity
  • I get frustrated when I can't find what I want
  • I spend too much time comparing options in stores and online
  • I find all the options overwhelming

Through the user interviews and synthesis I found that all my users had unique preferences and fit profiles, but everyone had issues finding what they were looking for. A lot of time was spent looking for items both in store and online which led to frustration. 

Other shopping apps I researched had search engines, but they didn’t narrow things down enough to take into account the user’s unique style and fit profile.  My solution was to create an app that would combine the filter with the user's unique profile so they would have more relevant search results. The app would also partner with a larger mix of stores so users could search for everything in one place. 

Problem & Solution Statement

This led to my problem and solution statement that: 

Shoppers need a more effective way to search for clothing because they're spending too much time sifting through items that don't match with their unique profiles.

We believe that designing a fashion search engine that takes into account their unique profile and preferences will result in a better shopping experience. 

We will know this to be true when we see more items purchased and less returns to our retail partners. 

User Flow

After I identified my problem and solution I made a rough sketch of the user flow for the fashion app. In my first draft I put the filter and user profile together at the beginning of the app, but through iteration I found that it was better to put the user profile later on in the flow after they found something that they wanted. 

User Flow

Storyboard

I created a storyboard to illustrate the need for the app and show how it would help our users. I chose to show a scenario when a user was under some stress and looking for something specific. In my example, I wanted to show how combining the search filter with her unique profile would lead to her finding what she wanted. 

Storyboard



User Testing / Iteration

Before sketching I looked at some examples of existing fashion search engines to review industry standards. After drafting several iterations, I landed on a minimal design with repeating elements to create cohesion throughout the app. 

Design Exploration

I performed a search engine test with five users. They were instructed to search for a pair of pants in a size medium, the color blue, and at a local store. After applying the filters, they would add two pairs of pants to their favorites, where they would review and select one to purchase. Once on the product page they would check the fit of the pants, which would lead them to fill out their fit profile. Then they could check the fit and purchase through a retail partner.

Usability Testing


The largest pain point for users was on the Filter page. I had designed the interface so the user would choose their preference, and select the caret at the top left of the screen to go back to the filter page. However, after users clicked into a filter category to select their preference, they expected the page to confirm their choice had been saved or automatically return them to the main filter page.

To solve this issue I added a “show ### products” button at the bottom of the filter category page that would appear after the user had made their selection. I tested the prototype with this update, but there was still confusion.

This led me to change the button to say “save filter.” If the user selected the bottom button or caret at the top, their selections would save and return them to the main filter page.

Filter Iterations

On the Fit Profile screen I wanted users to add in each measurement so that it would save their fit profile for future searches. However, I found that users were only adding measurements that applied to the current search for pants. I added an asterisk next to the categories along with a note at the bottom of the screen so that users would know each field needed to be filled out. 

Fit Profile Iterations

Paper Prototype 

After moving through several iterations, I landed on a final design for the paper prototype. Since the app is a search engine I wanted to show a clear search bar on the Home page. In my user research one of the themes that emerged was that people looked mostly to their friends, family and local street style for fashion trends and inspiration. Another key element that affected what clothing people were looking for was weather and season. On the Homepage I decided to feature local trends and products that would change based on the user's location and style preferences. 

After searching for an item, the product results would display down the page. I decided to show two items per row so that you could view multiple results while still seeing details of the product. I added a couple buttons at the top of the page so you could sort the items by attributes such as price, most popular, and newest, as well as filter by a number of preferences. I also included a Heart icon at the top of the page so users could easily navigate to items they had favorited. 

Home & Search

Once on the Filter page, I listed a number of categories to help filter the product based on information gathered from interviews and a competitive analysis. I decided on this layout because it felt clean and easy to navigate while showing all the options.

I chose to test the Store filter in the prototype because I saw an opportunity here to do something differently from the other fashion search engines. From my research I found that each search engine specialized in one segment of the retail market such as used clothing at Poshmark, emerging contemporary brands at Garmentory, and more mainstream retail at ShopStyle. The users I interviewed shopped all of these categories, so I thought it would be beneficial to feature all of them on the app. 

I also wanted to add in the Local Store filter because a number of users liked to shop retail stores in person so they could try things on, but experienced frustration from going to multiple stores and not finding anything. Having a way to compare local offerings ahead of time could help solve this issue and would also set us apart from the competition. 

Filter & Favorites

The research showed that users like to think about their purchases for several days or even weeks before purchasing, so I wanted to create a way to favorite and organize products that they were thinking about. This feature would also help to inform their unique user profile so the app could recommend more relevant products based on their user behavior. 

For the Fit Profile, I created a form where the user would add in their measurements. The idea was that the measurements given would create a proportional line drawing of their body. When the user would check the fit, the app would plug in the measurements of the garment from the product page to create an outline around the body, giving the user a better sense of fit and proportion. The app would take into account ease for movement and other fit preferences like ‘fitted’ or ‘relaxed’ so that it could recommend different sizes based on the user's profile.  

Fit Profile & Checkout

At checkout, I decided to refer the customer to the retailer to complete the purchase. I found that other search engines did a mix of retailer referrals or drop shipping, but I chose referral to start out so that the app would be more attractive to larger retailers like Amazon, Asos and Nordstroms who might want more control with the shipping and packaging. 

Learnings

If I were developing the app further, I would move into a higher fidelity prototype and collaborate with data scientists and developers to create the style and fit filters. For the app to be successful, we would need to test how accurately it could match products to the user's preferences and build a list of store partners.

Through this project I learned the importance of visibility of system status. Providing clear feedback throughout the app gave users confidence that their information was being saved, and they had a sense of where they were in the process. This was especially apparent on the filter category pages when users were making their selections. By creating a clear indication that their preferences were saved, users were able to add multiple filters quickly to narrow down their results to a more relevant product offering.



Interested in working together?

Let's chat.

get in touch