VB Custom Tees Hero Banner

VB Custom Tees Website

Case Study

PRODUCT

I created a website to help online shoppers design custom-printed t-shirts in the sizes they want and at the prices they want. I need to find out if the main user experience, designing, and purchasing t-shirts is easy for users to complete. I’d like to understand the specific challenges that users might face in the browsing, customizing, and ordering process.

PROJECT DURATION

July 2022 – August 2022

VB Custom Tees Macbook Pro Mockup

PROBLEM

Most online custom design t-shirt websites have cluttered designs, inefficient make and print design pages, and a confusing checkout process.

GOAL

Design the VB Custom Tee’s website to be user-friendly by providing clear navigation, easy-to-use make and print-your-own designs, and offering a fast checkout process.

MY ROLE

  • User Research
  • User Experience
  • Visual Design

UX designer designing a website for custom printed t-shirt company, VB Custom Tees.

RESPONSIBILITIES

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, iterating on designs, and responsive design.

USER RESEARCH: SUMMARY

I conducted interviews and created empathy maps to understand the target users and their needs. I discovered that many target users wanted to create their own t-shirt designs for their organizations and for personal use. However, many of the custom design t-shirt websites were overwhelming and difficult to create designs. This frustrated many target users. This caused the design process to become challenging for them and ultimately, caused the user to cancel making a custom design and settle for in-stock, pre-printed t-shirts.

USER RESEARCH: PAIN POINTS

PERSONA:

SHEILA JACKSON

persona Sheila Jackson

USER JOURNEY MAP

SITEMAP

Sitemap VB Custom Tees

The VB Custom Tees Sitemap highlights the 6 web pages that are important for a successful user journey. They include Shop, Cart, Search, Login/Sign Up, About, and User Account.

PAPER WIREFRAMES

DIGITAL WIREFRAMES

LOW-FIDELITY PROTOTYPE

USABILITY STUDY: FINDINGS

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.

Round 1 findings

  1. TBD
  2. TBD
  3. TBD

Round 2 Findings

  1. TBD
  2. TBD

MOCKUPS

Before Usability Study

After Usability Study

MOCKUPS

HIGH-FIDELITY PROTOTYPE

ACCESSIBILITY CONSIDERATIONS

IMPACT & WHAT I LEARNED