Breakfast Kiosk

 UI, Icon Design

A detail of three kisok screens and the breakfast food icon set.

For many people, the benefits of eating breakfast are outweighed by the necessity of a quick morning routine. This self-serve ordering kiosk meets users in the middle, providing a fast experience with large icons and buttons that are easy to spot even for customers who just woke up fifteen minutes before.

Use Cases

As someone who needs to multitask, I want to be confident ordering at a glance so that I can focus on other things while I get my breakfast.

As someone with limited time in my morning routine, I want the fastest way to order my breakfast so that I don’t have to rush or skip eating to stay on time.

As someone who is extra sleepy in the morning, I want to order with as little thought as possible so I can get the breakfast I need to get my day started.

Focus on Icons

Self-serve ordering kiosks and their analog menu counterparts often rely on imagery to help customers locate the food they are looking for faster and more accurately. While photography is a popular choice, icons eliminate confusing details and can be recognized quickly, ideal for this small menu and an experience that prioritizes speed and low cognitive load.

The final icon set incuding eggs, toast, donuts, pancakes, waffles, bacon, bagels, and muffins.

The final icons emphasize warmth, energy, and friendliness while being sure to keep close to the look of the actual food.

Stages of development for the donut icon including a pencil drawing of a dount, different shaped donuts, and donuts with and without sprinkles.

Each icon went through multiple rounds of experimentation and refinement to deliver icons that met the goal of fast and unambiguous recognizability.

Different color options for the icon set.

UI Approach

The full ordering kiosk with the home screen.
Four ordering kiosks show the screens from "Review Order" to "Checkout" and error messages.
Four ordering kiosks show the screens from "Welcome" to "Added to Order."
Welcome screen
Home screen
Single item screen
Item added to order confirmation dialog
Review order screen
Payment screen
Order placed confirmation screen
Example error screen