Lia Yue

Muncho

Contactless QR code ordering and payment services.

— PRODUCT

Muncho.io


— ROLE

Product Designer


— YEAR

2020


— STATUS

Shipped


Muncho was born in the middle of COVID-19 pandemic, aiming to help restaurants safely reopen by offering contactless QR code ordering and payment services. I worked as a product designer in the international teams, collaborating agilely with the company founder, product team and development team across the entire product cycle. We have gained more than 4,000 new users within the first 2 months we launched the product in Davis, helping local restaurants increase online orders by 10-15%.


Collaboration: Conducted user research with the founder; Defined product strategy and UX flow with product manager; Led UX design and UI design; Developed branding with another designer; Created prototype and ran usability testing by myself.

The Problem

Restaurants face new challenges to safely re-open their business under the COVID-19 social distancing regulations.


COVID-19 hit hard on the local business. Restaurants that hardly survived from the lockdown now are facing a big new challenge to safely reopen for outdoor dine-in services. Customers are looking for a safe and innovative way to eat outside. 

Restaurants setup dine-out spaces in downtown Davis

The Solution

We help the restaurants to increase their sales by offering contactless QR code ordering and payment services.

QR code ordering decreases the chance of contacting and increases labor efficiency.

The Process

Initial Research

Understand customers’ fear and concerns of dining out and balance business owner’s needs.


As the only product designer in the US office, I planned the initial user research and conducted it with the leadership. 

We chose quantitative approach over qualitative to collect richer and more insightful information. 

We conducted 10 interviews with local restaurant owners to understand their business performance and 15 interviews with customers who use food ordering apps on a daily basis to reveal their motivations and behaviors.

Guerrilla research in Downtown Davis

Key Insights

Key insights from the restaurant owners:

• Slow business requires labor reduction.

  • • Limited outdoor seating requires fast table turnover rate.
  • • Extra work for customer retention.

Key insights from the customers:

  • People are afraid of the unqualified sanitation condition in the restaurants.
  • Less contact with the waiters or waitresses would be ideal.
  • Having photos on the menu can help customers to quickly make decisions.

Reframe the problem

How can we redesign the ordering and payment system to help customers feel safe and quickly place orders in order to increase the restaurant's table turnover rate with fewer employees?

Ideation

A contactless ordering and payment services to relieve customers’s concerns.


In order to solve restaurants’ problems we need to focus on Customer's feelings and needs first.


Challenge 1: How can we reduce the contact between customers and restaurant servers? 

Design Decision: Generate the menu on the mobile website which can be pulled out from an easy QR code scan. 


Challenge 2: How can we help customers quickly make order decisions?

Design Decision: Display photos on the menu. (Studies found that seeing a picture of an item that looks good will likely influence choice.)


Challenge 3: How can we increase the table turnover rate?

Design decision: Allow customers to process the order and payment on their mobile phone instead of waiting for the servers to walk back and forth. 


Challenge 4: How can we help restaurants handle customer retention?

Design decision: Collect registered customer’s order behavior data and send monthly business performance report.


For the MVP, I focused on simplifying user experience to easily on-boarding users. I discussed with the leadership to identify product direction, worked closely with the product manager to define product features, and negotiated with the development team to make sure we are on the doable track.

view a high-res wireframe.pdf here

Refine the product

In order to learn fast, we fail fast. We rapidly build the product to test in the market, getting feedback from the customers to continue refining our product.

Initial Prototype

Usability Testing

I planned and drove the usability testing by interviewing 15 people through zoom meetings and in-person observations to find out what we have failed with the current built in order to continue refining our product for a better user experience. 

Online Usability Testing through Zoom and Figma

Failure #1

“Map Mode” causes confusion and reduces order placing time.

Over the 30 people we interviewed, 80% of them clicked the “Map mode” icon and got confused about what it was. Some people understood it as a “send a message” or “order location” icons which took them extra time to go back to the “List View Mode.” 

Design Decision

The visual of the “Map Mode” plays a CTA button, in order to less attract customers’ eyes, replace the icon position and use grey color instead. 

Failure #2

Coupons are confusing.

Coupon was our marketing strategy to help restaurants increase sales. However, over 50% of the people were confused about the coupon, such as “how to claim the coupon?” “What do the color codes of the coupons mean?” “It’s very annoying to see so many different kinds of coupons.” The good feedback was that 100% of the people say they are more likely to place an order with items with promotion if they don’t have a specific food preference. 

Design Decision

Simplify the visual presentation of the coupons and apply the sale price right on the item itself. 

Failure #3

Order list lacks arrangement.

80% of the people we interviewed felt confused after placing the order. They expected to see the order they just placed only. Having all the past orders listed below creates confusion.

Design Decision

Separate current orders and past orders. Makes in-process orders visually attract more attention.

Failure #4

Lack of QR code knowledge in the market.

QR code is  widely used in Asia’s market, but now here. 30% of the interviewee says they rarely have the habit to scan the QR code and don’t know which app to use to scan the code. It’s our challenge to educate people how to use our product.

Design Decision

Simple and easy to understand visual instructions to guide customers to use our product.

A customer was interacting with Muncho at Restaurant in Sac, CA

Execution

Based on the feedback after several usability tests, we improved our prototype and product spec and shipped them to the development team to implement. 

Learning

  • Get involved in User Research and Usability Testing is the key for product designer to empathize users better. 

  • Talk to unexpected experts.


More

If you live in Davis and Sacramento areas, check out our product on your mobile devices @yuehuang.muncho.io


Learn more about our product @muncho.io