How to improve your portfolio visuals (without being a Visual Designer)

Be Your Own Design Team #45

Quick note from me

Hey! Over the past week I’ve been running polls in my Instagram to choose topics for these newsletter issues. This time you voted for portfolio visuals. One of the most common areas designers struggle with, no matter their level.

Visuals were something I ignored in my first portfolios too. I focused on research and process, and assumed the “design” part didn’t matter as long as the thinking was solid. But the truth is, visuals shape the first impression before anyone reads a single word.

So in today’s issue, I’ll share clear, practical tips to help you make your portfolio more readable, intentional, and senior-looking, without needing to be a visual designer.

If you want to request a topic for a future issue, just reply to this email.

Story outline

  • Level 01: Treat visuals as part of your story

  • Level 02: Make your visuals big, clear and readable

  • Level 03: Make layout easy to scan

  • Level 04: Use colour to support, not steal the show

  • Level 05: Limit your styles, polish your artefacts

  • Level 06: Should you go creative with your visuals?

  • Level 07: Simple checklist you can use today

Level 01

Treat visuals as part of your story

Visuals are not decoration. They are how recruiters actually understand your projects. Instead of dropping random screens (e.g. screenshots with sticky notes), use visuals to support what you are saying.

Show a visual of exactly that thing when you write about:

  • Specific feature

  • Design decision

  • Problem you solved

Not the whole app, not 10 screens, just what helps recruiters get it.

You can ask yourself:

  • What part of the screen is important here?

  • What should they notice first?

  • What visual can show what I’m explaining in the text?

If your text and visuals tell the same story, your portfolio feels clear, intentional and senior. And if you want to share more, just link to the external files. But don’t use screenshots like the ones below as representative visuals, because they aren’t readable.

Level 02

Make your visuals big, clear and readable

Most portfolios lose points here. Designers often assume storytelling only happens in text, but that’s not true. Visuals tell the story too, so avoid:

  • Tiny screens

  • Blurry exports

  • Weird angled mockups that look “cool” but are hard to read

  • 10 artefacts squeezed into 1 image

Simple rules:

  • Make key visuals large enough so recruiters can understand them without zooming

  • Export from Figma at 2x

  • Keep screens straight, not rotated

  • 1 main idea per image

If a hiring manager has to strain their eyes or guess what they’re looking at, they’ll move on. No one has time to decode unclear visuals.

Level 03

Make layout easy to scan

A lot of designers have good work, but their portfolio is tiring to read.

Things that make it hard:

  • Too many fonts

  • Messy alignment

  • Low contrast text

  • Huge walls of text

  • Everything looks the same size and importance

To make the review process easy for recruiters, aim for:

  • 1 simple sans serif font, with 2-3 text styles

  • Left aligned paragraphs

  • Strong contrast between text and background

  • Clear hierarchy

    • Big heading

    • Smaller subheading

    • Normal body text

  • Short paragraphs and bullet points

Think about a busy hiring manager. Can we scroll and understand the main points in 20 to 30 seconds? If yes, you are on the right track.

Simple yet effective homepage and case study layouts

Level 04

Use colour to support, not steal the show

Your colour choices send a message before recruiters read a word. This happens more often than you think. Designers try to style their portfolios with colour, but if the skills aren’t there yet, the result is a weaker first impression and more drop-offs.

Common mistakes:

  • Very dull, muddy colours

  • Low contrast, hard to read text

  • Too many colours competing for attention

Keep it simple:

  • Pick

    • 1 primary colour

    • A few greys

    • 1 accent if you really need it

  • Use primary colour for links, buttons and key highlights

  • Use greys for text and backgrounds

  • Make sure text is always easy to read

If you’re not confident with colour, keep your palette neutral and light, and let your work speak. Most great portfolios I’ve seen lately use a simple white/light mode and put the focus on project visuals, not portfolio site styling.

Level 05

Limit your styles, polish your artefacts

Junior portfolios often try to show everything at once.

You will see:

  • Different fonts across pages

  • Different button styles in each project

  • Raw screenshots of personas, workshops, random Miro chaos

Instead, aim for consistency. You can:

  • Reuse the same basic styles in all projects

  • Decide on 1 thumbnail style and stick to it

  • Redraw messy artefacts in a simpler, cleaner way

  • Crop only the parts that support your story

You’re not “lying” by polishing. You’re respecting your reader’s time and helping them focus on what matters.

And if your artefacts look rough, don’t be afraid to create a future-vision version with a more modern look. Just be honest that it’s an iteration. This is often seen as a positive sign of being proactive.

Level 06

Should you go creative with your visuals?

You see online stunning, animated, experimental portfolios. It’s easy to wonder if yours should look like that too. The truth is: both extremes can hurt you.

  • Some designers almost ignore visuals

  • Others go overly creative and make their work hard to read

Neither supports your story.

Your visuals should make your work clearer, not louder.
A hiring manager shouldn’t struggle to understand what they’re looking at. But they should feel a strong first impression, because humans are biased. Polished visuals feel more senior and more intentional.

You don’t need to be a visual designer. But you do need the basics:

  • Clean spacing

  • Simple hierarchy

  • Readable typography

  • Consistent colours

  • Intentional artefacts

If you want to add creativity, do it in small ways: titles, icons, micro-branding. If you use creative layouts, make sure you don’t overshadow your case studies.

Your portfolio is a sales tool. Creativity is welcome, as long as clarity stays in front.

Creative, but easy to review portfolio site

Level 07

Simple checklist you can use today

Pick one case study and do a quick visual clean up. Ask yourself:

  • Is each visual connected to a specific part of the story?

  • Can recruiter understand the screen without zooming?

  • Do I have 1 clear font and 1 clear hierarchy?

  • Is my colour palette calm and readable?

  • Did I remove visuals that do not add anything?

You do not need to turn your portfolio into a Dribbble shot.
You just need visuals that are clear, intentional and easy to scan.

🫶 Together with Framer

Framer gives students full access to the platform for free

If you’re studying design, product, development, or any creative field, this is one of the best tools you can learn right now.

What you get as a student:

  • Free site hosting and publishing for an entire year

  • Full access to the Design Canvas to explore, design, and create

  • CMS for managing content without touching code

  • Unlimited use of Wireframer and Workshop AI

  • Access to templates, components, and free learning resources

  • Publishing in one click with no handoffs or plugins

Learning Framer as a student gives you real, practical experience with a modern design and web-building workflow.

Want free access? Apply here

Which portfolio problem are you trying to fix right now?

Login or Subscribe to participate in polls.

Want help with your UX portfolio? 🎁

  1. Build your UX Portfolio with this course

  2. Grab Storyline Portfolio Framer Template

  3. Book a portfolio strategy call with me

Questions? Reply directly.

Keep designing ✨
Aneta