Mama Mia
A mobile-first digital menu for Mama Mia Restaurant at Levy Mall, Lusaka, built so guests can browse, search and decide in seconds.
01Overview
A menu that lives on the guest’s own phone.
Mama Mia serves a wide menu of breakfasts, shawarmas, burgers, pizza, grills, shakes and more across 16 categories. I designed and developed a responsive web menu that makes all of it fast to browse on a phone, while still working beautifully on larger screens.
02Why digital
Supplementing the printed menu.
- Always current. Prices, specials and dishes are stored in a database (Cloud Firestore) rather than on paper, so updates don’t require reprinting.
- Faster decisions. Search, category shortcuts and sorting get guests to the right dish quicker than flipping pages.
- Richer information. Photos, ingredients, alternative prices and popularity signals sit right next to each dish.
- Scan and browse. Guests scan a QR code at the table and the menu opens in their browser. No app to install.
03Approach
Mobile first, thumb friendly, appetite led.
I started from the phone: a compact header with the restaurant’s live open status, a time-aware greeting, and a prominent search field. A horizontally scrolling category rail with photo tiles replaces long lists, and large tap targets keep everything reachable with one thumb.
The dark, warm palette with gold accents keeps food photography in focus. On desktop the same components re-flow into a wider editorial layout with a featured-dish carousel.
04Key features
Built around how guests actually order.
Live open status
Shows whether the restaurant is open and until when, based on its opening hours.
Dish & drink search
Instant search across the whole menu from the top of the page.
16 visual categories
A photo-tile category rail, from Breakfast to Freshly Squeezed and Softies.
Today’s specials
A featured-dish carousel with price and a direct “View dish” action.
Popular picks & badges
Popular, Hot and Best labels highlight crowd favourites.
Sorting
Sort the full menu by price (high/low) or by most liked.
Dish detail sheet
Photo, category, ingredients, alternative prices and like count in a bottom sheet.
Likes & order list
Guests can like dishes and add items with quantities to their order.
Contact & location
Opening hours, location and tap-to-call details in the footer.
05Gallery
Screens from the live menu.
All screenshots captured from the live site at mamamia-menu.web.app in October 2026.
06Outcome
Live and serving the full menu.
The menu is live at mamamia-menu.web.app, covering every category from breakfast to drinks. Usage analytics aren’t published here.
Next project
Epitome