Case Study / 02
Web Design · 2025
All work

Eskens Web Design
Refresh.

A full visual rebuild of the Eskens Tinting Solutions site, with a modern type system, motion-rich layout, and a live in-page preview you can scroll through right here.

HTML / CSS Vanilla JS Motion Design System Responsive

Overview.

A redesign of the Eskens Tinting Solutions website, replacing a dated marketing brochure with a typographically considered, motion-led layout that reflects the precision of the products.

The existing site at eskens.co.uk reads like a 2010 brochure: flat product grids, no hierarchy, generic stock imagery. The audience is paint shops, distributors and in-house ops teams who already know the kit; the site needs to feel as precise as the machines, not like a leaflet.

The redesign leans on a tight type scale, a single warm accent against a calm neutral, and motion that's only used where sequential reveals help comprehension: scroll-reveals on the product grid, parallax on the dispenser shots, a marquee for partner brands. Nothing decorative, everything earning its place.

Live preview.

Scroll inside the frame
eskens-redesign.local / preview

  The frame above renders the redesign exactly as it would ship, with animations, type, and layout intact. Scroll inside it to walk through the site.

Hero

A landing that leads with the kit

The original site buried products under marketing copy. The redesign opens with a confident headline, a clear product split (Tinting Machines / Shakers & Mixers), and imagery that carries the brand instead of stock photos.

Catalog

Filterable product grid

Tinting and shaker pages share a filterable catalogue (Corob, Fast & Fluid, Collomix) with live counts, spec lists, and a single card pattern that scales from 14 models to whatever ships next.

FAQ

Answers the questions customers ask

Replaced the old "contact us" wall with a real FAQ covering brand coverage, machine sizing, install and training, and service area. The questions buyers raise on the phone, surfaced where they look first.

Footer

One footer, used everywhere

A single footer pattern across the home, tinting, and shakers pages (brand block, site map, and contact list) so the site finally feels like one product instead of three loosely related templates.

Also shipped.

Alongside the marketing site rebuild, I also built and maintain Eskens' live Shopify storefront at eskensonline.com. Custom theme work, bespoke product pages, and the small JavaScript and UX fixes that keep day-to-day buying frictionless.

Up next.

Browse the rest of the work, or skip back to the homepage.