NOOCH VEGAN MARKET

MY ROLE

Lead UX/UI designer + researcher

—

Project:

Responsive Web + Mobile Redesign

Tools Used:

Sketch, InVision, Zeplin

Timeline:

2 week sprint

CHALLENGE + VISION

CHALLeNGE

Nooch Vegan Market is an independent, women-owned business in the heart of Denver. They offer 100% vegan items and specialize in local, handcrafted, small-batch, and artisan brands. They also have a large U.S. wide following and many people would like online access to their products. However many of the items they offer are perishable and cannot be delivered.

Task

Redesign Nooch’s website into an e-commerce responsive website.

Approach

I began by conducting a heuristic review of the current website and interviewing customers, potential customers, and Nooch employees - followed by a comprehensive competitive audit. These key insights defined the planning, design, and direction.

DIRECTION

The solution became an e-commerce website that provides access to unique food items offered by Nooch Vegan Market by making all items available for in-store pick-up and select items available for delivery.

RESEARCH + DISCOVERY

BUSINESS INSIGHTS

Unique Offerings

Nooch has the ability to provide specialty, small-batch items that larger stores can’t stock.

Large Market

They provide 100% vegan items and this attracts a very niche market. Nooch has a very large nationwide following on their instagram feed and many travelers stop into Nooch daily, excited to try the vegan items that are not readily available near them.

Diverse and Loyal Market

Many customers were not vegan, nor had dietary restriction, they choose to shop at Nooch for the unique offerings and to support a local independent business.

COMPETITIVE SET

USER INSIGHTS

Unique Product Demand

Customers return to Nooch for the unique specialty, small batch, local and vegan items that are hard to find elsewhere.

Online Shopping is a Thing

There is a growing trend of buying groceries online and 20% of those interviewed shop online exclusively.

Support for Local Businesses

There is a strong desire to support local small business to reinvest in the community.

Grocery Delivery

People want grocery shopping to be easy and prefer the convenience of having groceries delivered to their door.

Limited Availability of Vegan Items

Vegan specialty items can be limited and difficult to find in some areas and stores.

Diet Influences

Shoppers have become more influenced by diet restrictions and preferences.

From these insights the following

personas developed

**“I hate going to the**
**grocery store, I’d**
**rather tip the delivery guy who brings me my groceries”**

**Vanessa Smith, 31, Vegan, Denver CO**

**“I go to Nooch for the unique items I can’t find anywhere else”**

**Dan Drew, 37, Small Business Owner, Denver CO**

DIRECTION + VISION

NOOCH Vegan Market, can offer an e-commerce website that provides:

100% Vegan, local, small batch, handcrafted, and organic food items
Delivery and in-store pick-up
Easy to find featured items, with multiple ways to sort based on dietary or food preferences

-

No

1 IDEATION + DESIGN

Several design challenges were presented during the ideation process.

Challenge No 1 - Shipping

Nooch provides many perishable items that cannot be easily shipped, but people would still like to have access to these items online.

Early in the process of sketching and wireframing reviews, 100% of users tested said that delivery clarification was a crucial feature that must clearly be defined upfront. It was important to communicate that only some items could be delivered, while others could only be reserved for pick up.

“I proposed that a clear method carry through the user flow: distinguishing between which items can be delivered and which ones could be purchased in advance for pick up.”

Through several iterations and testing, I decided on a small blue call-out button on the product description that would communicate which items are deliverable. Choosing to focus on the positive language that indicated deliverable over introducing any negative language of something not being deliverable. I also provided a way to filter items by this metric, and unified the language throughout the website (on the homepage, in the cart, etc.).

Filter by

I clarified the filter options of Delivery or In Store Pick Up to avoid any confusion from the beginning of the customers experience. I added the blue background to this section to highlight the importance of this filtering option.

This Product is Deliverable

I kept the design clean and the message clear by adding a small call out to the product description. Products that are not deliverable just have the product description and price.

CheckOut

I continued communicating the choice of In Store Pick Up or Delivery throughout the checkout process

Continuing to communicate the delivery method, I designed a banner that highlighted the delivery options. However, testing showed that users wanted to click the banner thinking it was a CTA button and it became too much of a focus. This was problematic for several reasons, it was not clickable and I needed the featured items to still grab attention. It took a few iterations on this to come up with a workable direction that made the delivery options clear and still kept the featured items in the spotlight.

No 1

I added this banner in response to testing to help clarify the delivery method, but found in additional testing it was causing more questions then helpful direction. And was distracting traffic from the featured items.

No 2

Removing both the unclear hero image and the banner helped with the confusion and the featured items gained the traffic I was looking for, however this was not holding up as a solid homepage and left little communication about the delivery method.

Moving into mockups, the homepage got a

complete overhaul

No 3

Added back the delivery method language.

No 4

Introduced Customer Favorites, which also shows which items are deliverable in the product descriptions.

No 5

Introduced a hero image to ad more visual interest.

No 6

Provided more direction that indicates you can click on the featured items.

-

No

2

Challenge No2 - Filters

Identifying food categorization that was intuitive and widely understood, while remaining concise and effective presented another level of complexity. Seeing that stores have their own unique organizational techniques, a few things became clear: