The ordering kiosks all had benefits to diners: They let us skip slow lines, and more easily read menu choices that can be hard to see on wallboards. They let us customize our food, even old friends like the Big Mac. We didn’t have to download apps to our already full phones, or worry about connection speed.
At times, though, we found stumbling blocks that, while they didn’t stop us from ordering, could be improved.
1. The kiosk should work without set up.
Both Panera and McDonald's start out users with a decision point. At McDonald's, users are asked whether or not this a take out or eat order. This step would be needed at a certain point in the experience, but it is unclear that asking upfront would impact the ordering experience for the user.
Panera on the other hand, enforces a speedbump to identify myPanera customers. By stopping all users upfront, one would expect that the flow would encourage users to sign up to become a member, but unfortunately this opportunity is lost because users are not able to sign up for membership using the kiosk. If becoming a member cannot be woven into the flow, this speedbump could be removed and members could be encouraged to swipe their membership card on the welcome screen instead.
This initial screen allows users to swipe a membership card, credit card or just get started. The membership card has benefits, since it allows users to choose past customized dishes and rewards, but isn’t required. The credit card is also not required now, but might save a step, and lets the user know what payment types will be accepted.
The simple choice between eat in or takeout here is a bit abrupt as a way to begin, but the choice is simple and since it can easily be adjusted at the counter, it is at least not a barrier.
2. The physical situation and device should be accessible and pleasant to use for all
While not experts on accessibility, we still noticed that making the kiosks as accessible as possible would make them more comfortable to use for all.
This location's kiosk set up is almost there: The lower, tablet-sized kiosks are just about visible by a user in a wheelchair or someone shorter than average, including kids. These could have a lever to raise/lower the units to make them accessible to all. We like the printed menus as well as an alternative. We did not notice any obvious help for the visually impaired.
These kiosks are designed to be used by people within a very limited range of heights, in a standing position. When someone is outside of those design constraints the experience becomes a very tiny version of the main screen. At best, this seems like an afterthought and not very usable or welcoming to those who are sitting or shorter than average, including children. We did not notice any obvious help for the visually impaired.
Existing menu boards can be hard to read for anyone, especially those at a lower height or with imperfect vision. Kiosks can help alleviate this existing problem. Interestingly, the kiosks did not always display the complete calorie count required in NY city, therefore the large menu boards still served that purpose.
3. Offer Membership as a plus; make it seamless; make sure it’s not a stopping point
Some users love membership programs; others never sign up. For the first group, we recommend really making membership work smoothly with kiosks; for the second group, the lack of membership should not interrupt the workflow.
This store offers attractive benefits for members: ability to save customizations, easily place a past order again, and freebies such as discounted pastries. However, 1) it was impossible to sign up via the kiosk, 2) there was no way to request a card through the kiosk, and 3) there were no cards located near the kiosk. Users had to visit the main counter, and then use a browser to sign up. Requiring this many points of contact puts a large amount of work on the user that could be avoided.
Here lots of customization is available, but no way to remember choices. Perhaps introducing the membership concept would benefit users?
4. Design for the form factor
When using large touch screen food ordering kiosks, users are standing, further away from the screen than they might be with a phone or desktop computer, and perhaps in an unfamiliar and busy space. Large fonts and pictures will help with accuracy and scannability; vertical scrolling is natural but horizontal scrolling becomes slow and tricky; and since the users is ordering food, any images really benefit from large, delicious-looking photography.
These small checkboxes and menus are hard to select on a touchscreen; the type is quite small to read from a standing position. The left picture responding to the right selections is also difficult to scan.
Small photos are very difficult to make out when standing in front of this kiosk; making them larger would increase visibility and scannability.
These large photos and text are much easier to read (aside from the duplicate entries, which seem like a temporary hiccup.)
5. Accommodate different types of visits, e.g. a quick snack vs a large meal for a group
Currently the kiosk ordering experiences are directed toward savory meals, at the expense of other types of visits. A clearer hierarchy and balance would better expose the restaurant offerings, making the experience faster and more pleasant for many users.
The kiosk landing screen focuses on meal options, pushing snacks and drinks below scroll, and relegating them to simple categories for Beverages and Bakery, which are hard to find. However, at the counter, the baked goods at this bakery-based chain are invitingly displayed, which immediately accommodates snack visitors.
Likewise this kiosk directs users into customizing sandwiches in the focus area; whereas some users may be visiting for a milkshake, fries, breakfast food, etc.
6. Only show advertisements if they are relevant, integrated, and provide a way to add the item to the order
Advertising as the user places the order should be very targeted around building a better order; anything else is a distraction.
This splash screen advertisement is very enticing, but 'Tap to order' on the oatmeal image is actually generic and intended to say 'Start order'. We could only find this item by using the search function on a subsequent screen.
The suggestion bar at the left is virtually unnoticeable during the actual checkout, and sometimes suggests something already in the cart. Moving it to the right or below the last item in the cart would help its visibility. In addition, the engine might need tweaking to find the right product to suggest.
The ads above the ordering section are strangely generic for a user already in the process of placing an order (Especially the example on the right: advertising a burger to a user already customizing a burger...). These could be removed and replaced with targeted suggestions throughout the ordering process.
7. Reflect facts about food clearly, including allergens and other specialty diet information
Users with special dietary considerations are really left guessing, or having to speak with a person at the counter. Additional information available for each menu item could be provided regarding ingredients and nutrition, to respond to the needs of users with dietary restrictions or allergies, and other requirements such as the New York city calorie display.
A calorie count appears at top, but there are no calories indication for the add-ins. For allergens, while there are no nuts listed, the pesto may contain nuts, or any of the products may be made in a nut-processing facility, which should be stated. Some simple buttons for specialized diets, such as ‘Make this dairy-free’ or ‘Make this gluten-free’ would be a plus for many users.
Subtle calorie counts would help users make better informed decisions. Choices to make a meal dairy-free or gluten-free would be a bonus.
8. Make customization inviting
Customization is a prime benefit of kiosk ordering. We recommend making it a de facto (but quick to skip) step in the add to cart flow. Customization options should be tailored to the medium and content, using large, inviting photos, with simple click areas and scrolling lists.
Why make the user choose to customize vs add, or add and then customize?
9. Adjusting the quantity should be flexible and standard
Simple, large counters in the right place are clearest; this should be a fast, seamless adjustment for users.
The plus and minus buttons are intuitive to increase/reduce quantities, but their placement doesn’t flow naturally. We expect them at the right.
A ‘choose’ button turns to a counter after clicking, which is simple and efficient. A quick way to remove the item (rather than – to zero) might also be helpful.
10. Reduce paper waste (and customer annoyance)
We liked Panera's approach, which only provides a paper receipt on demand (members are emailed a transaction receipt). The store relies on the user's name only at order pick up. McDonald's could also benefit from this simplified approach. Receipts almost always go directly in the trash, and doing away with them would be more sustainable and less annoying.
11. Don’t forget the other principles of good design...
Clear hierarchies, rational font size, appropriate spacing, well-cropped photos and clear, unified button bars, among other principles of good interaction and visual design should all be part of each kiosk screen.
Most of our findings can be summarized by making sure to design for the medium: standing users, who are placing an order in a busy environment, and who may return again.
The bonuses of customization and membership can both be further enhanced. They provide real benefits in speed and satisfaction, in addition to the readability and basic speed any kiosk can provide.
Later, we visited a kiosk-only restaurant that we found incorporated many of the same points; check out our notes here.