Case-study pages often look polished while saying very little: a large hero image, a dozen interface screens, and a closing line about reshaping the client's digital experience. Peers may recognize the visual skill, but prospective buyers still cannot tell how difficult the project was, what the team did, or what happened after launch.
A case-study page that generates inquiries is not a portfolio copied onto a website. It helps an unfamiliar buyer assess risk by answering three questions: Have you handled a situation like mine? Can you explain the reasoning behind the design? Did you deliver an implementable solution or only attractive screens?
01 Explain the Project Background Before Promoting the Result
Open by explaining who the client is, where the business was in its development, and why the project began. You do not need to disclose confidential information, but readers should know whether this involved launching a new brand, redesigning an old corporate website, releasing a product, or expanding overseas. The less specific the context, the more arbitrary the design appears.
Instead of saying the client wanted to improve its brand image, explain that the old information architecture could not support new product lines, the sales team could not use the corporate website as a presentation tool, or mobile traffic was growing while important resources remained hard to find. Specific problems lead naturally to later decisions and help prospective clients recognize similar needs.
What to Include | Less Useful Wording | More Credible Wording |
|---|---|---|
Project background | Corporate website upgrade for a technology company | The company added three product lines, but the old site contained only a company profile, so sales could not quickly share the right solution pages. |
Reason for starting | Improve the brand image | After financing, the company needed a consistent external identity plus English content and contact paths for overseas customers. |
Project scope | Website design and development | Information architecture, 12 page templates, responsive UI, front-end development, CMS, and launch migration |
Constraints | Tight timeline | The launch-event date was fixed, and old content had to migrate without interrupting access. |

02 Present the Real Challenge to Give the Case Weight
A case study is valuable not because everything went smoothly, but because it shows how the team handled conflict. Common corporate website tensions include business teams wanting more content while brand teams demand simplicity; complex product structures that cannot turn the home page into an admin system; major redesigns that must preserve existing SEO equity; and strong motion effects requested for markets with unstable networks.
Internal debate does not need to become a dramatic story. Clearly state the problem, why the obvious request could not be followed directly, and which principle guided the final decision. That alone provides more professional evidence than most image-only cases.
03 Show the Decision Process Without Writing a Diary
Requirements discussions, competitor analysis, prototypes, visual design, development, and launch apply to nearly every project and do not prove differentiation. Select three to five important decisions and explain both the evidence and the options that were rejected.
For example: Why organize product pages by industry scenario rather than internal business unit? Why not translate the Chinese hero copy word for word on the English site? Why move the contact form from the footer to follow technical resources? Why retain old URLs instead of replanning every path? These details show whether the team understands the business and can implement its decisions.
- Begin each decision with the user problem it needed to solve;
- Name at least one direction that was discussed and rejected;
- Support the explanation with a flowchart, page structure, or before-and-after comparison;
- Do not package routine delivery steps as a proprietary methodology;
- When client data is sensitive, use ranges and trends instead of exact numbers.

04 Use Only Images That Readers Can Understand
Images on a case-study page should serve as evidence. Full-page screenshots show the overall character but hide local logic; isolated UI cards reveal details but lose context. A stronger mix alternates full pages, important details, structural diagrams, and the live product.
Add a short caption explaining what readers are seeing and what problem the design solved. A run of unexplained mockups can look like a concept exercise. If the project is live, include the real domain, a mobile recording, CMS screens, or multiple breakpoints to show that the work exists beyond Figma.
Evidence Type | What It Can Prove | Common Mistake |
|---|---|---|
Information architecture diagram | How complex content was reorganized | The diagram is too small to show anything but lines |
Before-and-after comparison | Which specific problems the redesign solved | Only showing a new visual style without explaining business differences |
Important page detail | Interaction details such as forms, filters, and navigation | Cropping so tightly that the use case disappears |
Live-site screenshot | Consistency between design and development | Showing only device mockups, not the real page |
Deliverables index | Project scope and completeness | Listing many file names without explaining their purpose |

05 Results Do Not Always Require a Growth Percentage
Not every project has reliable conversion data, and not every client permits disclosure. Without evidence, do not invent figures such as a 180% increase in inquiries. Results can be verifiable delivery changes: products moving from no dedicated pages to a maintainable catalog; sales gaining consistent solution links; multilingual updates moving from email requests to CMS publishing; or a completed 301 migration with key pages indexed normally.
When data is available, define the metric and time range. Page speed, form completion, organic clicks, qualified inquiries, or content-maintenance time can all help, but avoid attributing every change to one visual redesign.
06 End the Case Study with a Next Step
Readers are usually comparing options and may not be ready to submit a complete brief. Offer three levels of action at the end: view similar work, understand the service scope, or submit project background. This feels more natural than a single Contact Us Now button.
Recommend related cases by industry, project type, or similar problem rather than random rotation. If the case covers a complex enterprise website, the next case should continue with product catalogs, permissions, or technical resources—not an unrelated restaurant Logo.
Frequently Asked Questions
What if the client's name cannot be disclosed?
Describe the industry, scale, project stage, and service scope anonymously. Anonymous does not have to mean vague. Be specific about the problem, constraints, and decisions, and identify which information has been modified.
Does every case study need results data?
No. Without reliable data, show launch status, delivery scope, process improvements, and verifiable product changes. Do not fabricate growth figures for presentation.
How many images should a case-study page include?
There is no fixed number. Every image should explain something. A mix of full views, key details, structural diagrams, live pages, and deliverables is more useful than dozens of consecutive mockups.
Will too much process detail disclose confidential information?
You can omit internal data, technical details, and unpublished strategy while retaining the type of problem, decision principles, and delivery boundaries. Have the client or project lead review the page before publication.
Can case-study pages support SEO?
Potentially. Clear project context, service scope, industry terms, and relevant internal links help search engines understand the page, but the case must first support real procurement decisions rather than repeat keywords.
Service | View |
|---|---|
Corporate website design and website development | |
UI/UX design services | |
Project consultation |