OVERVIEW
Time
Nov 2023 - Dec 2023
Duration
2 months
Project Brief
This project aims to improve FIVE GUYS' online food ordering system by addressing current issues such as poor navigation, lack of guidance and functional bugs that frustrate customers. Through user research, competitive analysis, and customer feedback, the system will be reorganized with added visuals to improve usability. The new design will align with FIVE GUYS' original brand identity to provide a consistent, recognizable experience that drives customer satisfaction and loyalty. Through the redesigned system, the ultimate goal is to increase FIVE GUYS’ competitiveness in the fast-food industry amid fierce competition and digital transformation trends.
Role
UI/UX Designer
—
User Interview
Usability Testing
User Journey Mapping
Prototyping
Competitive Analysis
FINAL DESIGN
Locate Restaurant
Order Food Screen
Full Menu
Checkout
Burger Menu
Order Status
UNDERSTAND THE PROBLEM
Usability Testing & User Interview
In order to gain a better understanding of the problems users are facing, a usability testing was conducted on the existing ordering platform, followed by user interviews to fully comprehend the results.
Type
Moderated Usability Testing
Participants
3 female, aged 24-30
Research goals
Determine if the online food ordering user flow is difficult to follow and evaluate user impressions of the ordering experience.
01
Flawed location function
The search results of the nearby FIVE GUYS restaurants are not accurate. Users entered their locations but the top result was not the nearest restaurant to them.
02
Overwhelming list of burger toppings
There are 15 toppings in total for users to choose from. The long list of burger toppings looks overwhelming to users and make it hard for them to make a decision.
03
Inconvenient checkout function
Credit/Debit card is the only payment method available on the platform, leaving users no choice on payment options. Also, entering card details manually is troublesome for users.
04
Insufficient guidance for takeaway pick-up
Users went to counter for pick-up but found that the fries wasn't ready because fries would not be cooked until customers arrive. It is stated on the bottom of the Order Status page but users were not aware of that.
User Feedback
"This is so stupid."
User was unable to find her location in the dropdown list after entering an address, which caused her to get stuck when choosing a restaurant.
“Such long list of toppings… It doesn’t provide any category to help me choose them. Um… Are all these toppings free or not?”
User had trouble selecting toppings due to overwhelming options.
“No! It requires me to enter my card number. How troublesome it is!”
User found it inconvenient to manually enter credit card details and hoped for alternative payment options.
Problem Statement
Users encounter several difficulties when ordering food through the FIVE GUYS website. They often get stuck on setting their location, figuring out how to choose burger toppings and entering payment details manually, which makes the order process time-consuming. These issues can frustrate users and discourage them from using the online food ordering platform, resulting in incomplete orders and a loss of revenue for the business.
MAIN CHALLENGES
Having a variety of toppings is great for customizing burgers, but how can we make it less overwhelming for users?
The original design of the food menu does not include images because most food items consist of only essential ingredients. Additional ingredients are then added through customizations. Consequently, the menu appears text-heavy and uninteresting to users. What modifications can be made to make the menu more engaging and appealing?
Food delivery platforms have become extremely popular nowadays. To keep up with the latest technology trends and meet the needs of users while also presenting its unique qualities, what changes can the brand make on food ordering platform?
JOURNEY MAPPING & OPPORTUNITIES
Pain Points & Opportunities
Persona
Persona Journey Map
Persona - Storyboard
Scenario: Chloe chose to grab burger and fries for lunch on a workday, so she could have some more time to take a break and rest after meal.
1
Chloe decided to buy burger and fries for lunch.
2
She opened FIVE GUYS’ website to start ordering.
3
She encountered several problems while ordering.
4
She was asked to fill in credit card details to complete order.
5
She went to FIVE GUYS for pick-up when she saw “Order Completed” message, but fries weren’t ready yet.
6
She picked up her takeaway and went back office later than she expected.
Card Sorting
In order to help users select their preferred burger toppings from a long list of options, a card sorting was conducted to study their behaviors and preferences.
Type
Moderated Usability Testing
Participants
4 female, 1 male, aged 25-67
Research goals
Determine how users categorize various burger toppings and what reasons underlie their categorization.
Vegetables
Grilled/
Manufactured food
Sauce
Food
Sauce
Results
• 3/5 participants put all topping options into 3 categories: vegetables, grilled/manufactured foods and sauce
• 2/5 participants put all topping options into 2 categories: food and sauce
COMPETITIVE ANALYSIS
IDEATION
“How Might We” Approach
TEST IDEAS
Design Explorations
Full Menu
Approach A
Approach B
Show both graphic and text, align reading direction. Select your preferred meal without feeling overwhelmed by a text-heavy menu.
Burger Menu
Approach A
Approach B
Apply progressive disclosure, simplify menu layouts. Reduce distractions when customizing your burger.
Toppings Gallery
Approach A
Approach B
Replace lengthy topping descriptions with graphics. What you see is what you get.
Prototype
Project Goals
•
Users can place their food orders easily and efficiently.
•
Users can effortlessly customize their burger with their preferred toppings.
•
Enhance the brand's competitive edge on the online food ordering platform compared to rivals.
Main Improved items
Choose restaurant feature
Burger toppings menu
Payment feature
Explore the prototype
3 ways to quickly locate your position and nearby restaurants
Customization of burger is no longer a burden
Graphics (from FIVE GUYS' original website) added to catch user’s attention and help them quickly perceive the menu categories
Payment process can be easy and fast
More popular payment methods are provided, users can choose the one at their convenience
Explore the prototype
BEFORE & AFTER
Order Food
Before
After
Full Menu
Before
After
Burger Menu
Before
After
Checkout
Before
After
Order Status
Before
After
NEXT STEP
Usability Testing
To evaluate the usability and user satisfaction of the new food ordering platform, a usability testing will be conducted to gather user feedback. The collected feedback will be used to make improvements to the platform.
TAKEAWAYS
To gain insight into the brand value and target audience of FIVE GUYS, extensive research is conducted on the company's background and feedback from actual website users. Efforts were made to develop a design that aligns with the original brand visuals, including the distinctive red color, red-white grid pattern, and minimalist layout. It is essential to design solutions that not only reflect the brand identity but also deliver value to both the business and the end user.
My choice: Little Hamburger with lettuce, tomatoes, cheese, patty, grilled onions and BBQ sauce. What would you choose? ;)