Work
About
Resume
Work
About
Resume
Work
About
Resume

The Source Zero

Helping a mission driven eco-boutique connect their customers with products they love.

Overview

Background:

This was an individual project I did to redesign the website for a small local business to help them better showcase their products and tell their story.

Timeline:

2 weeks

My Role:

UX Research,

UI Design

Who is The Source Zero?

The Source Zero is a zero-waste shop in San Jose, CA whose mission is to help their climate conscious customers reduce their environmental footprint. They sell locally sourced household & personal care products and host sustainability focused events at their store.

Redesign Goals

1.

Help customers discover eco-friendly products that meet their needs.

2.

2.

Cultivate a community of loyal customers by attracting people to visit the store in person

3.

3.

Create a visual identity that attracts new customers and conveys the store's brand.

Sourcing Perspectives

Competitive Analysis

I began the discovery process by exploring the sites for 3 other eco-boutiques to see how similar business present their products and help customers make purchases.


I noticed that other sites had more robust filtering and greater detail in their product descriptions than The Source Zero's. They also had integrations with Google Pay and Paypal which makes the checkout process significantly faster for users.


I decided to run usability tests with the current website to understand if these gaps were negatively impacting user experience.

Identifying Pain Points

I recruited 5 participants who regularly shop for eco-friendly products to participate in my research. I asked them to find a hair care product they were interested in purchasing and checkout using the in-store pickup option. I found they struggled in 3 main areas of the flow

1) Confusing Navigation

60% of users initially picked the wrong category for hair care products. They expressed surprise and frustration at how products were grouped together.

2) Inaccessible Product Info

60% users felt the product descriptions were hard to grasp and had trouble deciding whether they wanted to purchase the product.

3) Time Consuming Checkout Flow

100% of users had to repeat steps in the checkout process in order to find the in store option and address information.

User Research

Objective: Learn what motivates customers to purchase an eco-friendly product.

To gather insights that would be relevant for The Source Zero's customers, I sent a screener survey to recruit users that cared about the environmental impact of their shopping habits and conducted 5 interviews.

Meet Jade, The Sustainable Shopper

Goals:

  • Discover products she's excited to use

  • Feel good about minimizing her environmental footprint

Frustrations:

  • Not understanding scientific jargon about products

  • Clunky, time-consuming online shopping experiences

Problem Statement

Jade wants a simple way to discover environmentally friendly products she’s excited to use so she can make purchases that align with her values.

Sourcing Perspectives

Competitive Analysis

I began the discovery process by exploring the sites for 3 other eco-boutiques to see how similar business present their products and help customers make purchases.


I noticed that other sites had more robust filtering and greater detail in their product descriptions than The Source Zero's. They also had integrations with Google Pay and Paypal which makes the checkout process significantly faster for users.


I decided to run usability tests with the current website to understand if these gaps were negatively impacting user experience.

Identifying Pain Points

I recruited 5 participants who regularly shop for eco-friendly products to participate in my research. I asked them to find a hair care product they were interested in purchasing and checkout using the in-store pickup option. I found they struggled in 3 main areas of the flow

1) Confusing Navigation

60% of users initially picked the wrong category for hair care products. They expressed surprise and frustration at how products were grouped together.

2) Inaccessible Product Info

60% users felt the product descriptions were hard to grasp and had trouble deciding whether they wanted to purchase the product.

3) Time Consuming Checkout Flow

100% of users had to repeat steps in the checkout process in order to find the in store option and address information.

User Research

Objective: Learn what motivates customers to purchase an eco-friendly product.

To gather insights that would be relevant for The Source Zero's customers, I sent a screener survey to recruit users that cared about the environmental impact of their shopping habits and conducted 5 interviews.

Meet Jade, The Sustainable Shopper

Goals:

  • Discover products she's excited to use

  • Feel good about minimizing her environmental footprint

Frustrations:

  • Not understanding scientific jargon about products

  • Clunky, time-consuming online shopping experiences

Problem Statement

Jade wants a simple way to discover environmentally friendly products she’s excited to use so she can make purchases that align with her values.

Getting to Zero Confusion

Information Architecture

To address the confusion users had with the main navigation, I conducted an open card sort where I asked 10 participants to come up with their own terms to categorize The Source Zero's products. I analyzed the results to identify converging themes and created a site map that better reflected how users thought products should be grouped -

Original

Updated Version

Sketches

Home page

More spacious layout which highlights best-selling/new products and in store events.

Product page

Better organize product information and make environmental impact obvious.

Reduce, Reuse, Redesign

Mid-fidelity Usability Tests

Using the same tasks from usability testing the original site, I ran 5 more usability tests with my redesigned version to evaluate whether the changes I made would help users accomplish their goal of easily finding and purchasing products that align with their values.

task success rate for completing the in-store pickup flow.

said the product information would help them decide whether to purchase the item.

found the information they were looking for within 30 seconds.

Design Changes

Overall the results were significantly improved from the first version. Based on feedback and performance, I made some improvements to the navigation design and product gallery.

1) Navigation

Feedback: Left to right organization was confusing and increased the amount of time it took to find the relevant page.

Change: Separated the global categories and nested local ones underneath to make them more distinct.

2) Product Details Page

Feedback: Users wanted information about the environmental impact of products front and center.

Change: Added icons that describe key sustainability qualities of the products (recycled packaging, biodegradable, etc.)

3) Checkout

Feedback: Users wanted a more personal touch when receiving an order confirmation.

Change: Rewrote confirmation copy and included a call to action to visit in-store events.

Accessibility Audit

Original Site

The Source Zero's website had a few accessibility violations that needed to be addressed, particularly around color contrast where key navigation and product links could could barely be seen when hovered over.

Overall WCAG score

Product gallery page

Redesign

I created a new design system that reflected The Source Zero's brand colors and tone while resolving accessibility issues.

Design system

Text contrast ratio

Final Prototype

Launch Prototype

Launch Prototype

Launch Prototype

Thanks for scrolling! Drop me a line if you want to build something together.

Get in Touch

Thanks for scrolling! Drop me a line if you want to build something together.