UX/UI projects for beginners #11: Redesigning Airbnb host onboarding

The objective of today’s practice project is to redesign the Airbnb website to streamline and accelerate the onboarding process for new hosts. The focus will be on simplifying the user journey, providing clear guidance, and reducing the time required to become an active host.

Airbnb redesign practice project

This is the 11th design portfolio project for UI and UX designers looking to build a portfolio of credible work. A detailed client brief that is time-boxed, detailed, and crafted realistically enough to give you a hands-on experience of doing a real project. Each portfolio project is meant to help you create realistic work you can add to your portfolio and test if design really is for you.

As is usually the case, I have included the following with each design brief:

  • Timeline (For this to be realistic each brief has a timeline that is as close to real-world work as possible)
  • Objectives (What is REQUIRED by the client. This part usually trips designers up as they go off designing what is not required)
  • Platform(Where your designs will live. Understanding these platforms will give a well-considered solution)
  • Target audience (Users always come first and the design must accommodate the target audience’s pain points)
  • References (If you are not sure where to start, clients normally give a set of examples or references they like. The closer the design solution is to the references, the fewer revisions a designer will have to do)
  • Deliverables (Most importantly how the solution should be delivered. These represent what a well-detailed portfolio case study looks like so hit it out of the park)
  • Recruiter advice (Portfolio advice from creative directors, CEOs and leading design creatives from the biggest companies)

Let’s begin.

Practice Project 11: Redesigning Airbnb Host Onboarding

Client: Airbnb

Timeline
1–2 weeks. The project is expected to be completed within two weeks.

Objectives

The objective is to redesign the Airbnb website to streamline and accelerate the onboarding process for new hosts. The focus will be on simplifying the user journey, providing clear guidance, and reducing the time required to become an active host.

Requirements:

  • Simplified and intuitive host registration process
  • Step-by-step guide for new hosts
  • Enhanced user interface with clear calls to action
  • Comprehensive resource center for new hosts (e.g., tutorials, FAQs)
  • Integration of automated tools for profile verification and listing setup
  • Improved customer support options (e.g., live chat, help center)

Success Metrics to Consider:

  1. Onboarding Time: Reduction in the average time taken to complete the onboarding process
  2. Conversion Rate: Increase in the number of users who successfully become hosts
  3. User Satisfaction: Improved ratings and feedback from new hosts
  4. Host Retention: Higher retention rate of new hosts within the first six months

Target Audience

1. Emily Smith,28 | The First-Time Host

Emily is a young professional eager to become a first-time Airbnb host. She needs a straightforward, step-by-step onboarding process with clear instructions and visual guides to help her set up her first listing confidently. However, she feels overwhelmed by the sheer amount of information and steps required, fearing she might make mistakes due to her lack of experience in managing property rentals and dealing with guests.

2. John Davis, 45 | The Part-Time Host

John is a busy professional looking to host part-time on Airbnb. He needs an efficient onboarding process that requires minimal time investment, along with tools that simplify the management of his listing. Despite his enthusiasm, John struggles with balancing hosting responsibilities with his demanding work schedule. He often finds the process frustrating, especially when technical difficulties arise or instructions are unclear, and he requires quick and responsive customer support to resolve any issues promptly.

3. Sarah Thompson, 52 | The Vacation Property Owner

Sarah is an experienced property investor with multiple vacation properties. She needs a reliable and comprehensive platform that supports the efficient management of multiple listings, along with access to market insights and analytics to optimize her listings and pricing. However, Sarah finds it complex to manage multiple properties, ensure they meet Airbnb’s standards, and handle guest inquiries seamlessly. The challenges of efficiently managing bookings and maintaining high standards across all properties add to her stress.

Specifications/ Limitations

Web

Reference

References that our company would like the new website to follow in terms of structure and layout. It will be your job to replicate something close to these examples but add your creative flair to it.

Vrbo:Vrbo

Booking.com:Booking.com

HomeAway:HomeAway

Deliverables

1. Home Page for Hosts: Enticing call-to-action, benefits overview, host testimonials, and sign-up button. Attract and encourage potential hosts to begin the onboarding process.

2. Registration Page: Simplified sign-up form with social media login options and a progress indicator. Make the registration quick and easy for new users.

3. Onboarding Dashboard: Step-by-step guide, checklist of tasks, progress tracker, and instructional videos. Provide a clear, guided onboarding experience.

4. Property Listing Setup: Interactive form for property details, real-time tips, and an image uploader. Streamline the property setup process.

5. Profile Verification: Identity verification tools, status updates, and document upload section. Simplify and clarify the verification process.

6. Host Dashboard: Listings overview, performance metrics, booking management, and guest communication tools. Offer a user-friendly interface for managing properties and tracking performance.

Testing and Results section

Show your wireframes to 5 people and ask them using your designs what they think about them, what they would improve, and an overall rating.

Take their feedback, iterate the designs, and have a final round of testing with 5 users. See that you improve your overall rating. If not go back to the drawing board and change your designs and retest.

What to do next

Download portfolio project PDFs of all the other existing design projects to do in your own time.

UX/UI design brief #10: Redesigning Uber App for Increased Holiday Rides

Today’s design brief is to redesign the Uber app to boost ride bookings during holiday seasons. This redesign will focus on enhancing user experience, providing holiday-specific features, and optimizing the app’s functionality to handle increased demand.

This is the tenth design brief or practice project for UI and UX designers looking to build a portfolio of credible work. Each detailed client brief is time-boxed, detailed, and crafted realistically enough to give you a hands-on experience of doing a real project. The design brief is meant to help you create realistic work you can add to your portfolio and test if design really is for you.

Designing an app is unique in that there are particular guidelines and best practices already outlined for Android and IOS that are different in some way to web patterns. This challenges the designer to be able to understand how platform constraints affect design.

As is usually the case, I have included the following with each design brief:

  • Timeline (For this to be realistic each brief has a timeline that is as close to real-world work as possible)
  • Objectives (What is REQUIRED by the client. This part usually trips designers up as they go off designing what is not required)
  • Platform(Where your designs will live. Understanding these platforms will give a well-considered solution)
  • Target audience (Users always come first and the design must accommodate the target audience’s pain points)
  • References (If you are not sure where to start, clients normally give a set of examples or references they like. The closer the design solution is to the references, the fewer revisions a designer will have to do)
  • Deliverables (Most importantly how the solution should be delivered. These represent what a well-detailed portfolio case study looks like so hit it out of the park)
  • Recruiter advice (Portfolio advice from creative directors, CEOs and leading design creatives from the biggest companies)

This will help you build your case study much faster as the project objectives and such are provided.

Let’s begin

Practice Project 10: Redesigning Uber App for Increased Holiday Rides

Client: Uber

Timeline
1–2 weeks. The project is expected to be completed within two weeks.

Objectives

The goal is to redesign the Uber app to boost ride bookings during holiday seasons. This redesign will focus on enhancing user experience, providing holiday-specific features, and optimizing the app’s functionality to handle increased demand.

“The global ride-sharing market is expected to grow from $75.39 billion in 2020 to $117.34 billon in 2021 at a compound annual growth rate (CAGR) of 55.6%.” – Grand View Research”By 2030, Urban areas will be home to more than 60% of the world’s population, leading to increased demand for ride-hailing services.” – McKinsey & Company

Requirements:

  • Festive and engaging user interface with holiday themes
  • Holiday-specific promotions and discounts
  • Enhanced ride booking and tracking features
  • Integration of special holiday services (e.g., ride scheduling, gift deliveries)
  • Improved communication tools for riders and drivers
  • Optimized performance for both iOS and Android platforms
  • Safety features and in-app support

Success Metrics to Consider:

Ride Volume: Increase in the number of rides booked during the holiday season

User Engagement: Increased daily active users and session duration

Promotion Utilization: High usage rate of holiday promotions and discounts

User Satisfaction: Improved user ratings and positive feedback in app stores

Target Audience

Jane Lee, 34 | The Holiday Shopper
NEEDS
Jane is a busy professional who relies on Uber for her holiday shopping trips. She needs reliable and quick transportation to navigate through the holiday traffic, and she appreciates easy access to in-app holiday deals and discounts. However, she often faces long wait times and difficulty finding available rides during peak shopping hours, which adds to her frustration. Managing multiple shopping bags while commuting also poses a challenge for her.

Michael Patel, 40 | The Family Traveler
NEEDS
Michael is a parent who uses Uber to travel with his family during the holidays. He needs safe and spacious rides that can accommodate his entire family, with features like car seats and child safety locks. Scheduling rides in advance for holiday events is crucial for him. Unfortunately, he struggles to find large vehicles that meet his requirements and faces challenges in coordinating multiple pickups and drop-offs for family members, all while ensuring the safety and comfort of his children.

Sarah Lee, 28 | The Festive Party Goer
NEEDS

Sarah is a social butterfly who relies on Uber to attend holiday parties. She seeks affordable and reliable rides, especially during peak party hours, and values the ability to share rides with friends easily. However, she frequently encounters high surge pricing and long wait times during holiday events. Coordinating ride-sharing with friends can also be a hassle, and the uncertainty of ride availability during busy periods adds to her stress.

Requirements

Please test our existing app with users to understand how the current functionality could be improved. Address their biggest pain point.


  • User-friendly interface that allows for easy navigation
  • Ability to personalize music recommendations based on user preferences
  • Option to create and save playlists
  • Feature for offline listening as a stronger offering
  • Integration with social media platforms for easy sharing
  • Ability to purchase concert tickets through the app

Platform

The app should be compatible with either iOS or Android devices. Pay attention to IOS and Android guidelines.

IOS guidelines
https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/adaptivity-and-layout/

Android guidelines
https://material.io/design/usability/accessibility.html#hierarchy

References

References that our company would like the app to follow in terms of structure and layout. It will be your job to replicate something close to these examples but add your creative flair to it.

Lyft:Lyft

Didi Chuxing:Didi

Specifications / Limitations

App must load quickly hence any large interactions must be kept to a minimum.

Deliverables

  • Holiday-themed Home Screen: Festive design, quick access to holiday deals and promotions
  • Ride Booking Screen: Enhanced map interface, holiday-specific ride options, fare estimates with holiday discounts
  • Ride Tracking Screen: Real-time GPS tracking, driver information, estimated arrival times
  • Safety and Support Screen: In-app emergency contacts, real-time ride sharing with friends/family, safety tips
  • Promotions and Deals Screen: Special holiday offers, discount codes, referral bonuses
  • User Profile and Settings: Personal information, payment methods, ride history, preferences

Testing and Results section

Show your wireframes to 5 people and ask them using your designs what they think about them, what they would improve, and an overall rating.

Take their feedback, iterate the designs, and have a final round of testing with 5 users. See that you improve your overall rating. If not go back to the drawing board and change your designs and retest.

What to do next

Download portfolio project PDFs of all the other existing design projects to do in your own time.

UX/UI design brief #7: Redesigning Renault outdated website (plus free pdf)

Today’s design brief is to redesign Renault’s South African car dealership website. This was an actual real project that I worked on at my digital agency but for Toyota Global. For this brief I have changed names and some details. This is the 7th design brief or practice project for UI and UX designers looking to build a portfolio of credible work. Each detailed client brief is time-boxed, detailed, and crafted realistically enough to give you a hands-on experience of doing a real project. The design brief is meant to help you create realistic work you can add to your portfolio and test if design really is for you.

As is usually the case, I have included the following sections with each design brief:

  • Timeline (For this to be realistic each brief has a timeline that is as close to real-world work as possible)
  • Objectives (What is REQUIRED by the client. This part usually trips designers up as they go off designing what is not required)
  • Platform(Where your designs will live. Understanding these platforms will give a well-considered solution)
  • Target audience (Users always come first and the design must accommodate the target audience’s pain points)
  • References (If you are not sure where to start, clients normally give a set of examples or references they like. The closer the design solution is to the references, the fewer revisions a designer will have to do)
  • Deliverables (Most importantly how the solution should be delivered. These represent what a well-detailed portfolio case study looks like so hit it out of the park)
  • Recruiter advice (Portfolio advice from creative directors, CEOs and leading design creatives from the biggest companies)

This will help you build your case study much faster as the project objectives and such are provided.

Let’s begin

Client/Brand

Renault SA https://www.renault.co.za

Timeline

1–2 weeks. The project is expected to be completed within two weeks.

Objectives

We are looking to redesign the official Renault website in South Africa. The site should provide a seamless experience for potential customers to browse our catalogue, book a test drive and purchase vehicles from our dealership. The website will be the primary sales tool for our business, and we want it to be easy to use, informative and visually appealing.

Success Metrics to Consider:
Conversion rate: The percentage of website visitors who purchase a vehicle or schedule a test drive.
User engagement: The amount of time visitors spend on the website and the number of pages they visit.
Search performance: The number of visitors who use the search function and the accuracy of the search results.
Customer satisfaction: Feedback from customers who use the website to purchase a vehicle or schedule a test drive.

This is the current site:

Platform

Please design website screens for desktop (1440px wide and mobile view 365px wide).

Target Audience

John, 35 | Busy Executive
NEEDS
A quick and easy way to search for cars that fit his budget and preferences. He is also interested in finance and insurance options that can be bundled with his purchase. Schedule is very tight and he doesn’t want to be haggled by salespeople at a dealership.

Sarah, 28 | First-time Car Buyer
NEEDS
Needs guidance and information about the car buying process. She also wants to compare different models and prices to make an informed decision. She is not familiar with the technical terms used in the car industry, which can make her feel overwhelmed. She is also on a tight budget and needs to find a car that is affordable but still reliable.

Robert, 50 | Experienced Car Enthusiast
NEEDS
Looking for a dealership that specializes in luxury cars and can provide him with personalized service. He is interested in the latest models and technology features. Robert has high expectations and wants to be treated like a VIP. He is not interested in mass-produced cars and wants a dealership that can provide him with unique and exclusive options.

Specifications/ Limitations

Site must load quickly hence any large interactions must be kept to a minimum.

Reference

Volvo https://www.volvocars.com/za/

Deliverables

• Research and testing conducted
• Wireframes/UI designs of
⁃ Homepage: Welcome message, featured vehicles, search function
⁃ Search results page: List of vehicles that match search criteria
⁃ Vehicle detail page: Vehicle photos, specifications, pricing, reviews, similar vehicles
⁃ Schedule test drive page: Form to schedule a test drive, available dates and times
⁃ Request quote page: Form to request a price quote, additional information
⁃ Contact us page: Contact information, form to send a message
⁃ Checkout page: Vehicle details, pricing, financing options, payment information

Testing and Results section

Show your wireframes to 5 people and ask them using your designs what they think about them, what they would improve, and an overall rating.

Take their feedback, iterate the designs, and have a final round of testing with 5 users. See that you improve your overall rating. If not go back to the drawing board and change your designs and retest

What to do next

Download portfolio project PDFs of all the other existing design projects to do in your own time.

Portfolio Advice from recruiters

I love to see how designers tackle complex problems in their portfolio case studies. It’s important to not only show the final product, but the process that got you there.
– Satish Kanwar, VP of Design at Shopify

I want to see a clear articulation of the problem, the design process, and the impact of the solution. Numbers and metrics are important, but so is the story behind them.
– Khoi Vinh, Principal Designer at Adobe

UX/UI design brief #9: Redesigning the Swedish Tourism Site (plus free download)

Today’s design brief is a redesign of the existing Swedish tourism site. This was an actual real project that I worked on at my digital agency but for the South African Tourism site. Obviously for our purposes I have changed the details to suit a public design brief. This is the 9th design brief or practice project for UI and UX designers looking to build a portfolio of credible work. Each detailed client brief is time-boxed, detailed, and crafted realistically enough to give you a hands-on experience of doing a real project. The design brief is meant to help you create realistic work you can add to your portfolio and test if design really is for you.

As is usually the case, I have included the following sections with each design brief:

  • Timeline (For this to be realistic each brief has a timeline that is as close to real-world work as possible)
  • Objectives (What is REQUIRED by the client. This part usually trips designers up as they go off designing what is not required)
  • Platform(Where your designs will live. Understanding these platforms will give a well-considered solution)
  • Target audience (Users always come first and the design must accommodate the target audience’s pain points)
  • References (If you are not sure where to start, clients normally give a set of examples or references they like. The closer the design solution is to the references, the fewer revisions a designer will have to do)
  • Deliverables (Most importantly how the solution should be delivered. These represent what a well-detailed portfolio case study looks like so hit it out of the park)
  • Recruiter advice (Portfolio advice from creative directors, CEOs and leading design creatives from the biggest companies)

This will help you build your case study much faster as the project objectives and such are provided.

Let’s begin

Client/Brand

Visit Sweden https://visitsweden.com/

Timeline

1–2 weeks. The project is expected to be completed within two weeks.

Objectives

We are looking for a redesign for the Swedish tourism website. The site is in need of a refresh and we require it to be visually appealing, easy to navigate, and provide all the necessary information to help visitors plan a trip. Our culture should be reflected across the site especially famous landmarks and common local native words.


“In 2020, domestic tourism accounted for approximately 85% of global tourism spending.” – Source: World Tourism Organization.

Success Metrics to Consider

Number of website visitors
Engagement rate (time spent on site, pages viewed per session)
Conversion rate (number of bookings or inquiries)
Customer satisfaction (rating and feedback)

Platform

Please design website screens for desktop (1440px wide and mobile view 365px wide).

Target Audience

Sarah Johnson, 28 | Adventure Traveler
NEEDS
She is looking for travel experiences that allow her to discover different cultures and trying new foods. Sarah wants to make sure that the travel experiences she books are safe and well-organized, with knowledgeable guides and good equipment.

James Lee, 42 | Family Vacationer
NEEDS
He is looking for travel experiences that are family-friendly, with activities that can be enjoyed by both kids and adults. James may be concerned about the cost of family travel, as well as the logistics of coordinating travel for multiple people. He may also be worried about keeping his family safe while traveling to unfamiliar places.

Marie Jensen, 55 | Cultural Tourist
NEEDS
She is interested in visiting museums, historic sites, and art galleries, and may also enjoy attending cultural events like concerts and festivals. She values comfortable accommodations and good food, but is primarily motivated by her desire to learn. Maria may be concerned about language barriers and navigating unfamiliar cities; accessibility and mobility issues.

Specifications/ Limitations

Site must load quickly hence any large interactions must be kept to a minimum.

References

References that our company would like the website to follow in terms of structure and layout. It will be your job to replicate something close to these websites but add your creative flair to it.

Visit Qatar – https://visitqatar.com/
Airbnb Experiences – https://www.airbnb.com/experiences
Lonely Planet – https://www.lonelyplanet.com/
Visit California – https://www.visitcalifornia.com/

Deliverables

• Sketch of conceptual ideas and a sitemap
• Wireframes/UI designs of
Homepage: This should be visually appealing and provide an overview of the destination and the experiences on offer.
Things to Do: This section should provide information on the top tourist attractions, outdoor activities, and cultural experiences in the area.
Places to Stay: This section should provide information on the best hotels, resorts, and vacation rentals in the area.
Local Food: This section should highlight the local cuisine and provide recommendations for restaurants and food experiences.
Travel Tips: This section should provide helpful information for travelers, such as visa requirements, currency exchange, and transportation options.
Booking: This section should allow users to book tours and activities directly from the website.
Blog: This section should provide fresh and relevant content to attract visitors and improve SEO.

Testing and Results section

Show your wireframes to 5 people and ask them using your designs what they think about them, what they would improve, and an overall rating.

Take their feedback, iterate the designs, and have a final round of testing with 5 users. See that you improve your overall rating. If not go back to the drawing board and change your designs and retest.

Portfolio Advice from recruiters

I love to see how designers tackle complex problems in their portfolio case studies. It’s important to not only show the final product, but the process that got you there.
– Satish Kanwar, VP of Design at Shopify

I want to see a clear articulation of the problem, the design process, and the impact of the solution. Numbers and metrics are important, but so is the story behind them.
– Khoi Vinh, Principal Designer at Adob

What to do next

Download a portfolio project PDF of this design project and all the other existing design projects to do in your own time.

UX/UI design brief #8: Redesigning the Spotify App

Today’s design brief is a redesign of an existing platform namely Spotify’s music app.

This is the seventh design brief or practice project for UI and UX designers looking to build a portfolio of credible work. Each detailed client brief is time-boxed, detailed, and crafted realistically enough to give you a hands-on experience of doing a real project. The design brief is meant to help you create realistic work you can add to your portfolio and test if design really is for you.

Designing an app is unique in that there are particular guidelines and best practices already outlined for Android and IOS that are different in some way to web patterns. This challenges the designer to be able to understand how platform constraints affect design.

As is usually the case, I have included the following with each design brief:

  • Timeline (For this to be realistic each brief has a timeline that is as close to real-world work as possible)
  • Objectives (What is REQUIRED by the client. This part usually trips designers up as they go off designing what is not required)
  • Platform(Where your designs will live. Understanding these platforms will give a well-considered solution)
  • Target audience (Users always come first and the design must accommodate the target audience’s pain points)
  • References (If you are not sure where to start, clients normally give a set of examples or references they like. The closer the design solution is to the references, the fewer revisions a designer will have to do)
  • Deliverables (Most importantly how the solution should be delivered. These represent what a well-detailed portfolio case study looks like so hit it out of the park)
  • Recruiter advice (Portfolio advice from creative directors, CEOs and leading design creatives from the biggest companies)

This will help you build your case study much faster as the project objectives and such are provided.

Let’s begin

Client:Spotify

Timeline
1–2 weeks. The project is expected to be completed within two weeks.

Objectives

Our goal is to redesign the Spotify music app to provide a richer and more personalized music streaming experience for users. The app should allow users to onboard, discover new music, create playlists, and easily access their favorite songs. “By 2026, the music streaming market is projected to reach $76.9 billion globally.” – Allied Market Research.berg

Success Metrics to Consider:

User engagement metrics, such as the number of songs listened to and playlists created
User signups and ratings
Conversion rate for concert ticket purchases through the app
Number of app downloads and active users

Target audience

Marcus Lee, 35 | Musician
NEEDS
Likes to create and share his own music with others. He wants a platform that allows him to easily collaborate with other artists, share his work, and get feedback from the community. Finds it challenging to get his music noticed in the crowded music industry and struggles to find a platform that caters specifically to independent artists like him.

Sophia Patel, 23 | Music Enthusiast
NEEDS
Enjoys discovering new artists and attending live concerts. She also likes to create playlists for different moods and occasions. Finds it frustrating when she cannot easily find new music recommendations or when she has to switch between multiple apps to listen to different genres.

Sandra Jenkins, 28 | Fitness Enthusiast
NEEDS

Enjoys working out and needs music to keep her motivated during her exercise routine. She wants a platform that allows her to easily create workout playlists and discover new music that fits her workout style. Finds it frustrating when the music app doesn’t provide enough variety in workout music or when the app doesn’t have features that help her track her fitness goals.

Requirements

Please test our existing app with users to understand how the current functionality could be improved. Address their biggest pain point.


  • User-friendly interface that allows for easy navigation
  • Ability to personalize music recommendations based on user preferences
  • Option to create and save playlists
  • Feature for offline listening as a stronger offering
  • Integration with social media platforms for easy sharing
  • Ability to purchase concert tickets through the app

Platform

The app should be compatible with either iOS or Android devices. Pay attention to IOS and Android guidelines.

IOS guidelines
https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/adaptivity-and-layout/

Android guidelines
https://material.io/design/usability/accessibility.html#hierar

References

References that our company would like the app to follow in terms of structure and layout. It will be your job to replicate something close to these examples but add your creative flair to it.

Youtube Music
Apple Music
Pandora

Deliverables

Onboarding screens – These screens will introduce the app to new users and explain how to use it. They might include a welcome message, an explanation of the app’s features, and instructions on how to create an account.
Homepage – displays recommended music based on user preferences, popular playlists, and trending songs.
Search – allows users to search for songs, artists, and playlists.
Playlist – allows users to create and save their own playlists.
Player – displays the current song playing, lyrics, and options for sharing or adding to a playlist.
Settings – allows users to personalize their music preferences, including genre and artist preferences.

Testing and Results section

Show your wireframes to 5 people and ask them using your designs what they think about them, what they would improve, and an overall rating.

Take their feedback, iterate the designs, and have a final round of testing with 5 users. See that you improve your overall rating. If not go back to the drawing board and change your designs and retest.

What to do next

Download a portfolio project PDF of this design project and all the other existing design projects to do in your own time.

50 UX UI portfolio intros you can “borrow” from Google, Apple, Facebook & Uber hires

This article is for aspiring designers who are still creating a strong introduction to their UX or UI portfolio. You may be struggling with how to summarize who you are and what your skills are on your resume, LinkedIn profile, personal portfolio website or even your social media page.

In this article I am going to share with you 50 examples of proven design portfolio introductions from designer hires from Google, Apple, Facebook, Uber, Apple, Spotify, Airbnb, and Amazon. Alot of these examples are from portfolio websites and resumes and we will dissect when to use one. I am also going to explain why it is important to have a great portfolio introduction and the basic structure of one.

Why is it important to have a strong design portfolio introduction?

Firstly, this is definitely what a recruiter is going to read and evaluate first as a potential indicator to whether they should hire you. A portfolio introduction that is vague or incorrect about the person or their skills raises red flags and doubt in the recruiter’s mind from the start and sets the tone for the rest of the interaction with your work. A bad first impression could ultimately hurt your chances of landing a dream job.

Secondly, as a designer you need to be able to sell your skills, your passion and your personality well enough for a potential recruiter to buy into you. People see selling as a bad word but it ultimately makes life easier if you know how to do it. When it relates to your design career you will be ask to not only sell or persuade people on your skills, your ideas and leadership. Look at your portfolio introduction as a concise but holistic statement that you want the marketplace to know about you.

Side note: Obviously portfolio introductions are one part of building a strong first impression with recruits. If you want to learn about enhancing your case studies as well, read this article.

UX Portfolio Case Study template (plus examples from successful hires)
A UX portfolio Case Study template for making your portfolio simpler and less overwhelming with the aim of getting you…uxdesignmastery.com

I have grouped the examples into three types of design portfolio introductions based on length. Which one to use depends on the platform that the introduction will be on. In certain cases like a resume, it needs to be brief but on your personal website or LinkedIn profile you can stretch it out abit more.

Basic structure of a good portfolio introduction

The key elements of this type of design portfolio introduction answers the following questions:
– Who are you
– What you do
– Where you work
– Which city you are from
– What you are passionate about

There are no hard or fast rules to how to structure your personal portfolio introduction but addressing 2 to 3 of these questions will go a long way. As you will see in the following examples, answering those questions creates a strong first impression for your work.

Let’s get started.

1. Short and punchy intro (6 to 15 words)

Josh Mateo, Spotify
Senior Product Designer at Spotify in New York

Josh Mateo

Will Chan, Facebook
Product Designer at Facebook.

Vera Chen, Facebook
Hello, I’m Vera Chen.
I create Better Experiences for Users/ People

Hiroo Aoyama, Facebook
I’m Hiroo, a product designer. Incoming Product Design Intern at Facebook.

Shelby Lindblad , Facebook
Multi-disciplinary designer in Oakland, CA

Jason Yuan, Apple
Graphic and User Experience designer currently based in Providence.

Sanat Rath, Google
Hi, I’m Sanat. I make word processors delightful at Google Docs.

Sophie Gardner, Google
Product designer, formerly at Google and Palantir.

Wei Huang, Google
I’m Wei, a User Experience designer at Google

Tiffany Wu, Google
Hi! I’m Tiffany Wu, a designer passionate about bridging gaps between people and their goals.

Simon Pan, Amazon
Simon Pan is a Product Designer based in San Francisco.

Christopher Michon, Amazon
Christopher Michon is an Art Director who is designing & illustrating in Seattle.

Tobias Ahlin, Spotify
I design, tinker & teach.

Hold Breton, Spotify
A product designer who values durability, transparency & cadence.

2. Meaty intro (18 to 31 words)

John West, Uber
Hello, I’m John. I’m a Designer in San Francisco & I do UI, UX, branding, animation, packaging and print.

Xiaoxue Zhang , Uber
Currently working at Uber, focusing on Machine Learning and Design System. Previously working as a front-end developer at Tencent for 3 years.

Bre Huang, Uber
I’m Pre, a process-driven product designer and illustrator on a quest to make smart, friendly and impactful experiences for people. Joining Uber Feb 19.

Xiaoxue Zhang , Uber
Currently working at Uber, focusing on Machine Learning and Design System. Previously working as a front-end developer at Tencent for 3 years.

Cas Lemmens, Apple
I’m Cas Lemmens. I design systems. I work as a Human Interface Designer at Apple. Previously Spotify and Hyper Island.

Hailey Cook, Apple
I’m a mission driven designer looking for new opportunities in San Francisco. Check out my work and say hello!

Jesse Chase, Airbnb
Jesse chase is a product designer in san Francisco, currently Sr. Experience Designer at Airbnb.

Keith Ahn, Airbnb
Hi, I’m a designer based in San Francisco. I’m currently a Product Designer at Airbnb. Former Product Designer at Venmo.

Ismael Barry, Airbnb
Product Designer passionate about serving people by solving for their needs and understanding the gravity of those decisions as they Impact our world.

Moneta Ho Kushner, Google
I am creative director and designer from Seattle, passionate about building digital experiences that improve customers’ lives.

Alex Lakas

Alex Lakas, Google
I’m Alex, a product designer at Google. Over a decade of experience focusing on desktop, mobile, social gaming, e-commerce, & early stage product design.

Rahul Jain, Google
I’m a Product designer focused on creating design concepts and experiences that empowers people and solve real-world problems.

Carson Young, Google
Hi! I’m Carson, a digital product designer. Former UX Design Intern at Google. Student at York Sheridan Design.

Abbey Lee, Amazon
Hey Hey,
I’m Abbey
I’m a visual problem solver and user experience designer who has a passion from motion, visual design, human-centred goodness and the outcome.

Angela Bang, Amazon
Meet Angela. Living and working in the intersection of design and tech — still wants to be an astronaut when grown up.

Brian Lee, Spotify
My name is Brian. I am a digital product designer, born in Singapore, based in Stockholm, Sweden. I currently work at Spotify, with a focus on growth and activation.

Tal Midyan, Spotify
Tal is a multidisciplinary designer and creative based in nYC. Currently working at Spotify as Senior Art Director. Here is a collection of projects for different artists and brands.

Andres Arbelaez, Spotify
Hey! I’m Andres.
Incoming Product Designer at Facebook and CoLab Fellow at IDEO. I study Human-Centered Product Design at the University of Maryland.

Amruta Buge, Spotify
Amruta is an Interaction Designer at Google interested in crafting effective design solutions to create meaningful user experiences.

Mohit Gupta, Facebook
A product designer with a focus in user experience, visual and interaction design. Previously at Facebook and Universe. Currently looking for full-time opportunities.

Hailey Cook, Apple
I’m a mission driven designer looking for new opportunities in San Francisco. Check out my work and say hello!

Kathleen Warner, Facebook
Oh hello there, I’m Kathleen.
I’m a product designer who sometimes jumps into frontend. Currently on News Feed at facebook.

Julia Liang , Apple
I’m glad you’re here!
I’m a designer, artist, and activewear enthusiast based in Berkeley. Thank you for taking the time to view my work!

Netta Marshall, Airbnb
Hello stranger, I’m Netta, a digital designer living in San Francisco. Let’s take a look at what I’ve been creating.

Sally Chan, Spotify
Hello! I’m a designer at the intersection of physical and digital products and services. I do that by making connections out of seemingly disparate ideas to create something meaningful for people.

3. Detailed but relevant intro (34 to 70 words)

Andre Salver, Facebook
I’m a strategy-minded product designer, passionate about designing for emerging technologies, developing wide applications for those technologies and bringing them to market. Also a recent graduate of MHCI+D and Product Designer at Facebook.

Nisa Andrews, Uber
I’m an independent decentralised apps designer and product designer at Uber. I’m passionate about solving problems for humans, particularly where physical and digital worlds meet. Peep my work below or learn more about me.

Ben Minard, Apple
My name is Ben Minard and I am a UI/UX designer at Apple Inc, in Cupertino, California. I recently graduated from the University of Illinois at Urbana-Champaign with a BFA in Graphic Design. Feel free to drop me an email at khdfkd@gmail.com and check out my work on Dribbble.

Craig Dehner

Craig Dehner, Apple
I’m Craig Dehner, and I help companies enhance their mobile experience through smart UI design and motion. Between working on the Human Interface team at Apple, to cutting edge startups like Airbnb and Lyft, the interfaces I’ve worked on have reached millions.

Eric Lobdell, Airbnb
Bay Area designer passionate about problem solving exposing and building consumer facing products. Currently designing a new typeface, hand-lettering, and collecting vinyl, I’ve poured my heart into many startups and worked at a handful of great companies: Google, MLB, Opera and #M. You can find more of my work on Dribbble. If you’ve got an exciting challenge and you’d like to work together, let’s talk.

Kaiwei Wang, Google
As a designer, I try my best to make sure the design decisions are the results of a human-centred process. I keep learning new tools and trends while telling myself — the user gives the most valuable insights and the team is my strongest backbone.

Kevin Chang, Google
Hey, I’m Kevin
I’m a product designer & engineer with skills and experiences that allow me to take ideas from concept to mock to prototype to production.

Formerly AR & VR at Google Daydream, design at Google Lens, product at BayRu. Computer Science and creative writing at Stanford University.

Yuan Gu, Amazon
Hello, I am Yuan

I am currently a UX Designer at Amazon. I have worked on a variety of projects on different platforms including but not limited to iOS, Android, Windows, etc. The best part of my job is to work the design magic around customer’s needs and seeking the balance between usability and aesthetics. This is a showcase of the projects I’ve worked on and hope you will enjoy it.

Samuel Hoang, Amazon
I am a product designer crafting the future of user experiences for consumer devices and services. This is my portfolio of publicly released work. Many of my current and past projects cannot be included here due to Non-Disclosure Agreements.

Conclusions and takeaways

Feel free to try different portfolio intros. Don’t feel boxed into one format but try what suits you at that point in time. To conclude your design portfolio introduction should answer the following questions:
– Who are you
– What you do
– Where you work
– Which city you are from
– What you are passionate about

What to do next

Bookmark this article so you can read it later.

Help me get the word out by sharing this article on platforms like Pinterest and X(formerly Twitter).

Check out these popular articles related with portfolio creation or just follow for more unique UX articles like this one. Cheers!!

5 reasons why you are not getting any UX interviews and what to do about
This article is for those of you who are struggling to making any meaningful progress towards the goal of getting your…uxdesignmastery.com

UX Portfolio Case Study template (plus examples from successful hires)
A UX portfolio Case Study template for making your portfolio simpler and less overwhelming with the aim of getting you…uxdesignmastery.com

Is UX design a good fit for you? 8 personality traits you must have.
Is a UX design career a good fit for you? 8 personality ux design skills you must have. How to improve ux skillsuxdesignmastery.com

UX/UI projects for beginners #6: Food App

This is the sixth design portfolio project for UI and UX designers looking to build a portfolio of credible work. A detailed client brief that is time-boxed, detailed, and crafted realistically enough to give you a hands-on experience of doing a real project. Each portfolio project is meant to help you create realistic work you can add to your portfolio and test if design really is for you.

Today I have a saucy one for you, excuse the pun. A UX/UI project for beginners on designing a food app.

We all have at some point felt too busy (lazy) to cook and reached out for our phones to order some delicious food. The convenience of ordering food is undeniable and such a ubiquitous reflex that we do not even think about it. I personally enjoy cooking for the family but there are times when I cannot due to the kids, an event or work.

Designing an app is unique in that there are particular guidelines and best practices already outlined for Android and IOS that are different in some way to web patterns. This challenges the designer to be able to understand how platforms constraints affect design.

As is usually the case, I have included the following with each design brief:

  • Timeline (For this to be realistic each brief has a timeline that is as close to real-world work as possible)
  • Objectives (What is REQUIRED by the client. This part usually trips designers up as they go off designing what is not required)
  • Platform(Where your designs will live. Understanding these platforms will give a well-considered solution)
  • Target audience (Users always come first and the design must accommodate the target audience’s pain points)
  • References (If you are not sure where to start, clients normally give a set of examples or references they like. The closer the design solution is to the references, the fewer revisions a designer will have to do)
  • Deliverables (Most importantly how the solution should be delivered. These represent what a well-detailed portfolio case study looks like so hit it out of the park)
  • Recruiter advice (Portfolio advice from creative directors, CEOs and leading design creatives from the biggest companies)

Let’s begin.

UX UI Design Portfolio Project 6: Designing an Food App

Client
OhSoYum

Timeline
1–2 weeks. The project is expected to be completed within two weeks.

Objectives

We are looking to create a food delivery app that will allow users to order food from their favorite restaurants and have it delivered to their doorstep. The app will need to be user-friendly, visually appealing and efficient. “Online food delivery has become a $200 billion global industry, yet there is still plenty of room for growth as people increasingly opt for the convenience of delivery.” – Bloomberg

Success Metrics to Consider:
User acquisition and retention rate
Order volume and revenue growth
User engagement and time spent on the app
Positive reviews and ratings

Target Audience

Marcus Lee, 32 | Busy Professional
NEEDS
Does not have the time to cook and prefer to order food online for convenience. They prioritize quick and reliable delivery and are willing to pay more for premium services. Health conscious and wants to eat healthy meals. She also has a tight budget and wants affordable options.

Sophia Patel, 37 | Health-Conscious Eater
NEEDS
College student who prioritizes healthy eating and has specific dietary restrictions. Always looking for options that fit their lifestyle and are willing to pay more for high-quality, healthy food. On a tight budget and wants affordable options

Sandra Jenkins, 35 | Budget-Conscious
NEEDS
Has two kids and a busy job. She needs an app that offers healthy options for her family as well as quick and convenient delivery options on a limited budget. Wants to feed her family healthy meals but doesn’t have the time or energy to cook after a long day at work.

Requirements

  • The app should allow users to browse and order from a variety of restaurants in their area.
  • Users should be able to customize their orders, including special instructions and dietary restrictions.
  • The app should provide real-time updates on the status of their order, including estimated delivery time.
  • Payment options should be secure and user-friendly.
  • The app should have a feature for users to leave reviews and ratings of restaurants and drivers.

Platform

  • The app should be compatible with either iOS or Android devices. Pay attention to IOS and Android guidelines.

IOS guidelines
https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/adaptivity-and-layout/

Android guidelines
https://material.io/design/usability/accessibility.html#hierarchy

References

References that our company would like the app to follow in terms of structure and layout. It will be your job to replicate something close to these examples but add your creative flair to it.

Uber Eats: https://www.ubereats.com/
DoorDash: https://www.doordash.com/
Grubhub: https://www.grubhub.com/

Deliverables

Onboarding screens – These screens will introduce the app to new users and explain how to use it. They might include a welcome message, an explanation of the app’s features, and instructions on how to create an account.

Home screen – This is the main screen of the app that users will see when they open it. It might include a search bar, categories for different types of food, and a list of popular restaurants.

Restaurant details screen – When a user selects a restaurant, they will be taken to a screen with more information about that restaurant. This might include the menu, photos of the food, and reviews from other users.

Ordering screen – This screen will allow users to place an order from the restaurant they’ve selected. It might include options for customization, like choosing toppings or specifying dietary restrictions.

Payment screen – After a user has placed an order, they will need to enter payment information. This screen might include options for different payment methods, like credit card or PayPal.

Order tracking screen – Once an order has been placed, users will want to know when it will be delivered. This screen might include real-time updates on the status of the order, like when it’s being prepared, when it’s out for delivery, and when it’s been delivered.

Profile screen – This screen will allow users to manage their account information, like their name, address, and payment methods. It might also include options for viewing past orders and saving favorite restaurants.

Testing and Results section

Show your wireframes to 5 people and ask them using your designs what they think about them, what they would improve, and an overall rating.

Take their feedback, iterate the designs, and have a final round of testing with 5 users. See that you improve your overall rating. If not go back to the drawing board and change your designs and retest.

Advice from recruiters

I want to see case studies that demonstrate a deep understanding of user needs, a creative approach to problem-solving, and a passion for delivering exceptional user experiences.

John Smith, Senior Product Designer at Doordash

I’m looking for designers who can demonstrate how they’ve solved complex problems in simple and elegant ways. I want to see how you can take a user-centered approach and turn that into a product that’s both delightful and effective.

Haraldur Thorleifsson, Head of Design at Uber

Show me how you’ve used data and research to inform your design decisions and how you’ve collaborated with cross-functional teams to deliver successful products. Don’t just showcase the final design, but also the process and the challenges you faced along the way.

Jane Doe, Senior UX Designer at Grubhub

Your portfolio should showcase your ability to think critically about design problems, communicate your ideas clearly, and collaborate effectively with others. It’s not just about pretty visuals, but about the insights and rationale behind your design decisions.

Kim Williams, Director of UX Design at Amazon

I love to see designers who can showcase a process, not just the end product. How did you get there? What were the decisions and tradeoffs you made along the way? How did you incorporate feedback and iterate? All of this tells me a lot about how you approach design problems and how you work with cross-functional teams.

Julie Zhuo, VP of Product Design at Facebook

What to do next

Download a portfolio project PDF of this design project and all the other existing design projects to review in your own time.

UX/UI projects for beginners #5: Property Website

This is the fifth design portfolio project for UI and UX designers looking to build a portfolio of credible work. A detailed client brief that is time-boxed, detailed, and crafted realistically enough to give you a hands-on experience of doing a real project. Each portfolio project is meant to help you create realistic work you can add to your portfolio and test if design really is for you.

Continue reading “UX/UI projects for beginners #5: Property Website”

UX Case Study Example #2 plus free template

You may be wondering how should you organize a large amount of project information in a case study so that it isn’t overwhelming to recruiters? What information is vital to include in a portfolio case study? Or maybe you are just struggling to bringing together your wireframes, strategies and sections into a clean, attractive narrative. Don’t worry this article is for you. 

I recently shared a UX case study example in the previous article that described how to use the free UX Portfolio Case Study template to rapidly create comprehensive case study for your design portfolios from scratch. 

The free UX Portfolio Case Study template is based on over 60 portfolios of successful design hires from Facebook, Amazon, Uber, Twitter, Apple, Google, LinkedIn, Dropbox and the insights of top design recruiters from around the world. 

What you are going to learn

Today I want to walk you through another UX case study example on how you can use the UX Portfolio Case Study template from scratch, to create a UX case study for your UX portfolio. We will walk through the creation of each section, step by step so that you can replicate the process for your cases studies.

The project

The UX portfolio project I will use is one I did as a Senior UX Designer at a digital marketing agency. The brief was to completely redesign a responsive web platform for one of the leading investment firms in South Africa, Alexander Forbes. I worked with a project manager, a UI designer, a back-end developer and a front-end developer.

Final design

I did the work some time ago so the challenge becomes trying to remember what I did and collecting enough content for a solid case study. This is where the template comes in handy.

The template ensures that your case study has a good project narrative and understandable structure.

This also allows you to plan more effectively what design artifacts you will need in your case study. It’s a system by which you can then rapidly roll out multiple case studies without forgetting anything that’s relevant to a recruiter or client.

In case you did not read the previous article, the UX Portfolio Case Study template has 8 critical sections that recruiters are looking for.

UX Portfolio Case Study template sections

1. Project Title & Subtitle A headline and subtitle that indicates the name and goal of the project
2. Client/Company/Project typeWho was the project for
3. Project dateWhen did you work on the project
4. Your roleWhat you were responsible for on the project
5. Project Summary/About this ProjectAn overview that summarizes the project, goal and results
6. The challenge What specific problem, user needs, business requirements and/or pain points that the project solves. Were there any technical constraints or business KPIs you had to keep in mind? Who are you users and what are their specific needs
7. SolutionWhat method/process were used to solve specific problem, user needs, business requirements and/or pain points? How did features address the objectives?
8. ResultsProject success metrics, awards, reflections, project next steps and/or lessons learnt

Making it as concise and easy as possible to digest

Now writing and condensing long texts for these sections can be very challenging. I have included how long each section should be so that you have a guide to your writing length. Let’s walk through each section of the UX Portfolio Case Study template and fill it in.

UX Case Study Example 2

1. Project Title & Subtitle

Length: Project Title (1 line) & Subtitle (1–2 lines)

This one is pretty straightforward. I used the name we had for the project at the agency. I generally like to use the client’s brand name as it is recognizable to recruiters and brief enough to fit any case study cover. I also added a sub-title to further explain what was built for the client and give more context around the project title.

2. Client/Company/Project type

Length:1 line

Unless stated in the title, this helps build more context to who the project was for. This was a commercial project for a client so I wrote the name of the client’s brand.

3. Project date/duration

Length:1 line

When or how long the project was helps the recruiter establish whether this is your most recent work and most importantly, to gauge where your skill level is. Always try to put up work that is recent because it’s an accurate reflection of your skills. This one was a bit of an old one that I had not drafted a case study for.

4. Your role

Length:1–2 lines

This is a section to state everything you did and were responsible for. Recruiters are looking to accurately assess your skills in the context of the entire project’s execution. I state that I was the Senior UX Designer on the project then briefly note down all the activities I did for the project over the course of several months. If you worked with someone on the project make sure to state it.

5. Project Summary

Length: 1–2 paragraphs

This is a critical section for any reader who does not have a lot of time to read through the entire case study but wants a brief summary of the project, goals, and results. They may be going through a stack of applications and only have a few minutes to scan over one or two projects in your portfolio.

I have kept my summary to three long sentences. The first is the context of the brand. The second touches on the challenge and problem we were attempting to solve. And the last sentence describes the platform this is being built for.

6. The Challenge/Problem

Length: 2–3 paragraphs

This section specifically looks at the problems the project is trying to address. While keeping this paragraph concise I dive into the details of the problem that the client and their user were experiencing. If you are struggling with this part, take a look at your client’s original project brief. The problem you set out to solve will be stated under objectives.

7. The Solution

Length: As long as needed

This is the longest and more time consuming section to fill in depending on how long ago the project was and how fresh in your mind it still is. For this section I outlined the design process steps and methods followed during the project. I wrote down the high level project steps but at this point I am already thinking of the the relevant design artifacts recruiters might want to see. Everything that I produced from sketches to visual mockups to prototypes.

8. Results

Length: 1 paragraph

The critical last section concludes the case study by outlining any project success metrics that were achieved. I was fortunate that we wanted to report back to the client how well the site had performed so this information was dug up from the Google Analytics tracking. In most cases clients are happy with just a launch and its really up to you to follow up and get the project impact.

Okay, now that we have filled in our UX Portfolio Case Study template we can move on to getting our design artifacts together. I am happy with the content I put down and importantly, I have not missed any section.

Putting it together

This part is really up to you and how you tackle it is going to depend on where you are going to host your UX case study. If you have a portfolio site you can put the text we just typed down on a page and fill in the gaps with images and project artifacts.

I have a Behance account where I house my projects and merely need to upload images and write the text in, then publish the portfolio. Taking it a step further I integrate the text and imagery in Sketch/Photoshop than just purely uploading the project’s web screenshots.

If you would like to use my Behance layout your can check out my portfolio kit with pre-made, fully customizable professional artboards for every section of a portfolio.

Product link

How to enhance your UX Case Study

Key things that I always like to include in my case studies to make them more interactive and engaging:

  • Brand imagery to create a more immersive narrative
  • A prototype/GIF of the final solution

UX Case Study Folder structure

I like to create a folder structure for housing everything I will need as follows.

  • Client brief (Optional)
  • Website screenshots (Screenshots of the final website)
  • Behance submission (Final design exports for Behance upload)
  • Wireframe screenshots (Wireframe and UI designs exports in here)

Here are some of the final case study design screens with the text we filled out in the UX Portfolio Case Study template.

The intro has most of our UX case study sections covered in one go. Super important for recruiters without a lot of time.

The About and challenge sections come directly after that.

Then we can dive into the work. Here is a tiny bit of the Solution section showcasing a wireframe and UI design.

And lastly the results to round off the case study.

Here is the link to my portfolio and the full project.

What to do next

If you really enjoy this article and would like to get down to work, download my UX Portfolio Case Study template for free. Its included with the Design Portfolio Layout Guide, which includes 20 online case studies and example scripts for each case study section.

Design Portfolio Layout Guide

DOWNLOAD GUIDE

What to read next

UX Case Study Example #1 plus free template

How to fill in the UX Portfolio Case Study template from scratch and I will use an example UX case study from my portfolio.Read more

UX Portfolio Case Study template (plus examples from successful hires)

Your portfolio is the most critical piece of the puzzle when it comes to selling your design skills to recruiters and clients. It’s the single most vital component of any design career move you will ever make. A UX case study is a detailed but summarized presentation of a design project, its goals and objectives, […]Read more

UX Case Study Example #1 plus free template

How to fill in the UX Portfolio Case Study template from scratch and I will use an example UX case study from my portfolio.

In my last article, I shared the free UX Portfolio Case Study template that I developed based on over 60 portfolios of successful design hires from Facebook, Amazon, Uber, Twitter, Apple, Google, LinkedIn, Dropbox and the insights of top design recruiters.

We explored what recruiters look for in UX job applications/portfolios and then dived into successfully structuring any UX case study, even conceptual projects.

What you are going to learn

Today I wanted to go a step further and walk you through how to fill in the UX Portfolio Case Study template from scratch and I will use an example UX case study from my portfolio. 

UX Case Study example

The core idea is to try to break down your case study creation process into a writing component and designing component so that you can tackle each one without getting stuck or overwhelmed.

ux case study example

The template ensures that your case study has a good narrative and understandable structure. 

This also allows you to plan more effectively what design artifacts you will need in your case study. It’s a system by which you can then rapidly roll out multiple case studies without forgetting anything that’s relevant to a recruiter or client.

The UX Portfolio Case Study template has 8 critical sections that recruiters are looking for.

UX Portfolio Case Study template sections

1. Project Title & Subtitle A headline and subtitle that indicates the name and goal of the project
2. Client/Company/Project typeWho was the project for
3. Project dateWhen did you work on the project
4. Your roleWhat you were responsible for on the project
5. Project Summary/About this ProjectAn overview that summarizes the project, goal and results
6. The challenge What specific problem, user needs, business requirements and/or pain points that the project solves. Were there any technical constraints or business KPIs you had to keep in mind? Who are you users and what are their specific needs
7. SolutionWhat method/process were used to solve specific problem, user needs, business requirements and/or pain points? How did features address the objectives?
8. ResultsProject success metrics, awards, reflections, project next steps and/or lessons learnt

Let’s begin.

UX case study example 1

The project

The UX portfolio project I will use is one I did as a Senior Designer at a digital marketing agency. The brief was to create a responsive website/microsite for an annual financial publication for an Asset Management company. 

Now let’s walk through each section of the UX Portfolio Case Study template and fill it in.

1. Project Title & Subtitle

Length: Project Title (1 line) & Subtitle (1–2 lines)

This one is pretty simple. I used the name we had for the project at the agency. It’s brief enough to fit any case study cover but does show the brand name, and the nature of the product, a journal. I added a sub-title to further explain what the heading means, and give more context around the project title.

2. Client/Company/Project type

Length:1 line

Unless stated in the title, this helps build more background to who the project was for. This was a commercial project for a client so I wrote the name of the client’s brand.

3. Project date/duration

Length:1 line

When or how long the project was helps the recruiter establish whether this is your most recent work and most importantly, to gauge where your skill level is. Always try to put up work that is recent because it’s an accurate reflection of your skills. This one was a bit of an old one that I had not drafted a case study for.

4. Your role

Length:1–2 lines

This is a section to state everything you did and were responsible for. Recruiters are looking to accurately assess your skills in the context of the entire project’s execution. I state that I was the Senior UX Designer on the project then note down all the activities I did on a high level, for the project over the course of several months.

5. Project Summary

Length: 1–2 paragraphs

This is a critical section for any reader who does not have a lot of time to read through the entire case study but wants a brief summary of the project, goals, and results. They may be going through a stack of applications and only have a few minutes to scan over one or two projects in your portfolio. 

I have kept my summary to three long sentences. The first is the context of the brand. The second touches on the challenge and problem we were attempting to solve. And the last sentence addresses how we would know we had done a good job.

6. The Challenge/Problem

Length: 2–3 paragraphs

This section specifically looks at the problems the project is trying to address. While keeping this paragraph concise I dive into the details of the problem that the client and their user were experiencing.

7. The Solution

Length: As long as needed

This is the longest and more time consuming section to fill in depending on how long ago the project was and how fresh in your mind it still is. For this section I outlined the design process steps and methods followed during the project. I wrote down the high level project steps but at this point I am already thinking of the the relevant design artifacts recruiters might want to see. Everything that I produced from sketches to visual mockups to prototypes.

8. Results

Length: 1 paragraph

The critical last section concludes the case study by outlining any project success metrics that were achieved. I was fortunate that we wanted to report back to the client how well the site had performed so this information was dug up from the Google Analytics tracking. In most cases clients are happy with just a launch and its really up to you to follow up and get the project impact.

Okay, now that we have filled in our UX Portfolio Case Study template we can move on to getting our design artifacts together. I am happy with the content I put down and importantly, I have not missed any section. 

Putting it together

This part is really up to you and how you tackle it, is going to depend on where you are going to host your UX case study. If you have a portfolio site you can use the template content on a site page and fill in the gaps with images and project artifacts. 

I have a Behance account where I house my projects and merely need to upload images and write the text in, then publish the portfolio. Taking it a step further I integrate the text and imagery in Sketch/Photoshop then just upload the images.

How to enhance your UX Case Study

Key things that I always like to include in my case studies to make them more interactive and engaging:

  • A video or gif of the final product
  • A prototype
  • Brand imagery to create immersive narrative

UX Case Study Folder structure

I like to create a folder structure for housing everything I will need as follows.

  • RAW ( I collate screenshots of the final project, UI designs and wireframe exports in here)
  • Images (Relevant visual imagery that can be interlaced between project sections)
  • Videos (Optional. In most cases there won’t be one)
  • Behance submission (Final design exports for Behance upload)

Here are some of the final design screens with the text we filled out in the UX Portfolio Case Study template. Go to this link to view the full case study.

The intro has most of our UX case study sections covered in one go. Super important for recruiters without a lot of time.

The About and challenge sections come directly after that.

Then we can dive into the work. Here is a tiny bit of the Solution section showcasing a wireframe and UI design.

And lastly the results to round off the case study.

Here is the link to my portfolio and other UX case studies.

Calvin Pedzai on Behance
I conduct website and mobile app usability audits, heuristic evaluations, user journeys, competitor analysis, user…www.behance.net

If you would like to get down to work, download my UX Portfolio Case Study template for free. Its included with the Design Portfolio Layout Guide, which including 20 online case studies and example scripts for each case study section.

Design Portfolio Layout Guide

DOWNLOAD GUIDE

What to read next:

UX Case Study Example #2 plus free template

You may be wondering how should you organize a large amount of project information in a case study so that it isn’t overwhelming to recruiters? What information is vital to include in a portfolio case study? Or maybe you are just struggling to bringing together your wireframes, strategies and sections into a clean, attractive narrative…Read more

UX Portfolio Case Study template (plus examples from successful hires)

Your portfolio is the most critical piece of the puzzle when it comes to selling your design skills to recruiters and clients. It’s the single most vital component of any design career move you will ever make. A UX case study is a detailed but summarized presentation of a design project, its goals and objectives, […]Read more

Exit mobile version