Concept build · 2026

Three branches, and never the wrong stylist offered.

Build story

The Éclat concept site homepage - a full-bleed beauty portrait behind the headline 'Beauty that holds', with Book an appointment and Explore treatments buttons.
Éclat doesn't exist. The three branches underneath it are the part that does.

Role

  • web
  • design
  • build

Stack

  • HTML
  • CSS
  • JavaScript
  • Cloudflare Workers
The problem
A salon with branches in three cities doesn't need three websites. It needs one booking flow that never gets the cities confused - offer a treatment the Dubai room doesn't run, or a stylist who's actually across town in Notting Hill, and the booking looks fine right up until someone is standing in the wrong chair.
What I built
A five-step wizard for a fictional salon with branches in Dubai, London and New York: pick the branch, pick treatments (stacked, so a colour service and a blow-dry add their times together), pick a stylist who actually works that branch and practises those treatments, then a time - only the ones where the whole appointment fits before that branch's own closing hour, in that branch's own currency.
The result
Nobody gets offered a stylist who isn't in the building, or a time the appointment doesn't fit into. Change an earlier answer and the later ones re-check themselves instead of quietly staying wrong.

Éclat doesn't exist. Three fictional branches - Marina in Dubai, Notting Hill in London, West Village in New York - built to make the multi-branch machinery real rather than decorative, the same way Amara Spa made a single Al Barsha address real.

Pick a branch first. Everything downstream - treatments, stylists, hours - belongs to that one room.

A single-branch booking form is mostly a calendar. A three-branch one has to know which chairs are actually in which city before it offers anyone a seat in one. Pick West Village and the wizard only offers what that room runs - skin and brows, no colour, no blow-dry bar - and only the three stylists actually rostered there.

The chain, and where it's actually tested

Treatments stack, reusing the logic the barbershop demo already proved: a colour service and a blow-dry add their times together, and every offered slot is checked against the whole total, not just the last thing picked. What's new is the branch sitting above all of it - a stylist is only offered if she works that branch and practises the categories chosen, and a time is only offered if the total fits before that branch's own closing hour.

A stylist who stopped being valid gets cleared, not left selected.
Only times where the whole appointment fits before that branch closes are offered.

Change an earlier answer - swap the branch, drop a treatment - and the later steps re-check themselves instead of quietly holding an appointment that no longer makes sense. A stylist who stopped being valid for the new picks gets cleared, not left selected and wrong.

What it doesn't do: take a deposit, send a real text, or check a real calendar. The 4-digit confirmation code is printed on screen, the 'already booked' slots are generated from a hash so the diary looks plausible without being one, and the prices are illustrative price points, not currency conversions at the peg. Every page says so, and both a noindex tag and robots.txt keep it out of search entirely.

Branch, treatment, stylist and time, all in one card by the last step.

Two ways on from here: the next case study - A trading school that needed to sell courses, not just describe them, or the films.