Building Lume’s Digital Experience with MadeByCat

A beauty device has to be understood before it can be wanted. The homepage opens with the plain statement that Lumé° is a smart beauty tool that turns a daily routine into a five-minute salon, then expands into the three modalities the product combines: warm micro-vibration, red light and a polished tip that carries serum into the skin.

The product page continues that education rather than repeating it. Specifications, what is in the box and the finishes are presented as scannable tables and selectable options, so a reader can move from curiosity to detail without leaving the page or hunting through marketing copy.

The ritual is the heart of the brand, so it is shown as a sequence rather than a paragraph. Four steps — pick up the wand, press once, glide upwards, seal and glow — are revealed one at a time as the visitor scrolls, each with its own elegant line icon. The pacing mirrors the routine itself: short, ordered and easy to remember after a single read.

On phones and tablets the same sequence becomes a horizontal, snap-scrolling carousel, so the steps stay legible and complete instead of being compressed into a wall of text.

Buying an at-home device is a considered decision. The site keeps the purchase path visible at all times — a persistent buy action in the header — while giving the reader the material needed to feel sure: technical specifications, box contents, finish options that update the product imagery as they are selected, a testimonials rail with real on-page video, and a frequently asked questions accordion that answers practical objections in place.

Claims on the site are kept to what the product page itself states. Nothing in this article adds results, certifications or figures beyond that.

The structure is intentionally shallow. The homepage is the narrative — wand, difference, ritual, details, shop — and the product page is the decision surface. A journal sits alongside them for longer-form writing. Because there are only a few destinations, navigation stays minimal: a wordmark, a language switch and a buy action, with breadcrumbs on inner pages so a visitor always knows where they are.

Each destination has its own address, its own title and its own description, so pages can be shared, bookmarked and found individually rather than living behind anchors on one endless scroll.

The interface follows the product: cream and ink tones, rose-gold accents, a serif voice for statements and a monospaced voice for labels. Editorial layouts, generous whitespace and full-bleed imagery do the persuading, which keeps the copy short and the hierarchy obvious.

Motion is used to explain, not to decorate. Sections reveal as they enter view, the ritual arc advances with scroll, the marquee keeps the three promises moving, the detail hotspots open cards that flip direction when they would otherwise run off the screen, and the gallery advances on its own but pauses the moment a visitor interacts with it.

The site is bilingual. A Turkish and English toggle switches the full interface, and the choice is remembered between visits.

The layout was reworked specifically for phones and tablets: horizontal overflow removed, sticky sections re-laid out, the ritual turned into a swipeable carousel, the annotated detail view turned into a readable list, and the product gallery given native swipe support. Heavier scroll effects are disabled below desktop widths so touch scrolling stays direct and responsive.

Sections that must fit a single screen are sized against the viewport rather than fixed pixel values, so cards are not clipped on shorter laptop displays.

Pages use semantic landmarks — header, main, sections, footer — with a single first-level heading and an ordered heading structure beneath it. Interactive elements are real buttons and links, the language switch exposes its active state to assistive technology, decorative imagery is hidden from screen readers and meaningful imagery carries alternative text. Breadcrumbs are marked up as navigation with the current page identified.

Pages are server-rendered, so the first response already contains the text and headings — good for visitors on slow connections and for search engines reading the page. Key imagery is preloaded, everything below the fold is lazy-loaded, video is muted and inline, and scroll effects are driven by animation frames rather than continuous work on the main thread.

MadeByCat supported the design and development of Lume’s digital experience. The result is a site that teaches the product, rehearses the ritual and keeps the path to purchase one tap away, in two languages, on any screen.

See the Lumé° Wand or return to the homepage.