Skip to content
herosmith
Heroes / Food & drink / Coalyard
Coalyard Flat Lay design

Design brief

Why it works.

Hungry people want to know what you make, how fast it's ready and how to order. Show the food on the table, promise the pickup time in the headline, and put Order for pickup in the middle of the screen.

Why this layout

  1. 01

    A top-down table of real food says pizza before a word is read, and the clear middle keeps the promise and the CTA in focus.

  2. 02

    The pickup time is in the headline (Ready in 18 Minutes.) because speed is what pickup customers choose on.

  3. 03

    The nav lives on the order pad, so the page needs no header bar; tonight's deal runs in the orange strip on top.

Fits

  • Pizza, burger and taco shops
  • Takeaway and pickup-first restaurants
  • Bakeries and delis with photogenic products

Not for

Fine dining or booking-first restaurants

Try instead: Table Card

You'll need

  • 4–6 top-down cut-out photos of food and tools
  • A top-down table or counter photo
  • Blank paper props (order pad, receipt, notes)
  • Tonight's deal, pickup time and phone

Connects to

  • Orders Square Online, Toast, Uber Eats storefront or Shopify: the CTA opens pickup ordering EASY
  • Calls tel: links EASY

Works as HTML, Webflow, Framer, WordPress.

Measure

Order for pickup clicks and calls per visit

More heroes

All heroes →
Get the code