Case study · Car detailing · Mauritius

Premium car care, priced up front and bookable in four steps.

NanoDrive is a car detailing and protection studio in Mauritius, specialising in graphene and ceramic treatments.

We designed and built its French-language website. It explains each treatment, shows every price before anything else, and takes booking requests in four steps.

Client
NanoDrive
Sector
Car detailing and protection
Scope
Design, website and booking flow
Language
French
Year
2026
Status
Built, not currently online
A black Mini Countryman, its trim masked with tape, in the NanoDrive studio.
In the NanoDrive studio.
The NanoDrive site on a phone: "Votre auto mérite le meilleur" with a button to book an appointment.
The site on a phone.
Close-up of the Mini’s door and wheel arch, masked with tape before work begins.
Preparation before treatment.
  • 6services, each priced up front
  • 4steps from choosing a service to confirming

Try it

Step through the booking.

The booking is the heart of the site: four steps, one decision at a time. Click through the screens below.

Step 1 of 4

Choose a service

The same six services as the menu, each with its duration and price, so nobody reaches the calendar without knowing the cost. Every service card on the page opens the booking with that service already selected.

Step one, Service: six services listed with durations and prices in amber, Graphène Pro selected.

Step 2 of 4

Pick a day, then a slot

A month view with past days disabled, then hourly slots for the chosen day. Unavailable hours are greyed out.

Step two, Date and time: the October 2026 calendar with the 22nd selected, and hourly slots from 8h00 to 17h00 with three unavailable.

Step 3 of 4

Leave your details

Name, email and phone, plus the vehicle and its plate number, so the studio knows what is coming in before it arrives.

Step three, Your details: fields for first name, last name, email, phone, vehicle, plate and optional notes.

Step 4 of 4

Check, then confirm

A summary of the service, date, time, vehicle and price. Confirming prepares the request as a pre-filled email to the studio.

Step four, Confirm: a summary with service, date, time, client, vehicle and price.

Screens from the NanoDrive booking flow. Step four shows sample details.

The thinking

Why the price comes first.

Graphene and ceramic coatings are a considered purchase. Before booking, customers want to know what each treatment does, how long it takes and what it costs.

So the site opens on the service menu: six services, from an express wash to a full detail, each with what it includes, how long it takes and its price. Every card opens the booking with that service selected.

NanoDrive service menu: cards for Lavage Express, Lavage Complet, Graphène Pro and Céramique Elite, each with a price and a Réserver link.
The service menu on desktop.

Also built

Explain, then sell.

Pourquoi graphène ?

A plain-language explainer of graphene protection: water-repellent, heat-resistant, anti-static and lasting two years.

Boutique

Aftercare products presented with their prices, from graphene spray to microfibre kits.

French throughout

Every heading, label, button and confirmation is written in French.

Credits

Design and build, end to end.

Made for NanoDrive

  • Visual design: amber on black, Barlow Condensed headlines
  • Responsive one-page website
  • Service menu with prices and durations
  • Four-step booking flow
  • Graphene explainer and product boutique

Made with

  • Hand-written HTML, CSS and JavaScript
  • No framework and no page builder

Start a project

Tell us what you need to build.

Start with a 30 to 60 minute call about your business and what you need, with no commitment.

Call +230 5255 8807

  • Port Louis, Mauritius
  • English, French and Kreol
  • In person or remote