McDonald’s Kiosk

Product Overview

Usefulness

Users:

The Kiosks will be placed in the physical stores of McDonald’s. The only payment options

available on the Kiosks are through Credit card, Debit card, and Apple Pay.

Hence the users of the kiosks are going to be the customers of McDonalds who do not want to go

to the cashier to order their food and who want to pay for their meals through the available

payment options – Credit card, Debit card, and Apple Pay.

Usefulness:

The primary purpose of the kiosk is to let the users order their burgers, meals, sides, etc. without

going to the counter. The kiosks will accept only electronic payments.

The users can determine the quantity and even customize their meals according to their liking.

Once the user makes the payment, they can collect their receipt and see the order number. This

order number helps them in collecting their meal from the counter.
User-Guide:

The user walks up to the kiosk and clicks on the start button. The user has the option to change

the language and even audio prompts for those who have low visibility. The audio prompts work

when the user touches any part of the screen.

The menu is then displayed to the user when they click the ‘Start’ button on the previous screen.

The menu is divided into categories like Popular, Meals, Breakfast, etc. The user chooses one of

the categories that they desire.

When the user chooses one of the categories, they are displayed with all the items in that

category. The user selects one of the items displayed, or they can go back to the screen where

they can see all the categories.

When the user selects a food item from their desired category, they are displayed with the details

of that food item. The price, quantity, and nutritional information are shown. The user has the

option to customize their meal or even make it a meal by adding fries and a drink. Once the user

customizes their food or makes it a meal, they add it to the cart.

When the user is ready to order, they can click on the Cart icon to go to the payment screen. Here

the user is displayed all the items in their cart, the price, the calories of each item, and the final

amount that they will have to pay. The users have the option to go back or complete the order by

paying.
When the user clicks on Pay Now, they are indicated to pay through their cards by inserting,

tapping, or swiping it on the machine next to the kiosk. The user still has the option to cancel this

payment.
Once the payment is received, the customer is shown their order number and asked to collect

their receipt. They can either click on the exit button to return to the home screen immediately or

the machine will automatically return to the home screen after 10 seconds.
Interaction Design

Cognitive Design

Building Blocks

1. Affordance: The buttons in the system have a drop shadow to make it look more like real

button. This makes the users believe that clicking the button would lead to some action.

The upward-downward arrow and the left-right arrow indicate that clicking those would

make things go up, down, left, or right respectively.

2. Signifiers: Each category and food item is depicted using their respective image and a

label is provided to signify what exactly it is.

 The shopping cart signifies the actual cart with the items that the user has in it.

Each button has been given labels to indicate what the button does exactly.

3. Feedback: Whenever the user adds any item to the cart, the total number of items in the

cart changes.

The number changes, depicting, the quantity whenever the user clicks on the plus or the

minus button.
 4. Constraint: Whenever, a user selects 1 item as a quantity, the minus button is disabled and

grayed out indicating that the quantity cannot be zero.

Attention and Memory

The kiosk is designed in such a way that it can be easy to use by people of all ages, and all

aspects of life.

To bring certain things to the user’s attention, a container, which is on top of other layers, is used.

Whenever this container is displayed, the background layers are blurred to make the user focus

on the required task.

A grid with 3 or 2 horizontal cells is used to display categories or individual items. This makes

sure that the screen is not cluttered with multiple options and helps the user focus.
Whenever any category is selected, the image of that category is displayed in a larger size

compared to other categories. This helps the user recall what category they are actually in.
There is a Back button provided at almost all the screens to help the user go back to the previous

screen. Also, the user can also click on the cart anytime to help them recollect what is already in

their cart if it’s a huge order.

Additional Interaction Design Concepts

Effective Design

1. Visceral Emotion: The kiosk starts with the iconic golden arches of McDonald's and the

red and yellow color scheme. This creates a sense of familiarity with everyone who know

about McDonalds. Almost all the components of the design have curved corners. This

creates a calmness in the users and indicative of the golden arches.

2. Behavioral Emotion: When the user interacts with the system, they would notice that

there are smooth animations whenever they click any buttons on the system. There are

slight animations whenever the user moves from one screen to another. There’s enough
 negative space between the components that make the system feel spacious. Every button

has shadows behind it to give it a look of physical buttons.

3. Reflective Emotions: The kiosk is easy to use and uses good contrast and size for the

text. This makes it easier to read and navigate through the kiosk. The kiosk follows the

brand colors of McDonald's which in the food industry is associated with stimulating the

heart and increasing happiness. The kiosk clearly mentions the payment options and

gives the option to go back or cancel any time. The kiosk also clearly mentions the order

number which makes it easier to remember when collecting the order.

Physical Design

There is a sound mode that the user can activate by clicking the speaker icon next to the language

icon. This lets users with low visual abilities use the speaker in the kiosk to understand more

clearly what they are touching. The voice assistance is in the language of the system. This option

can be activated on any screen throughout their journey.

There is a clear contrast between the text and the background color. This helps all users read

more clearly. This contrast aids people with color blindness to read better since the color scheme

of the kiosk is based on McDonald’s brand theme.

Ethical Design

Accessibility: The system has an option for voice assistance for people with low visual abilities.

The system also provides a good contrast between the words and the background to make it

easier to understand the text.

Privacy: The system does not collect any user information apart from the card details which is

through a point-of-sales system. The user does not collect information like Phone number, email

address, etc. The user gets the receipt for their order with the order number printed which is also

displayed for around 10 seconds on the screen. After that, the system resets for the next user.

Focus: The system blurs out the background layer whenever there is something that requires the

users' attention like changing the language or customizing their order. This is only done for

important activities. The system even increases the size of images of a category to let the user

know which category they are currently in.

Social Design

To help users with the complexities of interpersonal communication, the kiosk provides the

option to change the system language. This is especially useful in countries like the USA where

people from all over the globe live. This language change option along with voice assistance can

even help those who are illiterate to order food through the kiosk.
Since McDonald’s has stores all across the globe, the kiosk can be adapted by McDonald’s in

different countries and can be changed according to their menu. The language change option can

be used by the local population who do not know English.

References:

1. https://www.rd.com/article/mcdonalds-logo-yellow-

red/#:~:text=The%20color%20red%20is%20stimulating,spot%20on%20a%20crowded%

20road.

2. All images credited to McDonald’s