Background

Online Ordering was missing a significant feature - Google Reviews. Our competitors had it, and restaurant operators were using this as a reason to choose someone else. It kept coming up in sales conversations, so closing that gap quickly became a priority.

The feature looked simple to scope: add a prompt to the confirmation screen after checkout, let guests leave a review, give operators a way to configure it. What became clear during the project was that shipping it properly meant dealing with a structural problem in the confirmation screen that had been accumulating for a while.

Initial Confirmation Screen in Online Ordering

Initial Confirmation Screen in Online Ordering

My Role

I led the design for the full guest-facing experience, working alongside a colleague who owned the operator dashboard. As the project progressed, I also took on the channel-level configuration work.

Exploration

The first question was what form the feature should take. There are several reasonable approaches: a drawer that appears over the confirmation screen, an inline section embedded within it, a popup, or a flow that asks for a star rating first and routes users to Google based on their answer.

That last category was eliminated early. Showing the Google review link only to users who indicate they're happy first is called review gating, and it's prohibited under Google's own terms, UK consumer law, and several other regulations. Any approach that filtered users before showing the review link was off the table.

I used Figma Make to generate a broad set of concepts across the remaining options rather than developing a small number of ideas manually. The output helped identify which patterns were worth pursuing and which weren't, faster than conventional sketching would have allowed.

Initial AI-generated concepts

Initial AI-generated concepts

The drawer solution looked strongest at this stage. It doesn't touch the confirmation screen layout at all, and the same component could be reused across other platforms, like Pay at Table, Open Check, and the mobile app, without needing to redesign it for each one.

I generated a more detailed concept for the drawer with configuration and component states in mind.

Detailed drawer concept generated with configuration options

Detailed drawer concept generated with configuration options

Why the Direction Changed - and What I Found

As the team discussed options, inline placement became the preferred direction. The reasoning was grounded in real data: inline elements on post-completion screens perform better than overlays, and popups specifically carry a bounce rate disadvantage that works against driving review clicks.

Asset 4a.png

Before we committed to that, I looked more carefully at the confirmation screen itself.

The screen had no clear visual hierarchy. The order number sat at the top, delivery time appeared mid-screen, the primary CTA button was placed between content sections, and the delivery address came after it. There was no logical grouping, no clear reading order. This was a manageable problem when the screen had one action on it. Adding a Google Reviews prompt inline would put two calls to action on a screen that couldn't support one cleanly. Users who had just completed an order and needed to understand what happened would instead be navigating a cluttered layout with competing elements.

Shipping the feature this way would technically close the commercial gap while making the product harder to use, which would need fixing later anyway.