W-02 Case study · Clarity
Precision had to be visible, not asserted.
A clinical, laser-led aesthetics practice. The technology explains itself on the first screen.
02 The capture
Open it and check the claim.
03 Brief and build
A device page wearing a clinic.
The brief
Aesthetics marketing sells a feeling. This had to sell a calibration.
The reader is comparing devices, not just clinics. So the first screen carries the wavelengths, medical supervision, and a plain statement that individual results vary.
What we built
A galvanometer laser, drawn live in WebGL, behind the headline.
An effect, not a looped clip, named for the mirrors that steer a real beam.
04 What shipped
Fifteen modules, itemised.
- HeroA WebGL galvo laser on canvas, own render loop.
- PointerCustom cursor and magnetic buttons, every route.
- EntryA preloader, so the first frame is finished.
- ReadingScroll progress, with Lenis smoothing the scroll.
- ConsentConsent gating in the module set, not a third-party banner.
- ContactA chat surface and a validated inquiry form.
- HeadersHardened response headers, verifiable from outside the build.
- SpecificationWavelengths and supervision stated in the first screen.
05 At phone width
The spec row survives the crop.
The wavelength row is the first thing a responsive build drops. At 390px it is still there, wrapped to two lines, above the fold.