UI / UX Portfolio - McDonald's Redesign Case Study

Page 1

https://medium.com/@tristtsw/mcdonalds-dining-experience-a-uxui-redesign-case-study-1ca57862c566



Overview of McDonald's McDonald’s is one of Singapore’s favourite and renowned fast-food chain. It has a wide range of menu items that customisations cater to all ages.




Design Thinking Framework Empathise

Define

For this case study, our team aims to rethink and enhance the dining experience of ordering at McDonald’s through the design thinking framework.

Ideation

Prototype

Test

Observation

Empathy mapping

How might we

User flow diagrams

Usability testing

Collect findings

to identify common

Lotus blossom

Low fidelity sketches

Validate and refine

through emotions

patterns and

brainstorm

Outlining scenarios

prototype

and thought process

themes Shaping our protopersona

High Fidelity


Empathise Observation Collect findings through emotions and thought process


Contextual Inquiries Key Observations

Take-away orders not being Diners are observed

collected and left

crowding around the

on the collection

self-ordering kiosks

counter


Contextual Inquiries Findings Crowd in the restaurant could not be assessed remotely. 5 out of 6 individuals prefer table service. Customisation for multiple orders poses significant challenges. Lack of variety in family meals option. Unaware of food status.


Define Empathy mapping based on identifying common patterns and themes from observations Shaping our Proto Personas and Customer Journey Mapping


Proto Persona

Representation of the targeted user

Sarah

Susan




Customer Journey Mapping (CJM) Sarah Main Frustrations Prior Ordering Phase: At the restaurant, need to check for seat availability since usually will dine in alone. No visibility of human traffic in the restaurant. During Order: Overwhelmed by the food varieties to choose from even when there is already a breakdown into different categories for the first level.


Customer Journey Mapping (CJM) Susan Main Frustrations Prior Ordering Phase: At the restaurant, need to check for seat availability to determine whether to dine in or take away as a family. During Order: Need to remember and take note of any special requests orders for the children. Therefore, with customisations it slows down the ordering process. Post-Ordering Phase: Currently, after making payment there is no way to keep track in terms of the food statuses. Constantly have to keep a lookout of the food.


Ideate Technique Used: HMW, Lotus Blossom and SCAMPER


What We Want To Resolve Quick order and Favourite order customisation

Time taken from ordering to receiving order

Post Ordering Experience

How might we…

How might we…

How might we…

allow users to check the availability

reduce the amount of time that

enhance the post-order

of tables and table numbers

users take to order their food?

experience?

without having to physically be at the restaurant?


Key Ideas From Lotus Blossom Technique


Key Ideas To Enhance Offline Experience To Resolve The Accessibility of Crowd Issue TV Screen outside and inside restaurant to show the crowd level Lights on tables to indicate available seats


Core Features For Prototype Quick Add Feature using Save Favourite Orders Features Real-time Order Updates with Progress bar within the app, indicating each step of the order fulfilment, also consider showing out of app at notification center.) Minigame within app while waiting for food Able to reserve table remotely (10mins grace) GPS within 1km


Prototype User flow diagrams Low fidelity sketches Outlining scenarios High Fidelity


Userflow We mapped out 4 main user flows to map out the journey for each screen and the action users needed to go through



Offline Experience

Indicator lights to show the reservation status of tables


Offline Experience

TV Billboard near restaurant entrance to show table and seat availability


Offline Experience

TV Billboard near collection area to show table and seat availability


Userflow - Remote Table and Seat Reservation


Userflow - Customisation and Favourite of Orders


Userflow - Real Time Order Status via Lock Screen and In-App


Userflow - Mini-Game to Earn Loyalty Points while Waiting For Food


Figma Prototype:https://www.figma.com/proto/JrdzzpmdS04cXThNPeerim/Team-2-Mcdonalds---Design-Space?pageid=0%3A1&type=design&node-id=46-233&viewport=234%2C697%2C0.71&t=SlT66THSEmbogdCx-1&scaling=scaledown&starting-point-node-id=46%3A233&mode=design


Testing Usability Testing Validate and Refining Prototype


Usability Testing With 5 users

Positive feedback from our users centered around straightforward UI, convenience, efficiency, and flexibility. All of these were what we wanted to achieve for our users. Some key highlights our user mentioned were: Users like the photos of restaurants being shown so can recognise the place immediately. The app user interface was refreshing and very easy to see all the information. Users like the feature of reserving tables while on the go as it saves time. Moreover, able to check the restaurant crowd before going down. Wanted to play a mini-game while waiting for food. Instant validation of restaurant location after scanning table QR code to save the trouble of finding a restaurant. Customisation and favourite of orders feature are good as do not need to re-choose standard order every time.


Affinity Approach Findings Photos affiliation with the physical store helped users to identify restaurant easily User-friendly interface with accessible information Table reserving feature captured users needs Mini-game helped pass customers time while waiting for their food to be ready Instant validation upon scanning table QR to detect current restaurant location Customisation saving helped users process order quicker


To be Improved Table Reservation Flow - Users want to secure their seats before they order Text Readability - Visual hierarchy needs to be improved as all texts are the same size and weight. Navigation Flow and Words Definition - Users were confused with table service and reserve table differences. Finding McDonald’s Restaurant Location - The McDonalds icon does not show the location name unless clicked on


Conclusion With our prototype, McDonald's users are now able to reserve a table when they're on the way to the restaurant. The time taken from ordering food to receiving would greatly improve as customers are now able to order in advance. Customers are now able to track their food status on the McDonalds app and have a mini-game to keep them busy while waiting.


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.