Key Performance Indicators (KPIs)

Your constantly-updated definition of Key Performance Indicators (KPIs) and collection of videos and articles.
Be a conversation starter: Share this page and inspire others!

98 Shares

What are Key Performance Indicators (KPIs)?

KPIs (Key Performance Indicators) are metrics that brands collect and evaluate to measure how successful their user experience (UX) activities are. UX KPIs show how close a company is to meeting its UX goals and they help UX designers turn the more abstract user experience into measurable data. When designers track UX KPIs, they can monitor user interactions with a product and gauge how the experience makes users feel.

CEO of Experience Dynamics, Frank Spillers explains important points about UX KPIs:

Transcript

Why Are User Experience Key Performance Indicators Vital to Measure?

User experience designers value user experience KPIs as vital signs of how they can guide their design work towards the most desired outcomes both for their brands’ users and to meet their brands’ business goals, too. It’s crucial to measure UX KPIs, and for several reasons—namely to:

1. Track Success

UX KPIs help brands keep a finger on the pulse of their UX activities in real-world areas such as product development. When they monitor how successful efforts and iterations have been, they can make informed decisions or test hypotheses about how to improve the user experience as needs be.

2. Maximize Visibility

KPIs make UX contributions to the company's success both traceable and visible over extended periods of time.

3. Apportion Budget

UX KPIs that show signs of success can be a useful argument for design teams to bring up if their management think about allocating budgets away from their UX activities to, say, marketing campaigns.

4. Boost The Sense of Achievement

UX KPIs help bring a rewarding sense of accomplishment for teams as they make visible progress towards their set UX goals. Plus, success breeds success—and they can be nice morale boosters to give team members the lift they need to see that they’re on the right track with design efforts.

An illustration showing mobile device screens with pictures of measuring instruments and scales around them.

© Emily Stevens, Fair Use

What Are Types of KPIs in UX Design?

KPIs can comfortably split into three large branches or general types:

Behavioral KPIs

Behavioral UX KPIs help designers measure what users actually do when they’re interacting with a product. These are critical metrics because they yield invaluable insights into user behavior in the moment and in the field. Another important point is that they can clearly highlight areas where improvements need making. Key behavioral UX KPIs include:

1. Task Success Rate

The task success rate UX metric sees wide use, and—true to its name—it shows what percentage of users successfully complete a specific task. It's a simple—yet powerful—way to see how well users can actually achieve their goals when they use a product. In the main—and regarding KPI UX design efforts—a good task success rate to aim for is around 78%.

To measure their task success rate, designers typically run usability studies with multiple users and then they calculate the percentage of them who manage to finish the assigned task. It's important to consider partial successes, too, however—and in varying degrees. For example, if 35 out of 100 users complete a task with just a minor issue, then it’s important to record that 35% of users were able to complete the task with just that small kink—something that designers can iron out in the next iteration from the data collected.

A graph showing four results of percentage of users who completed the task at each level of success.

© Jakob Nielsen and Raluca Budiu, Fair Use

2. Time-On-Task

Just as it sounds, time-on-task measures how long it takes a user to get through and finish a specific task. The time spent usually gets reported as an average, and so it can give valuable insights into a user interface’s (UI’s) efficiency. Naturally, it can vary according to the individual user—and numerous factors might be at play, including external distractions and other factors such as their mood. Generally, though, shorter task times directly indicate high levels of usability. KPIs that reflect these can be a strong indicator of a decently crafted UI, therefore, if tasks that take just a small amount of time chart as a distinct majority.

At the other end of the scale, longer times might well suggest that users are really struggling to understand the product or find the information they need to use it. If there’s a sizeable amount of longer time-on-task KPIs showing up, then it’s almost certainly going to call for a revisit to the design. It’s a particularly helpful KPI for UI-UX designers, since it’ll also provide a chance for design teams to take a closer look at how they can make the content a better fit for the users’ contexts:

Watch Frank Spillers explain important points about context, content and what users need.

Transcript

To measure time-on-task accurately, it's best to track time per screen—or activity—as well as how long it takes users to get through the overall task; that means as a sequence of actions or screens. This helps to pinpoint which steps are taking them the most time to get through or which might be adding unnecessary seconds. Every split-second counts in this KPI for UX designers—a vital opportunity for them to deliver great customer service through seamless experiences that respect individual users’ time. To calculate average task time, it’s wise to use the geometric mean for sample sizes smaller than 25, and the median for larger samples.

An image of text showing how to calculate the average time on task.

© Aparna Subhash, Fair Use  

3. User Error Rate & User Error Occurrence Rate

These two KPIs are in the same “bucket,” but they’ve got minor differences which are important to understand to maximize the benefit designers can get when they use them.

To measure the user error rate is to find the percentage of mistakes that users make while they’re trying to complete a task. Take the number of user errors and divide it by the total number of task attempts and then multiply that result by 100. A high error rate is a pretty sure sign that usability issues are lurking in digital solutions and designers need to address these as soon as possible.

An image showing text explaining how to calculate the error rate.

© Sandro Meyer, Fair Use

Then, there’s the error occurrence rate or average error occurrence rate. Designers can use that whenever the task they want to measure has just one potential chance for error—for example, if users click the wrong button—or if designers, or UX researchers, just want to track one error among several different ones that a user could make. To calculate the average error occurrence rate, divide the total number of user errors which happened—for all users—by the total number of possible errors that all users could have made.

An image of text showing how to calculate the error occurrence rate.

© Sandro Meyer, Fair Use

Naturally, the error rate is a huge factor—and potential worry—for designers, design teams and the brands they work for. It doesn’t mean the other KPIs are any less important; it’s just that error rates tend to flag—in clear terms—what designers may need to do to improve UIs as a matter of urgency. Tasks might be too complex for users; the system itself might demand too much familiarity for them to use straight away—and so not be as intuitive as needed—or there might be environmental factors, like distractions, or user characteristics, like cognitive abilities to account for. The latter point highlights precisely why accessibility is so vital a matter in UX design.

Watch this video to understand key points about the need for accessible designs:

Transcript

4. Navigation Versus Search

With this KPI, digital designs’ essential quality of navigation vs search is a metric to compare the effectiveness and usage of a website or application's navigation system against its search functionality. This KPI helps designers and developers understand how users prefer to find information or complete tasks within a digital product like a website or mobile app. Navigation refers to the menu structure, links and hierarchical organization of content that lets users browse through a website or app. Meanwhile, search is the functionality that enables users to directly query for specific information or content using keywords or phrases.

This KPI compares these two methods of information retrieval so researchers or designers can tell which one’s more effective and preferable to users. For example, a large e-commerce website might have thousands of products with users being able to find the products they want in two primary ways, if they:

  1. Navigate through categories and subcategories: for example, Electronics > Smartphones > iPhones.

  1. Use the search bar to type in specific product names or features: for example, "iPhone 13 Pro Max."

The KPI of navigation vs search would measure and compare how often users successfully find products using each method and how efficiently they do so. For example, designers and UX researchers measure this KPI with analytics tracking—such as Google Analytics to track user behavior—and navigation path analysis, click tracking and heat maps. The insights they get from collecting data like this can show them many things about which way is better. For instance, a check in the search log analysis could reveal what search terms users enter to look for what they’re after.

An image of the Amazon.com landing page.

Amazon offers a wealth of possibilities for users to find what they want—how they get to the item page might be a matter of interest with key insights into this part of their user and customer experience.

© Amazon, Fair Use

5. Page Views

For this KPI—the number of views of a page—designs can involve anything from blog posts to the most particular type of item a brand might offer—like a tiny accessory or hard-to-find car part—and be a more intricate matter for interactive design.

Still, page views alone don't tell the whole story. To really understand how people use a website, it's smart to look at other factors as well. For example, with mobile apps, it’s advisable to keep a count of items like taps, clicks or how many screens a user goes through. When researchers or designers combine these details with page views, they’ll likely get a much clearer picture of how users use a site or app.

6. Bounce Rate

Bounce rate is a key user engagement metric—and even a UX designer KPI in the sense that a high bounce rate can show up a designer’s errors in judgment and other elements of work performance. It measures the percentage of visitors who leave a webpage without further interaction—potentially a major drawback for product designers, especially. To track bounce rates and other behavioral metrics, brands can use web analytics tools or app-specific platforms—with features like session tracking, heat maps and bug identification, among alternative methods like A/B testing.

UX Strategist and Consultant, William Hudson explains important points about A/B testing:

Transcript

Attitudinal KPIs

These KPIs measure what users say, with these key examples:

1. System Usability Scale (SUS)

The System Usability Scale (SUS) is a widely used tool for evaluating how usable software, websites and other interactive systems are. John Brooke of Digital Equipment Corporation created the SUS in 1986, and it’s become a standard method for assessing the overall user-friendliness of a product. It consists of a 10-question survey that users complete after they’ve interacted with a system, and it provides quick and unfiltered feedback.

The SUS uses a 5-point Likert scale—ranging from strongly disagree to strongly agree. The final score is something to calculate on a scale of 0 to 100, with higher scores indicating better usability. It’s important to point out that the average SUS score is 68%—roughly translating to “C” grade, with 51% being the threshold for a system not to fail.

A template of a System Usability Score card.

© Interaction Design Foundation, CC BY-SA 4.0

2. Net Promoter Score (NPS)

The Net Promoter Score (NPS) is a customer loyalty metric—one that Fred Reicheld at Bain & Company introduced in 2003. It asks users a simple question: "On a scale of 1-10, how likely are you to recommend this product to a friend?" Based on their responses, users are categorizable as Promoters (9-10), Passives (7-8) or Detractors (0-6).

To calculate NPS, subtract the percentage of Detractors from the percentage of Promoters. The score can range from -100 to +100. A positive score indicates that Promoters outnumber Detractors, which suggests there’s considerable customer loyalty at work.

An image of text showing how to calculate the net promoter score.

© NN/g, Fair Use

3. Customer Satisfaction (CSAT)

Customer Satisfaction (CSAT) is a metric that measures how satisfied customers are with a company's products or services. Researchers measure CSAT when they ask for customer feedback, and often use variations of the question: "How would you rate your overall satisfaction with the [goods/service] you received?" To calculate CSAT, use the responses of 4 (satisfied) and 5 (very satisfied) on a 5-point scale, though some Likert scales can vary.

An image of a Likert scale with 7 response categories.

Hubspot’s 7-point scale, for fine-tuned CSAT feedback.

© Hubspot, Fair Use

Other Important Business KPIs

Here are some other major KPIs for designers to consider:

1. Conversion Rate

One of the most telling indicators of how effective a product is is its ability to transform casual browsers into active participants—or visitors into customers. This transformation is something to quantify through the conversion rate, and it’s a percentage that reflects how many users complete a desired action, like to finalize a purchase or subscribe to a newsletter. To calculate this rate means to divide the number of successful conversions by the total visitor count.

2. Retention Rate

The retention rate is the percentage of users who continue to engage with a product—or a service—over time. To determine it, divide the number of customers retained by the total number of customers at the start of the measurement period.

CEO of Experience Dynamics, Frank Spillers explains vital points about KPIs in a business and UX context:

Transcript

3. Average Order Value

For e-commerce businesses, the Average Order Value (AOV) is critical for them to understand actual customer spending, and it’s the typical amount a customer spends in each transaction over a specific time frame. To calculate AOV, divide the total revenue by the number of orders that users placed during the chosen period.

An image of an SUS card along with another image representing measurement in UX design.

It’s helpful to keep an eye on UX design KPI examples in context and in combination with other UX metrics.

© Interaction Design Foundation, CC BY-SA 4.0

How to Implement UX KPIs in An Organization?

This typically applies more to startups—since established or bigger brands will likely already have a concrete grasp of what KPIs they should follow. It's critical to note that UX teams need to make sure they have their KPIs based on specific UX goals that support general corporate goals. The selection of UX KPIs should include business-centered, marketing-centered and user-centered metrics—that way, they can be in line with various corporate goals and avoid disconnects between what designers see as success and what the high management might deem success to look like and expect from a production team under them.

Set Up A Measurement Framework

To set up a solid measurement framework, start by identifying relevant KPIs. Google's HEART framework is a helpful tool for this. It covers Happiness, Engagement, Adoption, Retention and Task success. These metrics are applicable at both product and feature levels.

An image representing the heart network and its components.

© Long Le, Fair Use

Next, it’s important to align the chosen metrics with business goals to make sure they really do support key objectives. So, set clear benchmarks and goals for each KPI to track progress effectively, and use tools such as heatmaps and session recordings—important ways to bring qualitative and quantitative data into the picture. To implement UX KPIs effectively, it’s essential to combine quantitative and qualitative data—and so reveal both the “what” and the “why” behind user behaviors.

Watch as Author and Human-Computer Interaction Expert, Professor Alan Dix explains important points about the difference between qualitative and quantitative research:

Transcript

What Are Best Practices to Improve UX KPIs?

Designers can boost their essential KPIs in many ways, and here are some important ones:

  • Conduct thorough user research to understand their target audience’s needs.

UX Strategist and Consultant, William Hudson explains important points about UX research:

Transcript

  • Provide clear and concise instructions for complex tasks.

  • Design with a mobile-first approach for responsiveness.

Frank Spillers explains important points about responsive design:

Transcript

  • Use progressive disclosure to lessen cognitive load.

William Hudson explains vital aspects of progressive disclosure:

Transcript

  • Optimize page load times and overall performance.

  • Use descriptive, action-oriented button labels.

Watch this video on UI patterns to understand more about how useful they are:

Transcript

  • Incorporate visual cues and micro-interactions for feedback.

  • Work effective error handling and recovery into the UI.

  • Leverage A/B testing to refine design choices.

  • Create clear, intuitive navigation structures.

  • Include a clear and logical information architecture.

Watch William Hudson explain important points about information architecture:

Transcript

  • Make sure of an accessible design for all users—including those with disabilities.

  • Simplify forms and minimize unnecessary fields.

  • Provide search functionality with relevant results.

  • Implement user onboarding for new features.

  • Regularly analyze user behavior data and make iterative improvements.

  • Create designs that evoke positive emotions and align with users' values and expectations.

Author and Human-Computer Interaction Expert, Professor Alan Dix explains vital aspects of emotions and usability:

Transcript

  • Make sure there’s a cohesive visual identity and tone of voice across all touchpoints.

  • Be upfront about product features, limitations and any potential issues.

  • Tailor the user experience with individual personalized preferences and needs whenever possible.

  • Add little, engaging elements—micro-interactions that surprise and please users.

An illustration showing seven touchpoints.

Some important touchpoints to keep in mind.

© Rosenfeld Media, Fair Use

Why Are KPIs Important to Feature in UX Portfolios?

It's crucial for designers to demonstrate their ability to work with KPIs in their UX portfolios for several reasons—namely since designers can:

  1. Demonstrate business acumen: To show how proficient they are in handling KPIs indicates that a designer understands how important it is to align design decisions with business goals and objectives.

  1. Prove a data-driven approach: It showcases how well the designer can make informed decisions—as in, ones based on measurable metrics and hard analytics—rather than just aesthetics or personal preferences.

William Hudson explains key points about analytics:

Transcript

  1. Highlight problem-solving skills: To address KPIs in design work shows how ably a designer can spot and solve complex problems that impact business performance.

  1. Show value creation: When designers link design decisions to KPIs, they can illustrate how their work contributes to improving key metrics and overall business success.

  1. Differentiate themselves from other candidates: Many designers focus just on visual aspects; so, if a designer showcases KPI-driven work, it can really set them apart in a competitive job market.

Design Director at Societe Generale CIB, Morgane Peng discusses essential aspects of designer portfolios:

Transcript

How Can Designers Optimize Their Portfolios with KPIs?

Here are some important items that designers can effectively showcase their KPI-handling skills with in their UX portfolios:

  1. Case studies: Present detailed case studies that outline the project's goals, the KPIs targeted, the design process and the resulting impact on those KPIs—and it’s best to angle these in the form of a story arc.

A diagram showing the story arc approach to case studies.

Designers can include KPIs in their portfolios to great effect, especially when these tie in with a story arc approach.

© Interaction Design Foundation, CC BY-SA 4.0

  1. Collaboration highlights: A designer would do well to describe how they worked with other teams—like marketing and development—to align on KPIs and achieve shared goals.

UX Designer and Author of Build Better Products and UX for Lean Startups, Laura Klein explains essential points about cross-functional collaboration:

Transcript

  1. Lessons learned: It’s helpful to think from a storytelling angle again and discuss any challenges that came up while working with KPIs—and how the designer overcame them; something that can showcase adaptability and continuous learning.

  1. Contextual explanation: Give context for the KPIs chosen—and explain why they’re relevant to the project plus how they aligned with the overall business objectives.

Morgane Peng explains additional valuable points about how to craft a strong portfolio:

Transcript

What are Potential Pitfalls of Relying on KPIs Too Much?

Regarding pros and cons, there are so many benefits—and vital ones to consider, especially—that it’s easy to overlook some potential downsides that can come if designers, design teams and their brands over-rely on them. Here are some important concerns:

  1. Oversimplification: Complex user experiences can't always boil down into simple metrics—to try to do so can result in missed nuanced insights.

  1. Quantitative bias: To put too much emphasis on quantitative KPIs may overlook valuable qualitative feedback and insights—so get qualitative data, too.

  1. One-size-fits-all approach: Standardized KPIs mightn’t be suitable for all products, services or user segments. For example, there’s the users’ culture to consider.

Author and Human-Computer Interaction Expert, Professor Alan Dix explains important points about how to design for culture:

Copyright
Transcript

  1. Resource drain: To collect and analyze KPI data can be time-consuming and expensive—plus, it might even divert resources from actual UX improvements.

  1. False sense of security: Good KPI numbers might invite complacency—supposedly healthy readings can mask a complex design and user landscape, and end up meaning missed opportunities for innovation and improvement.

Remember, UX KPIs function much like the vital signs of a digital solution and—by association—the brand behind it; so, use them wisely and take insights alongside each other for the best results.

Questions About Key Performance Indicators (KPIs)?
We've Got Answers!

How do KPIs differ from metrics?

KPIs—or Key Performance Indicators—are specific, strategic goals that businesses track to measure their success over time. They provide a clear focus on what matters most to achieve long-term objectives. Metrics—on the other hand—are the data points that support KPIs. They’re the raw numbers or statistics that you can measure and analyze to understand performance. While every KPI is a metric, not every metric qualifies as a KPI. KPIs indicate whether you're on the right path, while metrics provide the detailed information needed to make adjustments. 

Watch our Master Class, Design KPIs: From Insights to Impact with Vitaly Friedman, Senior UX Consultant, European Parliament, and Creative Lead, Smashing Magazine. 

CEO of Experience Dynamics, Frank Spillers explains important aspects of KPIs: 

Transcript
 

When should you review your KPIs?

Review your KPIs regularly so you can be sure they stay aligned with your business goals. At a minimum, conduct a quarterly review to assess performance and make any necessary adjustments. What’s more, review your KPIs whenever there's a significant change in your business—like a new strategy, market shift or product launch. Regular reviews help you spot trends, address issues early and keep your team focused on the most relevant objectives. When you stay proactive with your KPI reviews, you’ll make sure that your business really stays on track and adapts quickly to any changes. 

Watch our Master Class, Design KPIs: From Insights to Impact with Vitaly Friedman, Senior UX Consultant, European Parliament, and Creative Lead, Smashing Magazine. 

Frank Spillers explains important aspects of KPIs: 

Transcript
 

Why do some KPIs fail to deliver results?

Some KPIs fail to deliver results because they don't align with the business's core objectives. When KPIs are too broad—or too narrow or irrelevant—they can mislead rather than guide effective decision-making. Another reason is poor data quality or inaccurate tracking methods—things that lead to unreliable insights. Another thing to consider is if teams don't fully understand or engage with the KPIs, they may not take the necessary actions to improve a UI’s performance. So, it’s a good idea to regularly review and refine your KPIs, to be sure they’re actionable and relevant. It’ll help avoid these pitfalls and make sure they’re KPIs that truly drive meaningful results. 

Watch our Master Class, Design KPIs: From Insights to Impact with Vitaly Friedman, Senior UX Consultant, European Parliament, and Creative Lead, Smashing Magazine. 

How do you present KPI data to stakeholders?

It’s important for user experience designers, user interface designers and others to focus on clarity and relevance. Start with a summary of the most critical KPIs that directly impact the business goals. Use visual aids like charts, graphs and dashboards to make the data easy to understand at a glance. Tailor the presentation to your audience—and highlight the KPIs that matter most to them, plus explain the implications in clear, concise language. Provide context by comparing current performance to targets or past results. Lastly, offer actionable insights and suggest next steps to show how the data can inform decision-making. 

Watch our Master Class, Design KPIs: From Insights to Impact with Vitaly Friedman, Senior UX Consultant, European Parliament, and Creative Lead, Smashing Magazine. 

Author, Speaker and Leadership Coach, Todd Zaki Warfel explains important points about how to present to stakeholders: 

Transcript
 

How do you set realistic KPI targets?

For one thing, analyze historical data to understand past performance trends. Consider your current resources, market conditions and business goals when you’re establishing these targets. Engage with your team to get their insights on what’s achievable, as they’re often closest to the processes that are under the “microscope.” Break down larger goals into smaller, incremental targets to ensure progress is steady and manageable. Use benchmarks from your industry to set targets that are challenging yet attainable, too. Last—but not least—regularly revisit and adjust these targets to reflect any changes in your business environment. 

Watch our Master Class, Design KPIs: From Insights to Impact with Vitaly Friedman, Senior UX Consultant, European Parliament, and Creative Lead, Smashing Magazine. 

How do you calculate the ROI of KPIs?

To calculate the ROI of KPIs, start by identifying the specific outcomes or benefits linked to each KPI. Quantify these benefits in financial terms—like increased revenue, cost savings or improved efficiency. Next, determine the total investment that’s needed to track and achieve the KPIs—including costs like software, personnel and time. Subtract the total investment from the financial benefits; then, divide this number by the investment amount. Finally, multiply by 100 to express the ROI as a percentage. This calculation shows how effectively your KPIs are driving financial returns relative to their cost. 

Watch our Master Class, Design KPIs: From Insights to Impact with Vitaly Friedman, Senior UX Consultant, European Parliament, and Creative Lead, Smashing Magazine. 

CEO of Experience Dynamics, Frank Spillers explains crucial aspects of KPIs: 

Transcript
 

How do you select the right KPIs for your business?

Start by defining your core business objectives. Find the key activities and processes that directly influence these objectives. Choose KPIs that align closely with these areas and can effectively measure progress toward your goals. Make sure that each KPI is specific, measurable, attainable, relevant and time-bound (SMART). Involve stakeholders in the selection process to get diverse insights on board and ensure buy-in. Review and refine your KPIs—regularly—to adapt to any changes in your business environment. Focus on KPIs that truly reflect your priorities and you can make sure they drive truly meaningful outcomes. 

Watch our Master Class, Design KPIs: From Insights to Impact with Vitaly Friedman, Senior UX Consultant, European Parliament, and Creative Lead, Smashing Magazine. 

Frank Spillers explains important aspects of KPIs: 

Transcript
 

What are some highly cited scientific articles about KPIs?

Lachner, F., Naegelein, P., Kowalski, R., Spann, M., & Butz, A. (2016). Quantified UX: Towards a Common Organizational Understanding of User Experience. In Proceedings of the 9th Nordic Conference on Human-Computer Interaction (NordiCHI '16). Association for Computing Machinery, New York, NY, USA, Article 56, 1–10.  This conference paper's authors propose a framework for quantifying user experience—crucial for establishing meaningful KPIs. They present a method for translating qualitative UX insights into quantitative metrics. 

Earn a Gift Earn a Gift, Answer a Short Quiz!

1
2
3
4
1
2
3
4
Question 1
Question 2
Question 3
Get Your Gift
Interaction Design Foundation logo

Question 1

What is the primary purpose of a Key Performance Indicator (KPI)?

1 point towards your gift

  • To track random metrics with no direct relation to business goals.
  • To measure progress toward achieving specific business objectives.
  • To solely focus on customer satisfaction without other metrics.
Interaction Design Foundation logo

Question 2

Why is it important for KPIs to be measurable?

1 point towards your gift

  • It allows subjective interpretation of results.
  • It ensures that performance can be quantified and tracked over time.
  • It reduces the need for detailed data collection.
Interaction Design Foundation logo

Question 3

Which characteristic is essential for an effective KPI?

1 point towards your gift

  • Broad and general, covering all possible business areas.
  • Specific and aligned with organizational goals.
  • Constantly changing to adapt to daily operations.

Learn More About Key Performance Indicators (KPIs)

Make learning as easy as watching Netflix: Learn more about Key Performance Indicators (KPIs) by taking the online IxDF Course Build a Standout UX/UI Portfolio: Land Your Dream Job.

Why? Because design skills make you valuable. In any job. Any industry.

In This Course, You'll

  • Get excited when you discover the secret to a portfolio that fast-tracks your way to job offers. Did you know most hiring managers decide on your application in just 7.4 seconds? In today's competitive job market, first impressions are everything

  • Learn to build a career where you fulfill your potential and earn a salary that reflects your true value. Your design portfolio is your ultimate advocate. It speaks for you when you're not in the room. In this course, you'll get real-world insider insights from an expert who's reviewed thousands of portfolios. Take the course and build the career you're truly meant for.

  • Make yourself invaluable when you learn how to hook hiring managers with your problem-solving mindset, user-centered design approach, and business acumen. We know how frustrating it is to apply for job after job with no response. As AI makes it easier to generate generic portfolios and case studies, you stay in demand by clearly showing your timeless human-centered design skills: How you think, make decisions, and solve real problems. This User Experience/User Interface (UX/UI) portfolio course gives you the skills to finally stand out from the pack. Whether you're new to design or already experienced, you'll turn your past work experiences into portfolio gold and create a portfolio they love! No matter your background, it's easier than you think.

  • Gain confidence and credibility with our step-by-step blueprint for a portfolio that gets you hired faster into a role where you'll fulfill your purpose and increase your salary potential. Through hands-on projects and ready-to-use downloadable templates, you'll develop a winning portfolio strategy, write attention-grabbing hooks, present your portfolio with confidence, and master the first impression formula. You'll walk away with a pitch-ready UX/UI design portfolio you can use to land your dream job.

It's Easy to Fast-Track Your Career with the World's Best Experts

Master complex skills effortlessly with proven best practices and toolkits directly from the world's top design experts. Meet your expert for this course:

  • Morgane Peng: Designer, speaker, mentor, and writer who serves as Director and Head of Design at Societe Generale CIB.

Get an Industry-Recognized IxDF Course Certificate

Increase your credibility, salary potential and job opportunities by showing credible evidence of your skills.

IxDF Course Certificates set the industry gold standard. Add them to your LinkedIn profile, resumé, and job applications.

Course Certificate Example

Be in distinguished company, alongside industry leaders who train their teams with the IxDF and trust IxDF Course Certificates.

Our clients: IBM, HP, Adobe, GE, Accenture, Allianz, Phillips, Deezer, Capgemin, Mcafee, SAP, Telenor, Cigna, British Parliament, State of New York

All Free IxDF Articles on Key Performance Indicators (KPIs)

Read full article
The ROI of UX – Some Basic Metrics - Article hero image
Interaction Design Foundation logo

The ROI of UX – Some Basic Metrics

User experience is essential; we know that as UX professionals, but how do we communicate the benefits to those who pay for our services? The easiest way is to develop metrics that can indicate that our work benefits the organization we work for. So, what kinds of metrics might we want to use? We’ll

Social shares
540
Published
Read Article

How to Write UX/UI Design Case Studies That Boost Your Portfolio and Get You Hired

How to Write UX/UI Design Case Studies That Boost Your Portfolio and Get You Hired

The term “case study” sounds a little boring, doesn’t it? What if, instead, it were called a “design story”? Well, that’s exactly how you should think of it! Approach your UX/UI design case studies like stories, not just a list of tasks you completed. You will not only make your portfolio easier and more enjoyable to create, but you will engage the reader and leave them wanting more. Give hiring managers structure, intrigue, and emotion as you tell your design successes. You’ll find yourself preparing to interview for your dream job in no time.

UX (user experience) design projects can be messy. Deadlines change, project goals shift, and new findings can fundamentally alter design specifications. Stories will give your past experiences form and organize your case studies. In this video, Stephen Gay, UX Design Lead for Google One, explains why you should include narrative in your UX/UI design portfolio:

Transcript

When you arrange your experience into a meaningful sequence of events, recruiters will understand the path you took to the final product. The path is the juicy part of your case study—it shows how you make decisions, problem-solve, and work with others. Combine structure with storytelling elements like emotion and conflict, and your design stories will come to life.

The UX/UI Design Story Blueprint: How to Structure Your Case Studies

Before you begin weaving tales, it’s important to create a structure for your case studies that keeps you on track as you write.

Your case study structure has three main goals:

  1. To showcase your design process and your solutions.

  2. To keep the reader engaged as you guide them through your design projects.

  3. To make it as easy as possible for busy hiring managers to navigate your case study.

Therefore, your goal is a logical, well-organized, and easy-to-navigate structure. The best way to achieve this is to follow the design process or methodology you used, such as design thinking, plus a hook and conclusion. Morgane Peng, Managing Director and Head of Design at Societe Generale CIB, explains what to include in your case study in this video:

Transcript

A typical structure for a case study might be:

  1. The hook

  2. Research

  3. Sketches and wireframing

  4. Prototyping and iteration

  5. Outcomes and lessons learned

Each section should include a combination of text and media (images, video, interactive elements, etc.). A good benchmark is 60%-80% text and 20%-40% media.

The stages of your design process serve as an ideal structure for your case study. They’re universal and relatable, so busy hiring managers can immediately understand what they’re reading. Your narrative can then flow through this structure as you set up your story with exposition, introduce and resolve conflicts, and reach the climax.

© Interaction Design Foundation, CC BY-SA 4.0

Depending on the message you want to convey in your case study, you might focus on one area in particular. For example, if you want to show off your UI (user interface) design skills, you might only include the prototyping and iteration section. For another project where you’re proud of the research you did, you could make this the primary section.

However, regardless of your project, you should always include two sections: the hook and the outcomes and lessons learned.

The Hook Area

The purpose of the hook is to immediately grab attention and entice the reader to read on. Your hook should convince hiring managers they’ve made the right choice by opening your case study.

© Interaction Design Foundation, CC BY-SA 4.0

To craft a hook that potential employers can’t say no to, make sure you include these elements:

  • The key characteristics of your project:

    • The type of project, e.g., a school project, client project, hypothetical project.

    • Your role, g., UX Designer, Product Designer, User Researcher, UX Writer

    • Your contribution, e.g., checkout flow, search optimization, information architecture

  • Whether you worked solo or in a group, and how you collaborated with others.

  • The design approach and methodologies you used to solve challenges and why they were effective. For example, design thinking, agile, lean UX, etc.

  • A preview of the work, such as screens, videos, or prototypes, to capture attention early on.

  • An introduction, or “exposition,” that sets the scene for the rest of the case study (more on this later on).

Where your case study differs from a typical story is that you should include the results of the project before the full case study begins. Why? Hiring managers are busy people and may only have allocated five minutes to review your whole portfolio. If you show them the results first, they will be more inclined to run over their time limit and find out how you got there. Even if the project did not reach its goals, include the positive outcomes, for example, the lessons you learned or the skills you gained.

“This might sound a bit counterintuitive … but as a hiring manager, I'd rather see the results first before diving into the case study and committing 7 to 10 minutes of my life reading it. If the preview is not available, I usually just scroll down to see it and back up to start reading.”

- Morgane Peng, Managing Director and Head of Design at Societe Generale CIB

Research Area

If your case study project followed a typical design process like design thinking, then the next part of your story will likely be user research.

© Interaction Design Foundation, CC BY-SA 4.0

When you present your research and outcomes in your case study, you show that you care about research-driven, user-centered solutions. Follow these top tips when you write about your research:

  • Provide context, constraints, and clear research goals.

  • Insights are more valuable than screenshots of interview scripts or the tools you used. However, you should still include deliverables such as empathy maps, personas, and affinity diagrams to show your processes.

  • Organically link your research findings and explain how they informed your problem statement and design process.

  • Explain the reasoning behind your research methodologies and what you learned from them. Otherwise, it may seem you just ticked off research as part of a checklist.

Sketching and Wireframing Area

Sketches and wireframes demonstrate your understanding of layout concepts, UI elements, and information hierarchy. They also show your thought processes and the journey from ideas and research insights to final prototypes.

© Interaction Design Foundation, CC BY-SA 4.0

This section is your opportunity to demonstrate the core of your design process:

  • Armed with research insights, how do you approach solutions for your users’ problems?

  • How do you collaborate in a team to generate and develop ideas?

  • When you face a roadblock, how do you get past it?

As for the sketches themselves, you may have created them rapidly while brainstorming, and unless you’re an excellent illustrator, they could be a little messy! Given this, it’s good practice to redraw your sketches for your portfolio. You want to make sure hiring managers can easily understand them and that your handwriting is clear.

Similarly, your hand-drawn wireframes should be well-presented. Even if you understand them, unaligned UI elements may appear as bad design. Redrawn sketches and wireframes also give you the opportunity to annotate and explain your design decisions. In this video, Mike Rohde, Illustrator, Teacher, and Designer, explains how to use sketches in your portfolio.

Prototyping and Iteration Area

The prototype and iterations section is the penultimate section of your case study, where you showcase your final design. You’ll also tell hiring managers about the road your designs took, from sketches to high-fidelity prototypes.

© Interaction Design Foundation, CC BY-SA 4.0

The time has come to show off your final designs! Use this opportunity to showcase how your design process paid off. These are some tips to get the most out of this section:

  • Include both mobile and desktop prototypes in context if your design is multi-device. For example, show the mobile version to scale within a phone mockup.

  • Link to your prototype files to allow hiring managers to explore the design in detail.

  • Highlight any usability testing and the design changes you implemented based on the insights you found. This approach shows how you improve designs through iteration.

Outcomes and Lessons Learned

The outcomes and lessons from your project are arguably the most important part of your case study. Hiring managers want to see how you reflect on and grow from your experiences.

© Interaction Design Foundation, CC BY-SA 4.0

Finish your case studies with a conclusion. Did the project achieve its goals? If not, why? If yes, how? While the result is important, how you reflect on the project tells recruiters the most about you as a designer. Make sure you include the following as you write:

  • Include self-reflection and what you have learned to show growth and adaptability. Hiring managers want to see what you learned and how you’ve grown from a project, even if the project was not a business success.

  • Acknowledge your mistakes and the lessons learned from them, such as adapting complex interfaces for advanced users. Employers will trust you more when you admit your mistakes and show your ability to evolve and self-improve.

Take the Fast Lane with Our Case Study Template

You can get started on the structure of your case study right now with our free downloadable template. For each section, the template shows you what to include and presents a simple example:

Advance Your Career With This Free Template for “Craft Case Studies That Get You Invited To Your Dream Interview”
Craft Case Studies That Get You Invited To Your Dream Interview
We respect your privacy
Get 1 powerful email each week: Design a life you love!

The Narrative: Your Design Story

“Tell me the facts, and I’ll learn. Tell me the truth, and I’ll believe. But tell me a story, and it will live in my heart forever.”

—Native American proverb

Now that you have your structure, you can begin to thread your narrative through it. Consider the following as you write your case study stories.

Exposition

Exposition is where you set the scene of your story—it should be short, sweet, and fit into your hook. In your exposition, you should include:

  • The project background: Provide only as much background as necessary to understand the project's context. Introduce the client or company, the product, and anything else relevant. If it doesn’t add to the story, remove it!

  • The “inciting incident”: The earliest event in the story that sets it in motion. Instead of “My company tasked me with the project,” aim for “My company wanted to increase conversions to improve year-on-year sales figures, and identified our product pages as an opportunity for this.”

  • Your motivation: This is the most important part of the exposition. What motivated you to take on the project tells hiring managers a lot about you. For example, “I was eager to develop my user rapport skills, and this project required a lot of qualitative research.” This example shows you’re committed to growth and up for challenges.

  • The project goal(s): Where possible, use measurable goals so it is clear in your conclusion whether you met them or not. For example, “The project goal was to increase conversions by 1.5% and monthly revenue by 3%.”

If you are transitioning to UX/UI design from a different industry, you may need to provide a little more exposition. This additional information will help recruiters understand how your experiences relate to design. Find out more from Morgane Peng, Managing Director and Head of Design at Societe Generale CIB, on how to use your non-design experience in your design portfolio:

Transcript

Emotion

Emotion helps readers relate to the story and imagine themselves in your shoes. An emotional account will always provide a better reading experience than a dry, factual account ever could.

However, emotion doesn’t mean melodramatic. Keep your writing professional, and don’t exaggerate the emotion. You want to engage recruiters—not perform a soap opera.

Look at the following two examples; which one is more engaging?

Factual:

The main finding was that the assumption that users shopped based on their weekly nutritional needs was invalid.

Emotional:

Our finding threw a giant wrench in the works. We realized our assumption—that users shopped based on their weekly nutritional needs—was completely wrong.

Emotion is a tremendous factor in decision making, as Susan Weinschenk, Chief Behavioral Scientist and CEO, The Team W, Inc., explains in this video:

Transcript

Moments of Conflict

Conflict introduces problems that require a resolution. Conflict drives the story forward, creates emotional engagement, and shows character development.

Think about the challenges you faced in your project. How did you resolve them? Some examples of conflict could be:

  • A lack of accessibility that resulted in user complaints.

  • Conflicting stakeholder expectations that slowed a project down.

  • Differing opinions within the design team on how to move forward with a design.

  • Technical limitations of the product or platform that required design compromises.

The Climax

The climax can happen anywhere from about two-thirds of the way through a story and should be the most pivotal event. It could happen in any section of your case study; however, make sure to allow sufficient time to build up to it. If the climax happens too soon, everything after it will feel flat.

In a UX/UI design case study, you have a lot of freedom in what the climax can be. It can be a turning point, a victory, or, in some cases, a failure. However, it is important that the climax makes sense in the context of the rest of the narrative. It is followed by the “falling action,” which is where the story winds down and all conflicts are resolved.

 Some examples of the climax of a UX design case study are:

  • The positive results of a usability test for a risky, unconventional design.

  • The agreement of stakeholders to implement a design after much discussion and convincing.

  • The discovery of a user research insight that explains a previously misunderstood low user completion rate.

  • The creation of an ingenious design element that solves a complex problem.

The Take Away

The best way to write a case study is to tell a story. Design stories are vessels through which recruiters can imagine a future working with you.

  • Structure creates familiarity and facilitates navigation. Use your design process as chapter headings and include a good balance of text and media. Include the sections that are most relevant to you or that you wish to focus on.

  • Storytelling helps hiring managers experience and understand exactly how you solve a design problem. Use exposition, emotion, conflict, and the climax to engage readers and make your case studies memorable.

If you enjoy the process of writing your design stories, recruiters will enjoy reading them, too. Inject color and passion into a framework that is easy to understand, and you’ll soon be getting invited to interviews!

References and Where to Learn More

Want to create a portfolio that gets you hired? Take our course, Build a Standout UX/UI Portfolio: Land Your Dream Job, and learn how to showcase your skills, tell compelling project stories, and impress employers.

Learn more on how to Turn Your Non-Design Experience into Design Portfolio Gold.

Find out how to Keep Your Case Studies Confidential and Showcase Your NDA-Protected Design Work.

Incorporate Freytag’s Pyramid and Craft Compelling UX/UI Design Case Studies the Easy Way.

Discover How Aristotle’s 6 Elements of Drama Will Transform Your UX/UI Design Case Studies into Page-Turners.

Justinmind reveals case study tips from the industry in their article, How to Impress in a UX Job Interview: Recruiters & UX Managers Reveal Their Top Tips.

Images

Hero image: © Interaction Design Foundation, CC BY-SA 4.0

Feel Stuck?
Want Better Job Options?

AI is replacing jobs everywhere, yet design jobs are booming with a projected 45% job growth. With design skills, you can create products and services people love. More love means more impact and greater salary potential.

At IxDF, we help you from your first course to your next job, all in one place.

See How Design Skills Turn Into Job Options
Privacy Settings
By using this site, you accept our Cookie Policy and Terms of Use.
Customize
Accept all

Be the One Who Inspires

People remember who shares great ideas.

Share on:

Academic Credibility — On Autopilot

Don't waste time googling citation formats. Just copy, paste and look legit in seconds.