Beep

Case study rethinking the group ordering for a food delivery app

UI/UX Design
Strategy
Goal
Redesign an existing food delivery app with group ordering features that fits in the current context
Process
Ideation, user flows, wireframing, high-fidelity mockups and prototyping features
Timeline
Aug-Sept 2020
2.5 weeks

Full article featured on UX Collective publication at Medium.

Problem

It’s lunchtime in your office. The sun is blazing hot outside, your stomach rumbles and the notion of simply staying in grows increasingly palpable amongst you and your colleagues. Then suddenly, some enlightened colleague blurts out––“Hey, do you guys want to order food from X?”

Everyone puts off their work in abrupt relief, as a group naturally forms to discuss what food/restaurant to order from, the delivery wait time, the promos that seem promising and even an informal voting process ensues.

10 minutes later, the restaurant is finally selected. Everyone starts browsing the menu on their own phones as the person who suggested the idea for food delivery regrets as he is unceremoniously chosen to be ‘the waiter’ responsible for getting everyone’s order right, checking the delivery time and hearing the most unpleasant phrase–– “Thanks for ordering! I’ll pay you later, just let me know how much.”

Choosing restaurant
Manual group process of determining which restaurant/food
Clunky ordering
One person is assigned to do the ordering for everyone
Checking delivery time
One person is assigned to check on the delivery time
Manual payment
One person receives manual payment from everyone
Rewards & ratings
One person receives all reward points and gives restaurant ratings

Users

It’s clear that the problems are burdensome for the assigned individual to handle everybody’s orders. But how can we better improve this? Let’s take work colleagues as an example persona to map out the basic process of ordering via most food delivery apps:

Users

Understanding the key steps in the delivery process gives emphasis to designing important screens and solving these problems within the app. At the same time, it was important to consider the aspirational needs for launching a new feature for the users.

Key priorities and principles
Democratised
Everyone plays their part in making the order work seamlessly
Simple/unobtrusive
Fits in with existing user flow, not just new and shiny features
Reducing effort
Takes away the manual handling and responsibility for one person

With these building blocks in place, it was easier to craft a defined goal that would be a natural add-on to the existing app. The goal should be simple enough to resonate with anyone and easy to refer throughout the exercise:

To create a seamless group ordering experience in an existing food delivery app service.

Solution

Before jumping into some ideation magic, I only had a specific problem with no particular app in mind. I decided to select Beep — a new food delivery service from StoreHub that takes a smaller commission % from local restaurants than the established players in the market.

User flow mapping

The first step was studying Beep’s current user flow/logic to understand the users’ decision-making process in ordering food. Next, I added a layer of group-ordering sequences that fits into the platform.

Wireframing interactions

Using my trusty whiteboard, the next process was making sense of the flow on a user-to-screen level. The goal was to introduce group ordering in a visible and non-invasive way & establish confidence in each step.

Other considerations

Once the wireframes were complete, it validated the technical assumption of solving the group ordering problem with the app as the middleman. This means users do not need to manually sort choosing restaurants, food and payment! Other questions that arise during this process were:

  • Multiple user views: what does the initiator vs. the group see on-screen?
  • Simple invites: how can we easily invite people to a group order?
  • Social features: how can we make this an enjoyable social experience?

After that, I couldn’t help but develop a new UI visual language for Beep!

Introducing the new Beep!

Add contacts to group order
Extend invitation to your colleagues, friends and family to the same order
Vote for restaurants
Democratic voting for restaurants with in-built timer, no more indecision!
Pay individually
Process payments, rewards and ratings separately for each person
Home: start a new group order anytime

In the new home and restaurant/menu screens, the ‘group order’ buttons are designed to be non-intrusive yet still grab your attention to try out the new feature. The home screen is designed to better showcase food selection.

New group order: invite your existing contacts easily

Utilising existing contacts from your phone, you can simply find your friends & family who have verified payment accounts on the app to share an order. The delivery location is confirmed before sending out the invites. A little confetti interaction signifies everyone is now together in a group order.

Restaurant voting: make it easy, fun & democratic

A new social feature is helping to solve the issue of choosing a restaurant. Admins can choose 2–3 max. restaurants as options for the group to vote. The restaurant is chosen after everyone votes or the timer runs out.

Ordering: order for yourself & see orders from everyone

The ordering process is no different than ordering for yourself, which reduces cognitive load for the user and solves the ‘assigned waiter’ situation. What’s new is seeing what others are ordering to inspire your choice.

Payment: everyone pays for their own meal only

One of the biggest hassle in a group order is collecting payment from everyone. The app simplifies this by organising payments by individual orders, so the bill is automatically split.

Complete: everyone can check the food delivery status

Once everyone is complete with paying for their orders, a prompt screen appears to confirm your delivery address one more time. Everyone in the group can see the delivery status, not bothering one poor person anymore.

Learnings

Food delivery marketplaces are ever-evolving with substantial financial backing for market dominance and maximising network effects. In a world where the cheapest price and best promos win, perhaps redesigning scenarios users face daily may contribute the best product for everyone long-term.

  • Leverage in-app features: complex problems do not always need complex solutions. By utilising what exists like users’ contacts to invite, basic payment and menus — this helps eradicate 80% of the issue at hand.
  • Urgency can be exciting: group orders is a social activity so implementing a timer and voting mechanism creates a fun, collective experience.
  • Inform when it’s a group/individual process: inform users when the entire group is required to progress the next step, e.g. voting for a restaurant, ordering and paying before delivery etc.
Back to homeNext: Sedunia