GoFood Menu Selection Redesign — UX Case Study
How I discovered user pain points and redesigned the user experience of GoFood recommendation and favourite feature.
Project Overview
With so many restaurants, promotions, and personal taste, choosing a food to order can become a complicated task. In this case study, I will uncover how I discover user pain points about food selection. Then redesigned the user experience of GoFood recommendation and favourite feature.
The Challenge
This project was made for my final project at UI/UX Design boot camp at Purwadhika Startup School. The challenge is to redesign the flow of menu selection, promotion until payments for Indonesian who likes to explore food in GoFood app.
My Approach
I approach the challenge by applying the double diamond process. This help me to outline every step I have to take, so that I can solve the right problem and solve the problem right. The steps are emphatize, define, ideating, testing then iterate the whole process.
My Role
Through the research process, I was working as a part of a team of four UX Designers. They are Indra Setiawan, Faishal Prawenda, Dendy, and me. Then we moved on to prototyping and usability testing individually.
Empathize
I began the project by creating a research plan. In this phase, I determine the respondent criteria, research objective and key questions.
Research objective
To identify user pain points when choosing food, using a promo, until payments so that we can improve the flow.
I plan my research to discover the user pain points when they are ordering in GoFood. So that I can found a real problem as an opportunity area where I can improve the user experience.
Key questions
These are the burning questions that needs to be asked to answer the objective:
What are their pain points when they are ordering food in GoFood?
What motivates the users to ordering food online?
What are their expectations and needs when ordering food in GoFood?
Define
From the survey result, I found that 58% of the respondent still looking for something to eat when they open GoFood.
Then, I collect all the insights from the user interview. I wrote it on a sticky notes and mapped them by category and subcategory. This process often called affinity mapping. It helps me to find a pattern of problems and opportunity area of improvements.
From the affinity mapping, I found that the most troubled areas are fall in the food selection category. Here are some direct quotes of the respondents:
Sometimes I spend too much time looking for what I want to eat. There is too much choices, and the recommendation doesn’t help.
I bought coffee on GoFood regularly. Sometimes I want to explore new coffee, but I don’t know where to begin. I don’t think the recommendation match my preferences.
Another interesting findings are about GoFood favourite and history feature. I found that when the user explored new food that they liked, they want to save it to order again later. But they don’t really aware about the favourite feature, they used the history instead. Here are some quotes about the favourite feature:
When I am tired of the recommendation, I think about the food I have ordered that I like. Then I search it through my history.
If there is something missing in the app, is to save my favourite food. Because sometimes I found the food I liked and want to save it for future order. Oh, it already has a save to favourite feature?
Who is this designed for?
Based on the interview, I created a semi-fictional persona that represent the ideal users. Meet Tommy, a millennial food delivery user who needs fresh food recommendation regularly.
Then, I created user journey map for Tommy. This mapped out the major steps Tommy have to take to reach his goal. It shows me how he feels and what he thought in every step. This was created based on a user interview of a real user.
Both the persona and the user journey help me empathize with the user pain points, needs, and goal as the project goes on. I keep looking back at them as I developed the food selection experience design.
Problem statement
To summarise the research results. I put all the insight into two problem statement:
- How might we improve the recommendations so that it can help Tommy to select a menu.
- How might we improve the favourite feature experience so that Tommy can remember to save his food for a repeat order.
Ideation
Together with the team, we collect all the possible solution based on the problem statements . Then I prioritize them by using 2 x 2 prioritization matrix. The prioritization was to determine the ideas that are low effort and high impact.
User flow
After I determine the solution, I created a user flow chart. This guide me to define the wireframes I will need to create. And showed me where are the new feature will fit into the flow.
Lo-fi wireframe
I sketched how the solution will look on the prototype. Then, I picked the best one to be arranged in the lo-fi wireframe and ready to be refined digitally.
Prototype
GoFood already has design system called Asphalt. Therefore, the first thing I do on the prototype phase was to learn about their system. Then recreated the essential components, colors, typography and elevation style.
The first prototype
Based on all the solution I get from ideation, I created a prototype so that I can test this solution later on the next step. Here are the big changes I made in the first prototype:
I redesigned the recommendation section on the landing page. This new recommendation is showing a category buttons based on what the user have searched frequently, user history, and trending category for a better exploring experience. This was inspired by Tokopedia, youtube, and pinterest.
The old favourite icon was combined with a feed icon. This makes the users not sure about what icon it is. So I separate them, and put on a label because I thought the feed icon is still a new concept and might need a label to get used to. The feed icon was adopted from Tokopedia feed icon. When designing icons, I was aiming for familiarity, based on the book Don’t Make Me Think by Steve Krug.
Testing
The testing was done to three users with persona matched to Tommy. Usability testing was the most crucial part of this project, as I revealed what the user truly needs.
To measure how successful the solution I offered for Tommy, I divided the test into four tasks: finding recommendation, see all recommendations, buy a food from recommendation, and add the menu to their favourite.
I gave score to each task by how easy they completed it. This gave me success rate that helped me determined which tasks need high improvement.
What did the users say?
To know what the user thought about the solution, I asked them to give a comments. Some good quotes from the users are:
This is really helpful, because now the recommendation doesn’t feel random.
My first reaction was to buy something because it looks familiar.
Now I can browse around in the app when I don’t know what to eat.
But, there are also a lot of issues. Here are the top findings:
Iteration
The testing result shows that users want to put the menu on their favourite list after they tried and liked the food. So, I recreated the user flow to matched the new findings.
Then, I changed the love icon into bookmark, redesigned the history page, and added a restaurant distance at the recommendation section.
Final Prototype
What’s Next?
If the favourite solution is live and had a good conversion, the favourite list might get too long after a while. Then, the user might need to make a group folder.
Lesson Learned
- Start the research with assumptions. I was avoiding bias, therefore I conduct the research without any assumptions. But I was going too far. From this case study, I found out how important it is to analyse the possible problem first. So the research can be more effective.
- Build the component nicely. In this project, I learn to build every frame from the component. It was very fruitful. Because when I needed to iterate the frame, I only needed to change the component.
Note: I am not working for or represent GoFood. This case study was my final project for UI/UX Design boot camp at Purwadhika Startup School.
Thanks for reading! I hope you enjoyed reading this case study as much as I did working on it. During this project, I am very grateful to have Kenneth Mahakim as my mentor, evaluated by Khirsnawan Adhie and my teammates Indra, Faishal and Dendy.
