Overview
This solo project is a proposed redesign for a fictitious client, The Garden Store. It is an e-Commerce website of a local business that sells plants and gardening supplies.
As the sole UI/UX designer on this project, my goal is to optimise the product discovery process and ultimately encourage users to follow through by checking out.
Timeline
2 weeks (Feb 2021)
Methods
User Interviews, Card Sorting, Affinity Mapping, Wireframes, Prototyping, Usability Testing
Tools
Figma, Miro, Adobe Illustrator, Optimal Sort, Otter.ai
Context
Nowadays, it's difficult to beat the convenience of shopping online, even for plants.
Owing to the influence of social media, an increasing number of city dwellers are beginning to discover a love for plants and dabble in gardening. Their desire to nurture, care and connect with Mother Nature has also contributed to the rise in plant sales in recent years.
Challenge
From my research, I found out that most online plant shoppers want the ability to filter out plants that are suitable for them, depending on the amount and quality of care that they're able to provide. Being able to do so would give them confidence in knowing that they can keep the plant alive after the purchase.
In addition, many of them also highlighted that they would appreciate being informed when plants they want are back in stock.
Hence, the question here is how can The Garden Store step up its e-Commerce game to cater to plant shoppers' need?
Solution
Based on research insights, the redesign of The Garden Store will focus on 2 core features to fulfil user needs:
1
Filtering search results based on care conditions plant shoppers are able to provide
2
Allowing users to be notified when items are back in stock
1. Understanding the Problem
User Interviews
I conducted 10 user interviews and was able to pull a few key insights which I believe will bring great value to The Garden Store and its customers.
These insights are that shoppers:
Competitive Analysis
2 Main Learning Points
from benchmarking against 3 direct competitors within the same industry:
NONE of the online plant stores
help shoppers to filter search results based on the care conditions they are able to provide
ONLY Potta Plantta
offers to notify shoppers when items are back in stock
Therefore, in order to have an edge in this industry, The Garden Store should consider implementing these features.
How do we do this?
Fret not, let's get inspired by a Best in Class example (Love, Bonito) and find out how they did it!
Best in Class Analysis
.png)
Love, Bonito is an established Singapore e-commerce site for women's wear. By analysing this site, I was able to learn and implement some of the best practices on The Garden Store website.
1) A simple questionnaire on the homepage to help filter for clothes that are suitable for shoppers
2) Shoppers get notified via email when items they want are back in stock
Information Architecture
I invited 16 people to organise products into categories that are logical to them.
69% of the participants agreed that 5 of the existing categories can be collapsed into a single category.
This result inspired me to simplify the site navigation (from 13 to 9 categories) in a way that makes sense to users.
2. Narrowing the Scope
Meet our Personas
From my research, 2 distinct personas emerged. Ideating concepts for these users would lead to solutions that work for both existing and potential shoppers on The Garden Store e-commerce site.
Lyla the Lawyer
"I only want to get low maintenance plants that will not die under my care."
Lyla is a very busy lawyer. She is single and lonely. She intends to buy some house plants for companionship. However, she is only considering low maintenance plants which she is able to take care of amidst her busy work schedule.
SCENARIO
• Low maintenance plants
• Staying alone and longs to care for something other than herself
NEEDS
• To feel sense of achievement when plants under her care thrive
• Making sure the plants survive under her care
GOALS
• Does extensive research before making purchases
• Feels lonely when she's alone at home
BEHAVIOURS
• Always busy and not at home most of the time
• Not being able to get all the things she need from one place
PAIN POINTS
Isaac the Interior Designer
"Uncle, can you inform me when the plant is back in stock?"
Isaac always puts his clients’ first. He incorporates plants in his designs because he feels that they help add a pop of colour. He puts into consideration where he intends to place the plants and how busy his clients are when purchasing plants. Recently, Isaac has been eyeing on a few trendy plants that will really complement his clients’ interior design but unfortunately they are always out of stock.
SCENARIO
• To be trendy
• To be notified when products he wants are back in stock
NEEDS
• To get plants that will complement his clients’ interior designs
• To impress his clients
GOALS
• On a lookout for what is trendy
• Gets inspired from Instagram & Pinterest
• Likes posting aesthetically pleasing photos on social media
BEHAVIOURS
• Not knowing which plants are suitable for his clients’ house/ schedule
• What he wants is popular and always out of stock
PAIN POINTS
Problem Statement
Online plant shoppers want the ability to filter for plants that are suitable for them, depending on the amount and quality of care that they're able to provide. Being able to do so would give them confidence in knowing that they can keep the plant alive after the purchase.
Core Features
Based on the research insights, I identified 2 core features to focus on for the redesign.
1
Filter search results based on care condition users are able to provide
2
Allow users to be notified when items are back in stock
3. Wireframing the Solution
With the scope defined, I quickly mocked up some basic wireframes for the redesign. Below are examples of sketches and wireframes of how I intended to implement the 2 core features on The Garden Store website.
Feature #1
Questionnaire on homepage to help shoppers filter search results based on care conditions that they are able to provide
Feature #2
Allow users to join mailing list and be notified when items are back in stock
4. Testing out the Design
I developed a mid fidelity prototype and invited 5 participants to test it out. The purpose of the usability test was to gather feedback for improvement of the design. During the session, I observed how participants interacted with the prototype and gathered several interesting insights.
What users liked...
1. All participants understood the purpose of the questionnaire and completed the search successfully.
“As expected, I see a list of plants that I’m best suited to take care of based on my current circumstance and the conditions I have.”
2. Participants appreciated the Autofill Function in the search bar.
“Some plant names are difficult to spell or remember. Having this function will help users a lot when they are searching for plants.”
Main issues to improve on...
1. Channel used to notify shoppers
Tested by Participants
Most participants would rather be notified via Whatsapp instead of email when an item is back in stock.
However, 1 other participant did mention having reservations to provide phone number due to privacy issues.
Recommendation for Improvement
The iterated version will provide shoppers with the option to choose whether they want to be notified via email or Whatsapp
2. Presentation of Related Products
Tested by Participants
4/5 participants did not pay much attention to the related products on the product details page as they are at the bottom of the page and the header "Related Products" is not as relatable as expected.
“Including related products in the pop up will be helpful and will entice me if I don't know what to buy to maximise the care for the plant. I just committed myself to buying the plant so I might as well just buy the other products.”
Recommendation for Improvement
1. Adjust placement
-
From a row at the bottom → a column at the right side of the product details page
-
Include related products in the 'Add to Cart' confirmation pop up
2. Edit Copy - Instead of 'Related Products', change copy to
-
'Customers who bought this also bought',
-
'Customers who viewed this item also viewed' and
-
'View other similar products'
5. The Final Design
I took the feedback gathered from the usability test and iterated the design into a high fidelity mockup.
Click here for fullscreen experience
Retrospective
Key Takeaways
Working alone on a project can be challenging when it comes to time and resources.
For this case study, it was crucial that I expanded my search beyond my direct contacts to recruit participants relevant to this topic for user interviews and usability tests.
Also, due to time constraints, I began testing at an early stage, leveraging on a simple grayscale prototype to gain valuable insights into plant shoppers’ behaviours, their expectations, what worked for them and what did not.
Doing so allowed me to iterate quickly, remain user-centric throughout and maximise limited time and resources.
Next Steps
This is just the first step. Moving forward, there is still more to explore with The Garden Store.
Here are a few ideas that I think can help bring the business to greater heights.
-
Responsive Mobile Site - To make it convenient for users to browse and purchase items on the go.
-
Plant Doctor Service - A feature that will provide assistance to customers in diagnosing what "illnesses" their plants are suffering from and suggest the necessary course of action to take in order to cure them.
-
Free Samples at Checkout - Not only will the free seeds/small cuttings allow shoppers to feel rewarded for completing a purchase, it will also increase their confidence and interest in taking care of various types of plants. This will benefit the business with more loyal and returning customers.
