← All work Restaurant & online ordering

Al-Asala Restaurant

An online ordering site for a restaurant: the guest first picks how to receive the order — dine-in, takeaway or delivery — then browses the menu, builds a cart and orders, while the restaurant manages everything from an admin dashboard.

Type
Restaurant ordering site
Stack
Static frontend + Supabase
Language
Fully Arabic RTL
Fulfilment
Three methods
Al-Asala Restaurant

How it was built, step by step

1

The first question, before the menu

Most restaurant sites show the menu and ask about fulfilment at the very end. We flipped it: we ask first — dine-in, takeaway or delivery — because the answer changes the expected time, the price and the presentation, and because a guest who made a choice early tends to finish the order.

2

Identity and interface

A warm orange-to-red gradient that reads as appetite, with the Cairo Arabic typeface and light reveal animations. The landing screen carries message and proof together: an appetising dish, three short numbers about the restaurant, and one clear order button.

Identity and interface
3

Menu and cart

The menu is split into tabs (seafood, meats, vegetarian, drinks, desserts) so a guest reaches what they want in one tap, and the cart is a side panel that stays open while browsing, with discount codes and a live total.

4

Mobile before anything else

Restaurant orders mostly come from a phone, in a hungry moment — that is, with no patience. So every screen was tested on mobile first: large buttons, clear photos, and the shortest possible path from landing to a confirmed order.

Mobile before anything else
5

Admin dashboard and handover

We handed the restaurant a dashboard to manage items, prices, promotions and incoming orders, plus a separate promotions page they update themselves without coming back to us.

Want something like this?

Send your request and get a clear quote within 24 hours.

Start Your Project