top of page


McDonald's App
Interface Revamp
Project date: 3/2024
Tool: Figma
Introduction
McDonald’s is one of the most visited restaurants in Hong Kong. In this fast-paced city, many people choose to order food through the app. However, the McDonald's app interface is not user-friendly. In this project, we aim to enhance the user flow and interface of the app.
Purpose
Improve the Ordering System and Interface for better user experience.
• Simplified steps for time-saving
• Streamlined checkout and payment process
Pain point of the app

1. Missing clear button for customers
-Hard to locate the button for choosing between eat-in or take away



2. Superfluous frames
-Using 3 frames for 1 action


3. Only add-to cart button
-Not user-friendly for customers who only ordering a single item




4. Without unify brand color
-Reduce brand recognition
Objectives
Ordering a take-away meal (tested by choosing a set meal- 脆辣雞腿包餐, as McDonald's menu has various options in each category of food and drinks)
What We Improved

Before

After

1. Flow enhancement
-Customer can choose the meal pick-up method first

2. Simplify frames
-Condensed 3 frames to 1 frame for store choosing

Before

After
3. Added Checkout button


4. Brand color align
-Increase brand recognition
bottom of page