Kiosk Interface



Client

Main Event

Role

UX Designer

Platform

Kiosk

Areas

Evaluation, Design

Main Event is a family entertainment center with locations across the United States. Initially they requested a design for an employee-facing workflow for managing cash within their customer kiosks. After evaluating the overall kiosk experience, I identified additional usability issues that secured additional business from them to redesign an existing customer-facing workflow.

Scope of Work

  • Designed kiosk screens and error messages for employee-facing cash management flows including reviewing balances, loading and withdrawing cash, and resetting the cashbox
  • Evaluated the existing user experience and customer flows to identify usability issues and opportunities for improvement
  • Created a new design for the bowling event selection flow, including scheduling, confirmation, and payment screens

Why Take On This Project?

  • I was able to reinforce that employees are users too by upgrading their current basic command-line interface for administrative workflows to a fully realized concept
  • It was a unique opportunity to design for a physical kiosk with a large screen, where interaction constraints are fundamentally different than the average software product

Designs

completed over a 2-month period of time, iterating on the current kiosk experience and known issues employees were facing during the cash management process




User Journeys

created to identify opportunities for improving the overall customer experience beyond the initial scope of the project

Project Overview

Discovery

Since this project was contracted through an agency, the first step was to speak to the client and the involved users at Main Event’s flagship location. From this, I learned several valuable things: My first job was to design that interface for employees, so they could feel confident when handling cash through the machine and assisting customers with transaction difficulties.

Cash Management Design

Mockups & Prototypes Iconography Adobe XD

Employees were not just helping customers with failed transactions - they were also responsible for withdrawing the day’s earnings, reloading the machine to handle change, and balancing the cash box. They did this using a command-line interface to log into the machine and view the cash totals, before physically opening the machine to access the cash reserves. This resulted in careful manual tallying of the money each time, that then had to be compared with printed receipts from the kiosk itself.

I decided to start with the actual snapshot of available money in the machine. There were several hardware requirements that dictated what would need to be visible on the screen:
Kiosk Requirement UX Solution
In addition to the cash box - which held money from customer transactions - there was a change fund which held bills to be dispensed to back to customers during transactions. Both of these reserves needed to be displayed to users, with separate totals provided for each.
The cash box itself could accept $1, $2, $5, $10, $20, $50, and $100 bills, and had a maximum number of physical bills it could hold at one time. Each bill type and the number currently in the machine needed to be represented, with an additional state to tell users the machine was at its limit.
The change fund only accommodated $1, $5, $10, and $20 bills, and the kiosk had strict requirements about the number of physical bills needed of each amount in order to operate. Each bill type and total needed to be displayed in a larger callout, with states to describe if there were not enough bills for each monetary value in the change fund or if the maximum number of allowed bills had been reached.

When listing out the monetary values, I decided to use a color coded-system to assist with telling employees what actions were needed, pulling from Main Event’s colorful brand lineup.
  Color Meaning Action Needed
Pink Everything is fine No action needed
Yellow Not enough bills Load cash box
Blue Maximum number of bills Cash out money
Green Currently being loaded Finish physical kiosk task

While the normal operation at the end of the day was to cash out the entire machine and then simply reload the necessary change fund, if the machine became improperly balanced during the business day, it would disrupt customer transactions. Giving each part of the cash box that could be individually managed a distinctive color treatment helped employees diagnose and resolve these problems at a glance, making for smoother transactions.

Beyond this, employees were also facing problems with the physical hardware of the machine. Often there were internal bill jams that were difficult to see without pulling out the mechanism that loaded cash into and out of the reserve, and sometimes the kiosks refused to print receipts, which were a mandatory part of financial reporting. With no error messaging in place to tell employees what had gone wrong, they had no clear way to resolve the issues. I implemented the following errors to provide actionable guidance:
  Error Solution
Bill Jam The user needs to remove the cash loading device to remove a jammed bill.
Unable to Print The user needs to remove the printing device to remove a jammed receipt or add more paper.
Cash Device Removed The user needs to place the bank note recycler back in the machine properly.
Generic Error The user may need to cancel out of a transaction, return to the home screen, or unplug the kiosk to reset the machine.

Unfortunately, the machine did not support more targeted messaging that could differentiate between certain printing errors or which specific cash reserve had been jammed, which is a hardware limitation that ended up impacting usability.

Additionally, I also implemented a cash loading sequence that prompted employees to load a specific bill type into the machine, with a button that allowed the machine to properly count and distribute the cash, and an initial landing page upon logging in that let employees access either cash management or bill loading directly.

Customer Experience Evaluation

Heuristic Evaluation Report User Journeys

Because one of the main employee complaints had been that customers were having difficulty booking events, I also performed a complete heuristic evaluation on their customer-facing interface.

Since I did not have access to the physical kiosk, I relied upon videos of the current process where I had directed someone through each of the normal customer flows, then played them back to note any usability issues and opportunities for improvement I noticed.

Once I logged down 18 interactive issues, 13 visual issues, and 20 content issues to contribute to their overall evaluation score, I mapped several user journeys for common situations noting differences between their current experience and the experience customers could have after fixing the usability issues present with their kiosk.

I presented these findings to the company, prompting them to sign an additional statement of work for a limited number of customer flow screens, most prominently including booking bowling and gravity ropes events.

These were relatively simple changes that involved changing the selection of details such as duration of the event and number of players to a button interface rather than a slider, and noticeably greying out the times that were no longer available to customers when booking.

As a bonus, I was also able to perform additional enhancements on the payment screen, which meant I was able to incorporate the previously worked on error messaging to alert employees to when a customer transaction had failed due to an empty or maxed out cash box.

Outcome

The redesigned screens and admin portal were released at a single location for on-site user testing over a limited time, and were well-received by both customers and employees.

Main Event employees overall reported less frustration when going through the cash flow process, saving anywhere from 30 minutes to 1 hour every time they needed to perform daily kiosk management tasks. They also noted that they could trust that the receipts they printed were accurate now, which helps to ensure proper reporting and supports compliance.

As a result of the change in event selection and error messaging, employees also saw an 8% increase in transactions completed on their kiosks without employee assistance being requested.

Following the success of the initial release, Main Event moved forward with releasing the newly designed screens to other locations, ultimately rolling the changes out to their kiosks nationwide.

This is definitely a time saver - no more stress when I need to handle the cash box!

This might be the first time I've seen a customer actually complete a kiosk transaction without having to ask for help. It's amazing.

I love the new screens for my admin login - it's so easy for me to use now!


Like what you see? Drop me a line!