CASE STUDY · PRODUCT BUILD

DINO

A two-sided platform: diners browse restaurants, book a table, pre-order by dish and flag allergens, while operators get a live table grid, guest management and a kitchen feed for the pre-orders. Built around the three things most booking tools leave half-solved: no-shows, pre-ordering and allergen tracking.

← Back to all work2025// BUILD SERVICE →

UX DESIGNMOBILE APPWEB DASHBOARDTWO-SIDED PRODUCTSTRIPE PAYMENTSALLERGEN SYSTEM

THE PRODUCT

Two surfaces, one live booking.

A diner app and an operator dashboard that stay in lockstep. The same reservation, seen two ways.

app.dinobooking.com

DINER APP

Restaurant discovery, table booking, food pre-ordering, allergen flagging.

RESTAURANT DASHBOARD

Live table grid, guest profiles, incoming pre-orders, allergen alerts.

KITCHEN INTEGRATION

Pre-orders arrive as structured kitchen tickets ahead of the booking.

Overview

A two-sided table-reservation product for hospitality operators: a consumer-grade diner app and an operator dashboard that stay in sync, built together rather than one with a back office bolted on.

The challenge

A problem everyone knows how to fix, and almost nobody fixes well.

The no-show problem isn't a mystery. When a booking costs nothing to break, some people break it, and an empty table at 8pm on a Friday is money the kitchen already bought ingredients for. A small deposit fixes the maths. The mechanism has existed for years; most booking tools just skip it, or bolt it on so awkwardly that restaurants switch it straight back off.

Dino's founder came to us with a sharper version of the complaint: the big platforms nail the booking and ignore everything wrapped around it. Diners still recite their allergies to a waiter at the table. Pre-ordering barely exists. And a surprising number of venues still run the floor off a paper diary or a spreadsheet someone last tidied up in 2019.

So the brief was two products at once, not one with a back office bolted on. A diner app that holds its own against any consumer app on the phone, and a dashboard a floor manager can grab mid-service and understand without anyone standing over their shoulder.

What was hard: building two sides at once means every feature is really two. What the diner taps and what the venue sees have to stay in sync without a beat of lag. We could have saved time with one shared interface stretched across both users. We didn't, because a floor manager mid-service and a diner on the sofa want opposite things. The part we genuinely underestimated was the kitchen: turning a pre-order into a ticket a slammed kitchen actually trusts took more rounds than we'd planned. A clean data feed isn't the same as a feed the pass believes.

What we did

Designed a diner app that does real availability, pre-order by dish, and allergen capture per dish in a single short flow. Every extra screen is a chance to put the phone down.
Built a live, colour-coded table grid for the venue with guest profiles, allergen flags, and incoming pre-orders one tap away.
Integrated a kitchen link so pre-orders land as structured tickets ahead of the booking. The kitchen knows what's coming, and what to leave off the plate, before the doors open.
Automated self-serve onboarding with Stripe-connected deposits and reminders, so a manager sets up in the gaps of a shift without a sales call.

// DINO DINER PHONE APP: TONIGHT'S AVAILABILITY IN LONDON

// DINO DINER PHONE APP: BOOKING WITH PRE-ORDER AND ALLERGENS

restaurant.dinobooking.com/dashboard

// DINO RESTAURANT DASHBOARD: LIVE FLOOR PLAN AND NEXT ARRIVALS

Live table grid with guest details, allergen flags, and pre-order status visible before each party walks in.

The outcome

Two sides of one product built together: a diner app and operator dashboard that stay in sync, each designed for the person using it.
Deposit-backed reservations and automated reminders built in from the start as the simplest honest way to deter no-shows.
Food chosen before arrival flows to the kitchen as structured tickets; allergens captured digitally per dish, replacing the verbal-at-the-door handoff. Full IP and Figma source handed over.

Tech & stack

React Native · Next.js · Supabase · Stripe

THE BETS

What we set out to solve.

Four convictions about where booking tools fall down. Each one shaped a decision in the product.

NO-SHOWS HAVE A KNOWN FIX

When there's no money on the line, some diners just don't turn up. A small deposit changes that calculus. The fix exists. Most booking tools either skip it or bolt it on awkwardly.

PRE-ORDERING IS LEFT ON THE TABLE

Letting guests choose food before they arrive cuts the wait and lifts the bill. Almost no booking platform does it well, so we made it a first-class part of the flow.

ALLERGENS ARE A REAL RISK

Allergen info passed verbally at the door is a legal and safety hazard. Capturing it digitally, per dish, before the kitchen starts prep was non-negotiable for us.

OPERATORS ARE STUCK ON PAPER

Plenty of venues still run the floor from a paper diary or an ancient spreadsheet. No live view, no guest history. The dashboard had to be better than the diary on day one, or nobody switches.

THE BUILD

How we built it.

Five weeks, four phases, from mapping both sides to a self-serve launch.

Week 1

DISCOVERY & SPRINT 0

We mapped both sides end to end: the diner finding a place, booking, pre-ordering and arriving, and the venue taking that booking, working the floor and prepping the pass. Both sides described the same problem in different words. By the time the information arrived, it was already too late to use. That became the whole brief. Get the right detail to the right person while they can still act on it.

✓ Dual-sided user flows✓ Information architecture✓ Brand and UI direction✓ Two-surface sprint plan

Weeks 2–3

DINER APP: BOOKING & PRE-ORDER

The diner app does three things together that most apps don't do even one of well: real availability, pre-order by dish, and allergens captured per dish. It all happens in a single sitting. Find a place, pick a time, set the party size, choose food, flag the nut allergy, done. We fought hard to keep that flow short. Every extra screen is a chance to put the phone down, and a booking abandoned halfway is just a no-show that happens earlier.

✓ Diner app screen designs✓ Booking and pre-order flow✓ Allergen management UX✓ Restaurant discovery and filters

Weeks 3–4

RESTAURANT DASHBOARD

The venue side is a live table grid you can read at a glance. It is colour-coded by status, with guest profiles, allergen flags and incoming pre-orders one tap away. The piece we're proudest of is the kitchen link. Pre-orders land as structured tickets ahead of the booking instead of a scribble shouted across the pass, so the kitchen knows what's coming and what to leave off the plate before the doors even open. The detail that took the most care was the allergen flag: loud enough that nobody misses it, never so loud that it cries wolf.

✓ Live table grid interface✓ Guest profile cards✓ Allergen alert system✓ Pre-order kitchen integration

Week 5

LAUNCH & OPERATOR ONBOARDING

Onboarding is self-serve by design: a manager can upload a menu, lay out the tables and add their team without a sales call or a training day. Restaurants don't have a spare afternoon for setup, so setup had to fit in the gaps of a shift. It shipped with Stripe-connected deposits (the simplest honest way to deter no-shows), automated reminders, and a plain-English view of covers, revenue per table and no-shows by night. Numbers an owner can read at a glance, not a BI tool nobody opens.

✓ Self-serve onboarding flow✓ Stripe deposit integration✓ Automated reminder system✓ Analytics and reporting dashboard

THE OUTCOME

What we delivered.

One two-sided product, shipped end to end: booking, pre-order, allergens and deposits, all in sync.

SIDES OF ONE PRODUCT, BUILT TOGETHER

A diner app and an operator dashboard that stay in sync. Same booking, two views, each designed for the person using it rather than forced into one shared screen.

DEPOSITS

STRIPE-BACKED BOOKINGS

Deposit-backed reservations and automated reminders, built in from the start as the simplest honest way to deter no-shows, not bolted on after the fact.

PRE-ORDER

FOOD CHOSEN BEFORE ARRIVAL

Diners pick dishes and flag allergens during booking. Those orders flow straight to the kitchen as structured tickets, so prep can start before the guest sits down.

ALLERGENS

CAPTURED DIGITALLY, PER DISH

Allergen data is collected at booking and surfaced to the kitchen before service. It replaces the verbal-at-the-door handoff that the operators we spoke to worried about.

HANDED OVER

+ Two-sided: diner app + admin+ Live table grid & pre-orders+ Full IP + source handed over

BUILDING A TWO-SIDED PRODUCT?

Let's design both sides.

Book a free call Explore BUILD →← View all projects