Lumière Beauty
Cosmetics
Online shop demo for a fictional luxury skincare brand: an animated product showcase, collections, quick view, search and a shopping bag.
This is a concept website built by Bright Analytic to show what we can do for a business like this. It is not a client project.
The problem
Nobody can try a cream through a screen. People buying skincare online look for something else before they pay: what is in it, whether it suits their skin and where it fits in their routine. If the shop does not say, doubt wins.
- The actives hide behind marketing names and the shopper leaves to look them up elsewhere. Often they do not come back.
- Each product stands alone, with no word on when to apply it or what to pair it with in a routine.
- The luxury look weighs so much that the shop is slow on a phone and the buy button is hard to find.
- Seeing a price or a size means opening every product page and going back again and again.
What we did
A showcase you can control
The hero rotates four star products, each with its own frame shape and transition. It pauses with a button, on hover or when using the keyboard, and on a phone you swipe to change.
Actives up front
Quick view shows each formula's key actives, the size in ml and the price, without leaving the catalogue. On a phone it slides up from the bottom.
Search by ingredient
Search finds products by name, type or active ingredient, and copes with queries typed without accents. It suggests terms such as “Serum” or “Vitamin C”.
The routine, step by step
One section walks through the ritual in four steps as you scroll: purify, brighten, nourish and hydrate. Each step says when and how much, and lets you add that product to the bag.
Clear filters and collections
The catalogue filters by serums, creams or treatments. Three collections open the same grid already filtered, with a product count.
Light, and sends no data
Fonts and WebP images hosted on the site itself, with no requests to other servers. The bag and newsletter are demo-only: there is no real payment and no data is sent.
What it does better
- It treats the routine as what it is, an order of use, not a list of separate products.
- Price, size and actives are visible without changing page, something many shops in the sector make you hunt for.
- The slide-out bag lets you change quantities, remove items and see how far you are from free shipping without losing what you were browsing.
- Plenty of motion, but optional: with the system's reduced-motion setting on, the hero stops rotating by itself and transitions are toned down.
- It states clearly that the brand and products are fictional, on the hero, in quick view and in the footer.
Features and modules
Included
- Hero showcase with star products
- Catalogue with category filters and collections
- Quick view with key actives, size and price
- Search by product and ingredient
- Step-by-step usage ritual
- Slide-out shopping bag (demo)
- Newsletter signup with email validation (demo)
Optional extra modules
- Real checkout with a payment gateway, order and stock management
- Full product pages: INCI list, how to use, skin type and verified reviews
- Shop in several languages
Local visibility
Being a demo, Google does not index it. On a real shop, this is the groundwork we leave in place so people searching for a specific product or category can find it:
- A dedicated page for each product and each category, aimed at searches such as “vitamin C serum” or “hyaluronic acid cream”.
- Product structured data with price and availability, so search engines understand what is for sale.
- Product content readable without JavaScript, with unique titles and descriptions on every page.
- Copy reviewed with the brand so every claim is backed up. Search visibility builds over time and nobody can guarantee a ranking.
Related services: local SEO for small businesses · monthly website maintenance
Does your business look like this?
Lumière Beauty is a demo, but the solution is real: we adapt it to your business, your menu and your area.
Can I actually sell with a shop like this?
This demo does not take payments: the bag is an example. Real checkout, orders and stock are added as an extra, scoped to what you need.
Doesn't all that motion slow down shopping?
The motion supports the shop, but it can be paused and is reduced when the phone is set up that way. The add-to-bag button is always within reach.
Who updates products, prices and photos?
Bright Analytic offers monthly web maintenance: you tell us and we change it. If you prefer to manage it yourself, we quote that separately.
What does a cosmetics shop like this cost?
It depends on the catalogue and the features. We work it out from products, collections and payments, and you get a fixed, no-obligation quote within 24 working hours.