E-COMMERCE FEATURE

Preserving THE store's brand image by showcasing diverse merchandise, AND highlighting thrift store status.

During the COVID pandemic, L Train Vintage, a thrift shop chain in NYC, got a chance to switch to selling things online. I came up with a re-design for their website adding new features for buying and selling. The goal was to make a model of the website to show their products and keep their brand's look.

Client
L Train Vintage

Timeline
2 weeks

Role
User Researcher, Product Designer, User Tester

Background

Since 1999, the family-owned company L Train Vintage has been delivering high-quality secondhand merchandise in NYC. People from across the USA flock to their stores in search of top-notch antique goods from around the world. They receive new shipments every month and restock their stores at least three times a week.

Competitive Analysis

I studied three secondhand stores in New York City that sell clothing online: Awoke Vintage, Beacon's Closet, and Housing Works. I wanted to see how their websites were designed for users to browse and buy shirts. I found that all three stores had the same steps for purchasing a shirt:

1. Go to the store's website.
2. Choose the type of clothing you want to look at.
3. Add the shirt you like to your shopping cart.
4. Review your cart.
5. Proceed to checkout.
6. Complete the order and payment process.

Interviews and card sorting

To better understand our users, I conducted interviews with four people who have experience buying clothes from thrift stores and regularly shop online. From these interviews, I gathered information and organized it through an affinity mapping session. Based on this, I identified common preferences, including the desire to use filters while shopping, knowing the size and measurements of clothes before purchasing, approaching shopping with an open mind, checking the order status, and appreciating a simple checkout process.

To conclude my research, I conducted a card sorting activity to group items sold by L Train Vintage. I made a list of 100 items that represented the store's variety of merchandise. This helped participants organize the items in logical categories. Based on the patterns I observed and the agreement among participants, I created a site map for the website's online shopping section using similar categories.

Personas

I created personas to better understand and prioritize the goals and needs of different user groups. One of these personas is Savannah, who loves fashion that is unique and expresses her personal style. She enjoys searching for hidden gems in thrift stores. Another persona, Aiden, likes to shop online, especially during difficult times like the pandemic. Learning from these profiles helped us design strategies and products that meet their specific preferences and behaviors.

  • Primary Persona

    Savannah has been shopping at thrift shops for years, both in-person and online. She loves finding used and vintage clothes. When she shops, she wants to easily navigate the store and find items for her wardrobe. She uses filters to get accurate results when she shops. It's important for her to be able to browse through the inventory easily. She goes into the store with a general idea of what she wants. She looks for specific information like measurements and materials. She doesn't like when items are not the right size. It frustrates her when it takes a long time to find what she wants online.

  • Secondary Persona

    Aiden is familiar with shopping online but not thrift shops. He prefers a simple and quick checkout process. He wants a one-tap checkout feature for safer transactions. Aiden uses Apple Pay, Shop Pay, and PayPal for his purchases. If the checkout process is slow or requires filling out long forms, he will abandon the purchase.

Problem Statement

Because of the restrictions caused by COVID, people need to be able to shop online instead of shopping in person.

Solution Statement

Create a new online shopping feature for the store's website to display and promote its products while staying true to the store's brand.

Sitemap

Thanks to organizing my cards earlier, I could categorize each product and make a simple sitemap for the website. The sitemap is easy to use and helps find what you're looking for.

Mid-fi wireframes

I started designing by making mid-fidelity wireframes. I quickly made a few different versions until I found the one that I thought would solve the design problem.

HOMEPAGE

PRODUCT PAGE

Hi-fi wireframes

After improving the mid-fi wireframes, I created more advanced hi-fi wireframes for the updated website.

HOMEPAGE

PRODUCT PAGE

Prototype and USABILITY testing

I used Figma to create a prototype of how to shop for a t-shirt. I tested it with three people to see if they could do certain things without any errors. The tasks were making an account, finding a shirt, and buying it. Everyone finished the tasks without any problems.

What I Learned

During the usability test, I collected feedback from participants on how to make the user experience better. Some of their suggestions include:

  • Adding more filters, even though they may not be always available.

  • Provide more product details while browsing, especially if you can add an item to your cart without visiting the product page first.

  • Allowing customers to save their billing and shipping info for future purchases.

To create an online shopping feature, you need to research the customers and what they care about when they browse and shop on your site. The pandemic made many people switch to online shopping. So, it's important to think about every aspect of your design to keep users interested and shopping, which helps your business grow.