Skip to main content
MAFT Studio.

CONCEPT DESIGN

Four screens to book a haircut.

A four-step booking flow reduced to one screen, with availability and the running total visible before confirmation.

Subject: Qamra Barbers, an invented barbershop on Al Reem Island, Abu Dhabi.

The brief we set ourselves.

Pick a service, next. Pick a barber, next. Pick a time, next. Enter your details, next. Each step is an opportunity to leave, and the price is not visible until the end, which is where people discover they were booking something longer or dearer than they meant to.

The flow is usually defended on the grounds that it is simpler per screen. It is, and it is also four times as many chances to abandon, measured against a decision the customer had already made before they arrived.

This concept keeps every option the four-step version offered and puts them on one screen with a running total. The only thing left to click is the one that confirms.

It is built as an asymmetric split: the room takes the right side at full height and the type sits in a leather-dark column beside it, with the day's chairs running along the bottom as a brass ticker. An earlier version made the whole homepage a departure board, which was a good idea about booking and a poor advertisement for a barbershop, because nobody chooses where to get their hair cut from a timetable.

THE WORK

What the frames show.

01 / LandingConcept design. Fictional business.
Concept barbershop homepage with the room on the right and today's slots as a ticker along the bottom

The room takes the right of the page at full height, the type sits in a dark column beside it, and today's chairs run along the bottom as a brass ticker instead of a table.

02 / The whole booking, one screenConcept design. Fictional business.
Concept booking screen with service, barber and time in one grid beneath a photographic banner

Under a banner of the room, service, barber and time sit as one grid with the running total on screen throughout, replacing a four step wizard without removing an option from it.

03 / Booking, mobileConcept design. Fictional business.
Concept mobile barbershop screen opening on the room with a pinned next-available bar

The phone opens on the room, then lists today's chairs, with the next free slot and its action pinned to the bottom in brass.

DECISIONS

The three that matter.

One screen, three choices

Service, barber and time side by side. Changing one does not lose the other two, and the whole decision is visible at once.

The total is always on screen

It updates as choices are made and add-ons are ticked. Nobody reaches the last step and discovers a number they did not expect.

Availability is stated, not discovered

Unavailable slots are struck through rather than hidden, and each barber's week is shown. Absence of information is what sends people to the phone.

What this would mean for your site.

A concept for a company this size is only worth publishing if the thinking survives being scaled down. This is the part that does.

  1. 01Every quote or booking flow has this shape: a clinic adding treatments, a contractor scoping a job, a venue adding extras. The question is always whether a step has earned its place.
  2. 02Abandonment is measurable per step. Knowing which screen loses people is the difference between rebuilding a funnel and fixing the one part that is failing.
  3. 03A paid campaign pointed at a leaking funnel is buying the leak. This is where landing page work and ad spend stop being separate line items.

ABOUT THESE CONCEPTS

Every business in this section is invented. Sadara Clinic, Qamra Barbers and Sabkha Coffee Roasters do not exist and are not stand-ins for clients. Their names, prices, opening hours and locations were created for the exercise. Nothing here is client work, a proposal or evidence of results. Every visible asset was made for this exercise, and no real company identity appears in the designs.

NEXT MOVE

Rather see this thinking on your own site?

Tell us what yours has to do and we'll say where we would start.