Interactive Design Portfolios

Your constantly-updated definition of Interactive Design Portfolios and collection of videos and articles
167 shares

What are Interactive Design Portfolios?

Interactivity brings your design portfolio to life!

© Interaction Design Foundation, CC BY-SA 4.0

Design portfolios are crucial in successfully landing a variety of roles, but what form should they take? Interactive portfolios are a great way to show off your design skills while engaging with your audience in ways that just aren’t possible with static media. And for interaction design, they allow you to showcase the same skills you’ll be using on the job.

In this clip, Morgane Peng, Design Director at Societe Generale CIB, explains the important role of a portfolio.

Show Hide video transcript
  1. Transcript loading…

What a Design Portfolio Should Include

It’s important not to focus solely on finished designs. Your portfolio will be more persuasive and informative if it tells the stories of design from problems to solutions. If you also do user research, be sure to include examples of that too, showing how research results affected design decisions. For a user experience portfolio, consider including

The complete list sounds daunting, but bear in mind that you are only giving highlights at each step of the story.

You should focus on three to four projects that showcase the range of your work.

Multiple Mediums for Flexible Presentation

Websites offer the greatest scope for demonstrating design skills, but it is often necessary to have a backup. This is especially true if a mobile rendering of a site does not show it in the best light.

Some website platforms support the ability to export your CV as a PDF. Alternatively, sites such as behance.net allow users to create interactive PDFs. These mostly rely on simple scrolling for navigation, but other interactive elements are present, such as drop-down lists and popups.

Where to Start

Building a UX design portfolio, as described below.

© Interaction Design Foundation, CC BY-SA 4.0

In a step-by-step article on how to build a UX design portfolio, Rachel Krause at NNG (see Where to Learn More) suggests:

  1. Review your projects. What makes them good, bad or different from others? What is likely to attract the attention of hiring managers?

  2. Whittle your list down to a handful and consider the story behind each. If you have many to choose from, consider those that might make an interesting conversation when someone asks what you do for a living. Talk about the problems you were solving, how you worked with others and how successful the solutions were.

  3. Choose the format of presentation. As discussed above, websites are great for interactivity. However, they may not always be the easiest to present. Interactive PDFs are a little more linear.

  4. Build it. If you are a confident website designer, starting from scratch can wow your prospective employers or customers. If you would rather focus on telling the stories behind your projects, consider template-rich environments like Wix, Squarespace, Behance and WordPress.

  5. Share your portfolio and get feedback. You can start with online communities but focus on those you already contribute to. Crashing into a community just to ask for feedback may be counterproductive. As you talk to hiring managers and recruiters, take note of what works for them and what doesn’t.

Sample Portfolios

Be sure to have a look at what others are doing. The great thing about interactive portfolios is that they can often be open to view. Naturally, sensitive or detailed information may be stashed behind a password-protected link, but your main goal is to generate enough interest to carry your portfolio past the initial filtering stages.

Here are some collections of good portfolio examples:

Where to Learn More

Questions about Interactive Design Portfolios

What tools can I use to create an interactive design portfolio?

Popular tools include Adobe XD, Figma, Webflow, and Behance. These platforms offer flexibility for designing and prototyping interactive elements, allowing designers to craft customized, engaging portfolios.

How often should I update my interactive design portfolio?

Updating your portfolio every 3-6 months or after completing significant projects is ideal. Regular updates show growth, new skills, and current interests, helping you stay relevant in the fast-evolving design industry.

What are some best practices for creating an interactive design portfolio?

Some best practices include keeping navigation intuitive, ensuring responsiveness on different devices, focusing on readability, and avoiding overly complex animations that can distract from the content. It’s also important to regularly update the portfolio with recent projects to reflect current skills and styles.

How can interactive elements enhance a design portfolio?

Interactive elements like animations, transitions, clickable prototypes, and hover effects can help to guide viewers’ attention and make the portfolio experience memorable. When used thoughtfully, these elements reflect the designer’s skill in creating engaging and functional user experiences.

What should an interactive design portfolio include?

When possible, an interactive portfolio should include case studies, project descriptions, images, prototypes, and links to live projects. Key sections typically cover the designer's process, challenges faced, solutions provided, and measurable results. It's also useful to include a brief introduction and contact information.

Why is an interactive design portfolio important for UX/UI designers?

An interactive portfolio helps UX/UI designers demonstrate their design thinking, technical abilities, and creativity more effectively. It gives potential employers and clients a hands-on experience of the designer's style and approach, making it easier to stand out in a competitive field.

What is an interactive design portfolio?

An interactive design portfolio is a digital collection showcasing a designer’s work and skills, often presented in a dynamic and engaging format. It typically includes interactive elements, animations, and responsive layouts to highlight a designer’s approach to user experience (UX) and user interface (UI) design.

Answer a Short Quiz to Earn a Gift

Question 1

What key components should be included in an interactive design portfolio to showcase UX and UI skills?

1 point towards your gift

Question 2

How can I effectively present case studies in my portfolio to highlight my design thinking and problem-solving abilities?

1 point towards your gift

Question 3

What are the best practices for structuring an online interactive portfolio for ease of navigation and impact?

1 point towards your gift

Question 4

How can I tailor my portfolio to attract specific types of clients or roles, like UX design, UI design, or product design?

1 point towards your gift

Question 5

Include only general information without specifying particular skills related to specific design roles.

1 point towards your gift

Better luck next time!

0 out of 5 questions answered correctly

Do you want to improve your UX / UI Design skills? Join us now

Congratulations! You did amazing

5 out of 5 questions answered correctly

You earned your gift with a perfect score! Let us send it to you.

Letter from IxDF

Check Your Inbox

We’ve emailed your gift to name@email.com.

Do you want to improve your UX / UI Design skills? Join us now

Literature on Interactive Design Portfolios

Here’s the entire UX literature on Interactive Design Portfolios by the Interaction Design Foundation, collated in one place:

Learn more about Interactive Design Portfolios

Take a deep dive into Interactive Design Portfolios with our course Build a Standout UX/UI Portfolio: Land Your Dream Job .

“Your portfolio is your best advocate in showing your work, your skills and your personality. It also shows not only the final outcomes but the process you took to get there and how you aligned your design decisions with the business and user needs.”

— Morgane Peng, Design Director, Societe Generale CIB

In many industries, your education, certifications and previous job roles help you get a foot in the door in the hiring process. However, in the design world, this is often not the case. Potential employers and clients want to see evidence of your skills and work and assess if they fit the job or design project in question. This is where portfolios come in.

Your portfolio is your first impression, your foot in the door—it must engage your audience and stand out against the hundreds of others they might be reviewing. Join us as we equip you with the skills and knowledge to create a portfolio that takes you one step closer to your dream career.

The Build a Standout UX/UI Portfolio: Land Your Dream Job course is taught by Morgane Peng, a designer, speaker, mentor and writer who serves as Director of Experience Design at Societe Generale CIB. With over 12 years of experience in management roles, she has reviewed thousands of design portfolios and conducted hundreds of interviews with designers. She has collated her extensive real-world knowledge into this course to teach you how to build a compelling portfolio that hiring managers will want to explore.

In lesson 1, you’ll learn the importance of portfolios and which type of portfolio you should create based on your career stage and background. You’ll discover the most significant mistakes designers make in their portfolios, the importance of content over aesthetics and why today is the best day to start documenting your design processes. This knowledge will serve as your foundation as you build your portfolio.

In lesson 2, you’ll grasp the importance of hooks in your portfolio, how to write them, and the best practices based on your career stage and target audience. You’ll learn how and why to balance your professional and personal biographies in your about me section, how to talk about your life before design and how to use tools and resources in conjunction with your creativity to create a unique and distinctive portfolio.

In lesson 3, you’ll dive into case studies—the backbone of your portfolio. You’ll learn how to plan your case studies for success and hook your reader in to learn more about your design research, sketches, prototypes and outcomes. An attractive and attention-grabbing portfolio is nothing without solid and engaging case studies that effectively communicate who you are as a designer and why employers and clients should hire you.

In lesson 4, you’ll understand the industry expectations for your portfolio and how to apply the finishing touches that illustrate your attention to detail. You’ll explore how visual design, menus and structure, landing pages, visualizations and interactive elements make your portfolio accessible, engaging and compelling. Finally, you’ll learn the tips and best practices to follow when you convert your portfolio into a presentation for interviews and pitches.

Throughout the course, you'll get practical tips to apply to your portfolio. In the "Build Your Portfolio" project, you'll create your portfolio strategy, write and test your hook, build a case study and prepare your portfolio presentation. You’ll be able to share your progress, tips and reflections with your coursemates, gain insights from the community and elevate each other’s portfolios.

All open-source articles on Interactive Design Portfolios

Please check the value and try again.

Open Access—Link to us!

We believe in Open Access and the democratization of knowledge. Unfortunately, world-class educational materials such as this page are normally hidden behind paywalls or in expensive textbooks.

If you want this to change, , link to us, or join us to help us democratize design knowledge!

Share Knowledge, Get Respect!

Share on:

or copy link

Cite according to academic standards

Simply copy and paste the text below into your bibliographic reference list, onto your blog, or anywhere else. You can also just hyperlink to this page.

Interaction Design Foundation - IxDF. (2024, September 5). What are Interactive Design Portfolios?. Interaction Design Foundation - IxDF.

New to UX Design? We're Giving You a Free eBook!

The Basics of User Experience Design

Download our free ebook “The Basics of User Experience Design” to learn about core concepts of UX design.

In 9 chapters, we’ll cover: conducting user interviews, design thinking, interaction design, mobile UX design, usability, UX research, and many more!

A valid email address is required.
315,482 designers enjoy our newsletter—sure you don’t want to receive it?