Plem AI Website Design, Framer Development and Motion

A clean, editorial direction built from the client's pitch deck: serif headlines with a red second line, continuous 1px frame lines, a dotted texture and layered product UIs in place of stock imagery. Seven pages, a design system with colour and type styles, brand guidelines and a matching pitch deck.

The hero went through several explorations in Figma before the dotted wave, from a process rail to versions with the product portal beside the headline.

Every page is built from reusable components driven by variables and variants, responsive across four breakpoints (1440, 1200, 810 and 390). A shared layout template holds the header, CTA and footer, alongside a trade picker for eight trades, FAQ accordions and pricing plans. SEO basics are in place: titles, descriptions, social images and a clean heading structure.

The whole project, design and development, was delivered in three days.

Custom React code components: the hero's interactive dotted wave that parts around the cursor, a pixel wordmark in the footer that reacts to the mouse, and a soft cursor trail. A scroll-triggered motion system makes every product UI tell its story when it comes into view: questions appear, answers type out, statuses resolve, engine checks tick through, scores and dots fill in, and the steps section advances with a progress bar. Loops update in place without resets, and everything pauses off screen to keep the site fast.