How to choose the right look for your portfolio

Default avatar.
April 19, 2017
How to choose the right look for your portfolio.

I have been looking at a ton of portfolio sites. The good news is, I get paid to do this. I look at a bunch of portfolios, pick the ones I like best, and then I magically turn those portfolios into a monthly article. Coffee counts as magic. I pick the portfolios on mostly aesthetic criteria. I pick what looks good to me, be it professional and familiar, or wild and post-modern. I pick these websites for how they might inspire other designers to break the mold a little, and try something new. I also secretly judge them based on whether or not I would actually hire them for work. Many designers with a strong sense of aesthetics are lacking in the UX department, and their site is nearly impossible to navigate. Sometimes the the UI is easy to navigate, but there are possible functional problems. Sometimes they’re issues that could easily be solved with progressive enhancement, but no one bothered. There are two reasons for this: bandwagon-hopping, and misplaced experimentation.

The Don’ts”

Bandwagon-hopping

Following trends isn’t an inherently bad thing. Right now, trends are basically what push web design forward. It’s how we went from Web 2.0” gradients to skeuomorphism, and then on to flat design, and beyond. People following trends, and the inevitable backlash to people following trends are what keep the discipline alive, interesting, and ever-changing. More recently, trends are how we ended up with some highly creative post-modern style sites: blackballoon samlordflavin Trends are how we ended up with daring typography-based sites: B14 Trends are the reason we talked about brutalism and pseudo-brutalism for like a month before we forgot about it: claudiadoms 01Buero The downside is that many people embrace trends without thinking too hard. They don’t think about the purpose behind the aesthetic, or the usability concerns of the people who started these trends. These aesthetic styles didn’t come from nowhere. They came from the minds of people that needed to solve a specific problem, to scratch a particular itch. There’s nothing wrong with having a design in a currently-trending style, just make sure that you’re embracing the trend for the right reasons.

Misplaced experimentation

If you do any creative work, you’ll always get the urge to try something new and different. You might feel as though you’re selling out if you make two similar site designs in a row. Experimentation is good, both for design and development. You should be doing new things. However, maybe your portfolio isn’t actually the best place to do them. I contend that if you’re going to get crazy with the animation, the navigation placement, or what-have-you, it might be better to do it with a side project. Too many of the portfolios I’ve seen throw basic usability principles to the wind in favor of wild creativity. Your portfolio is supposed to be selling your work or services. If the site breaks because the JS doesn’t load properly, or if it’s just hard to navigate, the results are just as bad as they would be on a large eCommerce site, or a major blog. You will lose money. People with bad internet need websites too.

The Do’s”

Okay, that’s enough negativity in your life. How should you approach your portfolio’s look, then? Well, I don’t have all the answers, but I do have two pretty good answers:

Approach 1: Design the site your customers want

Design the site that your client aspires to have. Make them envious, and then give them what they want. I mean, you have a chosen niche, right? A target audience? Make your portfolio site feel a lot like the sites you build for clients. You know your market. Use that. Shape does this quite well. The whole look and feel of the site is vaguely similar to that of an eCommerce template. Well, they design eCommerce sites, so that’s absolutely perfect. shape Now how about a portfolio that isn’t about web design? Stefanie Bruekler’s portfolio bears a striking thematic resemblance to the print work showcased on her site. stefanie

Approach 2: Put your work front and center

Don’t give them the time to judge your portfolio site’s aesthetic by putting your work right in front of them. This approach is typically used with minimalist sites, but it can work pretty much anywhere. Put a preview or two on the home page, or put the full portfolio there. If they’re already looking at your work, then the look of your site (and anything you might have to say about yourself, really) is incidental. Christopher Hall does this by showcasing his two major disciplines (furniture design and interior design) side by side, with no frills. Just look, and you get the idea. christopherhall Will Sanders does pretty much the same thing, only his photography is organized as a collage. The photos draw in the eye so quickly, it’s easy to forgive the inconveniently-orientated navigation. willsworld You may have noticed that Stefanie Bruekler’s portfolio from the last section could also easily be in this section. You can easily combine both approaches.

Conclusion

Sharp observers will note that these methods alone will not solve all of the issues I raised earlier. No matter how you choose your site’s aesthetic, accessibility and usability are on you. However, using these simpler approaches to the question can remove some of the temptation to go overboard. You’ll notice that these two approaches allow for a lot of variation and creativity. Still, you don’t need to limit yourself to them. If you end up with a trend-filled site, that’s great. If you invent a whole new kind of UI, I’m in (so long as it’s usable). If you’ve made these decisions with care, then I’ve done my job, here. Besides, I am curious to see what’s coming after this big asymmetry trend.

Ezequiel Bruni

Ezequiel Bruni is a web/​UX designer, blogger, and aspiring photographer living in Mexico. When he\‘s not up to his finely-chiselled ears in wire-frames and front-end code, or ranting about the same, he indulges in beer, pizza, fantasy novels, and stand-up comedy.

Read Next

3 Essential Design Trends, June 2023

This month we are focusing on three trends within a bigger website design trend – different navigation menu styles and …

15 Best New Fonts, May 2023

The choices you make when selecting a typeface have more impact on your design than almost any other decision, so it’s …

10+ Best Tools & Resources for Web Designers and Agencies (2023 updated)

Having the ability to envision a tastefully designed website (i.e., the role creativity plays) is important. But being …

20 Best New Websites, May 2023

This month, there are tons of great new agency websites to get excited about. 3D animated prisms are a popular theme, a…

How to Find the Right White Label Website Builder for Your Agency

Web design agencies face a lot of obstacles in closing the deal with new clients. One of the most common ones is the ar…

Exciting New Tools For Designers, May 2023

There are hundreds of new tools for designers and developers released each month. We sift through them all to bring you…

3 Essential Design Trends, May 2023

All three of the website design trends here mimic something bigger going on in the tech space, from a desire to have mo…

10 Best AI Tools for Web Designers (2023)

It’s time to stop worrying if AI is going to take your job and instead start using AI to expand the services you can of…

10 Best Marketing Agency Websites (Examples, Inspo, and Templates!)

Marketers are skilled in developing strategies, producing visual assets, writing text with high impact, and optimizing …

15 Best New Fonts, April 2023

Fonts are a designer’s best friend. They add personality to our designs and enable fine typography to elevate the quali…

20 Best New Websites, April 2023

In April’s edition, there’s a whole heap of large-scale, and even full-screen, video. Drone footage is back with a veng…

Exciting New Tools For Designers, April 2023

The AI revolution is having a huge impact on the types of products that are hitting the market, with almost every app b…