UX/UI Bootcamp
  • COURSE INFORMATION
    • UXUI Bootcamp
  • Self-Onboarding
    • Welcome
    • Your Bootcamp
    • Participation & Conduct Protocols
    • Tools
      • Google Classroom
      • Slack
      • Google Calendar
      • Zoom
      • Figma
      • Github
    • Learning Strategies
    • Complete your Self-Onboarding
  • Prepare for the Course
  • Foundations
    • What is the Foundations section?
    • Introduction to UX Design
    • User-Centered Design
    • Human-Centered Design
    • Design Thinking
      • Example of Design Thinking in a UX Project
    • Introduction to Project Management Methodologies
    • Figma
    • How to use AI
  • 1. Project
    • Milestone 1 - Research Planning
      • Introduction to User Research
      • Research Methods
        • Behavioral Research Methods
        • Attitudinal Research
        • Exploratory, Confirmatory, Evaluative Research
      • Research Planning
    • Milestone 2 - User Research
      • User Interviews
      • Qualitative Data Analysis
      • Practical Application of User Interviews
    • Milestone 3 - User Personas, User Journey Map
      • 👥User Personas
      • 🛤️User Journey Map
    • Recap
  • 2. Project - Mobile Application
    • Milestone 1 - UX Mapping, Empathy Map, Task Analysis, User flows
      • 🗺️UX Mapping Methods
      • 🐾Empathy Map
      • 🔰Task Analysis and User Flows
    • Milestone 2 - Information Architecture and Mid-Wireframes
      • 🏢Information Architecture
      • 💻Sitemap
      • 🏞️Mobile Navigation Patterns
      • 🌠Mobile Design Patterns
      • ✏️Wireframes
    • Milestone 3 - Prototyping, Testing and Refining
      • 🏗️Prototyping
        • Type of Prototypes
        • Prototyping with Figma
      • 🧪Usability Testing
    • Recap
  • 3. Project - Dashboard
    • Milestone 1 - Planning, Competitor Analysis, Design Proposal
      • Project Planning
      • Competitor Analysis
      • Desk Research
      • Design Proposal
    • Milestone 2 - Design & Prototyping
      • Mood Board
      • Style Guide
      • Component Library & UI Kits
      • Prototyping with Figma
    • Milestone 3 - Usability Test & Documentation
      • 🧪Usability Testing
      • Design documentation and Case Study
    • Recap
  • 👏Credits
Powered by GitBook
On this page
  • Design documentation
  • Case Study
  • Key differences between a Case Study and Design Documentation
  • Why do you need a Case Study?
  • Where to use a Case Study?
  • Key Components of a Case Study

Was this helpful?

  1. 3. Project - Dashboard
  2. Milestone 3 - Usability Test & Documentation

Design documentation and Case Study

Design documentation

Design documentation is a comprehensive record of the design process, decisions, and specifications for a project. It provides detailed information about the design’s objectives, components, guidelines, and requirements. This documentation helps ensure that all stakeholders—designers, developers, product managers, and clients—are aligned and can easily understand the design rationale, flow, and specifications.

Design documentation serves as a reference point throughout the design and development process, ensuring that the project is executed consistently with the original vision and guidelines. It can be used for future iterations, updates, or handoffs to different teams (such as developers or external collaborators).

Purpose in the process:

  • To ensure that the design is implemented correctly.

  • To provide detailed guidance for development and iteration.

  • Acts as a technical manual for the design and development teams

Case Study

A case study is an in-depth, detailed examination of a project or situation that highlights the process, challenges, and outcomes. In the context of UX/UI design or product design, a case study tells the story of how a specific design problem was solved. It walks the audience through the design process from start to finish, illustrating the designer's approach, problem-solving skills, methods, and the final result.

Case studies are typically used in portfolios to showcase a designer’s work, presenting the rationale behind design decisions, the impact of the work, and what was learned throughout the project.

Purpose in the Process:

  • To demonstrate the designer’s problem-solving skills and design thinking.

  • To showcase the design process from research to implementation.

  • To present the final results and the success of the project.

  • Used in portfolios, presentations, or for educational purposes.

Key differences between a Case Study and Design Documentation

Aspect

Design Documentation

Case Study

Purpose

To guide implementation and execution of design

To showcase the design process and highlight project outcomes

Audience

Internal teams (developers, designers)

External audiences (clients, employers, portfolio viewers)

Focus

Detailed design specifications and technical guidelines

Storytelling about the design process and challenges

Content style

Technical and detailed

Narrative and reflective

End Goal

Ensure successful implementation of design

Demonstrate problem-solving, creativity, and impact

When it’s used

During project development

After project completion, often as part of a portfolio

Depth of design process

Highly detailed (e.g., color codes, UI components)

High-level overview (e.g., key challenges and solutions)

Example of Use:

  • Design documentation: A UX designer creates detailed documentation of a redesigned e-commerce checkout process. This includes wireframes, color schemes, interaction guidelines, and instructions for developers to build the new checkout experience.

  • Case Study: The same UX designer creates a case study for their portfolio showcasing how they identified high cart abandonment rates, researched user pain points, developed a new checkout flow, and ultimately improved conversion rates by 15%.

Why do you need a Case Study?

  • Showcase problem-solving skills: It demonstrates the ability to identify, analyze, and address design challenges.

  • Highlight the design process: It illustrates the entire design process, from research and ideation to prototyping and testing, showing the thought process behind decisions.

  • Provide evidence of success: A case study often includes measurable outcomes (e.g., increased user engagement, reduced bounce rates) that highlight the impact of the design.

  • Build credibility: It serves as proof of work and expertise, helping designers present themselves to clients, employers, or peers as competent and experienced professionals.

  • Learning and reflection: Case studies often include reflections on what worked well and what could have been done better, showcasing a commitment to continuous learning.

Where to use a Case Study?

  • In a portfolio: Case studies are essential for portfolios as they give potential employers or clients a complete view of your problem-solving process and design thinking.

  • In presentations: Case studies can be used during presentations to demonstrate the impact of your work on a specific project.

  • For learning: Reflecting on projects and writing case studies helps you learn from past experiences and refine your approach for future design challenges.

Key Components of a Case Study

  1. Project overview/Introduction: A summary of the project’s background, the client or company, and the problem that needed to be solved.

  2. Problem statement: Clearly define the problem or challenge that the project aimed to solve.

  3. Research and insights: Describe the research methods used (e.g., user interviews, surveys, competitive analysis) and the key insights gained.

  4. Design process: Walk through the steps taken during the design phase, including ideation, wireframes, prototyping, and testing.

  5. Challenges and solutions: Highlight the challenges faced during the project and how they were addressed.

  6. Final design and deliverables: Show the final design, often through screenshots, prototypes, or mockups, and explain the rationale behind key design choices.

  7. Results and metrics: Present measurable outcomes or improvements achieved as a result of the design. These might include usability improvements, higher engagement, or business KPIs.

  8. Reflection and learnings: Reflect on the overall process, including what worked well, what didn’t, and what you learned during the project.

  9. Conclusion: Summarise the project’s success and its impact on the client or users.

Further resources:

PreviousUsability TestingNextRecap

Last updated 7 months ago

Was this helpful?

How to Write Great Case Studies for Your UX Design Portfolio
How to write a UX case study
How To Write a UX Case Study in 5 Steps
Design documentation process: Why is it important?