Online Food Ordering White Label

Brooke Kao
Jan 24 · 6 min read

My role: Support, then Lead Designer

Team makeup: Eric, Chris, Tamar, Aalap, Frank, Janna, Nora, Olesya, Doug. A majority of the team was remote.

What I did: Lead and mentored on user research best practices, lead Design Thinking workshops, interaction design

Olo’s online food ordering experience serves millions of people each day. Think the “enterprise-grade” restaurants: Wingstop, Applebees and Five Guys to name a few. Customers order online at these restaurants for different reasons. By the time I joined Olo, the team had embarked on a responsive redesign of the web app experience. However, little had been done to gain an understanding of its users. The last research session had been done two years prior.

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Online Ordering web app: the “Before”
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post

Making Research Table Stakes

For me, investing in user research is an absolutely critical part of product development. For the rest of the team, they understood it was important, but it wasn’t immediately clear how to make it a part of their process.

My first task was to establish a research cadence that was least disruptive to team’s current workflow. My team had already created a project plan with important epics mapped out. It was a matter of finding proper lead time to get user validation before implementation started.

Image for post
Image for post
Image for post
Image for post

It was also very important to get an upfront budget approved — company funds had not really been spent on user recruiting.

Image for post
Image for post

Taking the lead, quickly

When I came to take the lead on the project, it was a time where engineering was moving full speed, and deadlines were coming up, fast. I knew I’d be making tradeoffs in the process. I chose to focus on making sure the next epic was ready to be implemented: checkout. It wasn’t clear to me what aspects of the epic were nailed down and vetted, or what yet to be explored. How I got up to speed:

  • Familiarize myself with our clients. We work with the corporate heads of restaurants to get their online ordering off the ground. As a white label, it’s a major challenge respecting the needs of individual, high paying clients with the needs of everyone else. I had conversations with several key brands to take their pulse on the direction of their ordering UIs.
  • Reviewed client asks with product. We talked about the problem the client was trying to solve, and thought about the potential user impact it might have. Additionally, we sanity checked these client requests with available data we had on feature usage. For example, clients had asked about more features and support around splitting payment for an online order. Data told us that less than 1% of our user base used split payments at all. Leveraging data was key to letting us prioritize an immense amount of requests.
Image for post
Image for post
  • Outlined some critical questions and assumptions we were making with engineering. Work had been done by the previous designer already to redesign the experience. My priority was to get the team’s sense of what areas in the design were “boulders”.
Image for post
Image for post
  • Explored these questions and assumptions with end users.
Image for post
Image for post

Collection of learnings

Through initial solution testing, and more focused testing on upcoming epics, we became aware of issues that had surfaced with our redesign:

Be really explicit about what is and isn’t available. A lot of content in our ordering platform is shown or hidden based on business preference: for example, pushing users to opt for delivery and reducing visibility for in-store pickup. However, that lent to the impression that these “hidden” features weren’t available.

Don’t let splashy visuals get in the way of utility. One big team the team has agonized over is the degree of customization we offer to our brands. For example, we looked for more opportunities to use photo-based stylized headers to jazz up the look and feel, as opposed to plain text headers. However, we found that users quickly scrolled past these stylized headers, missing the title of the page altogether.

Image for post
Image for post
Image for post
Image for post

We haven’t scratched the surface of our user groups. Throughout user testing, we learned a lot of about attitudes toward online ordering: some are in it for rewards discounts, others because they don’t want to leave the house, others to order quickly for a big group gathering. I would have liked to explore and make sense of these behaviors so that we’re laser-focused identifying what success looks like for these groups.

Nailing down the logic

Following the usability testing, I had an opportunity to iterate on our product decisions. I first paired with a team member to generate ideas.

Image for post
Image for post
Image for post
Image for post

As a larger team, we drilled down into each view to map out the logic. Another challenging aspect of a white label was identifying areas where clients could configure and change the copy, content and appearance of their ordering UIs.

Image for post
Image for post
Image for post
Image for post

The Solution

Image for post
Image for post

Impacts

From a business standpoint, the main motivation behind this redesign was to combine our mobile and desktop code bases. In that regard, by getting this project off the ground was already a huge win.

At the same time, there had been a long-standing list of painful metrics that we wanted to overcome. We hope that we can:

  • Reduce number of mistake orders made
  • Reduce number of order cancellations and refunds
  • Drive customers to be more loyal to the brand
  • Most importantly, increase purchase converstion

From a design standpoint, I got us thinking about how we approach UX at Olo and how we share work across teams. In the time that I was leading two projects, I also worked with the UX team to develop the foundations of Skip, our Design System.

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post

Suitcase Words

Stories of Brooke Kao's work on research, design and finding the why.

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store