Skip to content

Food ordering | Shipped product

Eater: Food Discovery & Ordering

I designed the path from food categories and restaurant menus through item options, cart review and order status.

Food orderingFood categories · Restaurant menus · Item options
Eater food discovery and ordering app

PROJECT AT A GLANCE

The essentials.

Design scope
Food ordering
Available views
Cart and fees · Order status
Screen focus
Shipped interface
Design focus
Item choices and costs before payment
Skip to project details

KEY DESIGN DECISIONS

Item choices and cart review.

How I structured item choices and costs before payment.

01

Ordering scope

The ordering flow runs from discovery through item choices to cart review.

02

Options and instructions

I kept customization controls in the item view and brought instructions and fees together in the cart.

03

Quantity and add action

The item screen keeps quantity and the add action side by side.

Each of these decisions shipped in Eater.

Design
Question

How are item choices and order costs presented before the payment action?

Project
Design Scope

I designed these areas of the product:

  • Food categories
  • Restaurant menus
  • Item options

Ordering
Flow

How the shipped screens connect.

Food categoriesRestaurant menusItem optionsCart and feesOrder status

Pattern
review

  • Category browsing and item customization use different selection surfaces.
  • Item options appear before the cart review of quantities and fees.
  • The cart collects optional instructions and cost information on the same surface.

Discovery & Ordering
Flows

Home — Eater screen
Food categories — Eater screen
Category results — Eater screen
Restaurant menu — Eater screen
Restaurant menu — alternate view — Eater screen
Search results — Eater screen
Item details and options — Eater screen
Favorites — Eater screen
Cart and checkout — Eater screen
My orders — Eater screen
Order details — Eater screen
Transactions — Eater screen

Home

Home, the starting point for food discovery.

01 / 12

FROM THE PROJECT FILES

Inside the shipped product

Screens from the shipped product. Values shown are sample data.

Food categories

Food categories — Eater screen
Food-category tiles organize the first browsing choice. View full-size screen

Item details and options

Item details and options — Eater screen
The item view combines product information, customization choices, quantity and an add action. View full-size screen

Cart and checkout

Cart and checkout — Eater screen
The cart places order items, optional instructions, fees and payment in one review surface. View full-size screen

What I’d Change
Next

Looking back, I’d tie item options more visibly to price, so changing an option updates the cart line and total in place.