hello@creekstudio.co.uk

04ConceptWebsites index2026

Interval

Kensington

Type
Concept. A fictional independent hair salon off Kensington High Street; nothing here can be booked.
Scope
Name, wordmark and split-I monogram, generated photography and motion studies, a service menu at three levels, a thirteen-page website with a booking demonstration.
Built
November 2026, in two editions.
Tools
ChatGPT with OpenAI image generation; Astro and Sass; GSAP, ScrollTrigger and SplitText; Lenis.
The Interval home page: a monochrome portrait with hair moving across the face, under the headline Hair, as an art form.

The home page as it first opens, 1440px wide

An independent hair studio a little off Kensington High Street: four stylists, a small room, natural light for judging colour, and a thirty-minute conversation before anything else.

01 — The brief

One brief, a whole salon.

Creek Studio wrote a single brief for an independent hair salon in Kensington that does not exist, and asked for the whole thing from it: name, identity, photography, copy and website, generated with ChatGPT. The brief set the ethos in one line: “A creative refuge in the heart of Kensington. Bespoke hair architecture, lived-in color, and quiet sanctuary for spirit, intellect, and hair.” Creek wanted the photography as close to real as generated images get, mixing professional salon shots with frames that look as if they were taken on a phone.

Creek took it through two editions. The first used walnut-brown ink on warm paper with a pale blue-grey. For the second, Creek redirected it towards a fashion magazine: high-contrast black and white, asymmetric layouts and a lot of empty space. That edition added three monochrome editorial photographs (a campaign portrait, a sculptural bob and the salon interior) and kept the earlier colour studies in the lookbook and the artists' portfolios, where colour explains a tonal result.

The lookbook section, In good form: black and white studies of a sculptural bob, wet hair with a comb and the salon room, with arrow buttons and a progress line
02 / The ongoing study, on the home page: six generated studies on a track you drag or move with the arrows.
02 — Name and identity

Interval: the space between appointments.

The name comes from the gap between one visit and the next, which the site keeps returning to: how a cut grows out, how much natural colour to leave at the root, when to come back. The wordmark is a lowercase expanded serif, and the monogram splits the I, so the pause in the name becomes the identifying detail. Both are vector artwork drawn from licensed type outlines. The first edition set the same wordmark in brown, with a descriptor line, Hair & Colour · Kensington, and a mark of two upright bars of unequal height.

The interval wordmark in black: lowercase serif letters
The interval wordmark in white on black
The Interval monogram in white on black: a serif capital I split across the middle
The first-edition lockup: the interval wordmark in brown above the line Hair & Colour, Kensington
First edition
03 — Colour

Black, white and three greys.

The second edition's palette is ink, a muted grey for secondary text, a rule grey, a pale mist for panels and white. The photographs carry any colour there is. Measured contrast: ink on white 18.9:1, muted grey on white 7.2:1, muted grey on mist 6.0:1.

The first edition used a brown ink, #34261F, on paper #F2EEE8 with a pale blue-grey, #C1CDD8.

  • Ink#111111
  • Muted#575757
  • Rule#C9C9C9
  • Mist#E9E9E9
  • Paper#FFFFFF
04 — Typography

Source Serif 4 and Source Sans 3.

Source Serif 4 for display, with its italic carrying part of most headlines (an art form., With feeling.); Source Sans 3 for text and the capitalised labels. Both are Adobe Originals released as open source under the SIL Open Font Licence, self-hosted as five WOFF2 files.

Hair, as an art form.

Cut. Colour. Character.
Source Sans 3 semibold, in capitals
Come with your hair as you usually wear it. We want to see its natural movement.
Source Sans 3 regular
Technique. With feeling.
Source Serif 4, roman and italic
05 — Photography and motion

Every person and every room is generated.

Creek turned down an earlier set of images and had the photography regenerated. All thirty-five photographs on the site come from OpenAI image generation: the four stylists and their work, the room, the products on the counter, the lookbook. None of it documents a real salon, stylist or result, and the site captions say so. The short motion studies, including an eight-second light study on the salon page, are animated from generated stills.

On the home page a slider moves one head of colour from freshly finished to six weeks on. It illustrates the idea of leaving room for regrowth; the caption says it is not a promised result.

Generated monochrome photograph of the proposed room: walnut panels, chairs and low afternoon sunlight
The proposed room, second edition.
Generated monochrome study of a sculptural bob
Sculptural bob.
The art of growing into it: a generated photograph of brunette colour seen from behind, beside the line Leave room for life and a slider set to Week 0
05 / Beyond the chair, on the home page: the slider moves the same head of colour from freshly finished to six weeks on.
06 — The website

Thirteen pages and a booking that reserves nothing.

An Astro site with local responsive images: home, services and prices, colour, the salon, the team with a page for each of the four stylists, booking, visit, booking terms and credits. Creek's brief named six interactions, and all six are there. Lenis supplies the scroll inertia; GSAP, ScrollTrigger and SplitText reveal headlines line by line behind masks; the lookbook drags, with buttons and keys as alternatives; the cursor follows on a spring and labels what a click will do; the stylists' portfolios are layered on hover and focus. For the grain the brief allowed an SVG filter or a WebGL shader; the build uses the lighter SVG tile. None of the motion code loads until the first scroll, tap or key press, so the campaign photograph downloads first. Motion is reduced when the device asks for it.

Prices are set at three levels, Stylist, Senior and Director, and include VAT: a sculptural cut is £85, £115 or £145, dimensional balayage £225, £275 or £325, and the first consultation is free. The booking demonstration runs in four steps (service, stylist, date and time, details) beside a running summary with time in the chair and an indicative total. It says at the top that no appointment is reserved, no payment taken and no details sent. The visit page draws the neighbourhood from OpenStreetMap data and notes that High Street Kensington station has no step-free access.

The site runs at /interval/ on creekstudio.co.uk, with its paths moved under that folder, a Cloudflare script added by its first host removed so every page passes the studio’s content security policy, and the footer credit linked back here.

  1. —Campaign: Hair, as an art form.
  2. 01The studio: A creative refuge. A different kind of headspace.
  3. 02The ongoing study: In good form. Six generated studies to drag through.
  4. 03Our disciplines: Technique. With feeling. Cutting, balayage, scalp rituals and corrective colour.
  5. —Room interlude: Space to be yourself.
  6. 04Independent minds: Individual artists. Shared instinct. The four stylists.
  7. 05Beyond the chair: The art of growing into it. The colour slider.
  8. —Invitation: Make a little space for yourself. A free thirty-minute consultation.

Open the site →

Live: the site itself, at its real width, scaled to fit

Open the full site →
Desktop · 1440 × 900
Phone · 390 × 844

One frame runs at a time. Exit, or Esc, puts the still back.

The Hair architecture price table: sculptural cutting £85, £115 and £145; curl architecture £135 at Senior only; precision short form £65, £85 and £105
The services page: the Hair architecture group, priced at Stylist, Senior and Director level.
The booking page: Make some time for you, a notice that nothing is reserved, paid or sent, nine services to choose from and the appointment summary
The booking demonstration, step one of four: choose a service, with the summary beside it.
The Interval home page on a phone: the campaign portrait under Hair, as an art form
The home page on a phone, 390px wide.
Mara Ellis’s profile page: her name, Precision geometry and sculptural shape, a short note on how she works and a black and white portrait
One of the four artist pages: Mara Ellis, Director.
Just off the High Street: 8 Interval Mews, Off Kensington High Street, London W8, with opening hours, beside a grey illustrated map with the salon marked
The visit page: the fictional address and opening hours beside the illustrated map.
Credits

Type, code and what is invented.

Source Serif 4 by Frank Grießhammer and Source Sans 3 by Paul D. Hunt, Adobe Originals, SIL OFL 1.1. GSAP, ScrollTrigger and SplitText; Lenis. Map data © OpenStreetMap contributors, Open Database Licence.

The salon, the stylists, their handles, the services, the prices, the address and the contact details are invented. The telephone number is from Ofcom’s drama range and the email domain is not presented as owned or monitored. The credits list what was not used: website templates, UI kits, fabricated reviews, awards and product partnerships.

Interval