Overview

Project Overview

By 2020, W.S. Microgreens' customer base had rapidly expanded by 75%. Their single static page website wasn't made to handle high traffic.

Challenge

IDENTIFY all the service’s value propositions
ENGAGE new customers on the service & selections available
BUILD customer community with recipes

Solution

DEFINED user flows for both new & existing customers
SIMPLIFIED how subscription works
SHOWCASED all produce selections
AUTOMATED subscription sign up process
CONFIGURED recipe section into all user journeys

Overview

Results

45%

Increase in conversion rate

The redesigned landing page turned a considerable increase in subscription sales, thanks to the walk through of selling points.

71%

Decrease in onboarding time

Automated subscription sign ups saved employees time on repetitive customer service.

32%

Increase in site engagement

Average site visit duration increased from 10.2 sec to 40.4 sec, signifying customers are engaging more with the new site.

Process

Discover Problems

Company growth was rapidly outpacing the existing system in customer acquisition and fulfillment. To understand both customer and company needs:

My 2 goals were:

Understand Existing Architecture
What unique selling points speaks best to the target audience? What features does stakeholder wish to add?
Locate Pain Points
uncover obstacles in prospective customer buying journeys, and pain points in signing on & fulfilling orders.

hand drawn diagram of microgreens website's existing user journey map

Existing Website Audit

I examined the existing site to understand its information architecture. While Microgreens fills a much needed niche, their one-page website makes it hard for new customers to learn about the service & convert.

Unclear Service
Prospective customers struggle to learn how this service works or what to expect.
Produce Options
Customers are left in the dark on what produce options are available.
Call to Purchase
Subscriptions can only be placed via phone call, which wastes time.

Boosting Engagement with RECIPES

To promote customer community and engagement, the brand created RECIPES: an ongoing cooking series where you can learn recipes taught right in the kitchens of local restaurants. Stakeholders wished to add RECIPES somewhere along the user journey to promote engagement with their brand.

Preliminary User Testing

To actualize our findings, the existing website was screened through 10 brand-unaware participants matching the brand’s user persona. Here are the top comments:

Top Responses:

"How do I select what microgreens I want?"
"How often do I get a shipment?"
“What if I want to edit my subscription?"
“Do I have to call to change my subscription?”
“I don't get how this works”
“How much do i get with per shipment?”
“What should i expect after purchasing?”

hand-drawn wireframe of microgreen's selections page design in hanson's journal

Process

Develop Solutions

Serving both new & existing customers by restructuring info architecture

To accommodate the user journey of both prospective & existing customers, My team and I reordered the website with a simple layout.

Home Page
Educate prospective customers on how the service works
Selections Page
Showcase produce selection to both new and existing users
Subscriptions Page
The CTA. Provide subscription options to purchase
Recipes Page
Engage customers with tutorial based cooking content

finalized user flow diagram of both existing and prospective customers on microgreen's website

finalized user flow diagram of both existing and prospective customers

Educating prospective customers by optimizing the home page

My team and I altered the homepage to foster a great introduction for prospective customers. The primary call to action here, routes users to the selections page, NOT the subscription page. This is because most consider buying a subscription a large commitment. That's why we highlight what they'd get before encouraging them to buy a subscription.

diagram showing the process of creating the homepage design, from low fidelity wireframe, to high fidelity mockup

final mobile and desktop design of the produce selection page

Showcasing all produce options in selections page

A simple page of all selections made browsing all produce convenient for both existing and prospective customers. We organized the page starting with the most compelling groups of produce, such as Most Popular & taste profile. This made content skimable and easy to remember.

Automating the sign up process via subscriptions page

wireframe showing subscription options for microgreens customers

preview of product images highlighting product selling points

Automating the sign up process by creating subscriptions page

Automate subscription plans to buy

An automated subscription sign up process saves time for both the customer & the brand

wireframe of wholesale subscription option for wholesalers and restaurants

Reminding what they’re missing out on

Customers can review all produce options, showing a clear value proposition to sign up for.

wireframe of all selections option customers can go to see all produce options

finalized design of wholesale subscription selection for restaurants

Catering to wholesalers & restaurants

For restaurants & wholesalers who need much higher quantities delivered per shipment.

Boosting engagement by creating recipes page

My team and I dedicated a RECIPES page to engage the community with the brand. CTAs to this page scattered throughout the site to lure prospective customers into what they’re missing out from W.S. Microgreens. Meanwhile, the page gives existing customers the latest.

hi fidelity mockup of the recipe page with a featured recipe and a list of recommended recipes

high fidelity mockup of the recipe page with featured and recommended recipes

Develop & test solution

I built all pages & components on Shopify + Appstle. working closely with stakeholders and the marketing manager to iron out page interactions, and backend operating guidelines.

The completed site then had a final round of user testing to observe customer responses before going live.

Takeaways

Split design ideas into phases

With time and budget limitations, prioritize solutions that best address the problem and can be completed within time constraints. Components that require more resources can be done later.

Avoid interruptions during user tests

Human concentration can be easily interrupted, which affects user perceptions in random ways. Limit as many possible distractions to get accurate results.

Consider acquisition in user flows

In reality, user journeys start before arriving to the site, usually first on social. Consider how you can optimize the site to complement the brand's social media content.

W.S. Microgreens site revamp

Discoverability was the focus of this website redesign. This grocery subscription service refocused on educating new customers how it works, while keeping existing clients engaged. User flows began with features & produce options before showing subscriptions.

Project Overview

Challenge

Solution

Results

Discover Problems

My 2 goals were:

Existing Website Audit

Boosting Engagement with RECIPES

Preliminary User Testing

Define the Problem

Users are confused how this service works, and are left wondering what the produce options are. The route to purchase is archaic, and the brand’s recipes need be added to the user flow.

Takeaways

Develop Solutions

Serving both new & existing customers by restructuring info architecture

Educating prospective customers by optimizing the home page

Showcasing all produce options in selections page

Automating the sign up process via subscriptions page

Automating the sign up process by creating subscriptions page

Boosting engagement by creating recipes page

Testing Results

User testing revealed users favored the simple explanation on how the service works. They enjoyed viewing all selections, which quickly led to conversions. Once live, the new site increased conversion rates by 45%. Repeat visits on the recipe page marked a rise in engagement.

Takeaways

You might also like

Let's get in touch

Use this form to shoot me a message

Use this form to shoot me a message

W.S. Microgreens site revamp

Discoverability was the focus of this website redesign. This grocery subscription service refocused on educating new customers how it works, while keeping existing clients engaged. User flows began with features & produce options before showing subscriptions.

Project Overview

Challenge

Solution

Results

Discover Problems

My 2 goals were:

Existing Website Audit

Boosting Engagement with RECIPES

Preliminary User Testing

Define the Problem

Users are confused how this service works, and are left wondering what the produce options are. The route to purchase is archaic, and the brand’s recipes need be added to the user flow.

Takeaways

Develop Solutions

Serving both new & existing customers by restructuring info architecture

Educating prospective customers by optimizing the home page

Showcasing all produce options in selections page

Automating the sign up process via subscriptions page

Automating the sign up process by creating subscriptions page

Boosting engagement by creating recipes page

Testing Results

User testing revealed users favored the simple explanation on how the service works. They enjoyed viewing all selections, which quickly led to conversions. Once live, the new site increased conversion rates by 45%. Repeat visits on the recipe page marked a rise in engagement.

Takeaways

You might also like

Let's get in touch