Clingr is a hands-free hair dryer holder. It clips onto a mirror or a wall and holds the dryer steady, so both hands stay free for styling. The brief had two parts: a communication strategy that builds an emotional bond with the buyer, and a website that turns that bond into sales. We took on all of it: strategy, copywriting, brand identity, 3D renders, design, and development.
Product sites usually lead with the product: specs, feature lists, a catalog. For Clingr’s product landing page, we built everything around the person at the mirror instead.
A mirror, not a shop window
Clingr lives on the mirror, so the site works like one: visitors see their own morning before they see the device. The first screen opens on a frame from a lifestyle video, the brand’s line pattern, and a single headline: “Both hand for beautiful hair!.” The promise and the mood come first, and the product waits one scroll down. The story is told through the client’s own photos and videos, which show Clingr on bathroom mirrors and bedroom doors as part of an ordinary day.
Interactive 3D, driven by scroll
Below the first screen, Clingr appears in 3D and unfolds as you scroll, revealing the details of its design. Under the hood, it’s a sequence of frames rendered from a 3D model and tied to the scroll position, so the device moves at the visitor’s pace and glides back just as easily. Scrolling, the simplest interaction on any site, stops being a way to travel down the page and becomes a way to turn the object in your hands.
One benefit, one moment
Three cards carry Clingr’s key benefits, each with its own transition as you move between them. Every benefit is told through a moment in the morning routine, not a specification: less time at the mirror, a holder that mounts on any surface, a dryer kept at a safe distance from the hair. A list of features becomes a morning you can picture.
Icons in the brand’s style
A custom icon set marks the product’s features and the sections of the site. Drawn in the identity we built for Clingr, each icon tells you where you are and what a feature does.
Interactive specs, part by part
The technical specs bring the 3D device back, now with its parts numbered. Hover over a number, and a pop-up explains the feature or material behind it. The details are there for anyone who wants them, but they arrive after the story, not in place of it.
The result
Clingr won Site of the Day and the Developer Award on Awwwards, and Website of the Day on CSS Design Awards. Product website design usually starts with what the product does. This site starts with who it’s for, and that order shapes every screen. Every decision serves both parts of the brief: the first screen that opens on a person, the 3D device that unfolds on scroll, the benefits told through moments of the morning, specs mapped onto the device itself. The result is a bond with the buyer, and a site that turns it into sales. Like the product, the site leaves both hands free: the person stays in the reflection, and Clingr holds everything else.