case study of websites

• All Headlines

Top 40 Most Popular Case Studies of 2021

Two cases about Hertz claimed top spots in 2021's Top 40 Most Popular Case Studies

Two cases on the uses of debt and equity at Hertz claimed top spots in the CRDT’s (Case Research and Development Team) 2021 top 40 review of cases.

Hertz (A) took the top spot. The case details the financial structure of the rental car company through the end of 2019. Hertz (B), which ranked third in CRDT’s list, describes the company’s struggles during the early part of the COVID pandemic and its eventual need to enter Chapter 11 bankruptcy. 

The success of the Hertz cases was unprecedented for the top 40 list. Usually, cases take a number of years to gain popularity, but the Hertz cases claimed top spots in their first year of release. Hertz (A) also became the first ‘cooked’ case to top the annual review, as all of the other winners had been web-based ‘raw’ cases.

Besides introducing students to the complicated financing required to maintain an enormous fleet of cars, the Hertz cases also expanded the diversity of case protagonists. Kathyrn Marinello was the CEO of Hertz during this period and the CFO, Jamere Jackson is black.

Sandwiched between the two Hertz cases, Coffee 2016, a perennial best seller, finished second. “Glory, Glory, Man United!” a case about an English football team’s IPO made a surprise move to number four.  Cases on search fund boards, the future of malls,  Norway’s Sovereign Wealth fund, Prodigy Finance, the Mayo Clinic, and Cadbury rounded out the top ten.

Other year-end data for 2021 showed:

• Online “raw” case usage remained steady as compared to 2020 with over 35K users from 170 countries and all 50 U.S. states interacting with 196 cases.
• Fifty four percent of raw case users came from outside the U.S..
• The Yale School of Management (SOM) case study directory pages received over 160K page views from 177 countries with approximately a third originating in India followed by the U.S. and the Philippines.
• Twenty-six of the cases in the list are raw cases.
• A third of the cases feature a woman protagonist.
• Orders for Yale SOM case studies increased by almost 50% compared to 2020.
• The top 40 cases were supervised by 19 different Yale SOM faculty members, several supervising multiple cases.

CRDT compiled the Top 40 list by combining data from its case store, Google Analytics, and other measures of interest and adoption.

All of this year’s Top 40 cases are available for purchase from the Yale Management Media store .

And the Top 40 cases studies of 2021 are:

1.   Hertz Global Holdings (A): Uses of Debt and Equity

2.   Coffee 2016

3.   Hertz Global Holdings (B): Uses of Debt and Equity 2020

4.   Glory, Glory Man United!

5.   Search Fund Company Boards: How CEOs Can Build Boards to Help Them Thrive

6.   The Future of Malls: Was Decline Inevitable?

7.   Strategy for Norway's Pension Fund Global

8.   Prodigy Finance

9.   Design at Mayo

10. Cadbury

11. City Hospital Emergency Room

13. Volkswagen

14. Marina Bay Sands

15. Shake Shack IPO

16. Mastercard

17. Netflix

18. Ant Financial

19. AXA: Creating the New CR Metrics

20. IBM Corporate Service Corps

21. Business Leadership in South Africa's 1994 Reforms

22. Alternative Meat Industry

23. Children's Premier

24. Khalil Tawil and Umi (A)

25. Palm Oil 2016

26. Teach For All: Designing a Global Network

27. What's Next? Search Fund Entrepreneurs Reflect on Life After Exit

28. Searching for a Search Fund Structure: A Student Takes a Tour of Various Options

30. Project Sammaan

31. Commonfund ESG

32. Polaroid

33. Connecticut Green Bank 2018: After the Raid

34. FieldFresh Foods

35. The Alibaba Group

36. 360 State Street: Real Options

37. Herman Miller

38. AgBiome

39. Nathan Cummings Foundation

40. Toyota 2010

19 Examples of Online Case Studies Done Right

Designers generally don’t like writing. After all, creative problem-solving through design uses visual, not verbal tools, right? But, sadly for many, case studies are supposed to contain text, too. This is where a lot of designers and art directors stumble, ending up either with poorly crafted case studies, or no case studies in their portfolio at all. And that’s a huge mistake. Online case studies (because these days, if it’s not online, it’s not there at all) are immensely important as they provide a compact, informative display of not just your skills and expertise, but your professionalism too. A good case study shows that you understand the concept of focus, that you can distinguish between different layers of relevance and also sheds some light on your creative process. As such, case studies are an indispensable hiring tool.

That being said, let’s see how the visually-oriented folks can craft a case study that ticks all the right boxes.

Quick Tips for Designing Perfect Online Case Studies

If you’re in doubt as to where to start with your case studies, here are a few things to keep in mind:

• Stay focused . Don’t use case studies as an opportunity to channel your revolutionary ideas, but don’t delve in conventionalities, either. Don’t try to tell everything about the project at once, or at all. Your clients don’t need to know everything you did for a project. But they do need to know the relevant bits.
• Provide a solid structure. Scannable content is the form that works the best, whatever the format. Separate your key information in tidy, well-rounded units. These include, but are not limited to: project target/goal/outcome, background, evaluation, concept, implementation, conclusion.
• Provide essential project information. Viewers need the who, the what and the when.
• Treat the page as a gallery wall. Consider your own portfolio style and create case study pages that are in line with it, but also convey the character and the spirit of the project, too. When displaying visual material, don’t just scatter it around the page – it won’t impress anyone. Try exhibiting it in engaging, interactive frames, add interaction for better immersion, and display the material in their intended environment – various device screens, etc.
• Maintain good measure. You want to dazzle the visitors, not blind them. If your case studies are too cluttered, flashy or visually saturated, they might create an undesired effect. Go for minimalism, but avoid making your pages look poor.

Sure, things like these are sometimes easier said than done. That’s why we prepared a curated selection of the best, most inspiring online case studies we handpicked around the web, hoping to give you some cues and ideas for your own cases. Here’s what we’ll talk about:

Juicebrothers by Lama Lama

Art of swissdent by creative nights, max shkret by zhenya rynzhuk, mercado by loer architecten, self scenter by ultranoir, fontshare by wemakefab, more & more nespresso by playful, bian 2016 by baillat studio, prada employees online store by niccolò miranda, ortovivo by k95, obys agency typography principles, komuso design by tubik, the 92 group by humana studio, dreamhaus by wørks studio, topline by parsons branding, weekend by hello today, posted by fuge, decathlon app by fuego camina conmigo, unstuck by violet office.

If you read our piece on creative page transitions , you probably remember Lama Lama , a creative digital agency from Amsterdam, and their Juicebrothers project. The case study for the project (the organic, cold-pressed juice brand from Netherlands) is presented in a combination of playfulness and youth typical of Lama Lama, and a high level of professionalism, also typical of the agency . The main visual motif is the beautiful deep green color that communicates health and vitality, featured extensively in layouts for the Juicebrothers website. Small white typography conveys just the right amount of information about the project and allows the imagery to take center stage. The case study page opens with a sort of split screen between bits of text on the left and a vertical image gallery to the right, and then proceeds with larger image and video sections displaying selected bits of visual content for the brand. All the while, we also get to play with the cursor effect – an oversized, pixelized snake trail that follows the mouse movements.

Creative Nights is a UX design consultancy and creative studio headquartered in Prague, with an impressive roster of international projects. One of these projects is the website for the renowned dental products brand, Swissdent. Art of Swissdent is designed as a crossover between an eCommerce website and an online presentation of the brand. The case study , available at the agency’s website in their Works section, follows the style and the look of the agency’s branding and design, and the selected imagery from the project is given in beautiful frame sections with round edges. The entire page is perfectly balanced in terms of atmosphere, colors and dynamics , and makes the displayed work appear as an integral part of the agency’s own aesthetics, even if that may not necessarily be the case. The page ends with three fun, oversized buttons that the visitors can use to share their impressions with the agency.

Zhenya Rynzhuk is an architect-turned-art director with a solid industry experience and quite a few awards under her belt. Her website, which has received accolades for overall design as well as for mobile excellence, features some innovative design solutions, plenty of interactivity and just the right amount of brutalist details to keep things exciting in a minimalist environment . The Work section features several case studies for the projects Zhenya is most proud of, including art direction and interface design for Max Shkret , an award-winning digital artist creating 3D digital models. After an airy, minimalist and monochromatic section introducing the project, the page proceeds with a scroll-animated gallery of select project imagery. The images of Shkret’s digital models of animals (for which he hopes to raise enough money to turn into actual physical objects) are presented in successive full-width sections, each with a background that matches the object chromatically), resulting in an interesting, exciting stroll through Shrek’s imaginary world . This layout also adds a welcome touch of color to Zhenya’s generally monochromatic ambient.

Loer Architecten is a Dutch architecture studio with a beautiful, airy, dynamic website based on full-screen imagery, interactivity and interesting navigational solutions. The Projects section includes an interactive links list from which we get to navigate to the projects that interest us. We picked the Mercado project , which has the goal of transforming an abandoned backalley in the center of Groeningen into a thriving commercial and urban hub. Just as it would be expected from an architecture studio, the case study is clean and precise, opening with the most essential information , such as status and location. It is the page layout, however, that gives it a welcome kick and saves it from being plain and dull . The project name is displayed in vertical letters to avoid occupying precious space on the page. Thin straight and curved interface lines give it dynamicity, and so do animations in individual pieces of visual content, as well as animated scrolling effects. There isn’t a single full-width or full-screen image in this case study which, combined with ample use of negative space, gives it a very clean, breathable character.

Insurance WordPress Theme

Kids and Toy Store WooCommerce Theme

FreightExpress

Transport & Logistics WordPress Theme

Commissioned by Comme des Garcons to create an interactive digital experience helping customers discover their fragrances, the French digital agency Ultranoir came up with Self Scenter , a Web GL-based reinvention of the brand’s Fragrance Finder so that it dynamically creates user-specific shapes. The case study shares some of the immersiveness of the project, especially in the hero section with a video and a large title. The case study, however, assumes a cleaner, more informative and practical character later on the page, sharing some of the visual pieces that best convey the atmosphere of the project – videos and select imagery. And the project is truly stunning, too – a beautiful dark interface with a somewhat mysterious character is graced by superbly designed elements with utmost attention to detail and aesthetic coherence. These dark visuals are contrasted by a light background, complete with the cursor shaped like a dot that changes from black to white and vice versa, depending on the surface it hovers upon.

Wemakefab is an old acquaintance from our exploration of the power of interactive links in web design , and today we want to take a look at the case study for the project they developed for the online font aggregator Fontshare. As we get to learn from the case study, the project involved complete visual rebranding, interface design and even the logo redesign. And we have to say, this is a proper case study here, the one that ticks all the boxes as to how a case study should be done and what it should include . Each element of the project is listed and illustrated in a logical, sequential manner, on a clean, high-contrast black and white page. It starts with the project blurb, and then moves to font cards, internal pages, mobile view, the palette and select details. All visuals are given in a manner that follows the principles of usability and clean design – they are large (occasionally oversized), clean, carefully arranged, with occasional thin lines, both vertical and horizontal, that sequence off the sections. Several elements give off a spirit of playfulness and humor – like the section that switches from white ot black when hovered upon, oversized typography and the blinking cursor. The case study is stylistically coherent and tight and very well matched to the nature and the purpose of the project.

Playful is a collaborative collective of digital creators specialized in art direction and moving picture campaigns. More & More Nespresso is, by their own admission, one of the most challenging and rewarding projects the agency has worked on. The case study for the project is just as complex and rich as the project itself. It opens with an impressive hero slider introducing some of the textures that played a central role in the project, in a deep, sultry purple. Carefully curated images and videos from the project are skillfully arranged along the page, contrasted with large empty spaces with light backgrounds and text, offering a welcome pause from the visual feast. The color play is particularly striking – the project itself features a delicate interplay between rich, deep burgundys, greens and blues on one hand, and fine, elegant pastels on the other. The same interplay is repeated in the case study, and the elegant, sophisticated character of the project is underlined by the use of the lovely Antiga typeface throughout the page. The page features a director’s cut video, which is the centerpiece of the project, but doesn’t take over the case study, as it is after all exactly that – a case study in which the agency explains the creative process and pinpoints main visual cues and motifs.

You may remember the Baillat Studio from our piece on inspiring menu design , in which we praised the studio’s modern, interactive fullscreen menu. Today we’re going to check out the Project section of the website, specifically the case study for the 2016 edition of BIAN (the International Digital Art Biennale). The visual identity for the festival was based on black and red, a color combination that creates a lovely contrast with the page’s light gray background and black interface typography. A short text about the target and the main identity elements (Swiss style-based aesthetics, right-angle frames, repetition, lines and precision) follows the opening hero section with a full-width visual from the project. After this introductory section, we get to explore the visuals from the project, presented in the form of photography, video and images of project material in real life, in its designated ambience. The agency, therefore, decided to let the images speak for themselves, without excessive explanations and textual narratives . And it was a good call, too – the page is compact and informative, just what a case study should be.

Here’s a designer we love to feature in our articles – we’ve written about Niccolò Miranda in our pieces on poster-inspired web design and on great examples of footer design , to name a few. This time around, let’s take a look at how this talented Italian designer and developer with a penchant for illustration decided to present his featured works on his website, using the case study for Prada Employees Online Store as an example. The first thing we notice is that the project pages are completely in line with the overall style of Miranda’s portfolio. By that we mean the paper-like texture, the torn paper effect, the columns and sections resembling newspaper layouts, and, of course, illustrations . The page opens with a hero section that holds a lovely illustration from the project he did for Prada (an online store that sells the brand’s previous collections). We then move on to a section explaining what it was that Miranda was commissioned to do, and sections explaining how he did it. What’s interesting (in addition to the distinct and idiosyncratic style) is that the imagery from the project is presented not in the main page content, but instead in a sidebar that opens to the right when we click on the appropriate icon . The page also features a big oval button that leads to the project’s live site, and that’s about it. It is basically more of a project blurb page than a case study per se, but considering its unique style and Miranda’s amazing talent, we figured it deserved a mention here as well.

K95 is a design, branding and communications agency from Catania, Sicily. They work with mostly Italian clients but have a few international names on their roster as well. Their website features a neat list of projects in the form of an interactive link carousel, each link leading to the appropriate case study. Today we’re going to check out the one for Ortovivo , a Sicilian organic food production company. Each project is neatly divided into sections that include description, target, branding and packaging , linked in the header (from which we can also turn off the case study and return to the homepage). The layout is airy and clean, with plenty of empty space around each piece of visual content, and a large circular animated button inviting us to scroll to explore the project. Sections with empty space are combined with full-width interactive ones, moving and expanding as we scroll. It is a dynamic, modern and skillfully designed page that unites good UX, usability and efficiency with modern design practices that speak volumes of the agency’s expertise and taste.

Obys Agency is a creative design agency from Ukraine with a focus on UX/UI design, animation, graphic design and development. Their website is a modern, streamlined and fluid display of their works, principles, accolades and much more. As an agency that flaunts a serious approach to everything they do, Obys wanted to share some of their ethos and the artistic and design principles they follow in their work, and that’s why they created a standalone website on Typography Principles , while the main website has a page that serves as a case study for it. The site includes three sections explaining how the agency uses fonts, how it combines them and what rules it follows when it comes to typography. The page follows the white on black aesthetic line of the rest of the website, with sections that roll up or down revealing underlying content. Navigation is particularly interesting here, as we get to explore the visual content through scrolling, clicking on oversized interactive buttons, and play videos. Numbered sections and diagonal arrows hint to physical navigation signals (like traffic or airport ones), and the part of the study that deals with animation is presented in a separate unit. The website itself is rather impressive and the case study does an excellent job at conveying its complexity and elegance, both design-wise and in terms of UX.

Tubik Studio is a full-stack digital service agency with a focus on UX and UI design. Their website offers a rather no-frills (but nevertheless striking) display of services and works the studio is most proud of, with a gallery of images leading to specific projects. The page for Komuso Design project, for instance, offers an informative and hands-on overview of the project. It opens with an intro hero image, followed by brief project info presented in a simple, readable form, with comfortable black Gilroy typography on a white background. The visual content is presented in the form of videos on a lovely marble-like background, combined with screenshots from the project arranged on a beautifully combined palette of pastels. A particularly well-designed section is the boxed split slider gallery that offers a dynamic and convenient way of displaying several instances of content without cluttering the page or making it too long. The study ends with the visual system: a color scheme with HEX codes, some representative samples of typography and the mobile layout. The entire page bears an airy, pleasant character, perfectly aligned with the client’s brand and product (a wellness tool designed to help people relax through breathing).

Humana Studio is a Portuguese agency that helps build brands with a social and environmental impact. They were commissioned by the 92 Group, a design studio that challenges traditions in media and entertainment through irreverence, unconventionality and youth. Obviously, this was an excellent fit as the Humana Studio has a distinctly disruptive approach. The case study for the 92 Group brand identity and communication strategy partly follows the same disruptive principles – especially in terms of visual communication – but also some more conventional ones, specifically when it comes to UX. The visual content is saturated, loud and bold , with strong, deep colors on a black background, but the way it is arranged on the page guarantees proper navigation, readability and ease of consumption . The sections are topped with a subtle zoom-in effect and a yellow round cursor that shrinks and expands and the text is short and to the point. The study is brief but concentrated, informative and practical, coherent in character and atmosphere.

WØRKS Studio is a New York-based consultancy specializing in creative direction, strategy and design. Their main website is an exciting showcase of both the agency ethos and their projects, and is marked by a distinct cinematic approach, with a lot of information and content being handed in form of immersive fullscreen videos and animated sequences. The DreamHaus project is presented as an animated study of the pillar design elements used for the project – with the main focus on typography and the palette . The fullscreen hero section opens with a large animated logo of the project, proceeds with a palette of beautiful pastels, with names and hex codes, and ends with a sequence that showcases the typography used for the project, and the main layout style, as well as textures. The visitor can scroll to learn more about the project and its goal, as well as the main guidelines that the agency followed in the creative direction of this project. The images related to the project, or the products of the direction, if you will, are presented with animation effects that feature a brief flash of yellow, which is the agency’s signature color, thus providing a continuity between the project and its creator and, of course, reinforcing the agency’s own branding.

Our most frequent readers might remember Parsons Branding from our piece on inspiring creative agencies and designers , in which we praised the agency’s beautiful UI design and interesting navigation solutions. Today, we want to check out one of their case studies, specifically the one for Topline , the South African tool manufacturer. The case studies all feature unique page navigation – the left portion of the screen contains a numbered section with jump links to specific parts of the case study : Overview, Identity, Packaging and so on, and of course we can simply scroll down and explore the entire study in its intended order. The background is in the agency’s signature green and gray, with a very subtle paper-like texture, giving the entire interface a lifelike quality. The left side, the one with the table of contents, remains static as we scroll, assuring easy navigation and orientation on the page, which is, in itself, quite rich in content, both visual and textual. Certain sections are given in horizontal scroll sliders, so we get an impression that the page expands in all directions. This is an extremely well thought-out case study, brimful of information for those interested in exploring the project in great detail, but at the same time simple and informative for those looking to just skim the content.

The Japanese Hello Today did a quite complete agency work for the home appliance manufacturer Weekend, from strategic planning and branding to graphic design, web design, photo and art direction and even copywriting. The Weekend case study on the agency website is a modern, elegantly dark showcase of everything the agency did, from the first steps to the completion of the project. Discrete white typography on a black background introduces basic project information and brand philosophy, both in English and in Japanese, before we scroll down to visuals. These are presented in a typically Japanese, dignified manner, gently floating on the black background, creating a beautiful contrast and a strange sense of calm . Thin, subtle interface lines provide some framework for the visual content and communicate rather successfully with the overall aesthetics of the website – minimalist and stripped-down.

Fuge is a Moscow-based design agency delivering UI, branding and digital solutions. The agency website is minimalist, in a very reduced palette, with small typography and on-lover grid patterns, resulting in a modern, serious look. This character is repeated throughout the website, including the individual case pages. Our favorite one is the case study for Posted , a design magazine for which the agency did branding, as well as UX and UI services and animations. The case page starts rather minimalistically, with a large image on a light background and just a few bits of text. As we scroll, more and more pieces of content appear on screen, in an interactive and rather fluid way . The case study is divided into sections – logo and elements, desktop and mobile versions of the magazine website. Each image can be expanded in a popup, with smooth and modern transitions, giving the page a dynamic and modern look. This atmosphere is reinforced by a modern, minimalist palette reduced to grayscale, black and red, which is the Posted brand palette. The images (or rather previews) are alternately arranged on the page, creating a lovely balance, and the entire composition appears to be held in place by the grid lines that appear as we hover over certain areas.

Decathlon has long planned a redesign and a relaunch of its app for the Spanish market but the Covid-19 pandemic put a halt to those plans for a while. As soon as the pandemic loosened, the sports goods company reached out to the Barcelona-based, Twin Peaks-named agency Fuego Camina Conmigo (Fire Walk with Me) for a range of services from digital strategy, art direction and concept, to copy, audiovisual content and social ads. The Decathlon App case study is available at the agency website, and it’s one of the most successful, detailed and complete studies we’ve seen in a while . it ticks all the boxes in terms of what a case study should contain – the context, the target, the implementation, and so on, but it does so in a way that is by no means dry or technical. The agency achieved this by skillfully alternating light and readable text sections with fullscreen sections with the visual material from the app , which can be viewed either as images or clicked to play a video. All the while, the agency maintains its own visual identity, present in typography, layout styles and elements such as the round cursor, buttons and icons.

Here’s a project that is as noble as it is well-carried out. Unstuck by Violet Office is an effort started by the CEO of Chobani and several other stakeholders with the goal of helping refugees find full-time jobs in partner companies and their supply chains. Chobani was the first to join the project, of course, and it was soon followed by other major brands like Ben & Jerry and Dole. Violet Office did the branding, web design and development, as well as social media. The branding part is perhaps the most impressive – the agency created a logo and wordmark that can easily fit any brand partner’s logo , and the first part of the case study focuses on that particular effort, complete with rich visuals proving the efficiency of the design . It then proceeds with an analysis of the Unstuck visual system (colors, patterns, typography), and ends with examples of brand activations, complete with the launch video. The high-contrast visuals are displayed full-width, either in galleries or individually, which creates an immersive effect on the visitor, who ends up being completely drawn into the narrative of this commendable project.

Wrapping It Up

As we saw from the examples we visited today, while a good case study may not necessarily have to strictly adhere to a formulaic structure, it’s still a good idea to give it some structure and to conceptualize it in a way that communicates clearly and directly with the viewer. And since the viewers are also potential clients, it’s needless to stress how important this is.

We’ve seen some “proper” case studies with neatly divided sections and a tight structure repeated throughout each study. We’ve also seen some more “relaxed” ones, and some that perhaps don’t really qualify as case studies in the strictest terms but that due to their quality and supreme design elements deserve a mention.

Hopefully we managed to inspire you by showing a variety of styles and methodologies you can follow in creating your own case studies. Feel free to share with us your own favorites or, even better, your own work!

How to Create a WordPress Website: The Ultimate Guide

10 captivating examples of the liquid metal effect in web design, 10 examples of imaginative mouse cursor design, 10 examples of innovative contact form design, 10 examples of websites inspired by poster aesthetics, 10 google font combinations for inspiration, 10 inspiring design podcasts to listen to while you work.

Post your comment cancel reply

Save my name and website in this browser for the next time I comment.

Post your comment

One Page Case Study Websites

A curated collection of 48 case study websites for inspiration and references. Each review includes a full screenshot of the website design along with noteworthy features. These One Pagers are a great to show users your work in a beautiful long Single Page website, normally pitching your services and social links at the bottom.

Dare to Dream

Reject Pile

Variable fonts support in Figma

Vertigo Typeface

Pudding Studio

Green Reconstruction of Ukraine

Webflow — Build and style your site exactly how you want ✨

Shucks! We’ve run out One Pagers...

There are no more pages to load

How to write the perfect web design case study to win more clients

An immersive digital portfolio is the key to landing new clients. Learn how to show off your skills with a winning web design case study.

Design and build a custom portfolio website, visually, within 21 days.

A design portfolio without case studies is like a movie with no dialogue — visually present but lacking the substance needed to convey its full meaning.

Dialogue and case studies both communicate meaning. Without dialogue, audiences struggle to understand a film’s plot, characters, and themes, similar to how clients will struggle to understand the problem you solved, your design process, and the impact of your work without a thorough case study.

When you’re competing against other designers for a project or role, a well-written web design case study sets your portfolio apart , showing potential clients what you’ve done and what you’re capable of.

What is a case study?

A case study is an in-depth investigation into a person or group of people, a situation, event, or a product. A web design case study is a visual and textual analysis of a successful web platform, landing page , website design, or other web-based product. These types of case studies can be physical documents, but they’re often digital: PDFs, infographics, blog posts, or videos. Screenshots are an essential component, as are wireframes and mockups. But a robust web design case study also features detailed written explanations.

These visual and written elements work together to create a comprehensive assessment of the design process from start to finish, including the challenges faced, the solutions implemented, and the results achieved.

5 benefits of web design case studies

Now that we’ve touched on how case studies sell prospective clients on your work, here are a few other benefits of adding web design case studies to your portfolio website:

1. Demonstrate expertise

Case studies are a powerful marketing tool for designers to demonstrate their capabilities to potential clients or employers. A good web design case study showcases your skills and expertise in solving complex design problems.

2. Build credibility

In case studies, designers often include the name of the business, client, or project they’ve worked on, building credibility by providing real-world examples of their past work. You can even add testimonials and reviews to highlight positive feedback directly from those you’ve worked with.

3. Inspire future projects

Examining and analyzing your own work can inspire your next website build — maybe you’ll try one of the layouts that was nixed for this project or center the next design around an element you ended up loving. It also provides guidance and best practices for design projects, setting the bar for innovative design.

4. Encourage personal growth

Writing an investigation of your own design portfolio pieces after completing a project provides an excellent avenue for self-reflection. Reflecting on past projects, the struggles you’ve faced working on them, and what you’ve learned from the process will help you identify your strengths as a designer and areas of improvement to work on.

5. Improve communication

Presentations of your own work don’t just communicate the design process, decisions, and outcomes to clients. They also speak to stakeholders, including clients, team members, and management. A well-written case study illustrates a designer’s ability to effectively communicate complex design ideas and concepts, and writing it will improve your communication skills and offer insight into how effectively you work and collaborate with others.

What makes an effective web design case study?

A web design case study describes the process you took to solve a challenge with a particular web design project. A successful case study features a notable client project, a well-written narrative structure, and an engaging visual design.

Think of it as a story with an identifiable beginning, middle, and end. Throughout the story, show clients your approach to successful web design — the problem, the research you did to prepare for the project, the steps and iterations you completed throughout the process, and the final results you delivered. This narrative structure helps clients understand the project’s evolution and details your design process, making it key to an effective case study.

Case study curation and criteria

We’ve covered the basics of what a good case study looks like. But how do you determine which projects to include? If a project meets all the following criteria, it’s a good candidate for a detailed case study.

Is it relevant to the future projects you hope to explore?

If there’s a type of project you’ve completed in the past that you’d like to avoid in the future, that particular portfolio piece might not be a great option for a case study. You’re not just trying to sell yourself to clients — you’re trying to land jobs you actually want to do.

Does it have a defined initial problem?

Web design projects often arise as a result of a problem. These projects are perfect for case studies because the product design goes beyond appearance and functionality. Here are some of the issues your designs might solve:

• Poor user experience: To create a smooth, enjoyable experience for users, user experience (UX) design focuses on identifying and solving issues that cause frustration, confusion, or difficulty while using an app or a website, such as confusing navigation, misleading icons, or slow load times. Addressing these challenges lets you showcase your understanding of your target audience’s needs and demonstrates your ability to apply your creative and technical skills to solve them.
• Low search engine ranking: Redesigning a website with search engine optimization (SEO) in mind will improve its ranking in the search engine results pages, and you’ll have metrics to include in your case study to quantify the claims you’re making.
• Inconsistent branding: Brand design is a massive part of a company’s identity. A lack of alignment between the logo, colors , and other visual elements of a brand’s identity and its digital assets reflects negatively on the company, leaving customers with more questions than answers about who’s behind the brand. Good web design can bring a sense of cohesion to the company’s digital products, an achievement you can speak to in your case studies.

Does the outcome deliver measurable success?

Good design is subjective, but the best projects for case studies have data to show how successful they are. Search engine ranking is one example. You might also highlight impressive metrics for user engagement (bounce rate, time spent on the site), conversion rate (the percentage of visitors who make a purchase or fill out a form), or web traffic (the number of visitors to the website).

Is the project visually suitable for presentation?

When preparing a web design case study, consider the various formats it can be presented in, such as a video, static webpages, or interactive web content.

Selecting projects that fit your chosen presentation format is essential to showcasing your web design skills. As a web designer, it’s a given that whatever you’re presenting to potential clients needs to use thoughtful, aesthetically pleasing designs.

Design for display

There’s no single right way to present a case study. What’s most important is that your case study tells the story of the journey from an initial problem or idea to a finished product that meets the client’s needs.

A minimalist design will help you achieve this goal. But don’t confuse minimalist with boring. You can (and should) get clever with the presentation. Instead of using basic screenshots, for example, consider exhibiting your work in modern frames with immersive features. Or display screenshots of the product in its natural habitat. Webflow designer Karen Huang uses a digital screen in this user experience case study to feature a screenshot of the user interface (UI) on a smartphone screen just as users would experience it:

Build completely custom, production-ready websites — or ultra-high-fidelity prototypes — without writing a line of code. Only with Webflow.

How do you structure a case study?

The contents of every web design case study will vary, but they should all follow this basic structure:

1. A challenge

Start your case study with an introduction to your client and the problem your design solved. Include details about the project’s context, goals, and constraints. This section sets the stage for the rest of the case study and ensures the readers clearly understand what the project — and your solution — is all about.

2. A solution

Detail your approach to solving the challenge introduced in the previous section. Include information about your research, its methodology, and the data you gathered to develop your solution. Focus on your skills, not diagnostics — this is the place to showcase your intelligent approach, reasoning, and innovative ideas that ultimately resolve the challenge.

For this section, it’s helpful to break each key resolution into separate paragraphs and introduce images in chronological order to detail your design process. Screenshots of wireframes and strategy phases will paint a vivid picture of the project’s journey.

If you face any challenges or roadblocks while designing your solution, discussing them provides insight into your problem-solving skills and shows potential clients how you overcome difficulties. End this section with multiple pictures of the final product, and be sure to include a direct link to the project for potential clients and employers to peruse.

3. The impact

This section is where you’ll highlight metrics and data that back up the project’s success. Leverage metrics, user feedback, or whatever data is available to illustrate how your solution solved your client’s challenges and achieved the project’s goals. You can also include information about the potential longitudinal impact of your work and future opportunities for the project.

4. Key quotes

A case study is a perfect place to share client testimonials and add quotes from team members to help readers learn what the experts behind the project think about the build. Get creative but use quotes sparingly, sprinkling them throughout the case study to support the image or project stage the quote relates to.

Let your work do the talking

At Webflow , we offer the tools to make websites and the tutorials you need to perfect them. Learn how to start a web design business , make an online portfolio , or enhance your skills with a web design certificate with guidance from our blog and educational platform, Webflow University . Draw inspiration from our collection of templates and websites and start building your best site yet with Webflow.

Subscribe to Webflow Inspo

Get the best, coolest, and latest in design and no-code delivered to your inbox each week.

Related articles

10 stunning web design portfolio examples in 2024

As a web designer, you need a portfolio to show your best work and land clients. Here are 10 web design portfolio examples for inspiration.

Presenting your web design portfolio: The complete guide for winning new clients

When presenting your portfolio to a potential web design client, focus on sharing your goals, ideas, and thought processes as you worked through the projects.

4 steps to creating an impressive UX design portfolio

Your UX design portfolio helps you impress future employers and attract clients. Here are four crucial steps to creating an outstanding portfolio.

13 tips to make you a better web designer

Helpful advice to help you level up your web design skills

5 SaaS web design trends in 2017

Check out 5 of the most fascinating web design trends from ChartMogul's 2017 study of SaaS landing pages.

The modern web design process: setting goals

The first step to building a successful website is ... defining success.

Get started for free

Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.

Transforming the design process at

• Interactions
• Localization
• DevLink Labs
• Figma to Webflow Labs
• Accessibility
• Global alliances
• Freelancers
• Customer stories
• Webinars and ebooks
• Made in Webflow
• Livestreams
• Careers We're Hiring
• Webflow Shop
• Terms of Service
• Privacy policy
• Cookie policy
• Cookie preferences
• Accessibility statement
• Discover the community
• Partner with Webflow
• Certified Partners
• Become a template designer
• Become an affiliate
• Become a Global Leader
• Find a meetup near you

New Case Study

The "almost" perfect trial conversion

Case studies

How small UI delighters have a huge impact on UX

Been onboarding

One simple way Apple could improve your sleep habits

Apple sleep notification

How to avoid (and repair) these 3 critical design blunders

Design Blunders

Social Proof: Why people's behaviors affect our actions

Social Proof

Adobe: The growing issue with “Free” trials UX

Adobe Trial UX

Letterboxd: How to nail product market fit with clear Jobs‑To‑Be‑Done

Jobs-To-Be-Done

Spotify Wrapped: 6 psychology principles that make it go viral every year

Spotify Wrapped

The psychology of Temu’s casino‑like shopping UX

Temu Onboarding

GoDaddy: How to improve checkout flows ethically

GoDaddy Checkout UX

Framing Effect: Why context affects decisions

Framing effect

The psychology behind highly effective landing pages

Landing page conversion

Apple vs Meta Threads: The Illusion of Privacy

Apple privacy policy

Beehiiv subscription: 5 small UX mistakes that make a BIG difference

Newsletter subscription

Quiz: Find 4 psychology principles used in Shortform's offboarding

Offboarding Quiz

The Search War: Bing AI Chat vs. Google

The Psychology Behind Loom's Explosive Growth

Loom onboarding

Episode 1: Can Bing's new AI search challenge Google? 

Bing onboarding

Mental Models: Why expectations drive user behaviors

Mental Models

Zeigarnik Effect: Why it's hard to leave things incomplete

Zeigarnik Effect

Typeform: How to offboard users the right way

Typeform offboarding

How to increase signup confirmation rates with Sniper Links

Email confirmation UX

Labor Perception Bias: Why faster isn't always better

Labor perception bias

Tech ethics: If cookie consent prompts were honest…

Cookie consent

Amber Alert Redesign: 5 UX Improvements That Could Save Lives

Amber alerts UX

Google: How to increase feature adoption the right way

Google feature adoption

How Linkedin Increased Notification Opt-in Rates by 500%

Linkedin notifications

The Psychology of Advertising: Why this ad made me stop scrolling

Advertising psychology

The Ugly Truth About Net Promoter Score Surveys

Net promoter surveys

The Psychology Behind Amazon's Purchase Experience

Amazon purchase UX

One Simple Psychology Framework To Improve Your Onboarding

Blinkist onboarding

How Blinkist Increased Trial Conversions by 23% (Ethically)

Trial paywall optimization

YouTube’s Attempt To Solve The Paradox of Choice

Youtube retention

Adobe: The Psychology of User Offboarding

Adobe offboarding

Signal: How To Ethically Boost Your Revenues

Signal monetization

Chrome vs Brave: How To Use Ethical Design To Win Customers

Brave onboarding

The Psychology of Clubhouse’s User Retention (...and churn)

Clubhouse retention

The Scary Future Of Instagram

Instagram monetization

The Psychology of Misinformation on Facebook

Facebook misinformation

The Psychology Behind TikTok's Addictive Feed

Tiktok feed psychology

How To Properly Apply Jobs-To-Be-Done To User Onboarding

Headspace onboarding

How To Notify Users Without Being Spammy

Lifecycle emails

User Onboarding: Is HEY Email Worth It?

Hey onboarding

7 Product Team Pitfalls You Should Avoid

Product team pitfalls

How Tinder Converts 8% Of Singles Into Customers In Less Than 15min.

Tinder monetization

Coronavirus Dashboard UX: How Design Impacts Your Perception

COVID dashboard UX

How Morning Brew Grew To 1.5 Million Subs In 5 Years

Morning Brew retention

Uber Eats: How To Ethically Use Scarcity To Increase Sales

Uber Eats retention

Airbnb: How To Reduce Churn With Personalization

Airbnb personalization

6 Ways Mario Kart Tour Triggers You Into Gambling Your Money

Mario Kart monetization

Strava: 7 Strategies To Convert More Freemium Users

Strava monetization

Tesla: How To Grow Through Word-of-Mouth

Tesla charging UX

How Hopper Perfectly Nails Permission Requests UX

Hopper onboarding

9 Ways To Boost SaaS Revenues With A Better Upgrade UX

Zapier monetization

Superhuman's Secret 1-on-1 Onboarding Revealed

Superhuman onboarding

Trello User Onboarding: 7 Tactics To Inspire You

Trello onboarding

5 Deadly Onboarding Mistakes You Should Avoid

Sleepzy onboarding

Duolingo's User Retention: 8 Tactics Tested On 300 Million Users

Duolingo retention

Calm Referral Strategy: Drive Viral Growth With Simple Rewards

Calm referrals

Spotify vs Apple: How Spotify is betting $230M on podcasts to win over Apple users (Ep. 2)

Spotify onboarding

Spotify vs Apple: How Spotify is betting $230M on podcasts to win over Apple users (Ep. 1)

Spotify vs Apple

Business Case Studies

• Article Databases for Case Studies
• Case Study Database

Commercial sites to purchase cases

Free case study websites.

• For Faculty: Teaching with Cases
• For Students: Writing a Case Analysis

Business & Management Librarian

Commercial cases, like those from Harvard Business School, Ivey and others:

• a copy of the case is to be purchased by/for each student in a class
• like workbooks and other consumables, may not be copied under copyright "fair use"
• the library cannot purchase or get copies on interlibrary loan (ILL)
• Webster University faculty wishing to use commercial cases should check with their College or School on the home campus or with staff at their extended campus about the procedures for student purchasing.  

Case studies used in the classroom, which we at the library call the "case study method" of educational pedagogy, usually present the case facts and, rather than provide the solution, provide alternative solutions and/or questions to lead discussion or challenge students to apply theories learned in their course. Commercial publishers often provide faculty with teaching notes and other resources to facilitate student learning.  Faculty may be required to register for an account that allows them to access the publisher's website to identify and purchase cases for classroom use.

• The Case Centre Established by European higher education institutions as a "reliable facility for sharing case materials among business teachers."
• Darden Business Publishing University of Virginia
• Harvard Business Publishing: Education Harvard also partners with business schools and universities, such as Ivey, Kellogg, Standford, Thunderbird and more, to streamline searching and distribution of their cases.
• Ivey Publishing - Ivey Business School Provides "business case studies with a global perspective."
• Stanford Graduate School of Business: Case Studies:

Some organizations offer "free" case studies and materials for idea generation. These sites provide varying degrees of teaching support. Faculty may need to register for access to teaching notes and materials.

• Case Studies | Teaching Resources Library | MIT Sloan Free case studies from MIT Sloan School of Management in categories such as accounting and finance, leadership, operations management, strategy and more.
• Ethics Cases | Markkula Center for Applied Ethics This site from Santa Clara University provides ethics cases in business, government, leadership, ESG topics, etc.
• Ethics Unwrapped Case studies, curated resources, and videos from the McCombs School of Business at the University of Texas, Austin.
• Knowledge at Wharton Offers free access to over 10,000 articles and podcasts and videos highlighting Wharton faculty research and analysis of current business trends.
• Merlot OER Case Studies Merlot collects Open Educational Resources. This link is a search for business case materials that may be used for free.
• SHRM Teaching Resources "SHRM is committed to empowering HR faculty with the proper tools and resources needed to create better-prepared entry level HR candidates. These case studies and learning modules are available for faculty and educator use only."
• << Previous: Case Study Database
• Next: For Faculty: Teaching with Cases >>
• Last Updated: Aug 6, 2024 2:09 PM
• URL: https://library.webster.edu/businesscasestudies

Get inspired by design stories

Monthly UX and product design case studies. Trusted by designers from companies like Apple, Google and Spotify. It's 100% free.

"Such a valuable resource."

“Always appreciate it, truly.”

“This is lovely.”

Latest case studies

The Evolution Of Google Maps & Colour Picking Methodology

Avast Design Internship Case Study

Knowledge Depot - ElleHacks Winner

Product Card: a micro case study

Redesigning the Office App Icons to Embrace a New World of Work

Popular categories, from the journal.

Adapting an outcome-centric mindset

Stop Trying to Fit in With Your Portfolio

Case Study Talk

How to Accelerate Your Design Career

How to Break Into the World of UX Consulting

• Content Marketing

How to write a case study for your website

Published on: 11 May 2020

Last modified on: 24 April 2023

Team Hallam

Case studies are an essential part of any business’ marketing collateral. But creating a really good one takes more than just putting pen to paper and hoping for the best. Learn why they are important, and how to write a case study for your website that not only packs a punch, but drives results.

What is a case study? 

A case study is a way of demonstrating how your business’s helped a person or client overcome a particular challenge. It clearly lays out how your products or services were used to solve a problem, and the results.  It’s important to note that a case study isn’t a press release or a sales pitch (at least, not directly), it’s about showcasing your work and framing it in the context of helping others. In short, it’s not about you, but your customer. 

Why are case studies important? 

Case studies can often get overlooked when it comes to producing marketing material. After all, they’re not exactly the most glamorous form of content to produce, and blog posts can seem more appealing. So why invest in case studies at all? Haven’t we moved on to other things?  The truth is that case studies are, and continue to be, incredibly effective. They help to attract new customers, cement trust and increase conversions.  It’s the storytelling nature of the format that boosts its effectiveness, and that’s what case studies allow you to do – tell a story about your brand and how you’ve helped others. The story you draft paints a picture, stimulates emotions, and gives your business greater selling power. Storytelling, by using your customer’s voice in a data-backed piece, is an invaluable sales tool – and that’s why case studies continue to work so well. 

What makes a good case study? 

There are a number of things a good case study should include. Here are the core things you should consider when you are preparing to write a case study for your website, and you can use these as a sort of checklist when creating your draft.

A compelling subject matter 

Not every piece of work is worthy of a case study. Choose your best projects and accomplishments, where the client has been happy with what’s been achieved and you have clear results to show for it.  It doesn’t matter the size or scope of the work, either. It could have been a one-off, short campaign or a full website redesign over the course of several months. What matters is the impact you had.  And then it needs a good angle. Is there anything particularly different or unique about the problem you’ve solved? Anything different that you did as a business? Don’t use details that don’t support the purpose, but think about just why it was so successful. 

Industry-specific

Demonstrable problem-solving

Case studies are solution-centric, so you need to show yours at work. An effective one will clearly demonstrate how you took a problem and solved it using your expertise, products or services. There needs to be a before and after – a story.  

Solid evidence 

Quotes and testimonials 

Presented well 

Last but by no means least, your case study needs to presented in an engaging, easily digestible way.  This includes good formatting and a clear structure (which we’ll get to in a moment) but also the visual elements to it. You may want to enlist the help of a designer to really present it in the most user-friendly way. Depending on time and budget, you could even create a short video to help illustrate the story.  Of course, all the usual things for writing for the web still apply: headings and subheading, bullet points and lists should all be included. Make it as easy as possible for the scanners and skimmers out there to read and engage with it. 

How to write your case study

As we said previously, it’s not simply a case of putting pen to paper. The key to writing a successful case study is nailing its structure. It has to read well, and it has to tell that all-important story that captures your audience.  Thankfully, there’s a tried-and-tested method of doing this which we adhere to. To help your writing flow nicely, we recommend structuring it into the following sections:

1. The headline 

2. The client

Open with a short introduction to the client – who they are, their background and industry. You can base it on what they say on their company website or LinkedIn profile.

3. The challenge

Explain over a paragraph or two the challenges your client was facing and wanting to overcome. There could be just one, or a few different pain points. 

4. The solution (and your approach to it) 

Now for what you actually did. Talk about how your products or services helped solve that problem. Get into the specifics, and also explain your thinking and decision-making throughout the process.

5. The results

This is where you lay out It’s always better to use real numbers, not just vague statements like ‘more than doubled their traffic’. Really hammer it home by pulling out the big guns!

6. The testimonial 

Finish up with a quote from your customer, ideally stating how their business has been improved or how happy they are with the service received. It doesn’t need to be lengthy, but it should be genuine. And be sure to use their own words, rather than trying to make it sound typically corporate. 

Case studies: your next steps

So there you have it – our complete guide on how to write a case study for your website that captures your audience and hopefully converts them. Of course, no two case studies are ever the same (and nor should they be), but if you stick to a structure you can  Above all, the three fundamental elements are:

• What was the problem?
• What solution did you provide?
• What proven results can you showcase?

Have you just learned something new?

Then join the 80,000 people who read our expert articles every month.

• First name *
• Last name *
• Email address *

By signing up to this form I agree, that Hallam may store my data and may contact me using the email address I have provided with promotional emails about products, special offers, and other information which may be of interest. Please also read our privacy policy . You can revoke your consent at any time

• Comments This field is for validation purposes and should be left unchanged.

Get content like this in your inbox, weekly.

More trending content.

How to write great blog posts that engage readers and drive traffic

Email Marketing

How to write killer marketing emails

Free cases from The Case Centre

As a useful resource for case teachers, and to encourage the growth in case use, The Case Centre partnered with a group of leading business schools to provide this collection of ten free cases.

Search our full collection of diverse management cases, articles, book chapters and teaching materials from leading authors, schools and publishers worldwide.

Educators and trainers can also access free online preview copies and instructor materials.

Search the collection

Most popular.

• Preview copies

View all free case collections

Learning with cases can be a challenging experience.

Our interactive study guide takes students through the process, providing practical tips, tricks and tools.

Discover more

5 inspiring web design case studies

A good case study makes for a top calling card; check out these examples.

The reality of web design is that once you've finished a project, you hopefully move straight onto the next one. However, every site you deliver is an essential portfolio piece that demonstrates your skills and abilities, and while you'll usually want to link to your recent work on your site, it pays to do the job properly.

Rather than simply grabbing a screenshot of a landing page and a link and adding it to your online portfolio, writing up an engaging case study on your work can be a lot more worthwhile. Case studies don't need to be lengthy essays; they just need to give readers a taste of your process and provide some insight into the challenges you've faced over the course of a web build and how you solved them. 

They're a great way to let potential clients know how you work, and they can also provide inspiration for other designers and developers; here are five of our favourite recent examples. Make sure you also check out our top web design tips .

• How to write engaging case studies for your portfolio

01. Museum of Science and Industry of Chicago

For a really inspiring case study, it's hard to beat DogStudio's extensive piece chronicling its work for the Museum of Science and Industry of Chicago. The museum is a vast and highly respected American institution, and you can't help but get the impression that DogStudio was punching well above its weight when it won the commission to rethink and revamp its web platform, but as this case study reveals, it carried the job off with aplomb.

Packed with revealing wireframes, imagery and animations, it's a fascinating insight into a massive and challenging build that had to cater for more than five million online visitors wanting to do everything from buy tickets through to figuring out where to park and finding information about individual exhibits. 

02. National Geographic: A Bear's-Eye View of Yellowstone

Sometimes it's better to show rather than tell. For this captivating look at Yellowstone National Park as seen by four bears fitted with camera collars and GPS, Hello Monday had a wealth of footage, data and expert analysis to work with. And rather than go into dry details of how it fitted everything together, it keeps things brief in its case study , providing a short outline of the project and deliverables before moving on to an entirely visual essay that demonstrates just how much work went into creating this digital feature.

As well as a good helping of footage and screenshots showcasing what the site's all about, what we really love about this study is a section dedicated to how Hello Monday stamped its own personality on the project, breathing extra life into the feature with animation, watercolour illustrations and pencil-drawn portraits of each bear.

Get the Creative Bloq Newsletter

Daily design news, reviews, how-tos and more, as picked by the editors.

03. Once Upon a Time in… Hollywood

Currently doing big business at the box office, Quentin Tarantino's Once Upon a Time in… Hollywood is a love letter to 1960's cinema that recreates its era with Tarantino's typical attention to detail. And to create an online presence that captured the feel of 1969 Hollywood as well as the film, LA agency Watson went the extra mile to create a digital magazine that feels like it could have come off a newsstand 50 years ago.

In this case study the Watson team explain not only the thinking behind the magazine and its pitch-perfect adverts, but also how they create a physical print run of the mag that got handed out at the premiere and first-night screenings, creating a whole other social buzz as movie fans posted shots of their magazine to prove that they were there. If you're looking for ideas on how to run a strong social campaign, there's some great material here. 

04. British Red Cross

Kota's case study on its recent work with the British Red Cross is a clear and concise piece that provides valuable insight on the challenges – and opportunities – of working on a campaign with an institution with clear-cut brand guidelines that need to be adhered to. In the case of the British Red Cross's OneKindThing campaign, Kota had to create a platform that stood out from previous campaigns while staying within the society's pretty epic brand guidelines.

With a handful of images and a couple of paragraphs, Kota outlines how it managed just that, and also covers some of the technical hurdles that had to be overcome to deliver the finished site. The end result was well worth the effort, as the British Red Cross testimonial at the end of the case study reveals.

05. Stonewall Forever

To mark the 50th anniversary of the Stonewall Riots, an event that helped bring about the Pride movement, Stink Digital partnered with The LGBT Community Center to create Stonewall Forever, an immersive digital experience that features key narratives and previously unheard stories from LGBTQ+ history. 

Stink Digital's case study explains how it built a living monument to 50 years of Pride, based in Christopher Park, New York, but accessible anywhere through a website or AR app, and goes into some detail of the challenges of creating a WebGL monument that consists of over 10,000 individual shards with post-processing effects, but still runs at 60fps, even on low-end devices. 

Beyond the technical challenges, though, this is an absorbing and insightful piece on a project that explores life before, during and after the Stonewall Riots.

Related articles:

• The hottest web design trends of 2019
• How to refine your design portfolio
• Get the perfect website layout in 27 steps

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

Jim McCauley is a writer, performer and cat-wrangler who started writing professionally way back in 1995 on PC Format magazine, and has been covering technology-related subjects ever since, whether it's hardware, software or videogames. A chance call in 2005 led to Jim taking charge of Computer Arts' website and developing an interest in the world of graphic design, and eventually led to a move over to the freshly-launched Creative Bloq in 2012. Jim now works as a freelance writer for sites including Creative Bloq, T3 and PetsRadar, specialising in design, technology, wellness and cats, while doing the occasional pantomime and street performance in Bath and designing posters for a local drama group on the side.

Related articles

• 2 Noel Gallagher's football font makes a mockery of typography, claims design lecturer
• 3 A’ja Wilson’s Nike logo makes perfect sense
• 4 The new Verizon logo is a glowing success
• 5 'I can't tell you how scary it is designing for designers': Why Figma's new UI is a big deal
• 2 Apple finally addresses its most infamous design crime
• 3 Harness AI for design and art using your very own workstation
• 4 Acclaimed digital brush creator Kyle T. Webster joins Procreate
• 5 Using Unreal Engine: what skills do artists need to make it in real time filmmaking?

27 Case Study Examples Every Marketer Should See

Published: July 22, 2024

Putting together a compelling case study is one of the most powerful strategies for showcasing your product and attracting future customers. But it's not easy to create case studies that your audience can’t wait to read.

In this post, I’ll go over the definition of a case study and the best examples to inspire you.

Table of Contents

What is a case study?

Marketing case study examples, digital marketing case study examples.

Free Case Study Templates

Showcase your company's success using these three free case study templates.

• Data-Driven Case Study Template
• Product-Specific Case Study Template
• General Case Study Template

Download Free

All fields are required.

You're all set!

Click this link to access this resource at any time.

A case study is a detailed story of something your company did. It includes a beginning — often discussing a challenge, an explanation of what happened next, and a resolution that explains how the company solved or improved on something.

A case study proves how your product has helped other companies by demonstrating real-life results. Not only that, but marketing case studies with solutions typically contain quotes from the customer.

This means that they’re not just ads where you praise your own product. Rather, other companies are praising your company — and there’s no stronger marketing material than a verbal recommendation or testimonial.

A great case study also has research and stats to back up points made about a project's results.

There are several ways to use case studies in your marketing strategy.

From featuring them on your website to including them in a sales presentation, a case study is a strong, persuasive tool that shows customers why they should work with you — straight from another customer.

Writing one from scratch is hard, though, which is why we’ve created a collection of case study templates for you to get started.

There’s no better way to generate more leads than by writing case studies . However, without case study examples from which to draw inspiration, it can be difficult to write impactful studies that convince visitors to submit a form.

To help you create an attractive and high-converting case study, we've put together a list of some of our favorites. This list includes famous case studies in marketing, technology, and business.

These studies can show you how to frame your company's offers in a way that is useful to your audience. So, look, and let these examples inspire your next brilliant case study design.

These marketing case studies with solutions show the value proposition of each product. They also show how each company benefited in both the short and long term using quantitative data.

In other words, you don’t get just nice statements, like “this company helped us a lot.” You see actual change within the firm through numbers and figures.

You can put your learnings into action with HubSpot's Free Case Study Templates . Available as custom designs and text-based documents, you can upload these templates to your CMS or send them to prospects as you see fit.

5. " Embracing first-party data: 3 success stories from HubSpot ," by Think with Google

How to Write a Case Study: Bookmarkable Guide & Template

7 Pieces of Content Your Audience Really Wants to See [New Data]

How to Market an Ebook: 21 Ways to Promote Your Content Offers

How to Write a Listicle [+ Examples and Ideas]

What Is a White Paper? [FAQs]

What is an Advertorial? 8 Examples to Help You Write One

How to Create Marketing Offers That Don't Fall Flat

20 Creative Ways To Repurpose Content

16 Important Ways to Use Case Studies in Your Marketing

11 Ways to Make Your Blog Post Interactive

Showcase your company's success using these free case study templates.

Marketing software that helps you drive revenue, save time and resources, and measure and optimize your investments — all on one easy-to-use platform

Skip to main content

• Contact sales
• Get started Get started for free

Figma Design

Design and prototype in one place

Collaborate with a digital whiteboard

Translate designs into code

Figma Slides

Co-create presentations

Explore all Figma AI features

Get the desktop, mobile,
and font installer apps

See the latest features and releases

• Design systems
• Prototyping
• Wireframing
• Online whiteboard
• Team meetings
• Strategic planning
• Brainstorming
• Diagramming
• Product development
• Web development
• Design handoff
• Engineering
• Product managers

Organizations

Creator fund

Build and sell what you love

User groups

Join a local Friends of Figma group

Learn best practices at virtual events

Customer stories

Read about leading product teams

Shortcut: The Figma blog

Stories about how products take shape—and shape our world

Get started

• Developer docs
• Best practices
• Reports & insights
• Resource library
• Help center

Case study templates

Present your project in pre-built editable templates to get you started.

UX Case study template

UX Case Study Template made to help UX Designers create and organize their case study without any struggle.

Case study presentation template

Case study presentation to frame key insights and outcomes.

Long form research case study template with customizable styles.

Design presentation deck

Modern design deck template with multiple sections.

Visual portfolio template

Modern visual portfolio template with 12 column grid and light and dark themes.

Behance Presentation Template

Case study template with multiple components, visual styles and frame sizes.

Case study template

Case study template with pastel style coloring.

Holistic Case Study Template

Case study presentation template complete with project overview, wireframes and key journey insights.

Case study presentation layout for interview

Case study template with multiple app UI screens.

Portfolio UI - Web & Mobile

A portfolio UI for designers and developers which has 4 unique pages includes blog, case study.

Apple device mockups

Complete Apple device mockup screens for iPhone, Mac, iPad and Apple Watch.

Explore 1,000+ templates on the Figma community

Explore even more templates, widgets, and plugins—all built by the Figma community.

• Design for Business
• Most Recent
• Presentations
• Infographics
• Data Visualizations
• Forms and Surveys
• Video & Animation
• Case Studies
• Digital Marketing
• Design Inspiration
• Visual Thinking
• Product Updates
• Visme Webinars
• Artificial Intelligence

How to Create a Case Study + 14 Case Study Templates

Written by: Brian Nuckols

When it comes to high impact marketing content, case studies are at the top of the list for helping show off your brand’s stuff. 

In this post, I’ve put together a few high-level case study design tips as well as 14 professionally designed case study templates that you can use to start designing beautiful case studies today. 

Let’s begin! 

Here’s a short selection of 12 easy-to-edit case study templates you can edit, share and download with Visme. View more templates below:

What is a Case Study?

A case study is a way for you to demonstrate the success you’ve already had with existing clients. When you create a case study, you explore how previous clients have used your product or service to reach their goals. 

In particular, a case study highlights a specific challenge or goal one of your clients was struggling with before they discovered your product. 

It then demonstrates how your work has assisted them on the journey towards overcoming the challenge or accomplishing the goal. 

A case study’s outcome is typically to share the story of a company’s growth or highlight the increase of metrics the company tracks to understand success. 

The case study includes an analysis of a campaign or project that goes through a few steps from identifying the problem to how you implemented the solution. 

How to Write a Case Study

When it comes to adding irresistible design to your content from the start, using a helpful tool is a great start. Sign up for a free Visme account and start highlighting your own client success stories using one of our case study templates today. 

Also, while you’re beginning to transition your case study workflow to include a professional design tool, it’s helpful to review some high level principles you can incorporate into your case study. 

We’ll start by reviewing some of the critical style tips and structural elements to include in your case study before progressing to a more detailed design section. 

Pinpoint Your Main Message

When designing an impactful case study, it’s essential to stay clear on the metrics that you’re highlighting. The process of overcoming business challenges is a dynamic process with many moving parts. 

If you do not stay focused on what matters in your case study, you risk obscuring the big win your client experienced by using your product or service. 

This is why you need to focus on a single message or metric. This is often called the north star metric . 

The north star metric is the single most crucial rate, count or ratio that helped your client move closer towards their goals or overcame an obstacle. 

While north star metrics are context dependent, a useful heuristic you can utilize is to figure out the most predictive metric of your client’s long term success. 

In the template I’ll highlight below, cost per lead was the north star metric that The College for Adult Learning needed to optimize. 

Build relationships with customers and drive sales growth

• Reach out to prospects with impressive pitch decks and proposals that convert
• Monitor clients' level of engagement to see what they are most interested in
• Build a winning sales playbook to maximize your sales team's efficiency

Sign up. It’s free.

Use Emotionally Rich Language 

Recently researchers at Presado did an interesting study to understand the types of language that help readers take action. They broke the content included in marketing assets into several categories, including functional, emotional and descriptive. 

In the most successful pieces of content, the researchers found that emotionally coded words were present in 61% of the content’s total volume.

This research shows the benefit of using emotionally engaging content in your case study. While it’s essential to focus on the concrete evidence of how you helped your client get from where they started to a successful outcome, do not forget to highlight the emotional journey. 

Use Data For Concrete Evidence 

Once you’ve decided on the north star metric to highlight and you choose the emotional response you want to reinforce in your case study, it’s important to use actual data from the project to share the concrete results your product helped to achieve. 

To make sure your audience can follow your line of thinking, make sure the data in your case study is precise. If you track data across time, your readers must know whether you chose to track by month or years. 

If there are any apparent trends, you can use color to highlight specific areas in a chart. 

If you want to dig deeper into using data to tell compelling stories, check out our video data storytelling tips to improve your charts and graphs. 

In the template below, The College for Adult Learning case study is an excellent example of how these elements can work together. 

Cost per lead was a critical north star metric, so we chose to emphasize the increase in revenue and a decrease in cost per lead. 

Additionally, the background section uses emotionally rich language by highlighting how the school helps students get ahead with their career goals. Also, the factual data is the centerpiece of this page in the case study.

If you’re ready to share how you impacted a client, use the College for Adult Learning case study template right now! 

Include All Necessary Parts of a Case Study

After you’ve interviewed your client and you’re getting ready to start writing, it’s important to remember each piece you need to cover.

All good case studies consist of five parts: Introduction, Challenge, Solution, Benefit and Result.

While you don’t necessarily need to label each section like that, be sure that the flow makes sense and covers each section fully to give your audience the full scope of your case study.

RELATED: 15 Real-Life Case Study Examples & Best Practices

14 Case Study Templates

Now that we have explored some of the high level strategies you can use to create a business case study, we will transition to 14 case study design templates you can use with Visme. 

1. Fuji Xerox Australia Case Study Template

Use the Fuji Xerox case study template to showcase the concrete results you achieved for your clients. It has sections where you can explain the goals you started with and the results you achieved. 

2. College for Adult Learning Case Study Template

As we’ve explored already, the College for Adult Learning template has sections where you can embrace a data driven storytelling approach while also connecting with your audience using emotionally rich language. 

Utilize the professionally designed business case study to connect with your audience. 

3. Intel Case Study Template

The Intel case study has beautiful visual elements and gives you space to share the project’s context and the goals you set out to achieve. It also allows you to get concrete with the results you achieved. 

You can always use the Visme Brand Kit to incorporate your unique brand colors into this stunning design. 

4. Bit.ly Case Study Template

Bit.ly is a marketing product that helps brands track how they are doing with campaign results. The bit.ly business case study template showcases how they drove impressive results for an eCommerce business. 

You can modify the professionally designed case study template to illustrate the key results you drive for your clients. 

5. NVISIONCenters Case Study Template

The NVISIONCenters case study template is an excellent example of how powerful it is to pair beautiful designs with the results you generate for your clients. In this case study, we see how you can transform your past accomplishments into a powerful marketing asset. 

6. Adobe Case Study Template

The Adobe case study is an exciting example of a business case study because it does a great job illustrating how you can use a specific result to create a powerful marketing asset. 

Adobe had a particular goal of branding to position itself as a leader for the future of digital marketing. LinkedIn sponsored messages was an effective tactic to drive the outcome Adobe needed. 

You can use the Adobe case study template to demonstrate the success of your most effective tactics. 

7. Inkjet Wholesale Case Study Template

The Inkjet wholesale case study template is an excellent choice if you want to experiment with your case study’s visual element. The roadmap to objectives diagram is a powerful graphic that illustrates the journey of a successful campaign. 

8. Neutrogena Case Study Template

If you have a strong visual brand to tell your case study’s story with visuals, the Neutrogena template is a great choice. It is already designed with plenty of space to highlight your visuals. 

When it is all said and done, you have the results section to complete a successful client partnership story.

9. Weebly Case Study Template

The Weebly case study template is your choice if you want to add visual flair to your case study. The beautiful layout is a testament to the power of pairing minimal design with an exciting statistic. 

10. Patagonia Case Study Template

The Patagonia case study is a perfect example of how crucial it is to make design choices based on your brand’s unique personality. 

It is a fantastic choice if you have a project to showcase featuring a brand with a distinct brand aesthetic.  

11. Think With Google Case Study Template

The Think With Google case study template tells the story of a mobile game that needed to create more engagement on their app. 

It is a visually impactful case study design template that you can use to tell a compelling story about your results. 

12. Kleenex Case Study Template

This case study template is the perfect way to show off search marketing results for a client or other highly specific KPIs that you managed to accomplish.

Insert the initial challenge followed by your company’s solution and adjust the included data visualization tools to showcase your specific results.

13. Customer Experience Presentation Case Study Template

The presentation case study template is an excellent choice for blending beautiful visual elements with the ability to give detailed information about the results you generated, as well as showcasing that data in a unique format. 

If you are ready to show how the unique features of your product or service drove real world business results then it is a good choice for your case study. 

14. Webinar Presentation Case Study Template

One small business saw incredible results when using Visme to optimize their webinar workflow. They saved 100 hours of their precious time by incorporating our collaborative design tools. 

We designed the small business template using those results as an example. When you have an eye catching effect to showcase to your audience, you can use this template as a starting point. 

Case Study Design Tips

Now that we’ve explored the 14 templates you can use with Visme to create your case study, let’s take a look at some practical design tips that will take your content to the next level. 

Be Brief In Your Case Study 

In discussions about writing with style, brevity is a common topic. However, it’s also an important design principle. 

Brevity in design is when you find the best way to perform your intended objective in as few steps as possible. 

When designing your case study, make sure you do not add extraneous visual elements where they are not needed. Instead, think of the effect you want to have on your reader and try to do it simply. 

Describe Your Vision Clearly

Earlier in this article, I wrote about the north star metric, your case study’s emotional effect and using data to make the case study concrete. Your design choices should serve to reinforce these primary goals. 

Clarity in design is when all of the visual elements add up to a whole. 

A great example of this is in the small business case study template where the shapes, typography and color scheme all emphasize the main idea that Visme helps the reader save time. 

Create A Consistent Style 

Visual consistency is a fundamental design principle that you can not afford to ignore in your case study. It will help you increase readability and make sure your audience does not get frustrated with jarring visual elements. 

In short, a consistent style is when you use a uniform color scheme, typography and the same kinds of visual elements throughout the case study. 

Use A Case Study Template For Readability

Readability is a crucial element of design, especially for case studies that are experienced on mobile devices. Contrast is an impactful readability principle. 

Make sure any contrasting colors you chose are easy on the eye and your reader does not have to strain to read your case study. 

Use Proper Alignment In Your Case Study 

Alignment is one of the principles of design that sets professionally designed business case study templates apart. Great designers have an intuitive eye for the mathematically based ratios of proximity invisible in sound design and an eyesore in lousy design. 

The good news is that you do not have to be a mathematician nor a professional designer to have a perfect alignment for your case study. Visme utilizes an easy to use drag and drop design tool that helps you achieve proper alignment in your case study. 

Let Your Brand Personality Speak

When we make intentional design decisions, we want to create a positive emotional experience for our audience. One of the best ways to do that is to make decisions that showcase your brand’s unique personality .

Is the case study you are creating like a well dressed business person who is serious, trustworthy and capable of doing a great job? Is it more like an extravert at a party bouncing from person to person lighting up the room? 

There is no right answer, but you need to infuse your viewpoint into the case study you create if you want to create a unique design. 

Start Designing Your Case Study Today 

A professionally designed case study template will help you create a stunning case study. While reviewing some high level design strategies is an important step, a tool like Visme will help you make a real impact on your audience.

If you’re ready to create your next case study, get started with Visme today .

Design beautiful visual content you can be proud of.

Trusted by leading brands

Recommended content for you:

Create Stunning Content!

Design visual brand experiences for your business whether you are a seasoned designer or a total novice.

About the Author

Brian Nuckols is a writer working in Pittsburgh, Pennsylvania. He enjoys communicating visionary ideas in clear, action oriented language. When he’s not working on content for a transformative company you can find him analyzing dreams, creating music, and writing poetry.

Business Case Studies

• Getting Started
• Case Analysis
• Finding Case Studies in the Library

Free Case Studies

• Buying Cases
• Writing Case Studies
• Case Competitions
• Case Interviews
• Case Method (Teaching)

Many academic and business institutions develop and publish case studies. Some of these organizations provide free access to their case studies:

• Acadia Institute of Case Studies Focuses on entrepreneurship and small business operations.
• Business Case Studies by Company
• Business Ethics Case Analyses
• Canadian Centre for Occupational Health & Safety: Workplace Health Case Studies
• Case Centre Available for a fee.
• Daniels Fund Ethics Initiative Case Studies
• Give to Get Marketing. Marketing and Advertising Case Studies
• HR Open Source Case Studies
• MarketingSherpa Choose "Case Studies" as the content type in the filters.
• MaRS Search for "case study" in the top right search box.
• MERLOT Business Cases
• MIT LearningEdge Case Studies Free case studies by MIT Sloan School of Management.
• Penske. Logistics Case Studies
• Society of Human Resources Management.
• Open Case Studies Project by UBC The Open Case Studies project at UBC brings together faculty and students from different disciplines to write, edit, and learn with case studies that are free and open.
• World's Best Case Studies Short video case studies covering topics including consumer goods, services, and technology.
• << Previous: Finding Case Studies in the Library
• Next: Buying Cases >>
• Last Updated: Jan 17, 2024 11:02 AM
• URL: https://guides.library.ubc.ca/businesscases