Self-Serve Kiosk

🔍Overview

Refreshed the kiosk interface to align with mobile design. Improved clarity and accessibility for both repeat and first-time users.

🧠 Understanding the Problem

First-time users, often unfamiliar with touch interfaces or new to self-ordering, found the kiosk difficult to use. The UI was cluttered, buttons too small, and navigation unclear. Without guidance or feedback, users frequently hesitated or made errors, leading to delays and abandoned orders.

Screen captures of the previous user interface before the redesign. The images show limited space for product images, minimal white space, and an unclear primary button, highlighting usability issues.

🎯 The Objective

Simplify the self-ordering process for guests in restaurants, especially first-time or less tech-savvy users. Focus on clear call-to-actions, better spacing, and helpful feedback to ensure confidence and reduce errors. Create consistency with the mobile app so returning users feel right at home.

🛠️ The Process

For users unfamiliar with self-ordering, the kiosk needed to be simple and welcoming. I adjusted layouts to allow more breathing room, added large, centred buttons, and improved the overall visual hierarchy to reduce confusion. The design mimicked the mobile app so users who had tried it before would feel familiar. I tested it with people who weren’t tech-savvy, like older users or those in a hurry, to make sure it was truly easy to use without help.

‍

User flowchart illustrating the ideal path for placing an order using the kiosk. The diagram outlines the step-by-step process from start to order completion.

Render mockup showcasing the redesigned UI screens. The front displays include the updated homepage and three variations of product grid views.

✅ The Result

The updated kiosk became much easier for guests to use, especially those ordering for the first time. Staff noticed a drop in support requests, and customers completed their orders faster and with fewer mistakes. The interface gave users more confidence, and stores were able to serve more people without increasing wait times.

Accelerated video walkthrough of the kiosk interface used by an existing client (Chick-fil-A). The video demonstrates key user interactions and overall flow.

Photographs showing the kiosk in use within a real store environment. The images capture customers interacting with the kiosk as part of the in-store ordering experience.