Case Study: Foodies

UX/UI Design

Project Overview

Foodies is a mobile food delivery app designed for users with busy schedules. The app implements features such as scheduling their deliveries while having additional features for health-conscious users. I’ve conducted interviews, white-paper research, wireframes, prototyping, and usability testing during the development of this app. The biggest challenge I encountered during this project was thinking of ideas and finding/including necessary features to create an entire experience for the user.

 

My Contributions

Lead UX Designer, Researcher + User-testing, Wireframing, Prototyping, High-fidelity UI

Project Duration

February 2022 to April 2022

Step 1: Research

 

White Paper/Secondary Research

With such a large industry, I thought it would be necessary to do white paper research first. It would constitute as a survey or a questionnaire and a way for me to view common issues with food delivery apps with a large consensus.

Interview Process

Although the white paper research was concrete, it didn’t reveal in detail what exactly the problems were. To find out the core issues, I conducted interviews with four individuals between the ages of 23 to 29. What I discovered from the interviews were:

 

Busy Schedules

Many individuals who live alone whether they are a working adult or a student have extremely tight schedules and sometimes lack the time and energy to meal prep

 

Not Enough Information on the Food

Everyone that I interviewed expressed a concern for what they were eating. Most wanted to adhere to a healthy diet. Others with allergies and tolerances were pushed away due to not knowing the exact ingredients.

 

Not Knowing Where Their Delivery Is

A rough delivery process ruined experiences for some users. Sometimes it would be food missing, lack of communication between courier and receiver, or the user having trouble helping the courier.

Competitive Analysis

I conducted a competitive analysis to figure out their strengths, weaknesses, and areas of opportunities.

Step 2: Empathize

 

Personas

The first step I created to empathize with my users was create a set of two personas. The personas were to distinguish the needs and frustrations of users from different perspectives/environments but still shared some common issues.

 

Journey Map

To understand how users feel at a deeper level, I created a journey map based off the interviews I conducted. In this journey map I wanted to capture the pain points and points of delight at each stage from ordering food all the way to receiving it.

 

Areas of Improvement

Based on my research and empathizing, although there were numerous problems and issues. From a business perspective, I thought answering these statements would be the most beneficial:

  • How might we help the user find healthier options in order to help them with their health goals

  • How might we help improve the ordering process to help users save more time

  • How might we help improve the delivery process to better the chances of maintaining the highest quality of food

 

Giving the user more flexibility

Allowing users to schedule their orders allows them to have an extra flexibility as opposed to ordering then receiving right away.

Giving information about their foods

For users who have food allergies and tolerances, they should be able to include or exclude certain ingredients in their meals. This should reduces the amount of research a user needs to do.

Improving the delivery process

Receiving the delivery was a common issue that was revealed during my interviews. This concreted this issue that was found during my secondary research.


Step 3: Ideation

 

While brainstorming, I came up with ideas that could be potential solutions for the “How Might We” questions earlier. And once I came up with a lot of ideas, I categorized them into what is necessary for the app and what is more of a feature.

Step 4: Design/Prototype

 

Paper Wireframes

While building my paper wireframes I kept the user front in mind. I wanted to prioritize customization, flexibility, and convenience to give users multiple methods of achieving the same goal.

Digital Wireframes

After creating my paper wireframes, it was time to bring my drawings to life. I created these wireframes in Figma while making adjustments where it was necessary. My main point of focus during the design was the pickup and scheduling experience.

Usability Study on Low-Fidelity Prototype

To test my design, I conducted a usability study consisting of five participants. The goal of my usability study was to get a measure of how smooth the user flow was, overall UI design, and ease of use. The study was done over a span of two days. In the end participants concluded that the flow was good but some parts of the design needed work. Parts that needed to be addressed were:

 

1. Interactivity of buttons


  • “Sorry, I thought I could click that.”

  • “I thought the text was clickable too.”

2. Cluttered UI


  • “There’s a lot going on in this delivery page.”

3. No Page Indication


  • “Not sure which page I’m on right now.”

  • “Where in the navigation am I?

Step 5: Test

 

Hi-fi Mockups

This is my first iteration of my mockup. I went as far as I could to making all the screens, taking feedback from my first usability study, and polishing everything as best as I could.

Hi-fi Prototype Feedback

 

1. Hard to read items

The usability study revealed that users with low-sight complained about the font being to small and the cards being too compact. This discouraged their continuation of the study because they had to focus really hard to read and gave them slight headaches.

2. Navigation issue

Users mentioned that during the usability study while they were exploring the app, it was hard to keep track of what page they were on without any indication. This forced the user to remember what the pages looked like before they started doing tasks. To solve this, I highlighted the pages and used titles on some pages so users would instantly know what page they were on and be more focused on completing their tasks.

Overarching Solutions

While designing, it was most important to me to keep the users in mind. I wanted to use the feedback from the first usability study while designing to resolve the problems they were having. In turn, this is how my designs came to life.

 

Solution #1: Scheduling meals

For users who were tight on time, I wanted to give them ability to schedule their meals. Users during my interviews said they have small breaks during the day and during that time, they would like to be able to plan the rest of their day. In a survey, 33% of users said they would be willing to pay a higher service fee if it meant faster delivery. This could be a feature that businesses could implement and support knowing that there would be a return on it.

 

Solution #2: Giving users more information on their foods

During my interviews, two out of my five participants expressed a concern for the foods they put into their body. To solve this, I gave them multiple ways to get information on their foods. One was through an ingredients list and another was through a filtering system.

This in turn should keep users returning as opposed to closing the app immediately once they figure out they can’t get any information on their foods. This should also extend to a new set of customers, those with fitness goals and allergies or intolerances. Roughly 4% of adults have food allergies and 20% of adults do leisure-time physical exercising, where many of them presumably have fitness goals. An audience that has yet to be reached in the food delivery app industry.

Solution #3: Users who want a smoother delivery

Users are able to videocall or upload a picture to assist drivers with their deliveries. This in turn should reduce the amount of late deliveries, maintain the highest level of food quality, and most importantly retain customer retention. A survey showed that out of all the customers that received a late delivery, 39% of them were bothered by it. And half of that percentage either requested for a refund or looked towards a different app or restaurant to order from.

High-Fidelity Prototype (Final Version)

Reflecting on everything

With this being my first UX project, there was a lot to learn. It was a very tough and lengthy process but the knowledge I’ve gained was priceless. I learned that you have to approach at problem first, not solution first. Having a solution in mind will create biases and throughout the process, you’ll cater your information and research on that pre-emptive product.

Another thing that I learnt was the value of gaining insight from real interviews and usability studies. Doing secondary research is very helpful because you learn what the general population might have issues with but unless you get personal with your users then you’ll have a very generic product. Not to mention, I thought it was important to have a diverse set of participants when conducting interviews and usability studies just so I could have a wide range of feedback.

In the end, I was happy to hear that most users were thrilled with the app and said they would have used it in their daily life. Although the feedback was good, I know that this wouldn’t be the end. I would want to release the app and so it could reach everyone and get as much feedback as I could to keep iterating on it.

Previous
Previous

Case Study: Kidcare Net

Next
Next

Daily UI (Daily Design)