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:
- Kiosks were a “new and exciting” addition to Main Event properties, and employees were still trying to learn how to use them
- It was somewhat common for kiosks to stop working in the middle of customer transactions, making employee involvement mandatory
- Due to the confusion surrounding how to fix these issues, Main Event was continuing to push online and mobile transactions so no one would have to use the kiosks
- Employees found themselves faced with hardware limitations of the kiosk such as bills jamming inside the machine and only accepting a certain number of bill types at once, but had no GUI to tell them when or if these issues were at play
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.