Photo credit: Toast Inc.
Toast Payments
Time Line: November 2019 - March 2020
I was the sole designer working on the redesign of the guest payment experience. I worked closely with my design lead, engineering, and product manager to define features and contribute to the overall direction of our product area. I created unified components that could smoothly adapt to all of our supported devices, from handheld to larger ones.
Additionally, I worked with my product manager and researcher to run tests and analysis to ensure that the experience was not comprised in its features when guests are checking out and employees are processing payments in a full-service or quick-service restaurant.
Shipping on Android
The Redesign of Payments Experience
Goal: Increase ease of use and streamline user interface throughout our product line.
Metric: Increase payment completition rate and reduce inbound support volume.
Approach: Through an in-depth, qualitative research study, we learned that most of our guests never complete the whole payment experience; they usually walk away when prompting receipt options and loyalty sign up at quick-service and fast-casual restaurants. We also discovered that guests tend to make errors because of the various payment experiences we allow restaurants to customize. Each time a guest uses a Toast POS, the experience differs. We hypothesized that if we streamlined the whole process with a unified user interface and experience, we could reduce inbound support volume for accidental tender types, increase the speed and completion of transactions, and lower the cost of maintaining multiple UIs in the long term.
The Payment Experience
Below are experiences focused on cash payments, and due to the credit payment flow still being developed, I am unable to showcase it.
Final guests cash payment experience: The guests’ payment experience varies slightly depending on the payment type and restaurant’s setup, but overall it comprises tip options, signature, receipt options, loyalty signup, and thank you screen. Guests can easily opt into any form of receipt option for the first time, and the selection will save it on other restaurants that use Toast POS.
When a guest visits a quick-service restaurant or a fast-casual restaurant, they will complete the payment process through the POS flip or Toast Flex, which ranges in size.
1. Guest picks receipt option
3. If restaurant enables loyalty, guests will be prompt with a loyalty screen to claim points
2. Inputs email or phone number depending on previous selection
4. A thank you screen will appear indicating to guest that the payment is a success along with change due and rewards collected
In a full-service restaurant, guests would be using Toast Gos to complete a payment process rather than walking up to the front counter to pay, depending on the setup. In previous designs, the payment experience was never mobile-friendly, which resulted in poor ease of use.
Final employees' cash payment experience: The employee's experience varies depending on the permission level and the restaurant's payment configuration.
1. If guests want to redeem rewards or save it for later with a cash payment, they would have to give their phone number or email to the employee to do it. On the employee side, they would be prompt with this screen to confirm the action that the guest would like to take.
2, Depending on the restaurant’s payment configuration, all cash payments will be prompt with this screen and a CTA confirmation. In this case, there is only one CTA.
3. If restaurants’ configuration allows for receipt options, there will be different CTAs for employees on wether or not a guest would like their receipt.
4. Depending on permissioning, an employee might not be allowed to void, but if it is a manager they would have the ability to voide a payment right away. This is is for security reason because there are cases when employees would void the entire payment and pocket the money.
5. In cases when guests want to do a split cash payment, the employee would be able to see the total amount, tender amount, and remaining amount in a mathematical sequence that is more informative.
Similar to the guest payment experience, we never designed the employee experience for smaller devices. The device scaled the design down to fit on the Toast Go, which impacted employees' day-to-day jobs when using a Toast Go to take orders or process payments.
How We Got There
The process was a collaborative effort involving feedback sessions with internal stakeholders, including my product manager, engineers on my team, design systems team, product leadership, and customer support. After conducting a market analysis of POS payment experiences, breaking down various payment experiences, and running PURE analysis, my team could choose a direction to work with, and I continued to diverge on the UI execution.
After mapping out all of Toast’s payment configurations, it resulted in 26 different experiences a guest can experience when going through the payment process on a Toast terminal. Not only is this expensive to maintain on the development side, but it is also confusing.
By running a PURE analysis it allowed us to quantify and compare ease of use in a quick and affordable way.
PURE analysis results
The Outcome
We were about to run A/B tests in the next few months by removing signature prompts for payment completion and removing default tips.
The results: Due to the current COVID-19 situation, we were unable to run tests, but we hypothesize that the update will improve the ease of use and give the Toast payment experience continuity. Also, removing signature and default tips we expect will not make a difference to a guest's experience but rather increase the completion rate and reduce inbound support volume.
Next steps: The update in both user experience and interface will slowly roll out to all restaurants, so guests will no longer experience different payment flows. Our customer support team will also continue to track any problems that may arise.