7 Amazing UX Design Portfolio Example Websites

Daniel Schifano
Daniel Schifano
hero image

Looking for some inspiration for your design portfolio? Maybe to create your first one, or update your current site?

They do say that imitation is the highest form of flattery, so I’m going to share 7 of my favorite portfolio sites.

However, rather than just copy these examples though, I’m going to share the things I like most about them and why, so you get some ideas for elements to add to your own design, while still keeping it unique to you.

So strap in, grab a coffee, and let's walk through these examples.

Don’t feel like reading? Check out the video version of this article below!


This video is actually one of the lessons from my Complete Career Toolkit course.

build a personal brand

Creating a strong personal brand can be a powerful tool for career success. It's how you set yourself apart from everyone else. This course will help you build your personal brand, professional resume, cover letter, portfolio website, and case study to go with it so that you STAND OUT for the better.

The best part? You'll build your own version of all these step-by-step with templates and the latest tools! You'll even learn about different interview styles (behavioral, technical, app critique, past work) and how to ace each from an industry pro.

Anyway, enough about the course, let’s check out these portfolios, along with links so you can head across and take a look at them.

Example #1. Gloria Lo

gloria lo portfolio

I think the great thing about this website is the amazing introduction at the top of the page.

Why do I like this? Well, one of the first things that your UX portfolio should do, (or even your general website), is it should introduce you.

This is because employers and potential clients want to know who you are, and what you’re all about, and they should be able to find this out within seconds of landing on your website.

As you can see from this site, Gloria has nailed her introduction. First, she treats us to her bold headline, which describes her in terms of her favorite activities.

great introduction

The other parts of her portfolio are really neat also. You can take a look at her work really easily.

glorias case study example

It’s also really nice and neat in terms of how she decided to lay it out on the page and just looks great.

rokt ux process

Super simple while doing the job well.

Example #2. Moritz Oesterlau

Moritz Oesterlau portfolio

This portfolio site is really great.

One of my favorite things about this site is the storytelling throughout all the case studies. It really takes the user through the process of what UX design is all about, going through the process to solve a user's problem.

For example

If we take a look at one of the case studies, you’ll see what I mean about storytelling.

moritz case study example

It starts off with this nice intro to the case study that breaks down the audience, the challenge, his role in the project, the time frame, etc. It’s incredibly clean and detailed.

Moritz doesn't just show the finished project, he shows all the methods and processes that got him and the client to that end goal.

moritz case study example page walkthrough

It’s really in-depth, and most importantly, shows the before and after.

Editor’s note: If you think about it, a portfolio is really a selling tool for you to help sell a client on your services. One of the most powerful ways to do this is to help not only show the end product but also to try and connect with the reader and share a transformation. A before and after, so that the reader can visualize themselves in the same situation.

This works great because now the reader not only sees that your process can work for them, but it also helps them see what you do, and what it will be like to work with you.

Example #3. Elizabeth Lin

elizabeth lin portfolio site

This example is a custom site design, and it looks great.

What really stands out to me here is the visual storytelling that Elizabeth uses. She has all these visuals that support the narrative, such as the crown when you mouse over her image. Just really nice little touches.

If we go into one of her case studies, I really like how she has all the core content around the project and design - but then there are these little notes on the site, almost like a journal.

ELIZABETH JOURNAL NOTES

This is just another example of how each element of her case study is supported by a visual element, such as a wall of Post-it notes, a survey form that was sent to research participants, or even early-stage prototypes.

elizabeth process

If we take a look at her other case studies, we get that same level of consistent quality, aesthetic, and visual storytelling.

elizabeth case study

It’s such a great narrative all the way through - in both visuals and text.

Example #4. Olivia Truong

olivia truong portfolio

I really like the simplicity of this one, as well as the understanding of her audience.

Olivia kicks off her case studies by framing the problem in a personal and relatable way. Helping to connect with the reader.

user research

She doesn’t just talk about the user problem. Instead, she frames it in a way that invites the reader to step into the user's shoes and connect.

Top tip: When adding case studies to your own portfolio, you should definitely showcase your approach to problem solving, so the reader can connect.

Kick-off each case study by framing the problem in detail, using emotive language to convey empathy, and then referring back to the problem throughout.

Example #5. Lola Jiang

lolo jiang portfolio

I love this site. I think it’s great and there are a lot of things that Lola does really well with her projects.

First off, the design is very simple. The portfolio doesn't need to be super over the top. It just needs to do its job i.e. show what you can do, and find out how to work with you.

calls to action

For example

If I go into this case study, one thing I really like is that she gets over the issue that sometimes people have, which is sharing, measuring, and demonstrating the impact of your work.

proving your performance

She does a great job of showing that she's improved the user experience.

Not only that, but she keeps it simple, while also laying out the important details of the case studies. It’s easily readable and covers core elements such as the validation and the challenges.

lola case study example

It's really great.

Example #6. Vera Chen

vera chen portfolio

Vera does a really good job of providing context.

She doesn't just outline the problem for each case study, she helps you to understand instead by giving you a solid backstory and describing the events that led her there.

uber project

If we take a look at this wedding library project, the project background is really well designed.

wedding project example

She does a great job of explaining her role in each project, as well as who and what she worked with, which prototyping tools were used, etc. She also does a great job of sharing the context around each project.

Example #7. Zara Drei

zara drei portfolio

The thing I really like about this portfolio is the design. You have to remember that your design skills don't just stop at the case study, and Zara does a great job of this.

As for case studies, a lot of her work is around the fashion industry, and I’m guessing this is her speciality. This probably led to her design aesthetic, as it feels like the portfolio site fits the fashion design industry.

zara case study example

You can see that lot of thought went into her color palette and typography choices so that they fit this aesthetic.

Final thoughts and next steps

Hopefully these examples have helped you to get some ideas and inspiration. Each of them is fantastic. Some are complicated, some are simple - but all of them tell a story and that's the goal.

So, when you’re considering building your own portfolio site, make sure to stop and think about how you want it to look:

  • Do you want it to be minimal?
  • Do you want it to match a certain type of industry?

What about your case studies?

  • How will you lay them out?
  • Will they be simple and easy to read? Or will you add visual design to help compliment?
  • Are you providing enough context in your case studies?
  • Are you sharing performance metrics?
  • How are you going to tell the story for each case study?
  • What visual information will you showcase?

All important things to keep in mind.

There is no perfect design because they need to be unique to you and your ‘personal brand’. However, if you make sure to hit on specific elements then you can greatly improve the performance of your site.

Close more clients with far less back and forth.

Remember: If you want to learn how to do this in detail, then be sure to check out my complete course on personal branding and portfolio design.

build a personal brand

You’ll learn everything you need to know about the design and psychology behind personal branding, resumes, cover letters, portfolio websites, and more.

The best part?

You'll build your own version of all these step-by-step with templates and the latest tools! You'll even learn about different interview styles (behavioral, technical, app critique, past work) and how to ace each from an industry pro.

Once you join, you’ll also get access to our private Discord community, so you can ask questions of me (10+ year industry veteran), other design students, as well as other working professionals.


Share designs, get feedback, advice, and more!

More from Zero To Mastery

Design Handoff Guide (4 Key Steps To Improve Your Current Process) preview
Design Handoff Guide (4 Key Steps To Improve Your Current Process)

After 10+ years as a Designer, I've made the mistakes so you don't have to. I'll teach you the 4 steps to make your design handoff run as smooth as water!

Figma 101 Crash Course: A Beginners Guide preview
Figma 101 Crash Course: A Beginners Guide

Want to learn Figma but not sure where to start? In this guide, I break down the basics of Figma, so you can understand what everything does + how to use it!

The Web Designer Interview: Top 7 Most Important Questions (And Answers) preview
The Web Designer Interview: Top 7 Most Important Questions (And Answers)

There are 7 essential questions that will be asked at almost every web design interview. Learn the answers they want to hear and lock down that new job!