top of page
GROCERY FARM
- Revamping Online Store Of Little Farms
Harvesting Better User Experience
Grocery Farm
OVERVIEW
THE BACKSTORY
18.3% increase in online sales in tech-savvy Singapore due to COVID and convenience. Still online grocery shopping challenges persist.
I explored and developed solutions for consumers, to improve E-groceries, by researching the challenges
My Role
Product Designer
Skills
UX Research
UI/UX Design
Usability Testing
Tools
Duration
Figma
Apr 2023 - Jun 2023
Miro
UX Army
Prototyping
Design Process
I redesigned Little Farms website for easier product selection, clearer information, and better shopping experience, following a comprehensive design process as below.
Hurdles in online grocery shopping
1. Limited product information can be a challenge for online grocery shoppers.
2. Customers may have difficulty assessing product quality and finding specific brands.
3. Judging product size and accessing complete allergen information can also be challenging.
4. Online stores may substitute products without customer consent.
The challenges related to online grocery shopping that I’ve listed above are based on my research of various articles on the topic.
Here on I conducted extensive research to better understand these problems and develop solutions addressing them.
Empathise
I started off this project by empathising with the users, using platforms like little farms, by conducting a survey, followed by user interviews to gain insights into their motivation and pain points. And then conducted competitive analysis.
Survey, User Interviews and analysis
1. The Research began with interviews to understand people’s grocery shopping preferences
2. The majority of interviewees were women aged 30-40 , who had shopped online at least once in the past year
The User interviews inform the following :
-
Users behaviour as their daily needs when buying items
-
Do they buy from farms or where do they get fresh groceries?
-
On what platforms do they prefer buying groceries?
-
Understood their needs, motivations, goals, and challenges in purchasing fresh produce
Insight Board
Transformed the interview data into visually captivating affinity maps to uncover valuable user research insights.
The Patterns that I observed as insights were :
1. Preferring to consume nutrients rich food
2. Like to shop online rather than in-store
3. People want to know the source of their food like for eg. whether it’s organically grown
4. They do not like spending more than 15 minutes ordering groceries online and rather spend time with their families
Define
In the next step of design thinking process I created personas, customer journey map and then came up with problem staement
Persona 1
Sophia Joseph
Occupation : Pilot
Loc : Singapore
Sophia is a pilot in Singapore who has a very hectic schedule and is out of town most of the time with flight duty. As a result of this she prefers shopping online for groceries and having simple home meals cooked with fresh organic produce in order to stay fit. She is mostly happy with the produce that is delivered to her. But on a couple of instances she had to return her purchases due to produce being aged , rotten & from obscure sources(inorganic source)
Sophia needs a way to ascertain the produces quality so that she can gain more confidence in buying grocery online
Problem Statement
HMW give particulars of produce like expiry, freshness and organic certification to us users users, buying produce online
Persona 2
Mary, a homemaker with three children, finds it challenging to handle them in a crowded supermarket during weekends. As a solution, she orders groceries online twice a month, but is annoyed by the repetitive process of having to search for her favorite products each time
Mary Smith
Occupation : Homemaker
Loc : Singapore
Problem Statement
Mary needs a fast and seamless way to shop for groceries because grocery shopping online can be time consuming
HMW fasten the process for users, shopping for produce online, by providing details of past purchase to shop quicker
Problem Statement
How Might We
Mary needs a fast and seamless way to shop for groceries because grocery shopping online can be time consuming
HMW fasten the process for users, shopping for produce online, by providing details of past purchase to shop quicker
Ideate
In the third step of design thinking process I found solution, drew sketches of 3 types and then the mid fidelity wireframes
Rapid Sketches
I created several sketches of the existing Little Farms' Web Pages, so that the issues identified during user interviews are addressed
Prioritisation
I decided to start by focusing on the sketches, which are highlighted
I believe that this would help in providing accurate and helpful product information and will improve overall shopping experience on the website or platform
Detailed Sketches
Next the sketches of more detailed version of design I choose from my rapid sketches
E-grocery shopping? More like E-asy, but not without a few glitches
The exisisting Web Page of Little Farms which lacks all the info that the user requires
Prototype
In this step of design thinking process I put together the UI kit solution, and thereafter created prototypes.
Hi-Fi Designs
I took my Elaborate drawings into Figma to create a more detailed version of the screens ab below.
Decluttered the Home Page
I simplified the home page to make it easier to move around the website
Made the Home page less complicated so users can easily navigate throughout the website
Product Description Page
Clear information about the produce including whether it's organic or not , displayed with a noticeable organic certification label
Detailed
Description
Organic Certification
Item Page
Freshness Label
Created a simple color -coded
freshness label for products in the catalog page, indicating how fresh they are
Product Categorisation Page
Categorisation as Organic & Regular Produce
The website didn't have a way to filter organic and regular produce,
so I designed filter category to help users
find what they need
Test
In the test phase of design thinking process usability testing & incorporating the was done at this stage after coming up with first draft of prototype
Design Iteration
1. I conducted usability test to see how easy the design is to use
2. The usability test conducted was mix of both in person testing and Surveys
Feedback
1. The website has a clean layout on the home page.
2. I think it's pretty good. Well spaced out. Easy to follow.
3. It was easy to navigate to the different menus and there were no unwanted promos or offers or endless scrolling on the homepage
4. I like that it has a date (eg: 2 weeks, 1 week) next to some product. If this is an option to tell me the freshness of the product, that will be very useful.
5. Missing Outline during checkout process
Like a sponge, absorbing "user feedback" and making improvements !
Outline for checkout page
Added the Outline starting from the checkout page will help in knowing the number of steps in completing the process
Lessons Learned
-
As this was my entry into the vast world of UX design, I gained invaluable knowledge
​
-
Firstly I understood how to conduct UX Interviews specifically by not asking leading questions and focused more on trying to understand user needs through their behaviour and interactions with technology .
This laid the foundations and boosted my confidence to further progress in this project.
-
Secondly it was my first Hi-fidelity Mockup using Figma. I gained a deep understanding of usage of components, frames in order to create a simple yet a functional design
Thank you for your time, appreciated
Looking forward to working with you
bottom of page