Caviar is a popular app that offers food delivery from local restaurants.
Disclaimer: I do not work for Caviar. This case study was purely used as a tool for learning and making me a better designer.
I conducted a 2-week case study to challenge myself to improve Caviar’s iOS ordering flow. Being an ardent food lover, Caviar is one of the apps that I use a lot, if not the most. Through research, I was able to identify a few pain points that users were experiencing. I then prototyped some solutions and validated them with user data.
To begin my research, I started to look at a few competitors or similar platforms, analyzing UI, UX, User flow, key features and reviews to identify the common problems.
While many restaurants certainly offer their own pickup and delivery services, and there are a handful of smaller players in the marketplace, there are currently four other main competitors with Caviar Delivery: Uber Eats, Postmates, Grubhub, and DoorDash.
There are nearly 9,000 combined reviews between iTunes and Google Play, the Caviar app held an average rating of about 4.4 stars. I identified potential trends from users reviews which have not highlighted relevant issues about usability or functionalities. I’ve categorized the complaints in 4 categories:
- Cart/Checkout page
- Ordering from favorites
- Functionality issues
- Consider UX research methods to uncover user problems
- Propose to help create actionable solutions based on observable data
- Investigate how to connect users to ordering experience more seamlessly
- Prototype and test solutions with users to enhance the Caviar experience
- Home screen– Users had difficulty finding something in particular like filters or favorites.
- Food cart– Users were having a hard time figuring out how to add more items from the cart/checkout page.
- Favorites page– Users could not find this page which is unintuitive.
STEP 1 | Guerrilla Usability Testing
Performing a usability test with 5 people will help you uncover 93% of what is possible to discover(reference). I headed over to Ferry Building, San Francisco and approached strangers in the streets of San Francisco to conduct 5 guerrilla usability tests. 3 participants were current Caviar users and 2 had never used the product before.
SCENARIO 1 — Let’s say you live in Marina and you only eat gluten-free food. You feel like eating a Papaya Salad from a Thai place nearby. Please put your relevant preference through filters and select the restaurant to add the item to the cart.
SCENARIO 2—Say an hour ago you added a dish to your cart and did not buy for some reason. Now you want to add one item to the same cart and place the delivery order. Could you show me how would you place an order from the unfinished cart.
SCENARIO 3—Imagine you have a big deadline at work and you’re staying late at the office to finish the project. You want to order some food for you and your team. Please show me how would you quickly go to your favorites page to select the same place to order a pizza you had last week.
STEP 2 | Synthesis
I prioritized which problems were most important to solve. I used an affinity mapping method to find patterns in my observations and group them. I watched each screen recordings and recorded the insights on (virtual) post it notes. I segmented each user into different columns, then I wrote down the major pain points on a sticky note. Then I focus on the most important 3 features to iterate on.
“Sometime I spend more than 30 mins scrolling down the restaurant list, just to decide not to order because I couldn’t find things that I want.” — Melanie
Above is my 2by2 matrix which I used to prioritize the pain points. I took the findings and synthesized the major user and business goals.
#Important to Business: I did some research and learned that the app’s current visuals are attractive and have clean aesthetics
#Important to Users: Usability issues that elicited frustration from users were considered important pain points to users.
STEP 3 | Empathize
Using the information collected from guerrilla testing, I create two provisional personas to help me communicate my users’ motivations, goals, and behaviors. It helped me imagine what types of tasks a food app user might want to accomplish.
STEP 4 | User Flow
Once I figured out what the most important features were, I created a user flow and mapped out the exact steps to show where people had trouble. By giving users what they need to find what they are looking for, users will have a better experience and will return more often.
STEP 5 | Sketching
Then it was time to start sketching. I came up with several potential solutions to each of the pain points and made some rough UI sketches. I did some preliminary validation on the Lo-Fi UI sketches and used the feedback to refine my sketches and narrow down my solutions for the Hi-Fi mockups.
But the task flow wasn’t clear enough, so I combined the process with a lo-fi task flow to further the explorations. Taking this into consideration, I created task flow as a mid-fi digital sketch of the screens to remove all unnecessary blockers. I chose to wireframe most of my sketches, then narrowed down my top solutions based on peer feedback.
STEP 6 | Validation
I jumped into Sketch to create Hi-Fi mockups of my proposed solutions. Below are the Hi-Fi mockups of my final solutions including the results of the user testing before and after implementing my design solutions. Finally, I faced the challenge of creating an engaging app both from the user experience perspective and the visual perspective.
FEATURE 1 | NEW HOME SCREEN
By creating a new home screen, users have better understanding of the app.
New Navigation Bar
Existing users found this new bottom navigation extremely helpful, so that customers can shift between different tabs to view what they are looking for.
FEATURE 2 | NEW CART PAGE
New cart screen helps users have smoother checkout experience.
STEP 7 | Retrospectives
Through this case study, I learned the value of the user experience design process. It has been a challenging yet rewarding journey. I understood the needs of the users through the survey and conversations. From guerrilla usability testing and affinity mapping to building a prototype and conducting validation testing. I decided to preserve the Caviar’s existing visual design and focus on rebuilding the app’s architecture to improve usability.
To validate my proposed design solutions, I tested my prototype on 5 additional people. The results from five new users were showed significant improvements.
“Users never do what is expected, and patterns reveal themselves after having just a few users test a product”.
Rather than rely on my knowledge of the restaurant industry I chose to challenge my assumptions with research to better empathize with the user.
Thanks for reading!
As you might imagine, when it comes to the ‘best’ online food delivery service, it’s all about you. Although some of my solutions may seem like small changes, it’s important to note that I made the smallest changes that could allow for the maximum task success rate.
Over the last century, people’s eating habits have changed a lot. Technology has contributed largely and have moved people to do everything online including getting cooked meals delivered to their doorstep. In other words, it’s ultimately going to come down to which options offer the food you want, at the time you want it, and at a price you think is fair to pay.
This case study taught me how to keep the people I’m looking to serve in the heart of the design process.
This is my first Medium post. It is a great place to share your stories, your projects to get feedback, and interact with others who share your interests. If you like this, please clap or comment or both. I’m always open to meet other passionate designers in the field or anyone who’d like to talk about food or UX. Feel free to connect with me on LinkedIn or Twitter