How to Build a Case Study Page That Wins Agency Clients on Squarespace
Introduction
A case study page isn't just a portfolio tool—it's your most powerful sales asset. When prospects evaluate your agency, they're asking a single question: Have you solved problems like ours? A well-structured agency case study page on Squarespace answers that question with credibility and specificity that no sales pitch can match.
The difference between an average case study and one that actually wins clients lies in structure, clarity, and strategic design. Most agencies bury their best work in a generic gallery or PDF. The result? Lost opportunities. This guide shows you how to build an agency case study page that transforms interested prospects into paying clients using the STAR-R Framework and Squarespace's design capabilities.
Whether you're a marketing agency showcasing campaign results, a strategy consultancy demonstrating business impact, or a design firm exhibiting creative excellence, the principles in this post will help you present your work in a way that speaks directly to decision-makers' concerns. We'll cover the technical setup, the storytelling framework, and the design patterns that convert.
Key Takeaways How to Build a Case Study Page That Wins Agency Clients on Squarespace
Case studies are decision-making tools for prospects—structure them to address buying criteria, not showcase creativity alone
The STAR-R Framework (Situation → Target → Approach → Result → Relationship) provides a repeatable structure that works across agency types
Visual-first case studies suit creative and marketing agencies; outcomes-driven formats work better for strategy and consulting firms
Client permission for case studies must be explicit and documented, including approval of results and metrics disclosed
A single case study page should focus on one client problem-solution pair; link multiple studies from a portfolio hub
Design your case study for mobile-first scanning—decision-makers skim on their phones before deciding to read fully
Squarespace's image galleries, summary blocks, and custom CSS make it straightforward to build conversion-focused case study layouts without code
Why Case Studies Win Clients
Professional service buyers follow a predictable decision-making pattern. They move from awareness of a problem to evaluation of potential solutions. In the evaluation phase, they want social proof—evidence that your agency has solved similar problems, delivered measurable results, and understood their industry's constraints.
A case study satisfies this need better than testimonials, awards, or team bios. It shows, rather than tells. It demonstrates process, not just outcome. It lets prospects imagine working with you on their own challenges.
Case studies also address a critical gap in your website's navigation. Your homepage establishes credibility. Your services pages explain what you do. Your case study pages answer the crucial question: What's the proof?
Agencies that build dedicated case study pages—rather than hiding studies in blog archives or PDFs—see measurable improvements in inquiry quality and sales cycle speed. Prospects who engage with a case study are further along the buying journey than those browsing service descriptions.
The STAR-R Framework for Agency Case Studies
The STAR-R Framework is a storytelling structure designed for agency case studies. It creates consistency across multiple studies whilst remaining flexible enough to accommodate different agency types, project scales, and client industries.
STAR-R stands for:
Situation: The client's starting point—what challenge, constraint, or opportunity prompted them to seek external help. This section should emphasise the client's perspective, not your agency's expertise yet. Answer: What was happening? What problem needed solving? What had they tried before?
Target: The specific goal or outcome the client wanted to achieve. Distinguish between vague aspirations and measurable targets. Answer: What did success look like? What metric mattered most? What was the timeline?
Approach: How your agency tackled the problem. This is where you detail your methodology, process, and strategic choices. Show your thinking, not just your output. Answer: What was your strategy? Which channels, tools, or techniques did you use? Why did you make these choices?
Result: Quantified outcomes, where possible, plus qualitative impacts. Lead with numbers: revenue growth, time savings, audience expansion, cost reduction. Then add context. Answer: What changed? By how much? What secondary benefits emerged?
Relationship: How your work continued beyond the initial project. Did the client extend the engagement? Did they refer you? Are you still working together? This demonstrates partnership and ongoing value, not a one-off transaction.
In practice, the STAR-R framework looks like this:
Situation: A B2B SaaS company with £2M ARR was spending £40k monthly on paid search ads but seeing declining ROI. Their website conversion rate sat at 1.2% across all channels.
Target: Improve overall conversion rate to 3% within 12 months whilst reducing paid search spend to £25k monthly.
Approach: We conducted a full-funnel audit, identifying drop-off points in their messaging hierarchy. We redesigned landing pages using audience segmentation, implemented progressive profiling on forms, and retrained their sales team on qualified lead qualification. We also shifted 30% of paid search budget to account-based marketing targeting their ICP.
Result: Conversion rate improved to 3.1% within 9 months. Paid search ROI improved 38%. Pipeline value per visitor increased 44%. Year-on-year revenue grew 28%.
Relationship: The client expanded the engagement to include their customer onboarding flow. We've now worked together for 18 months and manage their entire growth marketing function.
This structure works because it mirrors how buyers evaluate solutions. They care about your understanding of their problem, your methodology, your results, and your commitment to long-term partnership.
Client Permission for Case Studies: Legal and Ethical Considerations
Before publishing any case study, secure explicit written permission from the client. This protects both parties and ensures transparency.
Identifying information: Will you use the client's actual company name and logo, or anonymise them? Anonymous case studies are acceptable if the results are compelling, but named case studies carry more weight. Always ask which the client prefers.
Results and metrics: Does the client approve the specific numbers and outcomes you're publishing? They may be sensitive about revenue figures, market share, or cost reductions. Agree on which metrics are appropriate to disclose.
Timeline: How long after project completion do they wish to wait before the study is published? Some clients want a 30-day quiet period.
Industry sensitivity: Does the case study reveal something about the client's competitive position or strategy that they'd prefer to keep confidential? A consulting firm might not want a case study revealing their pricing restructuring, for example.
Right to review: Give clients the opportunity to review the case study before publication. Make it clear you welcome factual corrections but reserve the right to make editorial decisions about tone and focus.
Duration: Is the permission indefinite, or do they request removal after a set period (e.g., two years)?
Document this approval in writing—email is sufficient—and retain records. If you're working with a larger client with legal departments, they may provide a case study permission form as part of your contract.
Ethical case study practices build trust with clients and encourage referrals. Clients who feel respected in how their work is portrayed become advocates who actively promote your agency to their networks.
Visual vs. Outcomes-Driven Case Study Formats
Agency case studies come in two primary formats, each suited to different service categories.
Visual-First Case Studies work best for creative and marketing agencies whose output is primarily visual or conceptual.
Ideal for: Graphic design agencies, brand design firms, packaging specialists, web design agencies, video production companies, advertising agencies, illustration studios.
Structure: Lead with high-quality images, moodboards, or video content. The visual work should occupy 40–60% of the page. Accompany with a concise narrative (600–900 words) explaining the strategic thinking behind the visual choices. Include specific metrics where applicable, but the visual appeal is the primary conversion driver.
Design approach: Use Squarespace's gallery features prominently. Showcase before-and-after comparisons. Embed video case studies. Use large images that demonstrate quality and attention to detail.
Outcomes-Driven Case Studies emphasise measurable business results and strategic methodology.
Ideal for: Management consultancies, business strategy firms, digital transformation consultants, market research firms, financial advisory practices, HR consultancies, operations improvement specialists.
Structure: Lead with the challenge and the results. Use data visualisation—charts, graphs, infographics—to communicate impact. The narrative (1,000–1,400 words) focuses on methodology, industry context, and the thinking behind recommendations. Visuals are secondary; they support the story but don't drive it.
Design approach: Use Squarespace's summary blocks to highlight key metrics. Incorporate charts created in tools like Figma or Canva. Use clean typography and ample white space. Make numbers scannable.
Hybrid Case Studies combine both approaches. A marketing agency implementing a brand repositioning strategy might lead with visual work, then follow with ROI metrics. A design firm improving a client's website might showcase the design, then highlight conversion improvements.
The choice between formats depends on what convinced your client to hire you, and what will convince prospects to do the same. Visual agencies win on the strength of their aesthetic judgment and creative problem-solving. Strategy firms win on their ability to impact measurable business outcomes. Know your agency's primary value proposition, and structure your case study accordingly.
Designing Your Case Study Page on Squarespace
Page Structure and Layout
Squarespace's page builder makes it straightforward to construct conversion-focused case study layouts. Here's a recommended structure:
Hero section: Client name (or anonymised category), project title, key result. Use a high-quality project image or brand colour. Keep this section tight—three elements maximum.
Client snapshot: A two-or three-column section detailing the client's industry, size, and core business. 50–100 words total. This establishes context for the reader.
Challenge/Situation: Dedicated section describing the problem. Use a background colour or subtle pattern to distinguish this section visually. One focused paragraph (100–150 words).
Goals/Target: What success looked like. Use a bulleted list or a summary block highlighting 3–4 key targets. Keep descriptions short (10–15 words each).
Our Approach/Strategy: Your methodology. This is your longest content section (400–600 words). Use subheadings, short paragraphs, and visual breaks. Consider adding screenshots, process diagrams, or workflow diagrams here.
Results/Outcome: Lead with numbers in a visually prominent way. Use Squarespace's summary blocks to display key metrics in large type. Follow with 150–200 words of narrative explaining secondary impacts and lessons learned.
Relationship/Next Steps: A concluding section explaining ongoing work or implementation outcomes. End with a call-to-action: Interested in similar results?
Let's talk about your challenge.
Design Best Practices on Squarespace
Use colour strategically: Assign a different accent colour to each section (Situation, Approach, Results). This improves scanability and creates visual hierarchy without overwhelming the page.
Images matter: Use high-resolution images. Poor-quality screenshots or pixelated graphics undermine credibility. Invest in professional photography if the case study includes office settings or team photos.
Mobile-first design: Test your case study on a smartphone. Prospects often skim case studies on mobile before deciding to engage. Ensure key metrics are readable at mobile widths. Avoid multi-column layouts that compress poorly.
Whitespace is your friend: Squarespace's default spacing works well, but increase margins between sections (40–60 pixels) to improve readability and create visual breathing room.
Typography: Stick to Squarespace's native fonts or Google Fonts. Limit yourself to two fonts: one for headlines (sans-serif, heavier weight) and one for body text (sans-serif, lighter weight, 16px minimum on mobile). Avoid decorative fonts.
Call-to-action placement: Include a prominent CTA button at the page's bottom . Make it visually distinct from the rest of the page. Aim for contrast ratio compliance (WCAG AA standards).
Related case studies: If you have multiple studies, include a Related case studies section at the page's bottom, linking to 2–3 similar projects. This keeps prospects exploring your work.
Three Before-and-After Case Study Page Examples
Example 1: Creative Agency—Visual-First Case Study
Before: A design agency's case study consisted of a blog post with six project images embedded inline, followed by three paragraphs of narrative. The images were small (400px wide), and the page had no visual hierarchy. Prospects scrolled past the work without understanding the creative brief or business results.
After: The redesigned case study page opens with a full-width hero image (the final design). A sticky header displays Revenue improved 32% year-on-year as the visitor scrolls. The Approach section includes a side-by-side before-and-after carousel. The Results section uses summary blocks to display engagement metrics, impressions, and conversion lift. A video case study is embedded mid-page. Prospects now spend an average of 4 minutes on the page (up from 90 seconds), and 28% click through to the contact form.
Example 2: Strategy Consultancy—Outcomes-Driven Case Study
Before: A consulting firm's case study was a downloadable PDF. The link to the PDF sat on a generic Work page with no context. Few prospects actually downloaded it. Those who did found dense text, tiny charts, and no clear navigation.
After: The PDF case study was converted into an interactive Squarespace page. The Situation section explains the client's market challenge using narrative and a simple timeline graphic. The Approach section breaks down the consultancy's methodology into four phases, each with a subheading and visual progress indicator. The Results section leads with a large data visualisation showing before-and-after performance across five KPIs. The page is scannable, interactive, and optimised for mobile. Prospects can now engage with the study directly on the website, reducing friction. Case study page views increased 3x; quality-qualified inquiries increased 45%.
Example 3: B2B Marketing Agency—Hybrid Case Study
Before: A marketing agency's case study showed campaign screenshots and vague results (We increased their visibility and engagement). The page was text-heavy, with no clear structure. Visitors couldn't quickly understand the challenge, the solution, or the ROI.
After: The revised case study uses the STAR-R framework explicitly. The Challenge section uses a pull quote from the client describing their frustration. The Approach section includes screenshots of the campaign creative, email templates, and landing pages arranged in a visual timeline. The Results section displays a chart showing lead volume growth (month-by-month), cost-per-lead decline, and sales pipeline impact. Summary blocks highlight the three most important metrics. A testimonial video from the client appears below the results. The page now converts at 6.2% (prospects who visit and click the contact button), up from 1.8%.
Content Elements Every Agency Case Study Needs
A complete agency case study includes these core components:
Client identification
Project scope
The challenge
Clear goals
Your approach
Quantified results
Qualitative outcomes
Client quote or testimonial
Visual evidence
Next steps or ongoing relationship
Lesson or insight
Clear call-to-action
Omitting any of these elements creates gaps. For example, a case study without quantified results forces prospects to infer impact. A case study without your methodology makes it impossible for prospects to understand your thinking.
Optimising Case Study Pages for Search and Conversion
SEO Optimisation
Case study pages should rank for branded keywords (your client name + results type) and informational keywords related to the problem you solved.
Title tags: Include the client name, project type, and key result. Example: B2B SaaS Conversion Optimisation Case Study | Agency Name | 44% Revenue Growth.
Meta descriptions: Summarise the situation and result in 150–160 characters. Example: See how we improved conversion rates from 1.2% to 3.1% for a B2B SaaS company. Strategy, implementation, and measurable results.
Headings structure: Follow a logical H1 → H2 → H3 hierarchy. Your page title is H1. Use H2s for Situation, Approach, Results. Use H3s for sub-points within each section.
Internal linking: Link from your services pages to relevant case studies. Link from case studies to service pages and resource guides. Build a content network that establishes topical authority.
Image alt text: Describe images clearly. Instead of image-1.jpg, use Screenshot of the redesigned landing page showing the new value proposition section. This helps screen readers and provides SEO signals.
Page speed: Optimise images for web (72 dpi, compressed). Squarespace handles most of this automatically, but avoid embedding large video files directly; use YouTube or Vimeo embeds instead.
Conversion Optimisation
Mobile experience: Test your case study on iPhone and Android devices. Ensure summary blocks stack appropriately, images display clearly, and the CTA button is easy to tap.
Scannable format: Use short paragraphs, bulleted lists, and visual separators. Prospects spend an average of 10–15 seconds deciding whether to engage further; make key information available at a glance.
Visual variety: Alternate between text sections and images or videos. A full page of text, no matter how well written, feels monotonous. Break up content every 150–200 words.
Social proof: Include the client's logo prominently. If you have permission, include a testimonial video or audio quote. These signals increase trust.
Clear CTA copy: Use specific, benefit-driven CTA text instead of generic buttons. Instead of Contact us, try See how we can improve your conversion rate or Discuss your marketing challenge with our team.
Exit-intent pop-up (optional): If a prospect scrolls past the case study without clicking the CTA, show a pop-up with a lead magnet offer. Squarespace doesn't support native exit-intent, but tools like Sumo or Optin Monster integrate via custom code.
-
An ideal case study page is 1,200–2,000 words of total content (including headings, subheadings, and short captions). The narrative itself—excluding metrics, images, and callouts—should be 800–1,200 words. Mobile readers skim; desktop readers may read fully. Structure your content so key information (Challenge, Result, CTA) is accessible in the first 30 seconds of scrolling, and detailed methodology is available for those who engage deeper.
-
Every agency case study must include: (1) clear identification of the client or project category, (2) the specific challenge or problem, (3) your strategic approach, (4) quantified results (revenue, traffic, conversions, efficiency gains), (5) qualitative outcomes (process improvements, strategic learnings), (6) evidence (images, videos, charts, testimonials), (7) an explanation of ongoing work or relationship development, and (8) a clear call-to-action inviting prospects to engage further. Missing any of these elements reduces the case study's persuasive power.
-
Start with a hero section (client name + key result). Follow with a short client snapshot (industry, size, focus). Then build sections matching the STAR-R framework: Situation (challenge), Target (goals), Approach (methodology), Result (outcomes), Relationship (ongoing work). Use Squarespace's Summary Blocks to highlight key metrics visually. Use background colours to distinguish sections. Include 3–5 images or visual elements (charts, screenshots, photos) distributed throughout the page. End with a prominent CTA button and a link to other relevant case studies.
-
Aim for 3–6 case studies initially, representing your best work and different client types. Quality matters more than quantity. A website with three exceptional, detailed case studies outperforms a site with twelve poorly documented studies. As your agency grows, add case studies selectively—one every quarter or so. Prioritise case studies that demonstrate results in industries or problem areas where you're actively pursuing new clients.
-
If the client approves, use their name and logo. Named case studies carry more weight and build your agency's reputation in specific industries. However, some clients require anonymisation due to competitive sensitivity or privacy policies. Anonymous case studies are acceptable if the results are compelling and the industry/context is clear enough for prospects to relate. A middle ground: name the client's industry and approximate size, but not the specific company name.
-
After a successful project, request permission in writing (email is sufficient). Specify: the metrics you plan to publish, whether you'll use the client's name, the planned publication date, and how long you'll keep the case study published. Provide a draft for their review 2–3 weeks before publication. Make clear you welcome factual corrections but retain editorial control. Most clients appreciate the opportunity to be featured; frame it as recognition of their success, not a promotional tool for your agency.
-
Lead with metrics that matter to your prospect audience. For B2B agencies: revenue growth, lead generation, cost-per-acquisition, customer lifetime value, pipeline expansion. For creative agencies: engagement, reach, brand awareness lift, conversion improvements. For consultancies: cost savings, efficiency gains, time-to-value, team productivity. Choose 3–5 metrics maximum per case study. Too many numbers overwhelm readers; focus on what most directly demonstrates ROI or business impact.
Conclusion
Case studies are not vanity marketing. They're decision-making tools. A prospect evaluating your agency against competitors is asking: Can you solve my specific problem? What will it cost? How long will it take? What results should I expect?" Your case study page answers these questions with evidence, not claims.
The STAR-R Framework provides a repeatable structure that builds credibility through clarity. Client permission ensures ethical practice and builds lasting relationships. Strategic design—whether visual-first or outcomes-driven—matches how your prospects make decisions. And Squarespace gives you the tools to build and publish case study pages without needing developers or designers.
The agencies winning new clients are those who document their work strategically, invest in quality design and photography, and make case studies the centrepiece of their business development effort. Your next major client is already evaluating you. Make sure they find a case study that proves you're the right choice.
From custom website design to SEO strategy, we help businesses launch a site that looks professional and performs better.
Author Bio
I'm Walid Hasan, a Certified Squarespace Expert and Squarespace Circle Platinum Partner with over 12 years of hands-on experience designing and optimizing high-performing websites. Over the years, I've had the privilege of building more than 2,000 Squarespace websites for clients around the world, always focusing on clean design, strong user experience, and conversion-driven results.
