Product Preview

- Mobile app improving Your Grocery Shopping Experience

Project type

Google UX design course project (Mobile App)

Role

Product designer

User Study

I created a questionnaire prior to the user interview with a focus on the user's pain points, from how they create a grocery shopping list to how they manage their pantry and what improvements they expect to see.

“I make a shopping list but there are always items that I forget to buy.”

“My boyfriend buys items many times that I already bought.”

“I want to shop for healthy food... but I don't know what to buy.”

User Journey

Based on the user interviews, I created a user journey map for grocery shopping. Users' main actions were divided into 5 steps. By documenting what users do at each step and the pain points that follow, I was able to deeply empathize with their pain points. Furthermore, I was able to identify improvements that can be made at each stage.

Creating a Frame Work

Green Pantry

By dividing the needs of users into four themes - interactive grocery list, communication, pantry recipe finder, and history of past lists - I was able to gain more accurate insight into their needs based on the user study.

A digital low-fi prototype was created based on the wireframe, and a usability test was conducted with 5 potential users.

Check list

“Why does this happen repeatedly?"

How can I make the user's grocery shopping experience more delightful?


Problem Discovery

Many people have experienced, at least once or more, forgetting to buy the necessary items during grocery shopping, resulting in the need to return to the store. We may also end up making duplicate or impulsive purchases that cause us to waste money.

“Oops ! I forgot to buy broccoli and eggs.
I need to return to the shop.

User’s grocery list is repetitive.

Interactive Grocery list

Users desire to decrease the frequency of grocery shopping and purchase only the necessary items, without making impulsive purchases. The use of an interactive grocery list that allows them to confirm the items they have bought would enhance their shopping experience.

communication

Users want an interface that allow them to efficiently share and collaboratively edit their grocery list with other members in real-time.

Pantry Recipes Finder

Users want to reduce food waste and are also interested in finding recipes that can be made using the ingredients currently available in their pantry.

History of Past Lists

As the user's grocery list is repetitive, they desire easy access to their previous lists. Additionally, they want to view their favorite recipes conveniently.

Wireframing

DESIGN ITERATION

Usability Test + Iteration

key finding #4

Key finding #1

key finding #3

key finding #2

Tool & method

User Interview Wireframing Affinity diagram Usability test Figma

Add ingredients

Past lists history

“It is easy to add items, but removing them is not intuitive“

It would be great if I could see how many items I need to buy at a glance.”

Solution : After adding items to their cart, users can easily check them off and clearly distinguish between checked and unchecked items. Additionally, they can view the status bar of the checked items at the bottom of the screen."

Users want checkboxes that are easy and intuitive to use, and they need to be motivated by the benefits of using checkboxes.

"I would like to find a 'share list' icon and a 'chat' icon on the same page when making a list."

"I want to be able to access the 'chat' icon with just one click, instead of having to click twice."

Solution : By placing the four most frequently used icons on the grocery list page, users can easily access them with just one click.

Users want to be able to easily share lists with other members and communicate with them.

"I would like to have more information about how many additional ingredients are needed before I click on a recipe."

"It was frustrating to discover that I needed to buy 5 more ingredients.."

Solution : To address this issue, information about the number of additional ingredients needed will be displayed on the recipe image, and the pantry information will be rearranged for easier visibility, both of which will be available to users before they click on a recipe.

"where can I see my saved recipe ?."

"Can I still see the list that did not save?."

Solution : To make it easy for users to find their saved recipes and lists. I placed these features at the top of the menu. After that, recent records can be displayed in chronological order.

Users want to be able to access all of their records, including saved recipes, unsaved lists, and saved lists, from the history menu.

Duration

2 months

“Sometimes I go back to shop 2 or 3 times because I forget to buy things.”

“I want to communicate better with my family for the grocery shopping.”

“I want to reduce food waste and save some money from overbuying.”


Hi I am Pam.

I am a busy full-time intern living with my boyfriend in Paris.

"I want to improve our grocery shopping planning and communication with my boyfriend to reduce food waste, save time, and save money.

Send messages




Users are excited to find recipes based on the ingredients in their pantry but get frustrated when they click on a recipe and discover that it requires more ingredients than they anticipated.

Pantry Recipes Finder & History

Share location

Pantry recipes finder

Color

Typography

After conducting user research, I used the insights gained to identify four themes. I then did brainstorming and ideation process to develop more detailed design elements based on these themes.

Check List & Communication

Check list

Final Design

Send messages

Visual Design

Pantry recipes finder

History of past lists