Finding the Perfect UX Portfolio Website

How I went through 3 weeks of fuckery so you don’t have to

Chris Rusnak
Chris Rusnak — Experience Designer

--

2021 Update

Website builders have come a long way since 2019, and so have I.

I’ve sprinkled some notes into the article with some updates from the future 👀 as well as a note at the end on how my portfolio has progressed into 2021!

TLDR; here are the website programs I tested:

Wix, Squarespace, Dreamweaver, RapidWeaver, Webflow, Canva, Universe, Uxfol.io, Tilda, Sketch, Tumblr, Instagram, Sparkle, Weelbly, Simpl, Adobe Spark and Wordpress.

Introduction

So here’s the thing, these days you need some sort of website, space, or feed to publish your content.

As a designer you need to create content in a variety of formats; videos, documents, long form posts (case studies) and images. Lots and lots of images.

There are places I would say that are common, or the best place to publish individual types of content; for example, small photos and short videos are great on instagram, or dribble, or bechance. Case studies, especially in UX, have moved over to Medium.

I needed a website that could act as a hub for all my different content. I didn’t want to have to pull my posts off medium, or my photos off instagram. I also needed a way to bring people on my website back to these platforms. The great thing about medium and instagram is that they are social. So you get feedback, reach a large audience and can update content quickly and easily from an app in a way that doesn’t disrupt my current workflow.

Also as a designer, I’m particular as fuck with what it looks like, and the experience you have using the website.

My criteria:

  • Import content from instagram and medium or
  • Display a content feed of instagram and medium, that I can curate on the website
  • Nice templates that I can customise
  • Responsive
  • Works well on desktop and mobile
  • Not hard to use

The Big Two

The main two website builders that have been heavily publicised in the last couple of years are Squarespace Inc. and Wix. I don’t think I can go more than 20 minutes on Youtube without seeing ads for both.

Made to be an easy solution to getting your website up and running quickly, I thought they’d be great options for building a website.

Squarespace

I initially started with Squarespace, because it’s in my mind the more “designer friendly” of the two, with lovely looking website templates and a super chique interface.

What they don’t say:

Dieter Rams said; Good design is as little design as possible.

Basic.

Squarespace’s team interpreted this as giving people very few options for customisation. I wasn’t able to import my medium case studies, and would essentially have to rewrite every single case study from scratch.

Not okay.

The way that it handles linking to other sites just didn’t[t work for me either. A link get’s presented differently to say an instagram post; and there are very few options for adding new content like an image carousel etc, without completely changing the website.

Verdict: Pretty, but basic. Shallow and surface level.

Wix

I’d heard about Wix’s plugins, which gave me hope that I could have a bit of a better experience there. There are a lot more templates to choose from (Although not as nice as Squarespace’s), however, they appear to be somewhat more customisable.

The built in set of tools like menu bars, carousels and feeds are quite nice too.

What they don’t tell you:

Tacky.

Customisation beyond anything like changing the colour and potentially the number of items displayed requires HTML and CSS coding, not something I want to get into for something so basic.

Spending 2 hours just adjusting the size of a tab button is not okay. Or trying to link a carousel object to my Linkedin.

Also the interface of the builder, plus the websites it creates are buggy as fuck.

Big fat nope from me.

What About Some Apps?

There are a whole slew of mobile apps that have been developed to take the hassle out of creating a website, make an website in two steps, right on your phone!

Sounds too good to be true.

Universe

I actually love this app; if you’ve got a simple website in mind, no frills, no nothing. Use this.

Actually love it.

Really smart concept, good execution, super powerful if you want to get into HTML.

What they don’t tell you;

There’s near to no support or documentation for this app, I feel like I could get what I wanted from this, however, I would need to teach myself some pretty heavy HTML/Java/CSS, which I am not ready for yet.

Any sort of feed would require me to write the code for it myself.

The app also creates websites that are very mobile centric, which can be great, but not what I’m looking for.

Thank u next.

Simpl.

I’m not going to spend much time on this one.

#basic.

Adobe Spark Page

I have a love hate relationship with Adobe Spark products.

I’ve used spark page and spark video to create small, single use products and posts.

What they don’t tell you

  • It’s slowwwww
  • Can’t customise anything beyond preset themes
  • No GIF support
  • No domain hosting
  • Single page of text does not a good website make.
Really bare bones interface, it is good, but not what I need.

Okay, so What About a Web Builder?

Webflow

Webflow is beautiful. Im just going to put it out there.

You want a gorgeous website with absolute control over the type, colours, layout and even animations, down to the pixel and bezier curve, this is for you. I wish I had a few weeks to learn it, maybe I’ll look back into it in a while.

Why didn’t I pick this one?

I think to be honest, I was just quite overwhelmed.

The inner interaction designer in me is screaming.

There’s just SO much to customise, and I didn’t at that stage have in my head the exact idea of what I wanted my website to be or do. I could spend weeks perfecting a single animation, and while that is amazing and everything that i want, it’s not what I need right now.

It also, so unfortunately, doesn’t come with a desktop app. Web interfaces are fine if your web works, but mine does not.

Let’s park this one for the moment.

2021 Update

Whelp. I came back to it. And?

Webflow 👏 is 👏 freaking 👏 amazing.

For anyone looking to get started with Webflow, check out their 21 day portfolio design course — it’s free, plus you end up with a website you built, yourself!

Ok back to 2019…

What About Desktop Website Builders?

Dreamweaver

This one went straight in the too hard basket.

RapidWeaver & Sparkle

Played around with them for a little while; here’s my take.

  • Great customisation, very familiar interface, love love love.
  • No support for feed integration with medium however.
  • Plus no integrated hosting, so I would have to set that all up myself.

Maybe I’m thinking into this too much

What About Some Sort of Social Platform?

UXFolio

It’s literally built for UX’ers.

Uxfolio is a great platform actually, I’m not really sure what to compare it to, but essentially it makes it really easy to write up case studies, gives you great tools to help present your work really nicely, and requires relatively little setup.

It does however, not allow much in the way of theming, and again, no integration with instagram or medium. If I was starting from scratch, might consider this an option.

There’s also no option for linking your own domain name.

Behance

Great for my existing projects, which were all from industrial design. However, I don’t like writing case studies on it, and there’s no option to bring them in from another platform.

Adobe Portfolio

If you’ve got a Behance page, I would highly recommend checking this out. Imports your existing feed of case studies into a nicely themed website.

So close to what I want. Just use medium and Instagram please.

Instagram

Linking in instagram

I have used instagram before for my work, great social media platform and amazing for sharing visuals and reaching large audiences, however, there are no ways to link to other content (that I have found anyway, without requiring a hell of a lot of backend work to hack a shopify account into it)

But it is a great way to share small interactions.

Can’t share case studies though.

Tumblr

Tumblr is great because it allows for the posting of many different types of content from a variety of sources. It’s also got a ton of support and heaps of free and paid themes that you can take advantage of.

Unfortunately, I didn’t like the way it handled links to my medium posts, and I can’t find a way to embed stories.

What I ended up with was a clunky mess of pop up windows and tabs.

Not ideal.

During my time researching, I came across this portfolio builder which looked absolutely awesome. Let’s talk about it for a second.

Semplice

This looks badass, the website is schmick and the fact that Google, Fjord and all these high profile companies use it! I must give it a crack!

How could I not be convinced!

What they don’t tell you

This is essentially a glorified Wordpress theme. Not only do you now have to install and host your own wordpress website, you have to use not one but TWO clunky interfaces to set up your content.

Also it used to but no longer supports medium integration.

I swear I must have spent about 4 hours trying to set up a single page to appear in the nav bar.

Not ideal.

There goes $200.

What can we take from this.

We have an overarching theme of the ability to customise specific parameters, without being overwhelmed with choice.

Also, not a single platform integrated very well with medium.

Occhams razor would suggest that the simplest thing to do would be to turn medium into my website.

So that’s what I did.

How I made a website out of Medium.

Now there’s two sides to Medium, one for posting personal content, and another side in which you publish content under a brand or marketing name.

I’ll be using both.

Looks like a regular website doesn't it?

Setting up a publisher page is super easy; and allows you to set your own custom name, add writers if you want more than one person’s content (Great for sharing team’s stories) and even categorising stories into different tabs which act as pages of a website.

Not so shameless plug.

Medium, since it is the host platform, integrates surprisingly well with itself; and for my instagram posts it does some super hot embedding magic, so I can include my images and give them the love they deserve.

← — — That’s what embedded posts look like.

Downsides? Sure. It has some.

I swear I had seen Medium publishers that used their own domain names. Unfortunately, this feature has since been removed.

sheit.

I felt so badass.

But ninja Chris wasn’t going to let that stop us! Since I already have a domain name registered, I did some fancy HTML coding to automatically redirect visitors from my website to my new Medium home.

import wixLocation from ‘wis-location’;

$w.onReady(function () {

wixLocation.to(“http://www.medium.com/interactiondesignunicorn”);

})

(The code for anyone interested)

So that’s it! That’s the story of how I went through 3 weeks of relentless heartbreak, letdowns and shitshows so that you don’t have to.

2021 Update

Since I wrote this article back in early 2019, a lot’s changed. I’ve been working hard as an Experience Design consultant at Ogilvy, working on some great projects. At the same time, website builders and design tools have evolved.

I went back through this article, and gave each one of these tools a go.

Webflow has matured significantly as a program, and is, in many cases, more powerful than pure code. So I gave it a crack, building my own website portfolio — check it out below!

I also haven’t left Medium — I still believe it’s the best platform for case studies, which is why I still post case studies here.

Post your portfolios in the comments below, and I’ll see you again in 2024!

--

--