Grab a snack
An app that connects people with local small food businesses.
Client
Small food businesses
Category
UX, UI.
Service
User research, wireframing and prototyping.
Table of contents:
-
-
Project Impact
-
Learnings
-
PROJECT OVERVIEW
Grab a snack is an app that let users ordering food and schedule the delivery in an easy and fast way.
When people get home after a long day at work, they are very hungry and don’t have time or energy for cooking food. The most common frustration for them are busy schedules and other important occupations they need to take care of.
​
GOAL
The goal for this project was to create an app that let users ordering food and
schedule the delivery time in an easy and fast way.
THE PRODUCT
A food app for small businesses
PROJECT DURATION
Mar - Sep 2023
ROLE
Lead UX designer
& UX researcher.
RESPONSIBILITIES
User research.
Wireframing.
Prototyping.
SCENARIO & CUSTOMER TYPES
I created the app "Grab a snack" thinking about the people of my hometown located in Mexico City. It connects people who are working from home or in their offices, housewives who have changed their routine and regular fast food customers with local small food businesses that need more sales and customers. The product prices are affordable so you can order daily menus and have food the entire week or you can also order just one meal occasionally. The restaurants are committed to providing quality food and service.
POTENTIAL CUSTOMER TYPES
Customer type one.
-
Working people, age 23-50.
​
-
Almost all week order food for them and sometimes for their family.
​
-
Usually when they come home, they are very hungry and they don’t have the time or energy for cooking meals.
​
-
The most common frustration for this type of customers are busy schedules and other important occupations they should take care of.
Customer type two.
-
Small Food Business owners.
​
-
The most common frustrations for them are finding new customers and increasing sales, also most of them are excited to enter the digital world.
​
-
Their frustrations are to take care of both the business administration and the kitchen at the same time.
COMPETITIVE AUDIT
The gaps I identified include that none of them have easy access to customer service and all of them need to include more accessibility features. Therefore, the opportunities I seized were: Provide quick and easy way to access to customer service and to the accessibility features.
USER RESEARCH
The research done for this app was foundational research, I took advantage of interviews, surveys and competitive audits and also some secondary research was made. Talking with users, helped me identify their paint points so that I could create a product that solves the main problem.
RECRUITMENT PROCESS
I recruit a representative sample of 4 participants of the target user group, from social networks and my immediate network with the next characteristics:
-
Age: 14-70.
-
Geographic Location: México, lives in metropolitan or suburban areas
-
Job title or Industry: People who order food from restaurants at least twice a month.
-
Gender: All genders.
​
The interviews where schedule according to the availability of the participants in labor days and in the afternoon.
INTERVIEWS
The goal of the interview was to understand emotions and identify needs, frustrations and common user behaviors and experiences involved in ordering food through a delivery app, and also learn as much as possible about users’ opinions, thoughts, experiences, and feelings around the app I was going to design.
EMPATHY MAPS.
According to the data obtained in the interviews, I create the empathy maps, for a better understanding of the users.
PAIN POINTS.
The main paint points of the users were as follows.
PERSONAS.
Based on the two main user groups the personas were created.
USER JOURNEY MAP.
According to the goal of having a meal at home when busy workers get back home, this is the journey the user has to follow.
USER FLOW.
This is the path the user has to follow to do the task of place food order and schedule the delivery.
WIREFRAMES & LOW-FI PROTOTYPE
The goal of the wireframes was to create a very intuitive flow for our users where they could find the best options to order food.
DIGITAL WIREFRAMES.
The wireframes show an intuitive flow for the user to find an easy and fast way to order food. The goal of this project is to give users a product that allow them to save time, and have delicious food when they get home.
LOW-FIDELITY PROTOTYPE.
​
The user flow start at the screen HOME, were users can follow two navigation paths: restaurant search or meal search . Then, they can select one or more meals, after that, one screen shows the order preview, and by clicking “confirm” users can type the address, schedule the delivery, select payment method and confirm their order.
UX RESEARCH STUDY
I made various unmoderated usability studies, testing first, low-fi prototypes, making changes and then testing hi-fi prototypes. The studies were made remotely and the sessions took place on august and september.
The goal of the study was to figure it out if the app indeed is an easy and fast way to order food. Here, we can see the Ux Research Study Plan that contains every detail of the study.
STUDY DETAILS
RESEARCH QUESTIONS
​
​
​
1. How long does it take to place an order?
​
2. Is it easy to schedule the delivery of your order?
​
3. Are there any steps where you get stuck?
PARTICIPANTS
​
​
​
4 participants.
​
Participants are busy employees, others are busy parents.
​
3 males and one female, between the ages of 20 and 75.
METHODOLOGY
​
​
​
Unmoderated usability study.
​
Location: Mexico, remote (each participant will solve the usability study in their home)
​
Date: Sessions will take place on september 14 and 15.
​
Four participants, each completing the study on their own.
​
Each session will last 60 minutes and will include an introduction, a list of tasks and a short questionnaire.
PROTOTYPE TESTED
​​
This is the low-fidelity food delivery app prototype that was tested by the participants.
AFFINITY DIAGRAM.
​
Having the supporting evidence from the usability study and the notes I take during, I made the affinity diagram.
And I find the patterns.
FINDINGS
1
​
​
​
3 out of 5 participants were confused by the "enter your zip code bar"
2
​
​
​
3 out of 5 participants find the "schedule section" a bit challenging.
3
​
​
​
3 out of 5 participants find that the app is very intuitive.
By having the patterns I made the necessary screens redesigns for a better user experience.
“The first screen confuses me because there are many sections.”
Jorge Lara, consumer from Mexico City.
The zip code bar confuses the users at the beginning and they didn’t click on the “search restaurant button.
PATTERN
​
It was observed that 3 out of 5 participants were confused by the “enter your zip code bar”.
​​
​
​
INSIGHT
​
Based on the theme that: for most users the “enter your zip code bar” was confusing an insight is: users need a clear path to follow in the home screen, and a simple interface.
​
​
​​
RECOMMENDATION
​
Remove the zip code bar and design a cleaner home screen.
BEFORE
AFTER
NEW SCREEN DESIGN.
​
Based on the theme that: For most users the “enter your zip code bar” was confusing,
I design better cues for what steps are required to choose a restaurant, a simple interface and a clear path to follow in the home screen.
“The task it's complicated for me, because of the design.”
-Juan Jung, consumer from Mexico City
For most users it’s not clear how to schedule the delivery.
PATTERN
​
It was observed that 3 out of 5 participants find the “schedule section” a bit challenging This means that for most users it’s not clear how to schedule the delivery.
​
​
​
INSIGHT
​
Based on the theme that: the “schedule section” is difficult for almost all users, an insight is: users need a more intuitive way to schedule the delivery.
​
​
​
RECOMMENDATION
​
Add a more familiar calendar and clock in the schedule screen.
BEFORE
AFTER
NEW SCREEN DESIGN.
​
Based on the theme that: the “schedule section” is difficult for almost all users.
I design a more intuitive way to schedule the delivery with a more familiar calendar and clock in the schedule screen.
“The information wasn’t very clear.”
Pedro Fernandez, consumer from Mexico City.
Users need a better design to confirm their order.
PATTERN
​
It was observed that 2 out of 5 participants had a hard time confirming their order This means that the information wasn’t very clear.
​
​
​
INSIGHT
​
Based on the theme that: most users have a hard time confirming their order, an insight is: users need a clearer interface in that step.
​
​
​
RECOMMENDATION
​
Add a better design for the confirm screen.
BEFORE
AFTER
NEW SCREEN DESIGN.
​
Based on the theme that: most users have a hard time confirming their order
I design a more clear screen that show each item with an image, in a bigger space and with it’s own “remove” button. Changing the ux writing in the footer button, replacing “Go back” with “Add item”.
After this first usability study, I made a second one to test the new screens designs.
And I write a new set of research questions based on the new screens.
MOCKUPS & HI-FI PROTOTYPE
ACCESSSIBILITY CONSIDERATIONS
SCREEN READERS
The text styles were made considering screen readers, by placing the right headers and titles in the design and also in the coding of the app.
COLORS
The colors of the app were selected, considering the higher contrast.
FONT
The font used in the app is a sans serif, legible and readable, the color of the font has high contrast, the size helps the user read each instruction and the language is wide and broad.
TAKEAWAYS
PROJECT IMPACT.
In this app the flow is easy to follow, the icons and buttons guide the users through the process of ordering food. The scheduling feature is a plus for this app because you can order food for the entire labor week.
​
The app offers punctuality, security, meals quality, good service, efficiency, easy subscription and cancellation, fast delivery, fast ordering, the meal of the day has an attractive discount, allergy filter, reasonable prices and easy communication with customer service.
​
It's efficient: Because of it's fast delivery, quality photo and design, good app performance, app rate, delivery schedule and weekly ordering and easy customer profile creation.
It's reliable: The transaction is secured, all restaurants registered in the app offer food quality, the app is easy to use and has easy communication with customer service: by phone or chat.
LEARNINGS.
Throughout the project I learned about the importance of the frameworks, research, empathizing with our target users, a lot about accessibility, and of the importance of creating products for specific persons that improve everyone’s experience.
NEXT STEPS
The next step is conducting a usability study to test the final prototype to ensure the best user experience.
​
After that study, submit the project to the engineers for codification.
​
And finally, make another testing round of the final product so I can iterate or launch the app.
