Toast Hackathon: Point-of-Sale Order Screen Redesign

Four times a year, Toast holds a company-wide hackathon where us “Toasters” get to work on an any innovative idea or project that we like. Throughout many months, my team had tossed around countless ideas on how we might dramatically improve the ordering user experience for servers and bartenders in a way that is different than traditional POS systems. We also really wanted to streamline the interface, making it as clean, simple, efficient, and flexible as possible, without sacrificing rich functionality. Finally, we wanted Toast to feel more like a familiar Android app, leveraging various aspects of Google’s Material Design, in order to match user’s expectations of a modern, mobile tablet app.

With these goals in mind, I spent my 24 hours of the hackathon constructing a couple blue-sky interactive concepts that reimagined the way entering orders into Toast might be achieved, while cohesively piecing together the various enhancements we had brainstormed about and discussed in passing.

Client: Toast

Industries: Hospitality & Restaurants

Demonstrated Capabilities: Creative Direction, Interactive Prototyping, Mobile Interaction Design, Product Definition, User Interface Design, Wireframing

Tags: point-of-sale / pos / restaurant management

The Project Story

Concept 1: Streamlined Ordering Interface with Global Search and Graphical Table Seat Position Control

In this concept, I specifically focused on using as few buttons as possible. My chief intent was to declutter the ordering screen and make it much more simple to use, while also ensuring that the most important information can immediately be found. I did this by hyperlinking textual information like number of guests, server name, and dining option. Such a design strategy allowed me to get rid of many bulky graphical elements, while still retaining all the functionality of our current system. I also removed all information that was irrelevant to full service restaurant servers at this point within the ordering workflow. For example, tax amount is not important at all to see until the guest actually gets ready to make a payment and close out the check.

In terms of net new UI interactions and features, I added a global, type-ahead food item search, and a graphical table widget that allows the user to easily select seat positions for the food items each guest orders. The seat number assigned to a dish can alternatively be modified by simply dragging the food item in the order list to a different pivot point on the table.

Concept 2: Handheld with Handwriting Recognition and Conversational Ordering

In this alternative handheld tablet concept, I took the global food item search one step further by experimenting with the use of handwriting recognition technology. Instead of tapping through categorical hierarchies of food items or punching a search in with a keyboard, the user can simply use her finger to quickly trace a couple letters of the item name and then instantly receive filtered results. From here, she can select one of these search result items with a single click. For instance, writing “1. BU” will reveal food items such as Turkey Burger, Burnt Cream, and Sticky Buns. Furthermore, writing the number 1 before the letters tells the system that this item was ordered by the guest in Seat Number 1.

I also built in support for what is known in the restaurant industry as “conversational ordering.” This allows the server to view all mods in a single glance, while rapidly adding or removing various modifiers in any order that the customer requests them. When combined together, these various UX enhancements have the potential to significantly improve the efficiency and speed of our system, while interactively maximizing the usage of screen real estate on a small handheld device.