How to Write a Web Design Case Study for a Redesign Nobody Paid For
Nothing shipped, no analytics, still fine: the old site sits out in the open and your prototype is ready to deploy, so you can take numbers off both of them today.
Every guide on how to write a web design case study leans on one premise: a client existed, the site went live, and by month three you have traffic, enquiries and a testimonial to point to. The framework they hand you — overview, brief, process, solution, impact — closes on the exact section a beginner has nothing to put in. You rebuilt a real local business’s site as a portfolio prototype. No one paid, nothing shipped, and there is no analytics account you can open.
So most concept case studies trail off into adjectives: cleaner, more modern, better on mobile. That is the bit an owner glances past, and the bit a seasoned designer treats with suspicion.
A better answer exists, and it needs no launch at all. The old site is out in the open. Your prototype is ready to deploy. You can measure both today, with the same free tools and under matching conditions. That hands you a genuine before-and-after with real figures in it — and it is a sharper pitch to the business itself than any prose you could write about them.
Why a web design case study for concept work needs numbers
We went through seven of the pages ranking for this search, ranging from Webflow’s April 2026 guide to a 2021 freelancer blog post. Not one of the seven touches concept or self-initiated work on a real business. Not one shows how to measure a redesign before it launches. A single page even mentions what to do when you have no metrics, and only in one line: fall back on “qualitative wins” instead.
On a concept piece, qualitative wins are precisely the trouble. “More modern” is a judgement the owner is free to reject. A line like “on a phone your homepage takes 9 taps to reach your phone number, the prototype takes 1” is a fact they can verify on their own handset inside ten seconds.
In a concept case study, a number pulls three kinds of weight:
- It converts a matter of taste into a measurement.
- It hands the owner a line to pass along to a partner or a spouse (“it loads in a third of the time”).
- It demonstrates you grasp what counts for a local business site — something a made-up brand can never do.
What to measure: the website redesign before and after on four instruments
Keep the list tight. Four instruments, all of them free, and each one covering something a local business owner already worries about, even if that is not the word they would reach for.
1. Mobile loading. Put both pages through PageSpeed Insights with the mobile setting chosen. Note down Largest Contentful Paint (how long before the main content shows), Cumulative Layout Shift (how much the page lurches as it loads) and the total page weight. Google’s own “good” cut-offs are an LCP of 2.5 seconds or less and a CLS of 0.1 or less, so you can state which side of the line each site falls on without making up a benchmark of your own.
One detail that counts for small businesses: PageSpeed Insights only surfaces real-user “field” data once a site pulls in enough Chrome traffic. Most local business sites never do, so lab data is all you will get. That is no problem — your prototype is in the same boat, so the comparison stays like for like. Simply write “lab test” in the case study.
2. Mobile layout. Load both sites on an actual phone, not just a shrunken browser window. Write down what you genuinely see: text you have to zoom into, a menu that will not open, content spilling past the screen edge, buttons packed too tight to tap. Screenshot every fault on the old site. Those turn into your “before” frames.
3. The task test. This is the measurement no one publishes and the one owners grasp on the spot. Choose the three things a customer visits the site to do — for most local businesses those are call, find the hours and find the address or book. On a phone, beginning at the homepage, tally the taps needed to finish each. Keep a separate count of scrolls. Run it on the old site, then on the prototype.
4. Findability basics. Rankings cannot be measured on a site that is not live, so measure what search engines and customers actually read instead. Does the page title spell out the service and the town? Is the phone number real text (and tappable) or locked inside an image? Do the name, address and phone line up with the Google Business Profile? Is there LocalBusiness structured data, confirmed with the Schema Markup Validator? Each of those is a plain yes or no on both sites.
Do this by hand and most of the work is really in choosing which businesses are worth measuring in the first place. LeadReef runs that opening sweep across a city for you, surfacing local businesses whose sites fall short on mobile, upkeep and findability, so your hours go into sites that will hand you a real before-and-after.
How to measure fairly, so the numbers survive a sceptic
A prototype nearly always comes out ahead. That is exactly the reason the comparison has to be even-handed — an owner, or a fellow designer, who catches a stacked test will throw out everything else in the case study along with it.
- Deploy the prototype to a real host. A page served off your own laptop scores unrealistically high. Host it on the same sort of public infrastructure a live site would sit on.
- Use real content. The prototype has to carry the business’s own photos, services and copy, at real image sizes. A one-page mock-up with three placeholder blocks set against a live twelve-page site is no comparison at all.
- Compare like with like. Homepage against homepage. If booking lives on a sub-page of the old site, count the taps it takes to get there.
- Same day, same tool, same settings. Lab scores drift from run to run. Test each site three times, record the median, and note the date.
- Keep the raw reports. Hold on to the PageSpeed report links or exports. If anyone challenges a figure, you can point straight to its source.
Measured, projected and unknown: what a concept case study can claim
This is the honesty rule that keeps a concept case study believable. Every sentence in it lands in one of three buckets, and the reader should always be able to tell which one.
Measured — you ran the test on both sites: load time in a lab test, page weight, taps to call, whether the phone number is tappable. Present these as facts, with the date attached.
Projected — a fair expectation drawn from what you measured, and flagged as exactly that: “a phone visitor should reach the booking form sooner.” Reach for should and expected, never the past tense.
Unknown — anything that hinges on the site actually going live: more calls, more bookings, higher rankings, more revenue. Leave these out completely. Some of the before-and-after “results” ranking for this search are percentage lifts with no source named. A concept piece that copies that habit is inventing figures about a real, named business, and that is the quickest way there is to forfeit the owner’s trust.
A web design case study template for concept redesigns
Six brief sections. The whole thing ought to fit inside one screen per section.
- The business and the one-line problem. Name, trade, town. Then the problem framed as a measurement rather than a jab — for instance: “On a phone, the homepage takes 7 seconds to show anything useful and 9 taps to reach the phone number.”
- The label. Say outright that this is an unsolicited concept, not paid client work, and give the date.
- The before-and-after table. Four rows — mobile loading, mobile layout, task test, findability — each carrying the old site, the prototype and the test date.
- Three decisions. For each one: what you altered, why, and the number it shifted. “Phone number moved into a fixed header: taps to call fell from 9 to 1.”
- What is not known yet. A single sentence: the site has not launched, so no traffic or enquiry data exists.
- Screens. Old and new, side by side, phone view first.
That covers it. Process sections stuffed with mood boards and personas belong to product design roles; a local business owner just wants the table and the screens.
Turning the website redesign case study into the pitch
The case study is not just portfolio fodder. That same page, sent to the owner of the business it is about, is the strongest cold pitch you can write. You are not telling them their site is bad — you are handing them four measurements they can check on their own phone, plus a working alternative. There is a first line for each failure if you want the exact wording.
Keep the numbers in the portfolio version and the pitch version exactly the same. The one thing that changes is the covering note. If the owner agrees, grab their current Google Business Profile and Search Console figures before the new site goes live; that baseline is what allows this concept case study to become a client case study later.
People also ask
What is a case study in web design?
A brief, organised write-up of a single project: the problem you found, the choices you made, and the difference they made. On a concept piece, that “difference” means numbers you took from the old site and the prototype — not visitor stats you were never able to collect.
How to properly write a case study?
Open with the problem stated as a measurement, put the before-and-after on display, walk through three decisions and the figure each one shifted, and be plain about what you still cannot know. Hold each section to a single screen.
How do you measure website success?
Once it is live, you track enquiries, calls, bookings and search visibility as they move over time. Beforehand, you measure whatever can be compared right now: mobile loading in a lab test, how the layout behaves on an actual phone, the taps it takes to finish the main jobs, and the basics of findability.
How to create a UX case study?
The shape is much the same, though UX case studies normally call for research and user testing. On a local business redesign, the task test — tallying the taps to call, find the hours and book — is a pared-down form of that testing that one person can run solo.
Measure first, then write
Take one of your concept pieces this week, run the four measurements across both versions, and rebuild its case study around the table. If you do not have a concept piece yet, begin with the business rather than the design: track down a local site that flunks the task test on a phone.
LeadReef turns up those businesses for you. Your first 10 leads cost nothing: choose from 10 business types and 10 locations, in any mix you like, at leadreef.ai/find.