Macelle

Macelle is a website template for niche perfumers, fragrance houses and candle makers.

Scrolling descends a perfume's note pyramid through liquid. A drop of ink falls into milk and blooms into the first note's name; the ink shows at full strength only inside the letters of the current note. Its colour, fade speed and drift change from top notes to heart to base: top notes fade fast and rise, base notes linger and sink. The cursor stirs the ink. It is a real fluid simulation, not a video.

Every fragrance page draws its own hero in that fragrance's notes and colours, straight from the CMS.

Pages

• Home: the note descent, the house's fragrances, the discovery set and FAQ

• Fragrances and a page per fragrance (CMS)

• Visit with a form, and a 404

Included: a Fragrances CMS with 5 complete entries, an Ink Word component that fills any headline with marbled ink, navigation with a phone menu, buttons, form states, colour and text styles, and desktop, tablet and phone layouts.

Limitations: buy buttons link out; point them at your own shop or checkout. It needs WebGL.

Buying: after checkout you get the remix link instantly, on screen and by email.