Mottasl – Unified WhatsApp CPaaS Platform

Marhaba – WhatsApp based Ordering Menu

Marhaba is a digital platform that streamlines restaurant operations with tools like interactive menus, QR codes, and analytics.

Twerlo
Mobile App
Marhaba
2022

Introduction: The “Marhaba” Project

Marhaba is a white‑label food ordering app that lets restaurant customers in Saudi Arabia quickly order delivery, dine‑in, pickup, or car pickup from a single, branded mobile experience.
The app connects directly to Fooder’s digital menu and WhatsApp infrastructure, so every order is structured, trackable, and easy for branches to fulfill across busy cities in the MENA region.

Business Context & My Role:

I worked as the end‑to‑end UI/UX designer on Marhaba. I was responsible for:

The Problem:

Before Marhaba, the customer journey looked like this:

For busy diners in Saudi Arabia who are used to frictionless mobile experiences, this felt slow and confusing. Restaurants were also missing out on structured data like order history, favorite items, and clear feedback scores.

Design challenge:
Create a mobile app that keeps Fooder’s WhatsApp‑first foundation, but gives customers a seamless, app‑like ordering experience with clear steps, fewer errors, and better visibility on the status of each order.

Goals & Success Criteria:

From day one, the design goals were:

  • Reduce friction in ordering:
    Make it possible to go from “open app” to “order placed” in a few focused steps, even for first‑time users.

  • Support multiple order modes:
    Handle delivery, dine‑in, pickup, and car pickup with one consistent UX pattern so restaurants can adopt new modes without redesigning every time.

  • Improve accuracy for restaurants:
    Ensure that the app sends structured orders (items, modifiers, branches, times, addresses) that map cleanly into Fooder’s dashboard and existing kitchen workflows.

  • Increase repeat usage:
    Make it easy to log in, see previous orders, reorder favorites, and feel confident about delivery time and status.

Design Process

Understanding Users & Constraints:

I started by mapping two primary user types:

On the technical side, I gathered constraints around:

This helped define a flow that feels familiar to users in Saudi Arabia and the wider Middle East, while still staying compatible with existing systems.

Defining the Ideal Flow:

From there, I designed one clear, linear journey:

Each step is supported by a dedicated screen, a single primary action, and contextual feedback so users never wonder “what now?”.

Key flows and UX decisions

Onboarding with WhatsApp:
Home & Menu Experience:
Order Type & Time:
Address Selection & Delivery Coverage:
Checkout & Payments:
Order Tracking & Rating:

Visual Design & Localization

From a visual standpoint, Marhaba uses a clean, light interface with strong accent colors for actions and alerts. Food photography takes center stage, supported by plenty of white space for readability on smaller screens.

The UI is designed with localization in mind: it works in both English and Arabic (including RTL layout), uses regionally familiar iconography, and displays currency and time formats that match customer expectations in Saudi Arabia and the GCC.

Impact & Results (How I present it):

Depending on what numbers you can share, here is how I frame the impact:

Even without exact figures, the case study demonstrates how thoughtful UX across onboarding, ordering, and tracking can directly support restaurant revenue and operational efficiency in a WhatsApp‑first market like Saudi Arabia.

Close

End-to-end design from research to production-ready handoff.

Let’s have a Call

+91 9747 957 819

Email me at

hello@ahmedansaf.com

Connect VIA

LinkedIn

WANT IT TO SOUND PLAYFUL, LUXURIOUS, OR MORE/