Whitelam.Media
Book a Call

Project

A US web development agency.

Visit the live siteAll projects
Industry
Web design and development agency
Location
United States
Year
2026
Scope
Full website design and build in Next.js
Disciplines
Web design, Frontend development, Interactive design, Animation, SEO foundations, Content migration
The agency's home page: headline, quote button and ratings

Features

What we built.

  • Designed and built from scratch in Next.js
  • A quote builder in ten short steps, with a live sketch of the site
  • An animated story that runs from one Google search to a quote request
  • Every site in the portfolio, filtered by industry
  • Search across 42 articles by question or topic
  • Every old WordPress address kept, with permanent redirects
  • One button in the footer pauses every animation on the site
  • Built to WCAG 2.2 AA, with an accessibility statement
  • A private review tool where the agency's team pins comments on any page

Whitelam Media designed and built a new website for a US web development agency, from scratch in Next.js. It replaced the agency's WordPress site, and every old address still works.

There are more than 80 pages: one for each service, six industry pages, 12 case studies and 42 articles. Visitors can configure their website in ten short steps, from the design to care after launch. A sketch of the site changes with each choice, and the agency replies with a quote by email. The portfolio shows the agency's sites by industry, each in a device or page mock-up, many of them moving.

The animations are part of the pages, drawn in code. One follows a buyer from a Google search on their phone to a quote request. Others show a page being designed and an online store coming together. Each one starts when it comes into view and loops. One button in the footer pauses every animation on the site, and visitors who ask their device for less motion get still frames.

Articles can be searched with a question or filtered by topic. The site is built to WCAG 2.2 AA and has its own accessibility statement. Behind it, the agency's team has a private review tool: they sign in with an email link and pin comments to any part of a page.

Gallery

Inside the build.

  • The agency's whole home page, top to bottom: headline and ratings, client logos, services, the quote builder, recent sites, the search story, numbers, reviews, editing, maintenance, insights and questions
    The home page, top to bottom
  • The agency's quote builder: style choices on the left and a sketch of the site in the bold style on the right
    The quote builder. Each choice changes the sketch and joins the list for the quote
  • The agency's search story: a phone showing Google results for a commercial HVAC search, beside seven numbered steps
    From one search to a quote request, an animated story with steps you can click
  • The agency's design story: a laptop showing a home page design for a sample HVAC company, beside the steps of the design process
    How a page gets designed, told on a laptop one step at a time
  • The agency's portfolio: industry filters and client sites shown on laptops and in browser windows
    Every site, by industry. Each card opens the live site
  • The agency's insights page: a large search box and topic filters with article counts
    One search box and eight topics across 42 articles
  • Three phone screens from the agency's site: the home page, a style choice in the quote builder and the Google search story
    On phones: the home page, the quote builder one step at a time and the search story

Next

Whitelam Media.

Full studio operating system. Public site, client portal, dashboards, payment and booking infrastructure.

Read the case study
Whitelam Media project

Contact

What are you trying to make happen?

Most projects start with a short conversation. We listen to the brief, ask the right questions and tell you straight what we can handle and how. The first call is free.

Prefer to pick a time? Book a 30-minute call.

Or email us directly at info@whitelam.media.