ZIMA Style

Beauty · Website and reels

The site of Sergii Zima's hair atelier in Notting Hill, built as an issue of a fashion magazine: the full menu as a live constructor, a colour try-on on your own photo and booking in WhatsApp.

ZIMA Style: website, first screen
ZIMA Style: website on a phone
Category
Beauty · Website and reels
Live
zimastyle.co.uk
Parts explained
07
The task

ZIMA Style is the hair atelier of Sergii Zima at 14 Portland Road, Notting Hill, London. We built his site as an issue of a fashion magazine called ZIMA: a cover with Sergii, the whole menu as a live constructor, a mirror that tries a colour on your own photo, booking in WhatsApp, an admin panel for the salon and three reels for his Instagram.

What we did
  1. 01Website
  2. 02Menu constructor
  3. 03Colour try-on
  4. 04Reels
Block by block

What each part does, and why

Real screenshots of the live site, desktop and phone. What each part does and why it is built this way.

01 / 07

A magazine issue instead of a banner

The first screen is a cover: the huge ZIMA masthead with Sergii standing in front of the letters, and cover lines that lead into the sections. Then the site reads like an issue: a contents page ("Inside"), an editor's letter under "Every strand is a brushstroke.", services, the menu, looks, the mirror, masterclass, the team, letters and the address. The facts the atelier states about itself sit right in the letter: twenty years behind the chair, five salons founded, membership of Intercoiffure Mondial.

  • Brand
  • Structure
ZIMA Style: A magazine issue instead of a banner
ZIMA Style: A magazine issue instead of a banner (phone)
02 / 07

The whole menu as a live constructor

The section is called "Every price, in the open." The visitor chooses who to sit with (Sergii Zima, a top stylist or a stylist) and the hair length, and every line of the menu recalculates. Categories switch with one tap: cut, colour, total blonde, styling, hair care and more. A plus next to a service adds it to the visit, so the person sees the sum for their own combination before writing to the salon. The menu is text, not pictures: it reads on a phone and the salon updates it without a designer.

  • Product
  • UX
  • Conversion
ZIMA Style: The whole menu as a live constructor
ZIMA Style: The whole menu as a live constructor (phone)
03 / 07

The Mirror: a colour on your own photo

"See the colour before the chair." The visitor uploads a selfie, turns on the camera or picks a model, and the mirror finds the hair and recolours only the hair, keeping its own highlights. The shades come from the atelier's signature colours. Everything runs in the browser on the phone: the page says "Your photo never leaves your phone. Nothing is uploaded.", and the heavy files load only when the person reaches this section.

  • AI
  • Product
ZIMA Style: The Mirror: a colour on your own photo
ZIMA Style: The Mirror: a colour on your own photo (phone)
04 / 07

Real work, and every colour can be tried on

"Recent work, straight from the chair." is a horizontal strip of the atelier's own photos and video loops: Butter blonde, Truffle brunette, Whiskey copper, Notting Hill autumn. Each look has a short note on how the colour is built and a "Try this colour" button that opens the Mirror with that shade already chosen. The portfolio stops being a gallery and becomes the first step towards a visit.

  • Content
  • Trust
ZIMA Style: Real work, and every colour can be tried on
ZIMA Style: Real work, and every colour can be tried on (phone)
05 / 07

Three reels from the salon's own footage

Together with the site we made three vertical videos for Sergii's Instagram, cut only from the salon's own footage and voiced: an expert reel about three myths he hears every week, a how-to on asking for butter blonde that ends on the site's Mirror, and a signature portfolio cut to the beat. On the site they live in the section "Sixty seconds from the chair." and play only while they are on screen.

  • Content
  • Motion
ZIMA Style: Three reels from the salon's own footage
ZIMA Style: Three reels from the salon's own footage (phone)
06 / 07

Expertise instead of filler

The team is shown by role under "Trained by Sergii, chosen by clients.", with one line about each stylist. Clients' letters follow, then "Before you book.": short answers about the consultation, what a haircut includes, why the cost depends on length and whom to choose. A separate section presents the masterclass for hairdressers. One spelling of the name runs through the whole site, and the page carries the HairSalon markup with the address for search engines.

  • Trust
  • Copy
ZIMA Style: Expertise instead of filler
ZIMA Style: Expertise instead of filler (phone)
07 / 07

From a chosen visit to WhatsApp

The last spread is the address: "14 Portland Road, London W11 4LA.", a photo of the corner salon and one red button, "Book on WhatsApp", with the phone, directions and Instagram next to it. The visit assembled in the constructor goes into the message: which services, with whom and for what hair length. The salon receives a ready request instead of "when do you have a slot?".

  • Buttons · CTA
  • Conversion
ZIMA Style: From a chosen visit to WhatsApp
ZIMA Style: From a chosen visit to WhatsApp (phone)
Inside
  • Menu constructor: three stylist levels and three hair lengths, the sum of the chosen visit, a ready WhatsApp message
  • The Mirror: hair is found and recoloured in the browser on the device, the photo is not uploaded anywhere
  • English and Ukrainian versions of the site
  • Admin panel: the salon edits the menu and the texts itself, with a written guide
  • Hand-written code without WordPress or page builders; HairSalon structured data with the address
  • Three voiced vertical reels for Instagram
Enquiry

Have a project like this?

Tell us in a few lines what you are making and for whom. We read every enquiry ourselves and reply personally.