Southpaw CutsWalk in. Walk out sharp.Four chairs, straight prices, twenty minutes in the seat.Book a chairSkin fade · 30 min · $32Beard lineup · 15 min · $18Kids under 12 · $22Walk-ins until 7

Demo brand · a four-chair barbershop under the elevated train in Queens

ExperienceTier: Premium

Fresh Fade

A barbershop direction with big type, straight prices, and a chair you can book in ten seconds.

Feeling: The shop is busy for a reason, and the price is the price.
Composition: Bold shop hero → the price list in plain rows → the chairs and the crew → walk-in truth → book action.
Motion: Type lands like clippers snapping on, price rows slide in fast, and the book button never moves.
Guardrail: Prices stay visible and literal — no 'from $' games, no hidden chair fees.
Best for: Barbershop · Salon · Grooming studio · Walk-in service
Tier: Premium tier. This direction has a hand-built Builder template, so Builder renders its own composition, and it carries an extended build spec: section-by-section requirements, a type scale, an alternate palette and a motion spec.

Capability sources

motion-primitives
launch-ui
launch-ui

The prompt works in any AI tool. Build this in Irie hands this direction’s agreement to Builder through a short-lived link, and Builder shows you what it imported before it generates. If that link cannot be created, Builder still opens with the prompt on your clipboard. The agreement is a structured irie.direction.v1 file you can also keep or feed to any tool that reads it.

Premium build spec

What premium means here.

Fresh Fade has a hand-built Builder template, so Builder renders this composition instead of the shared generic one. It also carries the build spec below, which travels inside the downloadable agreement.

Bold shop hero
The shop name at maximum scale, the neighbourhood, today's open or closed status, and the book control.
Most often goes wrongA stock photograph of a generic barber chair stands in for the actual room.
The price list in plain rows
Every service as one row: service, minutes, price. No tiers, no packages, no “from”.
Most often goes wrongServices are bundled into packages, so the price of a plain cut is no longer findable.
The chairs and the crew
Each barber with a real name, their chair, what they are best at, and how to book them specifically.
Most often goes wrongIdentical head-shots with invented accolades attached underneath.
Walk-in truth
Which hours are busy, whether walk-ins are taken and when, and the realistic wait.
Most often goes wrong“Walk-ins welcome” with no busy-hours detail, which produces exactly the complaint this section exists to prevent.
Book action
One booking control plus tap-to-call, both inside the thumb zone at 375px.
Most often goes wrongThe booking control hands off to a third-party site with no indication that the visitor is leaving.

Type scale

Display: Condensed uppercase at clamp(4rem, 14vw, 8rem) = 64-128px, line-height 0.85, tracking -0.01em. The shop name is signage, and signage is not a heading.
Body: 16-17px at line-height 1.55.
Meta: Price rows at 16px with tabular figures and the minutes at 14px in the same row. The price column is right-aligned and never smaller than the service name it belongs to.

Alternate palette — Bay rum

Canvas#12100D
Ink#F0E7D8
Signal#C8A24A

Use for an older, appointment-led shop. Barber-pole red reads young and walk-in; brass reads traditional and booked out, and it suits a price list with fewer, longer services.

Motion spec

Trigger: Hero type animates on load. Price rows animate on an IntersectionObserver at 20% visibility, once.
Property: Hero words: translateY(100% to 0) inside an overflow-hidden mask. Rows: translateX(-16px to 0) with opacity.
Duration: Hero 260ms per word at a 70ms stagger; rows 200ms at a 45ms stagger.
Easing: cubic-bezier(0.16, 1, 0.3, 1) — fast in and a dead stop, the way clippers snap on.
Never moves: The book control (its position never changes on scroll), every price, and the open/closed status. Nothing on this page loops; once the rows have landed the page is completely still.

Anti-patterns

“From $25” pricing.
A consultation gate placed before the price list.
A marquee running continuously behind the prices.
Red used for body text or borders instead of the one action it is reserved for.
An Instagram embed grid substituted for photographs of the actual chairs.
A booking widget inside an iframe that cannot be reached in one thumb-reach on a phone.

Direction film

Watch it move.

An eight-second pass through Fresh Fade — the palette, the composition, and the motion language the prompt asks for.

See Fresh Fade built for a real business in Irie Builder

Real interpretations

The same agreement, built more than once.

Independent implementations of this direction. Each was built from the agreement alone — different hands, different code, recognisably the same direction.

Irie BuilderIrie Builder
Generated inside Irie Builder from this direction's agreement, then published to the showcase.
Open the build

Fresh FadeFresh Fade

What premium means here.

Bold shop hero

The price list in plain rows

The chairs and the crew

Walk-in truth

Book action

Type scale

Alternate palette — Bay rum

Motion spec

Anti-patterns

Watch it move.

The same agreement, built more than once.

Related directions.

After Hours

Open Road

One Night Only

On Air

Fresh Fade