Portfolio Landing Pages that Convert
Reading time: 4 minutes
Portfolios are an essential part of getting hired in the design profession.
And—portfolios are hard.
It’s hard to find time to work on them.
There’s conflicting advice and opinions on the “right way” to do them (hint: there’s no single right way).
It’s hard to stand out from the crowd.
And in today’s market where hiring managers, recruiters, or potential clients have little time and lots of portfolios to review…
You have a few seconds to hook the viewer or else…poof!
Have you seen hiring managers or other designers say something like that before?
I sure have.
“Here's my simple rule of thumb for job seeking: You have ~10 seconds before hiring managers bounce to another candidate or decide to take the next step with you.
"Next step" translates to roughly two things:
a) Spending more than 10 seconds on your resume, portfolio, or LinkedIn.
b) Contacting you directly.”
—Cameron Moll, VP Design at Buzzsprout
I can confirm it’s true based on my own experience hiring designers over the last 13 years.
Hiring managers are crunched for time.
There are often hundreds of portfolios to review.
You really do have just a few seconds to grab attention before they move on to the next one.
The first time a hiring manager or potential client sees your work is likely to be on the home page of your online portfolio.
So how can you make a great first impression on your portfolio landing page?
Here are 4 best practices to help you grab attention and increase the conversion rate of your online portfolio:
1. Clearly state what you do
Make it effortless for the user of the portfolio to tell exactly what you do.
Are you a Product Designer with 8 years of experience in healthcare and AI?
Are you a freelance UI & motion designer that specializes in iOS apps for small startups, large enterprises, and everything in between?
Are you a User Researcher?
Information Architect?
Make this obvious.
And removing fluff helps.
Being “passionate about designing beautiful and usable interfaces” doesn’t tell the hiring manager anything useful or help you stand out.
There’s no mistaking what kind of designer Katie Cooper is. And you quickly understand Katie’s experience level, what they’d be good at, and a bit of personality too.
Good introductions don’t capture everything about you as a person or a designer.
Instead, they should be brief and specific. They should help the viewer understand how you can help them. And they should position you for the type of work you want to get.
Would you be surprised if Katie’s next gig was a Sr. Product Design role in design systems?
2. Avoid visual red flags
Hiring managers have limited time. They have a long list of portfolios to review. They're looking for red flags that help them cross designers off the list so they can move on.
So don’t give them any easy reasons to say “next”.
Avoiding obvious mistakes is a good way to get someone to stick around a little longer.
These errors are easy to fix and unfortunately, common:
- Misaligned UI elements
- Broken images
- Blurry images
- Bad typography
- Poor contrast for links and buttons
I did a portfolio review with a designer that had a lot of misaligned UI elements.
I noticed these instantly. If I were reviewing thei portfolio for an open role I’d bail and move on to the next one.
Below on the left is a wireframe I created of this designer's portfolio landing page:
How many alignment issues can you find in the version on the left? They’re fixed in the version on the right.
3. Elevate your work
This might seem obvious, but people visit your portfolio to see your work.
So make this as easy as you possibly can.
The viewer should be able to see work right away on your home / landing page.
Common issues:
- Work is shown at awkward angles
- Have to scroll or click too see work
- The work seems “zoomed out” in project thumbnails. It’s small!
- The work is less prominent than other visual decoration. Like background effects, device mockups, or other elements that aren’t the actual work.
- Showing a logo or photo instead of the designer's work. Unless the project was designing the logo or taking photos, this approach makes it harder for the viewer to see what they came to see.
Justin Farrugia’s work stands out and invites the viewer to scroll down to see more. The app UI is also animated, making it even harder to leave before checking it out.
4. Make it easy to contact you
You want the portfolio reviewer to reach out to you. There are exceptions. Your portfolio may be more of a playground. Or you might not be looking for work.
But most of us want leads for new jobs or clients.
Whatever it is—don’t forget to UX your portfolio.
Make the action you want the portfolio viewer to take easy to find and easy to use.
This can be a visible contact button that leads to a simple form.
Or it can simply be your email address that can be copied quickly or clicked to open an email app.
Here are two examples that capture all four best practices:
You can tell immediately that Justien Lescouhhier is an Interior Architect (if you read Dutch). You immediately see work. And a contact button stands out in the top right—it’s all by itself and the only element on the screen with an outline around it.
We know right away that Tolu is a freelance Product Designer that’s available for new clients. You see work immediately, and a clear CTA shows Tolu’s email address at the very top. Super clean!