Check Splitting App Feature | Startup Client
Defining a Mobile App Experience That Enables Diners to Split their Check at a Restaurant
How might we design an experience that makes it easier for diners to split their bill when dining at a restaurant?
Building out a feature ecosystem that capitalizes on competitive differentiation to drive user growth and loyalty.
Scenario & Background
Reserve was a restaurant technology startup with a connected ecosystem of B2B and B2C products. t’s consumer reservation booking platform was operating in a crowded space and, not being a first-to-market reservation product, needed a differentiator to driver diner adoption, usage and establish differentiation from more established competitors in the marketplace.
Through consumer research and testing, digital payment was identified as a differentiator with the potential to stimulate user adoption and retention by reducing friction and facilitating a more seamless dining experience for our users - creating surprise, delight, and gratification. The act of splitting a check with others was a natural aspect of the dining experience for our users. In order to be useful, the Reserve digital payment experience needed to facilitate the expected tasks and behavior that users associated with splitting their check while dining at a restaurant.
The scope of this project included the definition and design of a digital 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 app across both iOS and Android devices.
Reserve was a small startup with big goals, a lean team and limited resources. I was the sole product and interaction designer working on this project and lead planning, research and design from the ideation phase through to development and launch. Additionally, I consulted and collaborated directly with the VP of Design, CEO, COO, and CTO throughout the lifecycle of the project to foster inclusion, generate ideas, and facilitate progress and decision making.
My Role & Contribution
As the sole designer on this project, I was responsible for all aspects of design definition, design execution, and product management for this feature.
Design Definition Activities
Included collaborating with business and technology stakeholders to define feature requirements, KPI's, & goals, defining and conducting initial discovery/research, and organizing collaborative ideation activities with user and stakeholders.
Design Execution Activities
Included the definition of system architecture, key flows and interactions, the design of iterative wireframe design, the planning and facilitating of both in-person and online user testing sessions, user interface & visual design, and the creation of developer specifications & documentation.
Product Management Activities
Included the definition of project timelines & milestones, defining requirements & mapping corresponding user stories, setting and maintaining the cadence of design sprints, facilitating stakeholder discussion & decision making, and collaborating with development team through development, QA, design reviews & launch.
Process & Deliverables
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.
The solution developed was the result of a multi-phase, iterative design approach. Using data and insights collected from users, stakeholders, and an in-house technology team — a solution was designed that balanced user needs with business goals, while working within existing tech and operational constraints.
Phase 1: Planning, Research, & Discovery
Initial research and discovery focused on gaining an understanding of how users were typically splitting a check. This included understanding the context around a user's experience and experience when splitting a restaurant check with one of more guests (The ‘Where?’, ‘When?’, ‘Why?’, and ‘How?’).
The insights and findings from user surveys and interviews were synthesized, then ideated on during several collaborative design sessions and discussions with key stakeholders. The end result was four potential high-level design approaches for splitting the check within the Reserve app. These approaches moved forward for further ideation, testing, and validation with users.
Phase 2: Generative Ideation & Concept Testing
Secondary research and discovery focused on understanding user attitudes, understanding, and affinity for a range of potential design solutions with a goal of identifying on a single solution to focus on. Both paper and digital prototypes, and a combination of both in-person and remote user testing methods were used to garner feedback during several iterative design and testing cycles.
A hypothetical, high-level user journey was developed using research insights and findings from the initial research and discovery phase. This journey was based on assumptions of what an experience would need to provide to satisfy user needs. Additionally, it allowed us to erect a set of guardrails that defined the minimum viable functionality we would need to test and validate high-level concepts with users.
Phase 3: Experience & Interaction Design
After focusing in on a single direction, the detailed design of the system and interaction patterns that would bring the feature to life began. To begin to map requirements, the users and their potential 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.
As we got deeper into the design of the check splitting ecosystem and interface components, additional challenges and questions surfaced. To address these challenges, design solutions were developed, then validated with users. Often these results were presented to stakeholders for further discussion and consideration. 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.
Phase 4: Visual Design, Documentation, & Collaboration
After thoroughly defining the architecture, interaction patterns, and components within the system, the final steps in the design process began. This included refining the visual design patterns for the interface, then documenting the system for hand-off and collaboration with an internal development and QA team.
Collaboration with the technology team was an integral part of the design workflow. In addition to engaging developers throughout the design process via planned and ad-hoc discussions, UI specifications were shared digitally via Zeplin and a variety of documentation including user stories, screen flows, and annotations were created for the development and QA teams. This ensured that the resulting, final coded release functioned and appeared as closely as possible to what was envisioned.
Outcomes, Learnings, and Takeaways
Post-launch, the Check Splitting ecosystem delivered on the KPI's and key metrics desired – delivering a high-level of user satisfaction and contributing to a continuous month-over-month increase in app usage during the first 3 months live. This increased usage also resulted in the onboarding of new users who, when later analyzed, showed a high percentage of repeat usage of the app.
Learnings & Takeaways:
Low-fi prototyping can deliver 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!)
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.
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, if any blockers exist, what front and back-end development resources will be needed, and how releases can be sequenced to get a product out of the door as quickly as possible.
Define your MVP requirements early, then continue to 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?
An in-depth case study of the design process & deliverables for this project is available on Behance.