Top 5 Visual Mistakes to Avoid for an Impactful UX Portfolio

Raluca Angelescu
June 5, 2023
No read
Share this post

As a fresh UX Designer, your case studies likely consume much of your thoughts. We often discuss how to craft an excellent case study, but the visual aspect of it doesn't receive enough attention. Beyond the functional details of your projects, the visual design of your portfolio plays a crucial role in your success.

A staggering 50% form their judgments about a website's credibility based on its visual design. Don't quote me on this; there are studies to attest to this number. This isn't surprising, given that human beings are intrinsically visual creatures. When browsing a website, visuals guide us, shape our impressions, and help us make sense of the content. Therefore, the visual appeal of your portfolio is a crucial component of breaking into the UX world.

I've been talking to a lot of Designers and gone through a lot of portfolios, and I've identified five common visual mistakes that are often overlooked yet, can hugely impact the overall impression of your work. Let's discuss them one by one.

Lack of White Space

White space isn't wasted space; it's a fundamental design tool. It shouldn't be an afterthought or something to fill up your design canvas. When used strategically, it becomes an integral part of your visual storytelling, making your portfolio not only visually appealing but also easier to navigate and understand.

First off, by allowing your elements room to breathe, you enhance the clarity of your message and make it easier for the audience to grasp. White space can be viewed similarly to the pauses in a speech. Just as these breaks aid comprehension and allow people to receive the message, white space in design allows the viewer's eyes to rest and helps distinguish between different elements on the page.

You can also use white space to separate different sections or categories in your portfolio. This can help to structure your work and make it easier for viewers to find the information they're interested in. Whether dividing different UX skills, project types, or industries you've worked in, white space can create a clear distinction between them and enhance readability.

a woman sitting on a bench in a large room

Poor Alignment

Similar to designing a product, having a correct alignment of columns, rows, gutters, and margins is essential to a clean, organized design. A balanced arrangement helps to make your design easily skimmable and enhances the overall flow of your portfolio. This is particularly significant given that viewers often spend just a brief amount of time browsing portfolios.

Think about it this way: proper alignment acts like a silent guide that navigates viewers through your work. It seamlessly leads the eye from one piece of information to the next, creating a visual narrative that makes it effortless for the viewer to follow your thought process and understand your work.

For example, imagine a grid layout where your case studies are presented. If the elements of each case study - text blocks, images, captions - are perfectly aligned within their respective grids, viewers can smoothly transition from one project to the next. This consistency contributes to a positive viewing experience, and it can significantly increase the likelihood of viewers investing more time in your portfolio.

In addition, maintaining consistency with left-aligned text lends your portfolio a polished, professional look and reduces cognitive load for your readers. This approach makes your content easier to digest, as it adheres to the natural reading pattern in Western cultures. This way, your viewers can effortlessly flow from one line to the next, enabling them to focus more on the content of your portfolio rather than the effort of reading it.

In a world where time is of the essence, and attention spans are limited, proper alignment is not just an aesthetic preference; it's a crucial aspect of viewer engagement in your portfolio.

the word alignmentment spelled with scrabble letters

Inaccessible Colour Choices

It's quite common for us designers, in a well-intended attempt to craft a visually appealing portfolio, to lean towards using lighter shades or pale colors. On the surface, these colors might seem to provide a minimalist and sophisticated aesthetic.

However, using pale colors on a white background, while potentially attractive, can create significant accessibility issues. Accessibility in design isn't just about catering to a particular audience group, it's about inclusivity. As a designer, if you don't consider accessibility, you risk alienating a significant portion of your audience.

In addition to demonstrating inclusivity and respect for a diverse range of users, it's also essential to consider the various devices and screen settings that recruiters or hiring managers might use to view your portfolio. What might appear vibrant and clear on your high-contrast screen may not translate the same way on other devices or under different viewing conditions.

Every screen is calibrated differently, and what you see on your high-definition, high-contrast monitor might not look the same on a mobile device, a laptop with lower resolution, or an older desktop monitor. Light colors, in particular, may become indistinguishable on some screens, making your carefully crafted portfolio difficult to view and potentially frustrating your audience.

blue white green and red textile

Using (a lot of) small images

The temptation to showcase the breadth of your work can often lead to using a large number of small images to fit everything in. But if the viewer can't read or understand what's happening in an image, it's not adding value to your case study; in fact, it's frustrating your audience. Make images an appropriate size if you deem them worthy to include.

The strategic decision to cut something from your portfolio that isn't usable or readable can indeed be a tough one. Yet, if it doesn't serve the purpose of effectively communicating your skills and your work, it could be doing more harm than good. A picture is worth a thousand words, but only when it's clear enough for your audience to decipher the story it tells.

Crafting a visually appealing and effective UX portfolio is both an art and science. By avoiding these common visual mistakes and applying these principles, you're well on your way to creating a portfolio that's not just pleasing to the eye, but one that truly resonates with your audience, communicates your skills, and ultimately, lands you that dream job.

Remember, your portfolio is your golden ticket - make every pixel count!

Share this post
Bootcamp preview image
UX/UI Design Bootcamp
Next cohort starts Nextuary 35th, 2024
Part time • 24 weeks
Learn More