A skincare shop you browse by feel, not by problem

What Palune is

Palune makes eight products in four textures: a Cloud Milk Cleanser and a Gel Cleanser, a Water Gel Serum and an Oil Serum, a Day Cream and a Night Balm, and a Body Oil and a Body Balm. Every bottle and jar is frosted glass that takes a refill, so a pump unscrews or a pod clicks in when it runs out.

The name comes from lune, the French word for moon. It shows up twice: as the half-moon arch that frames the photos across the page, and in the logo, a drop of product with a crescent moon cut into it. The drop sits in the navigation, the favicon and the giant wordmark that closes the footer.

The problem the site had to solve

• Sell without promising. No “anti-ageing”, no “clears”, no “dermatologist approved”, no badges, stars or press logos. Products are described by how they feel, what they smell like, what is in them and how much to use.
• Help people choose without a skin quiz. Most shops ask about acne or wrinkles. Palune asks what you like on your skin, and that has to be enough to build a routine.
• Make eight products feel like a range. A small shop needs clear ways in: by texture, by step, by routine, and a close look at one product.
• Make refills the easy choice. The bottle is bought once. The page has to make the refill plan as clear as buying the bottle.

A hero that changes texture

The first screen is a full-width photo on deep plum with the headline “Skincare you choose by feel.” Five tabs along the bottom, All, Gel, Milk, Balm and Oil, crossfade between five scenes made for the brand: the range on a blush plaster plinth, a gel on smoked glass, milk pouring into stoneware, balm on dark travertine and oil drops on plum lacquer. Every subject sits on the right, so the words always have dark space on the left.

The scenes play through on their own every six seconds, with a thin line filling under the active tab. They pause when the hero leaves the screen and stop for good once someone hovers or taps a tab. The main button follows the scene, so on the balm it reads “Shop the balms” and filters the shop to balms. A slim product strip in the corner keeps the Cloud Milk Cleanser one tap from the bag, with its two sizes and the price inside the button.

Shop by texture

Right under the hero, the whole idea fits in one row. Four arch-topped tiles, each a close-up of one texture with its name in white and a short line on how it feels: Gel, clear, light, cool. Milk, thin, soft, quick to sink in. Balm, thick, melts as it warms. Oil, silky, a few drops go far. On desktop every second arch sits lower, so the row reads like a magazine page rather than a grid.

Tap a tile and the shop below filters to that texture, with a small “Balm only” chip you can clear in one tap.

The eight

The shop is the whole range in one grid of eight cards, all in one design. Every packshot sits on a backdrop coloured by its step, rose for cleansers, lilac for serums, stone for moisturisers and deep plum for body care, so the grid sorts itself by colour before you read a word. Hover a card and the bottle gives way to a close-up of what is inside it.

Tabs filter by Cleanse, Treat, Moisturise and Body. Size pills change the price inside the Add button, and the buttons are outlines that fill on hover, so eight dark pills never weigh down the grid. One card carries a New tag. The Body Balm is sold out, and its card turns into a “Notify me” button with its own confirmed state.

Add to bag opens a drawer from the right. Each line has its photo, size and a stepper, the subtotal updates as you go, and a thin bar counts down to free delivery at $60. The bag icon in the nav keeps a live count and opens the same drawer from anywhere on the page.

Inside the Night Balm

One product gets a close look. The Night Balm stands tall in the middle of a rose panel, under a half-moon arch, with four short notes around it on fine rules, numbered 01 to 04: how it feels, how it smells, how much to use and how the jar refills. The price and the Add button sit in one light pill underneath.

Below that, three folding rows hold the full ingredient list, how to use it and delivery and returns. It is the most honest selling a skincare page can do: say what is in the jar, and let people decide.

The same textures, for the body

Halfway down, one wide photo breaks the shop rhythm: two hands smoothing balm along a forearm in window light, with “The same four textures, made for the body.” set in the dark wall above them. It is the only full-width photo after the hero, and it leads straight to the body care.

A routine finder that asks about feel

Three questions, one at a time: how your skin feels by evening, which texture you reach for, and whether two or three steps feel right at night. Each answer slides to the next question, a Back link steps back, and the routine panel beside it fills one numbered slot at a time, from Cleanse to Treat to Moisturise.

The suggestion follows the textures you like, never a skin concern, and the page says so under the questions. At the end you get the routine with its total, one button to add all of it to the bag, and Start again. Every state was designed, from the empty panel to the full one.

Keep the bottle, refill what is inside

Refills get their own plum band beside a photo of a glass bottle and its refill pouch at a basin. A switch for every 6, 8 or 10 weeks updates the next three delivery dates on the spot, and three folding rows explain how refills work, how to pause or skip, and how to send the empties back. One button starts the plan.

The brand system

There is no black anywhere on the page. Text is a warm brown, #50463E, on white and a pale stone. The colour comes in fields: pale rose for the Night Balm and the routine finder, deep plum for the announcement bar, the hero ground and the refills, and a darker plum for the footer. Every pairing was checked for contrast before it was used.

Headlines are Fraunces Light, set large and tight, and everything else is DM Sans. Buttons, size pills, tags and the email field are full pills, cards have soft 16 pixel corners, and the half-moon arch frames the texture tiles, the Night Balm and the journal photos. The photos were made for Palune, each on its own surface, colour and light, so no two look like the same set.

The logo came last, from three options: a moon rising in an arch window, an arch around a serif p, and the one chosen, a drop with a crescent cut into it. It is a single shape, so it holds up at 16 pixels in a browser tab and at the full width of the footer.

Sound on

Motion with a job

• One opening. On load the hero photo opens out from a rounded frame and settles, then the headline lines rise into place. It happens once.
• One loop. The hero scenes are the only thing that moves on its own, and they stop as soon as someone takes over.
• Quiet arrivals. Each section rises once as it reaches the screen, the body care and refill photos drift slightly slower than the page, and scrolling is smoothed so nothing jumps.
• Calm by request. For visitors who ask their system for reduced motion, the hero does not play on its own and every transition is off. The page is complete without them.

Fast and easy to read

• Light to load. On a slow phone profile the page loads in 15 requests and about 690 KB, with the largest image on screen in about 2.5 seconds. Only the first hero scene loads with the page. The other four follow once it has finished, and the typefaces and animation code are served from the site itself.
• Steady while loading. Nothing on the page shifts as it loads, and the photo grade is built into the image files instead of being calculated as you scroll.
• Easy to read. Every line of text on a solid colour passes the WCAG AA contrast standard. The white text over photos was measured against the pixels behind it, and on phones the texture tiles get a deeper shade so their names stay clear.

Built for phones

On a phone the hero photo sits on top and the headline sits below it on solid plum, so the words never cover a product. The texture arches go two across, the product cards go two across, the Night Balm notes stack under the jar, and the routine finder runs as one column. The menu slides in from the left with the five sections and search and account, and the bag slides in from the right, so both stay one tap away.

Ready for Shopify

Palune was designed for a Shopify theme from the first section. Each section maps to one Online Store 2.0 section with its own blocks, so the store owner can reorder or hide them in the theme editor. The eight products come from one card design, ready to read from Shopify products, sizes and stock, and the sold-out state and Notify me follow the stock. Colours, type, corners and spacing sit in a small set of shared settings.