Role
Brand Designer, Web Designer, Webflow Developer
Timeline
6 weeks (mid-March to May 1st launch)
Tools
Figma, Webflow, Google Analytics, Google Search Console
Deliverable
Multi-page CMS Webflow website
40
estimate requests in April
75% → 50%
bounce rate reduction
#1
for "concrete Grand Rapids"
01 Overview

Four years in the making

Pro Concrete Services had a website, but it wasn't working as a business tool. Two separate forms confused the conversion path, an estimate form buried at the bottom of the homepage gave users no reason to stay, and required fields asking for project measurements and finish types created friction at the exact moment users were ready to reach out.

The 2026 redesign focused on one goal: turning visitors into leads. That meant simplifying the conversion path to a single estimate form, rewriting copy from company-focused to customer-focused, and rebuilding the site architecture in Webflow with CMS-powered service pages, service areas, and project galleries to support organic search performance.

The result is a site that ranks first in the local business pack for high-intent keywords like "concrete Grand Rapids," drives consistent form submissions throughout concrete season, and gives a one-person operation the digital presence to compete with established contractors.

02 The challenge

A site working against itself

The old site had accumulated four years of decisions made without a design system. Inconsistent typography, unoptimized images, and a background hero video that tanked page speed on load were the most visible symptoms. Beneath the surface, 10 services were presented without hierarchy, a 10-tab project gallery opened individual lightboxes stuffed with every photo the client had ever sent, and two separate contact forms split the conversion path with no clear direction for users who were ready to reach out.

The estimate form was the biggest friction point. Four required fields, finish type, total square footage, concrete removal, and project description, asked users to measure their project and make technical decisions before speaking to anyone. Downloading and analyzing a full year of form submission data confirmed the problem: roughly 90% of users were selecting "undecided" for finish type, signaling the field added friction without adding value. Because of this, those fields were removed entirely after confirming with the client that his estimators collect that information during the initial consult anyway.

The copy told the company's story instead of the customer's. The original hero led with "Residential Concrete Is Our Specialty" and a single CTA to start a project. The redesigned hero leads with "The Curb Appeal Your Home Deserves," a subline that communicates reliability without corporate language, and two CTAs that serve both ready-to-buy and still-browsing users. That shift, from what we do to what you get, runs through every page of the new site.

The constraint
Budget came in slightly below the project scope, and the launch window was fixed at May 1st to capture the start of concrete season. Content was handled end to end, copy written from firsthand knowledge of the business and reviewed by the client, photography selected from the owner's drone footage library. The constraint pushed toward focus: every decision had to earn its place on the page.

03 The process

Every decision earned its place

Showing all services, not teasing them

The original site showed only three services with a "View All Services" CTA, an intentionally minimal approach meant to create curiosity. In practice it hurt both SEO and usability. Search engines couldn't index services that weren't visible on the page, and users wanted to see the full picture without navigating away. This led to a 3x3 grid on desktop (list on mobile) of nine services on the homepage, removing Pool Areas and Basketball Courts due to limited project examples, and adding Concrete Repair as a service with stronger demand.

Rebuilding the project gallery around the best work

The old gallery used ten tabs with up to eight projects per tab, each opening into a lightbox stuffed with every photo the client had provided. It prioritized volume over quality and gave users no clear starting point. Because of this, the new Projects page opens with a compact hero followed by five curated project cards showing the most recent and visually varied work. Each card links to a dedicated CMS project page with a gallery of eight selected images, giving users depth without overwhelming them upfront.

Replacing the video hero with a structured image layout

The background video created two problems: page speed dropped significantly on load and visual attention went to the video rather than the copy and CTAs. The new hero uses the brand's off-white as a solid background with a structured copy block on the left and a three image layout on the right, a main 4:3 image flanked by a square and portrait image that scroll in opposite directions on scroll. On tablet and mobile the secondary images disappear to keep the focus on the primary visual and CTAs. This led to a significantly faster load time and a hero where the copy, not the background, earns the user's attention.

Building on CMS from the start

With 8 service pages and 16 service area pages, static pages were never a realistic option. Every page in those collections follows the same structure with different content, making CMS template pages the only maintainable solution. This meant the client can update project details, add service areas, and manage content without touching the underlying design. For a one-person operation, that independence was a non-negotiable deliverable.

SEO as a design decision, not an afterthought

Keyword research informed not just meta titles and descriptions but copy structure throughout the site. Strict HTML hierarchy was followed on every page. Keywords were placed in image file names and alt text, and copy was written to sound customer-facing rather than keyword-stuffed. The result is a site that ranks first in the local business pack for high-intent searches like "concrete Grand Rapids," driven by structural decisions made at the design and development stage.

04 Setbacks and pivots

What the scope didn't include

The biggest technical challenge came from a conflict between design intent and SEO requirements. Page headers were styled with a bold display font where the last word appears italic and in a red accent color, a treatment that required two separate elements inside a reusable component to render correctly. Late in the project it became clear that wrapping an H1 across two elements signals two separate sentences to search engines, undermining the page hierarchy that SEO depends on. For every crucial H1, the component was detached and restyled as a single H1 element with a span, preserving the visual treatment without compromising semantic structure.

A smaller but time-consuming Webflow discovery was Rich Text element styling. Connecting a Rich Text field to a CMS collection reset all custom styling back to Webflow defaults. The fix required styling the element on a blank page first before it would render correctly inside a CMS template. Not documented clearly anywhere, found through trial and error.

The project grew beyond its original scope mid-engagement. Service Area pages required a static Service Areas index that wasn't originally planned. A form submission redirect page, a Privacy Policy, and a 404 page were all added along the way. The scope growth against a fixed budget was a clear signal for future projects: define every page deliverable explicitly before agreeing to a price.

05 The solution

Built to convert

A conversion-focused Webflow site built on a foundation the old site never had: a design system, semantic HTML structure, CMS-powered content, and copy written around the customer rather than the company.

The homepage drives a single conversion action, the estimate form, supported by social proof, service clarity, and drone photography that lets the work speak for itself. Eight service pages and sixteen service area pages are CMS-powered, meaning consistent structure with zero manual duplication.

Every page decision, from the hero image layout to the form field reduction, was made to move a visitor one step closer to becoming a lead.

06 Launch and impact

The phone doesn't stop ringing

40
estimate requests in April
75% → 50%
bounce rate reduction
#1
for "concrete Grand Rapids"

The redesign converted a brochure site into a lead generation tool. GA data shows a consistent flow of users moving from the homepage to the contact page to the form confirmation redirect, a path the old site never established clearly.

For a one-person concrete operation, a phone that rings every day and a calendar booked through July represents the direct business value a well-structured, conversion-focused website can deliver.

Prioritizing the client's drone photography over generic stock imagery was one of the most impactful design decisions on the project. Competitors use stock. PCS shows the actual work, from above, in detail. That visual differentiation builds trust before a user ever fills out a form.