Platter is a content management system that caters to independent restaurants. The goal is to empower small businesses with an all-in-one solution for their POS needs.
Our team was tasked with designing a white-label mobile app for Platter. Businesses will be able to provide their customers with a branded mobile app with online ordering and a loyalty program.
My Role: Design Lead
Team: David Kim, Tanya Iniguez, Mike Brunson
Tools: Sketch, Axure, Invision, Photoshop, Whiteboard, pen and paper
Project Duration: 2 weeks
Restaurants and customers currently rely on 3rd party apps to find each other. Businesses lose out on the opportunity to extend their brand and customers pay a premium to order through apps like UberEats or Postmates.
Platter gets rid of the middle man and provides businesses with an all-in-one solution. Businesses can now focus on directly providing their customers with a delightful, branded experience.
Competitor Research, Online Screener Surveys,
User Interviews, Contextual Inquiry
The struggle of an independent shop
Running a small business is tough! Resources need to be managed well and relationships need to be cultivated with their customers. Food discovery apps like Uber Eats mean that restaurants can be found — which is great!
Food discovery apps can help businesses make a sale but they are not designed to for repeat customers. Let's see what happens when an order is placed on a food discovery app that we'll call 'Munchster'.
The business never gets to connect with the customer
The customer sends feedback through the 'Munchster' app — increasing the app's credibility
'Munchster' has established an on-going relationship with the customer via emails and marketing opportunities
How do people order food online?
Single Branded apps
Order history and item favorites
Allows detailed customization
Takes time to learn
Adds another app to user's phone
Food Discovery apps
Hundreds of local options
Convenient when looking for a new food
Easy to use
Expensive delivery charge
Customer connection to restaurants blocked
Identifying User Behaviors
I conducted user interviews and collected online surveys to understand how people used their food ordering apps. We also surveyed users on their experience with single-branded and discovery apps to gain insight on their preferences.
96% of users currently had a single-branded apps while 77% of users currently had a discovery app installed
“Square already takes 3% for each credit card transaction… I can't afford to have my own app.”
— S. Kim, Small business owner
“I like the rewards but I use it because I love the customization features.”
— L. Rodriguez, Cafe Customer
Observing users with their apps, while thinking out loud, gave us an opportunity to see how users actually use their apps. We learned about what they liked and wanted out of their apps. We asked users to use apps that they already had installed on their phones.
Businesses that use third party POS systems pay up to 3%* per transaction
Many businesses rely on punch cards and email lists to reward customers if they don’t want to use another third party service
Owners want more ways to connect with their customers
Convenience was the main reason for using food apps
Branded apps were used for both delivery and pick up
Users were drawn to apps with rewards programs
Users wanted to be able to customize their orders
Personas, Customer Journey Map, Feature Prioritization
Making sense of the research
Affinity mapping, card sorts, and white boards.
Identifying user needs, pain points, and behaviors helped in creating personas and their scenarios.
Iris is the proud owner/operator of Firebrand Coffee Co. She uses the highest quality beans from a boutique roaster and aims to tell a story with each cup she sells.
Iris relies on third party services like Square and 5 Star to process payments and reward her customers. These services get the job done but she is paying 3% per credit card transaction and a monthly fee to maintain her loyalty program.
Brian is an accountant working out of downtown Los Angeles. His days are busy and he does not like wasting his time or money.
Brian is also a coffee connoisseur and is particular about where he takes his business.
He discovered Firebrand Coffee through Postmates but decided that he would pay them a visit and avoid the delivery fee.
Brian had to wait in a line before even placing his order
His drink takes time to make resulting in increased wait time
The business doesn’t have a way to engage Brian to give him an incentive to return
Brian enjoyed the coffee Firebrand Coffee Co. but was frustrated that his visit took so long. They offered great customer service but the wait can get really long. How might we streamline this process so that Brian can order his coffee with confidence?
With the problem statement identified, I was able to define which features would be most valuable for the Platter App.
Analyze the task and put a story to it
Stories put the user and product in context
Context puts constraints on the product… which is good!
I decided to use the Kano method to categorize all the features into 3 categories: Exciters, Expected, Wants.
The Kano Method
Exciters - Features that are “nice to have” (non-essential)
Expected - Features that are expected by users based on common convention
Wants - Features that our users expressed that they wanted
We wanted to make sure that the app would give users a sense of confidence while using the app.
We conducted open and closed card sorting exercises with 10 participants to ensure that our navigation and menu categories were intuitive.
Many single branded apps do not rely on a traditional navigation schema
Users expect to be able to locate the item they want within a few taps
Users expressed that pictures often influence their purchases
Wireframes, Usability Testing, Prototype
User flows and wireframes
Brian’s new journey demonstrates how a the platter app improves the overall experience for the customer and the business.
Brian’s new user flow
The purpose of this exercise was to rapidly iterate on screen designs while making sure that the designs aligned with research findings.
(10 min) - Sketch out 3+ versions of the screen
(5 min) - Present each screen
(10 min) - Steal and Combine; Sketch out 3+ versions of the screen
(5 min) - Present each screen and Vote as a team
(10 min) Design Together
I took the results of the design studios and created mid-fidelity wireframes so that we could conduct usability tests.
Usability tests were conducted to gain insight on how users were understanding the UI and copy. Some screens were brought to a higher fidelity to give a more realistic feel to the wireframes. Users were prompted with a scenario and task.
Scenario: You are placing an order at your local coffee shop
Task: Order a Caramel Latte for Pickup
Listening to Feedback
Usability tests revealed that setting a pickup time and indicating the type of order (pickup/delivery) was introduced too early in the user flow.
“The problem wasn’t as much about the form’s layout as it was where the form lived...It came before they could actually enter the information to pay for the product.”
— Jared Spool, UX Researcher, Writer, Educator, source
Asking users to select when they wanted to pick up their order before they even placed an order was too big of an ask. By moving this screen to the checkout flow, users were able to freely navigate the app without committing to a time.
Users showed hesitation when trying to set a pickup time before picking what they wanted
Users voiced that they wanted to see more details about the product over seeing customization options
Customization options created too much scrolling
Users were delighted by the rewards points and the prospect of free items
Sketch & InVision
The result of 2 weeks of research and design. Designs were made on Sketch, Photoshop and InVision.
A completely branded experience
Colors and images can be added from the Platter CMS to allow for a branded experience
Clear labels and pricing help guide users through the app
Customize your order how you like it
Items can be added to your bag as is or after customization
Floating Action Button makes adding items to your cart easier
Set a pick up time
Customers can set their desired time in 15 minute increments
A large CTA at the bottom of the screen makes it easy to proceed to the checkout screens
Add a cookie, checkout and get a reward!
Users are presented with suggestions to add to their order before continuing to a review screen
Restaurants have the option to add a rewards program to their business. Firebrand has chosen to give back to their customers with every purchase
You can even tip your barista!
Platter is currently being developed for a small business chain in Los Angeles and Santa Monica. The next challenge is building out a CMS that will allow businesses to customize and manage the content shown on their mobile apps.
The Platter POS is being designed for use at Silverlake Ramen in Los Angeles, CA.