How to design case study pages that win work

A founder lands on your case study at 10:40pm, halfway through shortlisting three studios. She gives you perhaps ninety seconds. She is not reading; she is pattern-matching. Have they solved my kind of problem? Do they think clearly? Can I defend hiring them to my board? Your case study page answers those questions or it doesn't, and no amount of parallax will cover for a shrug.

We rebuilt our own /work section twice before it felt honest, and we've designed case-study formats for clients from record labels to providores. This is the anatomy we keep returning to — written for studios and freelancers, useful for anyone selling expertise with a portfolio.

The narrative arc: circumstance before solution

Most case studies open with the solution. "We built a headless storefront with edge rendering." Nobody outside your standup cares yet. Stories grip when the reader understands the stakes first, and stakes live in the circumstance:

  1. Who they are and what was at risk. One paragraph, specific numbers if the client allows. "Fernleigh Wines had a cellar door full of loyal visitors and an online store converting at a third of the industry median" is a circumstance. "Fernleigh Wines is a leading wine brand" is wallpaper.
  2. The challenge, honestly framed. Include the constraint that made it hard — the budget, the legacy platform, the founder who hated the colour green. Constraints are what make your decisions legible as decisions rather than defaults.
  3. The approach, told as choices. Not a process diagram. The three or four forks where you could have gone another way, and why you didn't. This is the only section that actually demonstrates how you think.
  4. The outcome, with hedged, believable numbers. More on honesty below.
  5. What the client says. One quote, attributed, that sounds like a person talking.

When we wrote up the Wattle & Daub reservations project, the whole piece hangs off one circumstance: a dining room that was full Friday, empty Tuesday, and a booking flow leaking a third of its would-be guests. Every design decision in the study — the persistent availability strip, the two-tap booking — reads as an answer to that circumstance. Strip it out and the same work description becomes a features list.

Proof placement: evidence where the doubt lives

Readers don't doubt evenly. Doubt arrives at specific moments, and evidence should be waiting:

  • At the top: one result, one image. A single headline outcome ("Tuesday covers up 61%" — clearly labelled as illustrative on our site, since ours is a concept studio) beside one image that shows the work, not a mockup floating in a gradient. If you only get ninety seconds, spend them here.
  • Beside every claim: the artefact. The moment you write "we simplified onboarding to three steps", the screenshot of step two should be in eyeline. Claims without adjacent artefacts read as adjectives.
  • After the approach: the messy middle. One honest paragraph about what went wrong or what got cut. Nothing builds trust like a controlled admission. Our Brightmarsh onboarding case study admits the first prototype tested worse than the original — and that paragraph is the most quoted one in client conversations.
  • At the end: the client's voice. Not praise — perspective. "They told us no in week three and they were right" sells harder than "great team, highly recommend".

Metrics honesty: the fastest way to be believed

Fake precision is everywhere in agency portfolios: "+340% engagement!" — a number so context-free it could describe a loading spinner. Sophisticated buyers discount it to zero. The credibility hierarchy, strongest first:

  1. Named, dated, directional numbers with a baseline. "Checkout completion rose from 54% to 71% in the eight weeks after launch."
  2. Relative change with the baseline stated. "+31% against the previous quarter's average."
  3. Time-bound qualitative claims. "Support tickets mentioning the configurator fell by a third within a month."
  4. (Never.) Unsourced percentages with no unit, no baseline, and no date.

State your measurement window. State what you didn't measure. If the project is under NDA, say so and show the thinking instead — a well-reasoned approach section with anonymised screenshots beats invented numbers, and buyers who've been burned can tell the difference at a glance. Every metric on our own case-study pages is labelled illustrative, because Brassfern is a concept studio; the label costs us nothing and buys trust anyway. That is the paradox of honesty in portfolio design: it converts better than the lie.

Design the page for a scanner, reward the reader

The 10:40pm founder scans. The design lead she forwards it to next morning reads deep. The page must serve both, in the same markup:

  • A scannable skeleton. Challenge / Approach / Outcome subheads, a facts rail (client, sector, services, year, stack), and one-line captions under every image. A scanner should reconstruct the whole story from headings and captions alone.
  • Typography that flatters long reading. 66–75 characters per line, real paragraph rhythm, sectional breathing room. If your case study is 1,500 words set in 15px grey on white, you've told the design lead you don't respect reading — an odd message from a studio. This is where your brand voice either survives contact with a long page or dissolves into lorem-grade filler.
  • Images that behave. Fixed aspect ratios so the page doesn't jump as assets load, alt text that actually describes the work, captions that add information rather than repeat it. Image carousels are where case studies go to hide; if a screenshot matters, lay it out large.
  • Related work at the foot. Two or three studies in adjacent industries or services. The reader who finishes is your warmest prospect — give them somewhere to continue that isn't the back button.

The CTA that doesn't beg

The default agency case study ends with "Like what you see? Let's chat!" — a sentence that spent all its credibility by the second word. The reader at the bottom of a strong case study is already persuaded; the CTA's only job is to make the next step specific and low-pressure.

What works:

  • Name the actual next step. "Tell us about your project" linking to a real, respectful brief form beats "Get in touch" linking to a mailto.
  • Offer the parallel path. "Or see how we price engagements" — the reader who isn't ready to talk is ready to read, and pricing pages are where serious buyers go next.
  • Keep it to one ask. Two competing CTAs at the foot of a case study halves response to both.

Tone matters most here. You've just spent 1,200 words demonstrating competence. End like it. "If this is the kind of problem you're sitting on, we should talk" is a peer speaking. "Let's make something amazing together 🚀" is a stranger asking for a lift.

What to leave out

  • Process theatre. Persona galleries, journey maps, and affinity diagrams included to imply rigour. Include process artefacts only when one changed the outcome, and say how.
  • Every screen you designed. Five images that each earn their place beat thirty in a grid.
  • Your own adjectives. "Stunning", "cutting-edge", "seamless". The reader's adjectives are the only ones that count; your job is to supply the nouns and verbs that generate them.
  • The decade-old trophy. Three recent, honest case studies outrank a museum. Retire studies older than your current capabilities.

Key takeaways

  • Open with circumstance and stakes, not the solution — solutions only matter to readers who feel the problem.
  • Place proof where doubt naturally arrives: one result at the top, artefacts beside every claim, one honest paragraph about what was hard.
  • Honest metrics with baselines and windows convert better than fake precision; label what's illustrative and say what you didn't measure.
  • Build the page for a ninety-second scan that a deep reader can drill through: skeleton headings, captions that carry plot, typographic comfort.
  • End with one specific, low-pressure next step delivered in a peer's voice — never a beg.

FAQ

How long should a case study be?

Long enough to show the thinking — usually 900–1,500 words with five to eight images. If you can tell it honestly in 600, do. If a reader skims your headings and captions and can't reconstruct the story, the problem is structure, not length.

What if the project is under NDA?

Write the study about the problem and the reasoning. Anonymise the client ("a national insurer"), redraw or abstract screenshots, and say plainly that details are withheld. Buyers respect a handled NDA; it previews how you'll treat theirs.

Should every project get a case study?

No. Publish the studies that represent the work you want more of. A portfolio is an instruction to the market, and a study you're faintly embarrassed by is an instruction you'll regret.

How often should case studies be updated?

Revisit six to twelve months after launch to add outcome data — the numbers age into your best evidence. Retire any study that no longer represents how you work; our own work index is pruned like a garden, and it's healthier for it.


Keep reading