Harbor Street Barbers

The approach

The hero is a framed poster: a thin brass border, big serif type and nothing else to distract. Directly under the headline, it answers the two questions every client has: how long is the wait right now, and when can I get in? The next three openings are buttons; tap one and it’s filled in on the booking form.

Playfair Display in italic brass gives it the feel of a traditional shop sign; Work Sans in small capitals handles the practical parts. Black, brass, bone and a touch of wine keep it classic without leaning on barber-pole clichés.

Decisions worth noting

• Prices like the board in the shop. Services, times and prices are laid out with dotted leaders, the way clients already read them.
• Book a person, or the first available. The flow asks for service, barber, then day and time. Booked slots are grayed out and crossed through, so nobody picks a time that isn’t free.
• One thumb away. A sticky “Book a chair” bar stays at the bottom of the screen on phones.
• No photos needed to launch. Each barber gets a monogram in a brass ring until real portraits are ready.

How it’s built

One static page. Slots are generated in the browser, with a fixed pattern for “booked” times so the demo looks the same on every visit. Every choice is a real radio button. Fonts are self-hosted.

What would change for a real client

A connection to the shop’s booking system (such as Square Appointments or Booksy) for real availability, real barbers and photos, and live wait times from the front desk.