DISCOVERY.
BRAND × DIGITAL PRODUCT

Mishwar identity design
and the trip booking experience.

A case study on how we brought together the visual identity and the user experience into a single flow that shows dates, prices and seats, then prepares the booking request over WhatsApp.

See the booking experience
Client
Mishwar
Scope
Identity and booking experience
Main deliverable
Interactive booking prototype
SCROLL
Project overview

From scattered details to a clear booking experience

Mishwar's trip details were scattered across posts and chat threads, and every customer had to ask about the date, the price, the route and the seats before deciding. So we designed the identity and the booking experience as one system that makes the trip clear and sends the request in a few steps.

01
The challenge

Show the trip programme, the price, the route and the available seats in one place that is easy to read.

02
Our role

Brand strategy, visual identity design, user experience design, and building an interactive booking prototype.

03
The response

A distinctive local identity and a light digital product that organises the information and passes the booking request to WhatsApp.

04
Deliverables

A logo, a colour system and usage rules, alongside a trip calendar and a booking experience you can test.

BeforeDetails spread out, the same questions with every booking.
AfterAn experience that shows the essentials before the chat opens.
The booking experience

We put trip details and the booking request on one screen

The prototype inside the phone is live and open to try. It shows two months of trips, the details of each destination, the price and the seats left. When someone picks a trip, the system builds a ready WhatsApp message carrying the booking details.

A traveller browsing the Mishwar booking system on his phone at a coastal station
THE BOOKING MOMENTThe real booking interface inside the scene

The phone screen shows the real Mishwar calendar running from the prototype itself, not an interface drawn into the photo.

The information before WhatsApp opens

The calendar shows which days are open and which are full, and each card gathers the route, the price and the seats left.

A clear notice when seats run low

An «only 4 seats left» notice appears automatically, while a full day sends the user to the waiting list.

Fast and light

The whole experience runs in a single HTML page; the application logic is about 23 KB, with no external requests after load.

Pick a day marked in orange and follow it through to the WhatsApp message Open the booking prototype in a separate window ↖
Operating reality

We designed the booking around the user in Syria

Internet connections can be weak, online payment gateways are not reliably available, and conversation is still the main channel for building trust. So we chose a light page, local payment options and a ready WhatsApp message rather than forcing a new account and a payment path that does not fit the reality on the ground.

01
Local payment options

The user picks Sham Cash for a direct transfer or Al-Haram to pay at a branch before sending the request.

02
WhatsApp instead of a new account

We ask for no new account: the chosen trip turns into a clear message that reaches the operator, who completes the booking.

03
A light page for weak connections

After the first load, the fonts, the data, the graphics and the interaction logic all stay inside the same file.

04
Dates that update automatically

The calendar updates its dates and Arabic month names, so the prototype stays testable as time passes.

An example of the ready booking message: «Hi, I'd like to confirm my booking 🚌 — Trip: Mishwar Wadi Qandil — Date: Tuesday 21 July — Seats: 3 — Total: 1,650,000 SYP — Payment method: Sham Cash — Name:». The user adds their name before sending.
Logo design

We drew «mishwar» as a road that leads to a destination

We started from the name itself, drawing the wordmark by hand instead of setting a ready typeface or reaching for a conventional travel symbol. The letters join into one path that starts at a point and ends at a destination, so the meaning of «mishwar» — an outing with a destination — becomes part of the mark.

م — the startA fixed point: where every trip begins.
ش — the mountainsThree peaks, the middle one taller, drawn from Mount Qasioun.
و — the bendA curve taken from the road changing direction.
ا — the road markerA vertical stroke that works as a marker along the route.
ر — the arrivalDashes fading towards an orange point: the destination.
Brand distinction

We avoided the usual travel symbols

A visual audit of travel brands showed the same symbols repeating: the aeroplane, the globe, the map pin, the suitcase and the compass. We ruled them out and built Mishwar's character from the name, the road and the destination, so the brand is easier to remember and less like its competitors.

Aeroplane
Map pin
Suitcase
Colour system

We tested the colours on the mark and in use

We tried 24 colour sets on the main wordmark and on the badge — 48 visual tests in all. Three samples here represent different directions, followed by the approved set, chosen after comparing legibility, contrast and how the brand holds up on screen and in print.

Taxi
Sea and sun
Damascene mulberry
Approved — lemonade on teal
Why did we choose this set?

The final set brings teal, lemon yellow and earthy orange together on a light sand background. These colours read clearly and feel local without slipping into stock tourism imagery.

A colour system that is easy to apply

Yellow on the teal background carries the main interfaces, while teal lettering on sand carries print and quieter spaces.

Mishwar identity applied to a bag, a cap and travel cards
IDENTITY IN USEHow the identity shows up in daily use

Mock-ups showing the logo and the colours on fabric, travel cards and small printed items.

From brand to product

We turned the mark's language into booking components

We did not stop at placing the logo in the interface. The same road idea shows the stops along the trip: a continuous line, dashed segments, and a bend that ends in an orange arrival point. That makes the booking experience a natural extension of the identity.

BRAND — the wordmark
PRODUCT — the Wadi Qandil route
Damascus Homs Latakia Wadi Qandil
The same stroke weightThe same dash patternAn orange arrival pointA clear bend for long routes
Scalability

A design structure that extends with new programmes

The identity does not stop at the logo. We drew five icons to classify destination types, alongside components and usage rules that can be reused on future trips and screens without losing consistency.

Mountains
Coast
Steppe
Old towns
Countryside
79
files in the design system, covering the colours, the components, the rules and the calendar template
14
React components for forms, display and alerts, built in Mishwar's visual language
7 + 8
seven PNG versions of the logo, plus an eight-page PDF for print and presentation

Note: we built the design system to grow out of the approved logo, and documented the rules that hold it together when new components are added.

Handover

We delivered a usable identity and a working prototype

The handover covered print-ready and web-ready identity files, usage rules that hold the work together, a design system built to grow, and an interactive booking prototype showing how the brand turns into a digital product.

A group of friends arriving by local bus at a mountain viewpoint over the coast
FROM SCREEN TO DESTINATIONFrom the booking screen to the trip itself

The value shows when someone moves from searching and repeated questions to a clear decision and a ready booking request.

Does your business need a clearer digital experience?

If your operations run on repeated questions and manual work, digitisation can cut out steps and improve the customer experience.

Talk to us about digitising your project ↖