# Restaurants list for less. Diners order nearby.

Comiida · restaurant listing app for Colombia, client work

**Handed to developers for production** · The case stops at handover

Comiida was designed to give restaurants in Colombia their own way to sell. A diner finds a place close by, then orders or books a table. They pay, follow the delivery and rate the meal. A web portal and social designs came with the same project.

## The problem

1 delivery app held the market, with high fees to list and to deliver.

## What changed

- Restaurants pay little to list and deliver for themselves
- 2 journeys designed end to end, the owner's and the diner's
- Real owners tried it, and actions, wording and flows changed

## The result

Finished on a tight deadline, with marketing under way during the build · Digital product designer: research, UX and UI

## Tab by tab

### Listing

Nearby first, on equal cards.

- Relevance: time and distance on every card, for diners nearby.
- Comparison: the same facts for all, so small places can compete.
- Effort: Sort and cuisine chips sit above the list, 1 tap each.
- The home list: Restaurants near you, 125 restaurants, Sort and cuisine chips, then Italian House on its card, with its price for 2, offer, rating, time and distance. Beside it, the top of the home screen: a search, cuisines as photos and an offer banner.

### Restaurant

A whole shop on 1 page.

- Certainty: status, time and rating sit on top, before any scrolling.
- Reach: Reserve Table is a tab like Order, so seats sell too.
- Effort: Veg only cuts a long menu in 1 tap, with search beside it.
- A restaurant's page: an Open status, its rating and time, then 4 tabs: Order, Reviews, Gallery and Reserve Table. Beside it, Reserve Table: guests, a date, a meal and a time slot.

### Checkout

Every extra has a price.

- Clarity: each dish shows its price, then its add-ons, before any total.
- Reward: a coupon field sits above payment, with offers beside it.
- Choice: cards, net banking or cash on delivery, so payment never stalls.
- The cart: each dish with its price and its add-ons, a coupon field with View offers, then saved cards, net banking and cash on delivery. Beside it, a dish's options: every sauce and size with its price, even at $0.00.

### Delivery

The wait becomes a number.

- Trust: each restaurant sends its own driver, so the map shows a face.
- Progress: Arriving in 10 Minutes and a bar, so nobody has to ask.
- Honesty: a tag says No Live Tracking, before you order.
- Order tracking: a status line, the driver on a map with the route, the minutes left with a progress bar. Lifted out of the list, a restaurant card's photo with a No Live Tracking tag.

### Feedback

Reviews an owner can act on.

- Effort: stars, then choices to tap, so a rating needs no typing.
- Specificity: from cleanliness to value, an owner sees what to fix.
- Return: Reorder sits beside Rate Food, so 1 meal leads to the next.
- The rating screen: stars, What did you like with 6 choices to tap. Over it, an order's Rate Food and Reorder buttons. Beside it, a restaurant's reviews with scores for cleanliness, comfort, location, value for money and staff.

### States

No screen ends in a dead end.

- Recovery: No Results and an empty cart end in Browse Restaurants.
- Clarity: 1 line says why the screen is empty, then 1 button.
- Consistency: 1 drawing style across states, a red line on rings.
- 5 screens play in 1 phone: Loading, Results, Order placed, an empty cart and No results. The last 3 share a red line drawing on soft rings, and each has 1 button: Track Order or Browse Restaurants.

### Handover

A file built for developers.

- Findability: screens numbered and named in flow order, so any one is found fast.
- Specs: colour ramps with hex codes and 10 named text styles, no guessing.
- Reuse: 16 core screens use 38 components, so 1 fix reaches all.
- The Figma file, 1 sheet at a time. Screens: 48 numbered screens by flow. Design system: 7 colours by job with hex codes, 2 ramps of 10 steps, and Poppins by job. Components: the restaurant card and buttons by job. In its 16 core screens, 321 of 392 text layers use a named style, and 212 instances come from 38 components.

## In their words

"He consistently delivers on time often ahead of schedule and his professionalism is unmatched." Carlos Arias, Founder, Medellin.co.

Page: https://www.surinder.design/work/comiida