Fade District
Demo build for a fictional premium barbershop in Ann Arbor. Hero, five services with prices, a work grid, barber profiles, and location and hours — all arranged to push one action: book a chair. The booking section has two tabs: an interactive three-step scheduler, and a live Calendly embed where you can paste your own Calendly or Cal.com link and watch it load inside the site's design. There's also a side-by-side comparison of DM booking versus scheduler booking, aimed at owners still taking appointments through Instagram.
Full case study: A booking-first barbershop site where you can embed your own Calendlyread →
01 — PROBLEM
Barbershops lose bookings to Instagram DM back-and-forth. A site that just lists a phone number doesn't fix that — the booking action has to be the point of the page.
02 — APPROACH
Built the whole page around one action. A three-step scheduler demos the flow, and a second tab embeds a real Calendly widget — visitors can paste their own Calendly or Cal.com link to see their scheduler running inside the design.
03 — OUTCOME
A demo build for a fictional Ann Arbor barbershop that shows a shop owner exactly what booking-first looks like, including their own booking tool embedded live.