Fiserv.

Enhancing the Group Dining Experience

Team: 5 Devs & 3 Data Science

Role: UX Designer, Project Lead

Timeline: February 2024

Tools: Figma, Jira, Miro, Google Suite

INTRODUCTION

If you're a foodie who loves dining out with friends and family, you know how frustrating it can be when the bill arrives and everyone must sort out their portion. But what if there was a way to make the group checkout process seamless and enjoyable?

Fiserv wants to expand its services and products into the Restaurant and Hospitality Industry. With our proposed solution, you can move money and information during the group checkout process, making it effortless for patrons to split the bill and enjoy their meals without hassle.

I had the opportunity to participate in their Industry Project with Fiserv. I collaborated with 5 Developers and 3 Data Scientists, where we competed against five other teams.

Spoiler: We placed 1st!

INITIAL RESEARCH

1

3

I conducted a SWOT Analysis on Clover, a Fiserv product. I did five in-person one-on-one Interviews with Restaurant Patrons and Restaurant Staff at Snap Thai Fish House, located in Atlanta, GA.

By prioritizing research and exploring design ideas, we were able to start development after understanding who we were solving for and whether Restaurants were interested in investing in digital technology.

Non-Keyword reviews: n=12838

Mean Rating: 4.26

The Data Team used these keywords to split the dataset into two groups and analyze them to see if each group had meaningful differences in average rating. Their analysis found a statistically significant difference between the average scores for reviews containing our keywords and those not.

Are wait times really the problem?

People are willing to wait in line if they see value in it. Many of our Interviewees mentioned that, even though they experience wait times when waiting for a table, they don’t mind it because they expected it and are dining in because of the popularity of the restaurant.

However, when it comes to paying, this experience is 50/50. Depending on peak hours, Restaurant Staff can start to fall behind and take a lot longer to get back to their customers’ tables to complete check-out, especially if they have to split 4+ payments individually.

Based on these insights and data, we focused on mid-sized restaurants and restaurant patrons who frequently dined out in groups of 3 or more.

Next, the Data Team conducted a deeper data analysis by pulling a dataset of Yelp reviews from Kaggle. The data contains just under 20,000 reviews, collected between 2010 to 2021. Their approach was to identify reviews containing keywords that one might expect to find if a diner were frustrated with the payment process. 

2

4

Start with key terms associated with checkout time (i.e. “search”, “leave”, “payment”, etc.)

Cosine similarity expands key terms list

Compared mean rating distribution via Wilcoxon ranked sum as distributions were highly left-skewed

19896 Reviews, 2010 - 2021

Separated all reviews by presence or lack of key terms

Keyword matched reviews: n=7058

Mean Rating: 3.90

REFINED PROBLEM SPACE

Groups dining out frequently encounter issues during checkout, resulting in long wait times, and overall, this can create a negative dining experience. 

How might we help Fiserv. move money and information for restaurant patrons during the group checkout process to enable quick and hassle-free payments to enhance their overall dining experience?

OUR PROPOSAL

By leveraging data analytics and integration with restaurant management systems, such as Clover, we aim to enhance the group’s patron check-out journey in mid-sized restaurants by a mobile web application through a business owned device.

EXPLORATORY MOCKUPS

Our main feature: Payment Methods (Split Payment or Pay by Seat)

Users will be able to “Share the Tab” with Friends or by “Selecting their Seat” from the Order Summary based on the Items they ordered.

Most Restaurants do not allow Diners to handle their checkout process. Typically, a server will have to be involved in the process.

In this exploratory design, Users can start their checkout process with their group without the help of restaurant staff.

PAYMENT SCREEN

Initially, I thought it would be best for the User to complete their task on one continuous web page.

After receiving feedback, I created another mock-up to remove the gray border because it was hard to distinguish each section.

I separated the content by using white cards. This better displays the information without distracting the user with gray lines, and I made the text darker.

PAYMENT SCREEN

I used a pop-up screen for Users to enter their Debit/Credit Card information for payment options.

This would appear if the User selects this as their payment option. On the main page, the payment method default would be “Debit/Credit”, as this is the most preferred by Users.

PAYMENT FLOW PROCESS

HIGH FIDELITY MOCKUPS

Based on additional feedback, I decided to improve the overall design by:

  • Instead of a Continous Page… I created a new flow to complete the checkout so Users focus better by completing one task at a time

  • Fiserv and Zelle have a strategic partnership, so I included this as a Payment Method option

  • Re-arranged the information hierarchy: “Review Items” then “Table Summary”

  • Updated the UX Writing Content for “Payment Options” to make it direct and clear

  • Included Taxes and Fees in the “Order Summary” so Users can know what they are paying for upfront

  • Once the first payment is complete, the next guest can start the payment process

  • Added in a Progress Tracker so Users can know where they are in the Flow at all times, additionally, providing them the option to Go Back if needed

FINAL PROTOTYPE

FUTURE CONSIDERATIONS

Looking back, there are a lot of things that I would like to improve my designs on, such as:

  • Adding an “Edit Items” functionality — Users can move around their food items if they change their minds or the server does not arrange them beforehand.

  • Remove or Update the Progress Tracker — I would have to research Progress Trackers and different UI options more.

  • User Testing — Due to time constraints, the Team wanted to start coding soon in order to make the most of their time. Therefore, we were unable to conduct User Testing with our prototypes. In order to improve, I would like to test this with multiple users such as Restaurant Staff and Patrons to see if passing one device around is efficient.

  • Explore “Split Tab” Page and “Edit Tab” Page — In the final design, I was only able to create a “Pay by Seat” Flow. I would like to take some time in the future to brainstorm ideas in order to make this scalable.

  • Re-design the “Loading Page” and “Success Page” — For re-designs, I want to look at other applications for UI Inspiration on how I can improve the visuals to make it more aesthetically pleasing and provide useful information while the application is loading.

  • Add option to “Send Receipt” Functionality — On the “Success Page”, adding an input field where Users can enter their email or phone number for their receipt would be ideal

  • Update “Payment Methods” Buttons — Currently, all 3 methods are highlighted (Card, Zelle, and Apple Pay); I would change this by only making “Pay by Card” the default and making the other 2 options “inactive”

KEY LEARNINGS

This project was exciting and challenging. At times, I felt stressed since I had to conduct Research and Design by myself in only a few days. Having a team waiting for design hand-off added a bit of pressure, but ultimately, pushed me to keep iterating and be productive.

  • Interviews provide the most valuable insights — While online articles and data can support our solution, talking with Restaurant Patrons and Staff ultimately allowed us to find areas of opportunities we might have missed.

  • Restaurant Owners/Managers will make the final decision — Even though we are trying to improve the dining experience from a Customer’s POV, we must also consider the Restaurant’s Needs as well, as they will be the main ones investing in this technology to add to their Restaurant workflow.

  • Areas of Improvement — During this process, I also want to consider how this application would function for groups of 5 or more. In our proposal, this is a restaurant-owned device that the table can pass around to complete their payment without the need for a server. I’m curious to see if it is useful for larger groups.

  • This is not supposed to replace Restaurant Staff — Our digital solution is being offered as an alternative, optional payment method for Restaurant Patrons. I understand that the Restaurant and Hospitality Industry works best with human interaction.