Illustration showing the visualisation of a case study, which includes the layout, color scheme, typography and high-quality images.

Design with Intent: Craft Your Portfolio with Visual Storytelling Tools

by Laia Tremosa • • 13 min read

641 Shares
Save

Does your UX/UI portfolio look like a dry textbook or a captivating story? Use typography, colors, layout and accessibility to create a memorable narrative that showcases your design skills and your personality—make a great first impression on hiring managers and get that interview for your dream job.

In this video, Morgane Peng, Design Director at Societe Generale CIB, talks about the visual elements of a design portfolio.

Transcript

Visual Design: Form Follows Function

When you work on the visual aspect of your portfolio, think about how you can use the visual elements—typography, color scheme, etc.—to tell your professional story. Think about the content you’ve selected to represent yourself and how you can better showcase it.

Let’s explore how each visual element becomes a narrative tool to captivate potential employers:

  1. Visual hierarchy and layout: Use visual hierarchy to guide recruiters through the story of your work. Take them on a journey—your design story—and help them find what they’re looking for. Also, use grids to keep your content organized and clean.

  1. Typography: Don't underestimate the power of fonts! Choose fonts that are not just aesthetically pleasing; they should speak to your design personality and professionalism. Clear, readable fonts act as your narrator; use them to communicate who you are as a designer to hiring managers. They are the voice that tells your design story. For body text, stick to user-friendly fonts, and be more creative (within reason) for titles.

  1. Color scheme: Keep in mind that colors evoke emotions and thus, have a significant impact on how your work is perceived. Think about the story you want to tell and choose your colors accordingly. Define the color palette and stick to it for the whole portfolio, this will ensure a cohesive and professional look.

  1. High-quality images: Be intentional about the images you choose. Think of them as snapshots of your design story. Each image should have a clear purpose and tell a story, whether it showcases your design process, the final product or a glimpse into your personality. Ensure all images are high-quality, well-lit and cropped to emphasize the key elements.

  1. Your logo and branding: Although logos are not mandatory for portfolios, if you’d like to design one, make sure that it represents you and your brand appropriately. Then feature it in your portfolio to build your identity as a designer.

  1. Responsiveness: Ensure your portfolio looks and functions flawlessly on any device, adapting to different screen sizes. Just like a great book can be enjoyed anywhere, your portfolio should provide a seamless user experience for recruiters, no matter how they choose to view it.

Remember, visual design isn’t just decoration; it’s the language that tells your professional design story. Use visual elements with the purpose to support your narrative, stand out from the crowd—for the right reasons—and captivate potential employers.

Illustration showing the visualisation of a case study, which includes the layout, color scheme, typography and high-quality images.

© Interaction Design Foundation, CC BY-SA 4.0

The Take Away

Don’t just make your portfolio aesthetically beautiful, use visual elements to tell your design story. Every visual element in your portfolio, from font choice to color palette, is a storytelling tool that can help you land your next interview.

Start by choosing fonts that support visual hierarchy, represent your personality and are easy to read. Next, select a color palette that reflects your design style and considers emotional impact. Add high-quality images that have a purpose and convey a specific message that supports your narrative. Also, make sure that hiring managers will have a seamless experience when reviewing your portfolio—no matter the device they use.

Overall, let your visuals be the voice of your design journey and use them strategically to support your professional narrative.

References and Where to Learn More

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

Take our course, Visual Design: The Ultimate Guide, to learn the basics of visual design and level up your portfolio’s appearance.

Read the article, The Key Elements & Principles of Visual Design.

Watch our Master Class, The Tone Of Typography: A Visual Communication Guide.

Build a network that supports your career growth—join an IxDF Local Group.

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

Learn More in This Course:

Learn Design and AI From the Best

Get one powerful email each week, like 312,068 others.

Next email in:

What You Should Read Next

  • Read full article
    Conceptual Models: The Hidden Structure Behind Your Next Great Interface - Article hero image

    Conceptual Models: The Hidden Structure Behind Your Next Great Interface

    Ever wondered why some interfaces feel effortless: like they already know what you’re trying to do, while others leave you guessing? The difference often lies in how well a product’s design matches the way users think. When your interface reflects their mental model, every action feels intuitive, an

    Social shares
    472
    Published
    Read Article
  • Read full article
    Get to Grips with Constraints - Article hero image

    Get to Grips with Constraints

    Got constraints? Perfect. That’s where great design begins. Just as electrical standards define how a toaster safely works without shaping what it does, your software also lives within boundaries that quietly guide its behavior. Functional requirements describe what your system does: the stories of

    Social shares
    469
    Published
    Read Article
  • Read full article
    How Persona Stories Help You Design for Real People - Article hero image

    How Persona Stories Help You Design for Real People

    User stories caught on because they were quick and simple, but speed often came at the cost of real understanding. A “user” in a story is rarely more than a guess, shaped by the assumptions of whoever wrote it. When you shift to persona stories, you ground your work in real research and real people.

    Social shares
    391
    Published
    Read Article
  • Read full article
    Use Cases: The Ideal Bridge Between Requirements and Design? - Article hero image

    Use Cases: The Ideal Bridge Between Requirements and Design?

    Imagine trying to describe everything your product needs to do, without getting lost in technical detail or endless feature lists. That’s the problem Ivar Jacobson set out to solve in the 1980s when he introduced use cases. Instead of worrying about how a system worked internally, he described it fr

    Social shares
    410
    Published
    Read Article
  • Read full article
    What is Good Design? - Article hero image

    What is Good Design?

    Design matters. It enables us to understand, communicate and improve the world around us. When done right, design has the power to improve the everyday lives of users. When done wrong, design can disrupt and frustrate users. As a designer, you have the power to improve the everyday lives of your use

    Social shares
    668
    Published
    Read Article
  • Read full article
    How To Use Grid Systems - Article hero image

    How To Use Grid Systems

    Grids systems can help you add structure to your design, organize information and create a consistent user experience. When designing with grids, the best thing you can do is to choose the right grid for the right project. However, with so many grids to choose from, it can be hard to know where to s

    Social shares
    829
    Published
    Read Article
  • Read full article
    The Basics of Type: Design Interfaces Users Keep Coming Back To - Article hero image

    The Basics of Type: Design Interfaces Users Keep Coming Back To

    Type is everywhere. In the books you read, the products you use, and even in this very website you're on right now. But what is type? In the context of design, type is the style or appearance of text. It can also refer to the process of working with text. Typography can often be an intimidating topi

    Social shares
    676
    Published
    Read Article
  • Read full article
    What are Color Modes? - Article hero image

    What are Color Modes?

    As a designer, it’s important to differentiate the color modes so you can optimize each stage of your design process. If you use the correct color mode in your design, you will also help get your message and tone across. In this lesson, we’ll define common color modes and help you understand when to

    Social shares
    789
    Published
    Read Article
  • Read full article
    The 5 Pixar Storytelling Principles That Will Redefine How You Present and Fast-Track Your Career - Article hero image

    The 5 Pixar Storytelling Principles That Will Redefine How You Present and Fast-Track Your Career

    Ever sat through a presentation that felt like watching paint dry? You’re not alone. Most presentations miss one vital ingredient: Storytelling. And when it comes to telling stories that make people laugh, cry, or rethink their entire worldview… no one does it like Pixar. They’ve mastered the art of

    Social shares
    513
    Published
    Read Article
  • Read full article
    5 Ways to Use Behavioral Science to Create Better Products - Article hero image

    5 Ways to Use Behavioral Science to Create Better Products

    A myriad of fields, skills and insights come together to create the overarching discipline of user experience design. Psychology and behavioral science play a big part in UX design because understanding people, the way their minds work, what they want and don’t want, will help us create better produ

    Social shares
    654
    Published
    Read Article

Top Articles

Top Topic Definitions

39% of Today's Skills Will Change by 2030

The World Economic Forum expects 39% of today's skills to be transformed or become outdated by 2030.

The good news is that jobs in UX / UI design and AI are among the fastest-growing professions globally.

Build Skills That Keep You Relevant

Privacy Settings

By using this site, you accept our Cookie Policy and Terms of Use.
Customize
Accept all

Be the One Who Inspires

People remember who shares great ideas.

Share on:

Academic Credibility — On Autopilot

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

Learn Design and AI From the Best

Get one powerful email each week, like 312,068 others.

Next email in: