← Back to the site

How this site was built

A short teardown of the design decisions behind moores-welding — written so anyone can learn from it, and so the client knows exactly what they got.

The read

Moore's is a second-generation iron shop in Lakeland with a hand-painted sign, a 4.3-star Google profile, and zero web presence. The design goal was to put that hand-painted sign on the internet without losing its soul: paper white, ink black, and the exact distressed red of the shop's lettering.

Typography

Display type is Rye — a western slab that closely matches the shop's existing painted logo — used sparingly, at large sizes only. Body is Barlow, a grounded grotesque drawn from California public signage. The pairing reads 'old shop, straight talk.'

Color

Paper #FAF6EF, ink #1B1410, and brand red #A8332B sampled from the logo. Two dark forged-steel bands (#171210) break the white page like the shop floor breaks the daylight — one carries a live spark animation, one carries the process section.

Motion

A canvas particle system throws weld sparks inside the dark hero strip — transform/opacity only, capped at 90 particles, fully disabled under prefers-reduced-motion. Everything else is restrained: scroll-triggered fades with a single cubic-bezier, count-up stats, and hover lifts on the service cards.

Content honesty

Every claim on the page is sourced: the 4.3★ rating, 17 reviews, and all three testimonials are real Google reviews. The services list (security bars, sliding gates, spiral staircases, aluminum rod iron) comes verbatim from what customers wrote. Nothing is invented.

Conversion logic

Trades customers call. The phone number appears in the sticky nav, the hero, the CTA section, and the footer — four taps to a call from anywhere on the page. The quote form is a 3-field fallback for people who don't like phones.

Stack

Next.js 16 (App Router, server components), Tailwind v4 design tokens, Motion for scroll reveals, next/font for zero-layout-shift type, deployed on Vercel.

Designed & built by Blue Hippo Cyber — websites and automation for working businesses.