cuenta
Overview
Splitting a dinner bill amongst friends can turn a beautiful evening sour, but can it be avoided?
Cuenta is a mobile web based application that integrates with restaurant POS systems to allow patrons to split and pay the bill using their mobile device. Users will be able to scan a QR code printed at the bottom of their receipt , select their ordered items and pay using their preferred method of payment.
Tools Used
Framework
The team used Lean UX Agile Methodology to keep our team on track to create the best possible product.
Learn
The Learn phase of UX design unpacks the brief, inspires us, and allows us to empathize with users and get to the heart of overlapping needs of the business and user, as a result solving a problem.
Conducting competitive audits gave cuenta insight on what is currently working for active bill splitting plat forms and what we can incorporate into our design to create a more well rounded product.
*Audited sites above: Splitwise, Kitty Split and Cost Split.
Social Listening
How do we know what the needs of the people are if we aren’t listening to them? Social listening provides the voice that will help cuenta design the need in this market.
*Quotes supplied by Quora
2 Google Form Surveys:
224 Total Responses
The information we received from our survey results gave us insight on the users needs and expectations for our MVP. Utilizing this key information guided us through the define phase ; creating momentum for future design aspects.
Key Data Points
Focus Group
Creating time for focus groups helps validate beliefs we had as a team about the bill splitting process and shed light on aspects that we had not even considered.
We asked our Focus Group to define the bill splitting process in one word.
Their responses:
Chaos
Time
Debate
Dollar Signs (Overpaying)
Math
Chaotic
Anxiety
Upfront
Define
The define phase of UX design identifies the goals, objectives, and strategy for the UXUI.
Personas
When creating your personas it is best to think of them in a story like fashion. Properly designed personas will allow you to pinpoint the users goals, needs and understand personality traits that define your targeted user base.
User Journey
The User Journey allows us the opportunity to create a map that will visualize the process that a user goes through in order to accomplish a goal. Here we can identify pain points and utilize the information to help develop key features.
“1st Collaboration with Dev Team where everyone gets to share their ideas”
- Lean UX
We had so many ideas how do we distinguish our key features? By laddering up to our KPI’s we were able to do so.
MVP (Minimum Viable Product) Session + Feature Prioritization
We collaborated with our teams on Miro, and using post it notes we voted on KPIs, features and prioritized our Minimum Viable Product using the MoSCoW prioritization method.
KPI’s (Key Performance Indicators) Measurements of success
Plot Matrix
Sitemap
A sitemap structures and clarifies the different features and content chosen during the MVP session. Those become the pages and sections in the website, this way we make sure every part of our website is reinforcing our strategy goals.
Design
During the define phase we identified what is currently working, and not working, for bill splitting applications currently in the market. As well as conducted several surveys and focus groups to identify user needs to maximize future user functionality.
Low-Fi Sketches
The early stages of designing are always the most exciting. In the low-fi sketches we begin our early sketches of what our final product could possibly look like.
Wireframes
Black and white representation layouts and how it works. This is how we figure out the best user experience.
Wireframe Prototype
Mood Board
The mood board is the directional theme and feel of your designs. You’ve built the house, now it’s time to add paint and fixtures before moving in.
Mockup Annotations
Mockup annotations allow us the opportunity to explain our whys?
Final Mockups
Style Guide
Primarily used during the Web Development handoff, the style guide is a combination of cuentas assets.
Mockup Prototype
Interaction Designs
Rewards Carousel
Ordered Items Selection Process
Apple Pay Animation
Experiment & Iterate
Now that we have collected our date, defined our problem and
User Testing
Iterations
Our
