Case Study: Designing an impactful experience

Enhancing digital payment – Defining a mobile app experience that enables diners to split their restaurant check.

 
 
portfolio_hero_1840x625_check_splitting.png
 
 
icon_number_01@0.85x.png

The problem.

Reserve was a restaurant technology startup with a connected ecosystem of B2B and B2C technology products that facilitated a two-way communication network – allowing for real-time demand for a reservations to be disseminated from consumers directly to restaurants.

portfolio_process_divider_line.png

Digital payment as a differentiator for Reserve.
Reserve’s consumer reservation booking platform was operating in a crowded space and, not being a first-to-market reservation product, it needed a differentiator to drive diner adoption, usage and establish differentiation from more established competitors.

Early on, digital payment was identified as a differentiator with the potential to stimulate both user adoption and retention by reducing friction and facilitating a more seamless dining experience.

Why check splitting?
The payment experience had been built, but Reserve was still seeing a high, double-digit percentage of diners paying “off-app”. Through previous research, a number of pain points had been identified, including an inability to split the check with other diners when paying digitally, through Reserve.

  • The act of splitting a check with others was a natural aspect of the dining experience.

  • In order to be useful, the Reserve digital payment experience needed to facilitate the expected tasks & behavior that users associated with splitting their check while dining at a restaurant.


The ask.

The ask for this project was to define a digital experience ecosystem that would allow a diner to seamlessly split their check with one or more additional diners when paying for a restaurant check digitally, using the Pay With Reserve feature in the Reserve iOS app. Android parody would come after.

Success for the experience would be measured by the following:

  • Experience – An ecosystem that would allow multiple diners to split their check while paying digitally, using the Reserve app.

  • Pay with Reserve usage (%) – A decrease in the percentage of Reserve users who were paying for their meal “off-app”.

  • User acquisition (#) – An increase in new Reserve users, onboarded via the Reserve check splitting experience.


icon_number_02@0.85x.png

Delivery & outcome.

The final output of this project was an app ecosystem that allowed a diner to seamlessly split their check with one or more additional diners when paying for a restaurant check digitally, using the Pay With Reserve feature in the Reserve app.

 
 
portfolio_process_divider_line.png

Outcomes – By the numbers.
By understanding the needs of diners, then aligning our check spitting to their experience dining out with friends, the check splitting feature was received positively by our users and showed positive movement in key KPI’s over the first 3 months post-launch.

  • While bookings remained flat, the check splitting feature contributed to significant increases in the percentage of diners using the Pay with Reserve feature.

  • Additionally, through passive onboarding of check splitting participants (“invited guests”), we saw incremental increases in new user acquisition, of which a median percentage booked a reservation within their first 3 months as a user.


icon_number_04@0.85x.png

My role & contribution.

As the design lead on this project, I was responsible for leading, coordinating, and/or facilitating all aspects of design definition, design execution, and product management for this feature.

icon_contribution_highlight_10@2x.png

Design definition.

Collaborated with business and technology stakeholders to define goals, feature requirements & KPI's, coordinated customer discovery, and organized collaborative ideation activities.

icon_contribution_highlight_01@2x.png

Design execution.

Defined of system architecture, key flows interactions, iterative wireframe design UI & visual design, and the creation of specifications & documentation.

icon_contribution_highlight_12@2x.png

Program management.

Defined timeline, milestones & requirements, mapped user stories, set and maintained sprint cadence, facilitated discussions & decision making, and coordinated with engineering partners throughout development & QA.


icon_number_05@0.85x.png

Key components of the deliverable.

The experience followed the principles we defined in our customer discovery – we strived to not make diners think, not interrupt their dining experience, and make paying the check as easy as it was to book their reservation.

  • Intuitive – Don’t make us think.

  • Seamless – Don’t interrupt our dining experience.

  • Simple – Make paying the check as easy as it is to book a reservation.

portfolio_process_divider_line.png

Confirm your reservation using the app.

Confirm a reservation at your favorite restaurant using the Reserve app, then enable the Pay With Reserve digital payment feature to have your check total automatically charged to your credit card at the end of your meal. Dine, then dash!

portfolio_process_divider_line.png

Invite your guests.

Once your reservation is confirmed, invite your guests to split the check with you via their mobile phone number. For new users, your invite will be sent via SMS message. For existing users, your invite will arrive via a personalized in-app notification.

portfolio_process_divider_line.png

See when your guests have accepted your invite.

The guests you invite will have the option to review, then accept or decline your invite to split the check. In-app notifications will keep you up to date on the status of all of your pending, declined, and accepted invitations.

portfolio_process_divider_line.png

Easily control how the check will be split.

The check splitting interface provides a real-time overview of how the check will be split. The simple interface allows guests to be added and removed at any time before the end of your meal, making it easy to understand and stay in control of the experience.

Split & pay seamlessly.

At the end of your meal, the check will be split evenly amongst all confirmed guests. A receipt detailing the amount they were charged for their portion of the meal will be sent to each guest via email and is also accessible via the app.

portfolio_process_divider_line.png

icon_number_06@0.85x.png

How we got there 5 moments that mattered.

Getting to the final product was an iterative process that took place over a multi-sprint workflow.

Iterative conversations with customers, stakeholders, and our partner across engineering & operations resulted in a solution that balanced user needs with business goals, while working within existing tech and operational constraints – Here are a few moments that mattered along the way.

Moment 01: Discovery
Understanding context & identifying potential approaches.

Initial research & discovery focused on gaining an understanding of existing user attitudes, habits, and preferences when paying and splitting a restaurant check with others – the who, what where, when, and why. Online surveys & interviews were used to understand their experience and the context around it.


Identifying high-level approaches to splitting the check.
Surveys and interviews insights were synthesized, then ideated upon during several collaborative whiteboard sessions. The end result was four potential high-level design approaches for splitting the check within the Reserve app.

portfolio_process_divider_line.png

Moment 02: Exploration
Iterative ideation & validation to hone in on a direction.

Follow-on discovery aimed to hone in on a single approach to focus on. To do so, paper and digital prototypes, and a combination of both in-person and remote user testing methods were used to understand user attitudes, comprehension, and affinity toward the high-level approaches we previously identified.

Hero flow - a high-level user journey.
A hero flow was created to frame the minimum viable experience that would satisfy user needs. Additionally, it erected a set of guardrails that defined the minimum viable functionality we would need to design, in order to test and validate high-level concepts with users.


Iterative explorations + user testing via paper & digital prototypes.
To gather feedback on which approach was the most functional, easy to understand, and impactful to user, iterative prototypes of increasing fidelity were developed, then tested with users through a series of in-person and remote, unmoderated tests.

Feedback from these sessions allowed us to identify which approach was the most functional, easy to understand, and impactful for Reserve users within the context of their dining experience.


Outcomes – Guiding principles. (What Reserve users wanted).
Our discovery helped us identify a direction for splitting the check as well as a set of guiding design principles for our experience – it needed to not make diners think, not interrupt their dining experience, and make paying the check as easy as it was to book their reservation.

  • Intuitive – Don’t make us think.

  • Seamless – Don’t interrupt our dining experience.

  • Simple – Make paying the check as easy as it is to book a reservation.

portfolio_process_divider_line.png

Moment 03: System design
Defining the experience ecosystem & the variables within it.

After identifying a direction for splitting the check, defining the system helped us understand and discuss complexity and tradeoffs.

To begin to map requirements, the users and their actions within the system were loosely mapped. From there, stories breaking down user needs were created and connected to the map. This helped to frame the scope of the feature and prioritize our design efforts.


Mapping the ecosystem.
A system flow diagram illustrated the entire check splitting ecosystem, specifically highlighting connection points and the relationship between booking owners and their invited guests.

portfolio_process_divider_line.png

Moment 04: Interaction design
Exploring & refining key user interactions.

As we got deeper into the design of the check splitting ecosystem, additional challenges and questions surfaced. To address these challenges, design solutions were developed, then validated with users.


Example – Exploring visualizations & invite interaction patterns.


Example – Assessing user effort when adding contacts to invite.


Discussing design decisions with stakeholders.
Often these results were presented to stakeholders for further discussion. Synthesizing research insights into a succinct, understandable format that stakeholders could digest at a glance was just as important as the design of our user-facing components.

portfolio_process_divider_line.png

Moment 05: Styling
Defining & applying visual design styles to the interface.

After defining defining the architecture, content and interaction patterns within the system, we explored the visual design patterns that would bring the interface to life.


Developing a visual language.
Core styles for the components within the interface were designed to align with the overall look and feel of the Reserve brand.


Applying the visual language to the interface.
After defining the visual language for the feature, we applied it to our interface and iterated upon it.


icon_number_07@0.85x.png

What I learned.

Through iterative prototyping and discovery, we were able to better align design decisions with user behavior– here are a few things I learned along the way.

Low-fi prototyping delivers high value insights.

Results from a simple online survey, followed up with the use of paper prototypes to validate our initial ideas produced the insights that framed our MVP approach. (We all know this, but sometimes it is good to be reminded!)

icon_contribution_highlight_19@2x.png


Context is key to understanding your user’s true motivation and desires.

Existing user mental models, attitudes, and understanding only tell part of the story. Dig deeper in your research to uncover the context of a user’s journey when acting on a desire or engaging a task – from inception, to well past completion.

icon_contribution_highlight_09@2x.png

Align with your technology stakeholders early and often.

An open dialogue with technology stakeholders early and often not only fosters inclusion, it also ensures that the functionality being envisioned can be built, what blockers exist, what front and back-end resources will be needed, and how releases can be sequenced to get a product out as quickly as possible.

icon_contribution_highlight_04@2x.png

Define your MVP requirements early, then continuously socialize them.

Avoid scope and release creep by defining, articulating, and socializing a set of MVP release requirements early in the process, then continuously socializing these requirements with stakeholders throughout the design and development process.


Want to know more?

Have questions? Want to learn more about my experience enhancing digital payment for Reserve? Contact me.