Almost all beauty websites look the same: lots of gold, lots of serif type, little attitude. MAISON LUMIÈRE was the counter-test – an atelier in Düsseldorf's old town, designed like a magazine rather than an industry template.

At the heart of the design is an editorial base of warm paper with dark atelier blocks. The services are not a grid of tiles but a numbered index 01–06 that fills with ink on hover and pulls a preview image along behind the cursor. The work runs sideways as a pinned strip while the page scrolls vertically.

The rest is craft: 106 MB of imagery brought down to 2.6 MB, seven pages, not a single template, and an appointment request in three steps instead of one block of form fields.

Art direction & design system
Front-end development (no framework)
Motion & scroll interactions
Image optimization & performance
Responsive build
Social video for the launch

Design system

Warm paper, ink, a single shade of gold as the accent – plus Fraunces as a variable display serif and Inter for body text. No shadows, no rounded corners, 1px hairlines as the only dividers.

Interaction

Three custom-built effects carry the site: the ink index of services, the pinned work strip that turns vertical scrolling into sideways movement, and the three-step booking flow with inline validation.

Performance

Sixteen source images totaling 106 MB became responsive WebP sets in three widths – 2.6 MB for the complete site. If JavaScript fails, the content stays visible; `prefers-reduced-motion` switches off all motion.

A closer look

Concept project. MAISON LUMIÈRE is a fictional brand. This project was created as independent design and development work to show a complete concept, from art direction to execution. There was no client; the address, prices, team and reviews are fictional.

View all projects