2023, Stylesaves

made online shopping less overwhelming

Role

UX Designer (Solo)

Duration

10 weeks

Skills

  • user interviews

  • competitive analysis

  • product strategy

  • information architecture

  • usability testing

  • visual design

introduction

The Project's Inspiration

One day, I was watching a friend online shop: she clicked through seven tabs of different retail stores, scrolled through the carts of each, sighed, and then closed her laptop. This made me wonder, Was my friend's struggle of excessively online browsing only to find nothing purchase-worthy a more widespread problem than just her?

The Problem

⚠️
⚠️
The online shopping experience is too overwhelming.
The online shopping experience is too overwhelming.

The Opportunity

🌟
🌟
HMW make online shopping less overwhelming and help shoppers make purchasing decisions?
HMW make online shopping less overwhelming and help shoppers make purchasing decisions?

Solution Overview

The App's Key Features

Easily Discover Relevant Options
  • follow brands and save items to inform app on style preferences

  • personalized home page recommendations from browsing history, saved items, and followed brands

Compare Multiple Items on One Page
  • eliminate back and forth tab switching and streamline decision making

Smart Purchase Insights
  • Brand data used to predict cheapest time to purchase item

  • view brand sales and shipping policy to factor all costs of a potential purchase

process Overview

process Overview

the process

the process

Validating the Problem: User Interviews

To understand the problem more deeply, I conducted 4 user interviews, learning about people's online shopping process, motivations, and factors that affect their decision to purchase. Through this, I discovered the problem was more nuanced than simply having too many options. I identified the 3 biggest shopper pain points to guide my design direction.

Users browsed multiple stores to make sure they weren’t missing out on a better option.
Users browsed multiple stores to make sure they weren’t missing out on a better option.
Users browsed multiple stores to make sure they weren’t missing out on a better option.

Insight #1

HMW simplify item discovery across brands without overwhelming users?
HMW simplify item discovery across brands without overwhelming users?
HMW simplify item discovery across brands without overwhelming users?

Design Opportunity #1

Design Opportunity #1

Design Opportunity #1

Users compared items across and within stores before purchasing.
Users compared items across and within stores before purchasing.
Users compared items across and within stores before purchasing.

Insight #2

HMW make comparing items easier?
HMW make comparing items easier?
HMW make comparing items easier?

Design Opportunity #2

Design Opportunity #2

Design Opportunity #2

Sales incentivized users to make a purchase and helped them justify it.
Sales incentivized users to make a purchase and helped them justify it.
Sales incentivized users to make a purchase and helped them justify it.

Insight #3

HMW provide the price information needed to incentivize making a purchasing decision?
HMW provide the price information needed to incentivize making a purchasing decision?
HMW provide the price information needed to incentivize making a purchasing decision?

Design Opportunity #3

Design Opportunity #3

Competitive Analysis: Finding a Market Gap

Competitive Analysis: Finding a Market Gap

After identifying the three biggest pain points shoppers were having, I needed to see how well current solutions addressed these pain points. Was there a need for my solution?


I found no direct competitors, and none of the indirect competitors addressed all three pain points.

Designing, Testing, and More Designing

With the key user needs established and no solution on the market addressing these needs, I got to designing. And iterating. And re-iterating. Given time restraints, I prioritized testing 2 features with 3 users. This was important because as a solo designer, I didn't have other designers to do design critiques with, so I wanted to validate my thinking.


I concept tested the clicking brand name interaction because it was an opportunity to understand user preferences to further personalize recommendations.

Testing #1

Clicking on Brand Name

Later in my design process, I user tested the direct item comparison feature in high fidelity because it addressed one of users' greatest pain points, so it was crucial to get feedback on and design well.

Testing #2

Direct Comparison Feature

There were major issues with all of my designs, so I ended up combining the aspects users liked about the containers and swiping cards design to create the final feature.

Final Designs

Creating a Design System

I created a design system to ensure consistency within the app and to make the product cohesive. I revised this design system in efforts to make the look and feel of the app more modern.

Final Design System
Final Design System
Example of UI Improvements: Item Details Screen
Example of UI Improvements: Item Details Screen

Prototype

Considering Business Needs

Hypothetically Measuring Impact

If StyleSaves were to launch, I'd want to measure how well my designs addressed shoppers' greatest pain points.

Metric #1

Metric #1

Metric #1

Direct Comparison Usage Rate
Direct Comparison Usage Rate
Direct Comparison Usage Rate

Tracking the percentage of direct comparison feature users and their frequency of use could reveal its effectiveness and integration into the shopping process.

Tracking the percentage of direct comparison feature users and their frequency of use could reveal its effectiveness and integration into the shopping process.

Tracking the percentage of direct comparison feature users and their frequency of use could reveal its effectiveness and integration into the shopping process.

Metric #2

Metric #2

Metric #2

Conversion Rates by Feature
Conversion Rates by Feature
Conversion Rates by Feature

Tracking rates of key conversion points like item comparisons, best-time-to-buy notifications, and item details page will help identify what drives purchase decisions.

Tracking rates of key conversion points like item comparisons, best-time-to-buy notifications, and item details page will help identify what drives purchase decisions.

Tracking rates of key conversion points like item comparisons, best-time-to-buy notifications, and item details page will help identify what drives purchase decisions.

Learning and Reflections

Importance of prioritization

I initially got lost designing every feature the app would have, but revisiting my research helped me prioritize features to design, and I could execute the project more efficiently. This skill was crucial to develop, especially given limited resources and time in the real world.

Importance of prioritization

I initially got lost designing every feature the app would have, but revisiting my research helped me prioritize features to design, and I could execute the project more efficiently. This skill was crucial to develop, especially given limited resources and time in the real world.

Importance of prioritization

I initially got lost designing every feature the app would have, but revisiting my research helped me prioritize features to design, and I could execute the project more efficiently. This skill was crucial to develop, especially given limited resources and time in the real world.

Challenge instinctive design decisions

Designing from scratch without constraints like a design system or existing information hierarchy, challenged me to constantly question and justify every design decision, enhancing my critical thinking skills.

Challenge instinctive design decisions

Designing from scratch without constraints like a design system or existing information hierarchy, challenged me to constantly question and justify every design decision, enhancing my critical thinking skills.

Challenge instinctive design decisions

Designing from scratch without constraints like a design system or existing information hierarchy, challenged me to constantly question and justify every design decision, enhancing my critical thinking skills.

Be aware of assumptions made

Through user testing, I learned to be more aware of assumptions I made about my user that I didn't even recognize were a part of my design process. In the future, I will be extra aware that I am not the user, so that I can prevent making unintentional assumptions.

Be aware of assumptions made

Through user testing, I learned to be more aware of assumptions I made about my user that I didn't even recognize were a part of my design process. In the future, I will be extra aware that I am not the user, so that I can prevent making unintentional assumptions.

like what you see? Get in touch!

katiewu@umich.edu

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More Work

More work

More work