title-03.png
 

Overview

Pick is a grocery shopping mobile app that helps you pick food that is safe and suitable for you and your family to consume. It helps you avoid reading through all the ingredients on food labels by giving quick and precise answers to your questions.

This app helps users with specific diet plans, food restrictions and uncommon food allergies while grocery shopping.

Role

UX & UI designer / Creative director/ Interactive designer

Duration

The project took 3 months to be completed from August 2019 - October 2019.

The problem

Identification of ingredients in a food product is very tough especially when the consumer has a restricted diet or uncommon allergies that might not be specified on the product.

 
 

40%

40% of the population in Vancouver under 35 years of age vegan and vegetarian

100%

100% of the users interviewed wanted to know more about the ingredients on the food labels

 

The solution

  • Scanning: Making a mobile app which lets the user scan the food products to let them know what foods are consumable.

  • Customization: Feature to make the app their own by letting the users save their diet plans, restrictions and food allergies.

  • Multiple food profiles: Making sure that the users with families can scan for their loved one too.

User Research

User interviews

I interviewed up to 30 users in person and online by posting questions in Vegan and Vegetarian groups on Reddit and Quora. This helped me to gather more information needed for my research.

 

I statements

These are some of the “I” statements extracted from the user interviews. Collecting these statements helped me to understand and empathize with the user more.

“I have to go to more than one shop to get everything I need.”

“I look really hard and think it’s ok to eat but end up getting sick anyway”

“I'm super bugged by reading labels when the whole list is great and everything till I get to the very bottom and there's like one item I can't eat and I'm like frick lol and then every other item I look at is like that or has dairy or eggs.”

“I hate all the hidden and nonsense ingredients they add.”

 

User persona

I created a persona based on the users I interviewed and my initial target audience. This helped me narrow down my focus to one user and improved my storytelling for the app.

 
user-05.png
 
user journeys-01.png
 

User journey

I made the user journey map to get a better understanding on the pain points and it played an important part in the optimization of the features of the app. This made me visualize the user’s journey through the app.

 
Research document.png
 
Research document (2).png
 

Key takeaways

  • Ingredients: There are certain ingredients which do contain animal products in them but the labels are not sufficient to understand.

  • Distance: Users are not able to buy all the items from one place and have to travel to more than one place to get what they need.

  • Feelings: Many users felt lonely with their family and friends due to their dietary needs and restrictions. Some of them even said that they get made fun of.

  • Other apps: None of the users that I interviewed used any apps to make it easier for them to shop for grocery items 

  • Going out: It seemed like majority of the users just went to places they already know or just ask for customization in the restaurant.

 

Product development

Product features:

  • A customizable profile.

  • Distinguishing ingredients

  • Multiple profiles in an account

  • Search bar for ingredients

 

WIREframes

 
unnamed+%282%29.jpg
 
 
 

Using testing results

I performed user testing on the initial prototype and made changes according to the results. Some of the changes made were:

  • search bar and an “add” option for allergies

  • search bar on the scan screen instead of a different tab

 

final lo-fi prototype

 
lofi-06.png
 

Art direction & UI generation

 

Branding

 

the big idea

“be as picky as you want

 

brand personality

Fresh, quick, reliable, fun and quirky

 

Brand values

Honesty, efficiency, empathy and inclusive

 

Final logo

 
pickbrandingicon-26.png
 

Style guide

 
 
iPad – 8@2x.png
 
iPad – 9@2x.png
 

Final screens

 

Final UI screens

screens-07.png
proto-16.png
proto-06.png
proto-15.png

mockups

 
Mockup.png
 
isometric.png

Prototyping & UI animation

 

Logo animation

 
loganiConverted.gif
 
 
 

final prototype

 Video Case study