UX Portfolio 101 (2022 Version)

A UX portfolio is a collection of case studies that reveal your design process and skills through the story of design projects you’ve been part of.

The difference between UX portfolios and UX case studies

Many designers use the word ‘portfolio’ to refer to their case studies. But they’re not the same thing. The difference is technical:

  • Your case studies use a mix of text and visuals to present your design process in the context of previous design projects.
  • The word portfolio refers to the entire file – website or document – that binds your case studies, portfolio cover page, bio, resumé, and contact page together.

What are recruiters and design leads looking for?

When you are building your UX portfolio and case studies, you have to keep thinking like a UX designer. Most importantly, you should consider your target audience: HR managers and UX leads.

They have to review hundreds of portfolios in a limited amount of time. What’s more, there’s probably a set date by which they need to find the right person for the role. This leaves only a few minutes to review a portfolio.

With that in mind, here’s some practical advice:

  • Stop overdesigning your portfolio. 
    • Why do so many portfolios follow the same structure and look? Because that structure and look works. Your target audience is comfortable with it, which means that they’ll have a pleasant experience using it. Don’t try to reinvent the wheel: find a stunning, tried-and-true template and customize it to your taste.
  • Keep it safe and beautiful. 
    • People gravitate towards pretty things, whether we like to admit it or not. Therefore, your portfolio needs to look sleek. What’s more, it’ll need to pass through a few people with varying tastes. So, it’s better to play it safe: go for the minimalistic look, as most people find it pleasing to the eye.
  • 2-5 case studies are enough. 
    • Due to time restrictions, most design leads will check 1-2 case studies when reviewing your portfolio. So, don’t stress about the number of case studies in your portfolio. “Quality over quantity” should be your mantra. As the seniority level of the role raises, so does the number of projects they’ll check. But there’s absolutely no reason to have more than 5 case studies in your portfolio.
  • Use your best work only. 
    • In this context, ‘best’ doesn’t necessarily mean the most beautiful or smoothest projects. Instead, it means the projects that called for hard decisions, new skills, and lots of cooperation. The rule of thumb is to choose projects that show the most of your soft and hard skills.
  • Keep it relevant. 
    • If you’ve worked on something that’s thematically relevant to the niche or product they’re hiring for, give that project the special treatment. This will immediately put you at an advantage.
  • Feature what’s in the job description. 
    • Give a good read to the job description and identify the buzzwords regarding skills, methods, and tools. If you have experience with them, highlight that experience in your case studies, just as you would in your resumé.

Now that you have an idea of what makes an exceptional UX portfolio in general, it’s time to move on to your case studies.

How to write UX case studies like a pro?

UX case studies are about storytelling. Yes, it’s an overused word, but bear with us! Storytelling in this context means that you’ll write about the project as you’d talk about it with a colleague over lunch or coffee. Just put it to words, add some visuals and you have a UX case study. Here’s an easy-to-follow structure:

Title and subtitle

Drop the name of the product or feature in your title and give a little description of the process in your subtitle. Keep both short and sweet but intriguing. Overlong titles are unnecessary and they tend to look bad too. Here are some guiding questions:

  • What was the product’s name?
  • What type of a project was this? (redesign, UI design, UX research)

Context with visuals

Begin your case study by setting the scene. This part is very important, because it’d be hard to understand your decisions and process without knowing the circumstances. This can be done by answering the 5 Ws:

  1. When? (The date and duration of the project.)
  2. Who? (Your role, and the team you’ve worked with.)
  3. Where? (Extremely relevant in the COVID era – remote or in-person setup.)
  4. What? (The product, feature, and business goal.)
  5. Why? (The problem.)

Once you’ve set the scene, it’s a great idea to inject something visual into the case study. Use a photo of the team or a teaser screenshot from the finished product. This’ll increase the curiosity of your readers.

Your process, step-by-step

At this point, the spotlight is on your skills. This is where the action begins. When we’re telling stories in a natural setting – like a conversation with a friend – we usually proceed in chronological order. You should do the same in your case study:

  • Begin with the discovery: reveal how you’ve familiarized yourself with the product and problem, what were your initial observations and theories, and how you’ve planned to proceed.
  • Move on to problem-research-solution trios. While describing them, show as much of your skillset as possible: what methods did you use, what did you find out, how did you organize the data, what tools did you use, how did you come up with the solution, how did you validate the solution. Don’t forget to present your sketches, personas, wireframes, prototypes, and other relevant visuals too!

Show the finished product or feature

The high point of the case study should be the reveal of the final product. The best way to do this is to embed an interactive prototype into your case study. This’ll allow your reader to use the product without having to download it or navigate to another page.

In our UX portfolio-building tool, UXfolio, you can embed your Figma, Axure, Sketch, and other prototypes in just a few clicks. Alternatively, you could also show screenshots of the product, presented in neat device mockups, which are also part of UXfolio.

Underline your impact

The conclusion of your case study is just as important as the introduction. In this part get to show the impact of your design through analytics and data. Your task is to use numbers to answer the following question: what changed after implementing your solutions? For the business-minded reader, this’ll be the sweetest part of the entire case study.

Finish with learnings & quotes

Sometimes a project doesn’t go as planned and initial assumptions get refuted, so we have to re-calibrate our process. The good thing is that we come out from such experiences with learnings that’ll benefit us throughout our careers. Share these insights with your readers at the end of your case study. It’ll show that you’re willing to learn and grow as a designer and a person.

If you have quotes about yourself or your team from the stakeholders, don’t be shy to share those too! Quotes will provide a glimpse into what it’s like to work with you. And that’s a great note to end on.

Start working on your UX portfolio!

That should do it for your UX portfolio! Remember, that you don’t have to reinvent the wheel. It’s your storytelling skills, design process, and deliverables that’ll convince design leads to hire you. If you’re ready to work on your portfolio, try UXfolio!

Animation has emerged as a powerful tool to captivate and engage users. From delightful micro-interactions to seamless transitions, well-crafted animations can elevate the overall user experience and leave a lasting...

As the digital landscape continues to evolve, the role of User Experience (UX) design has become increasingly vital. However, what often goes unnoticed is the profound relationship between UX design...