How to start building a content-driven portfolio

Alexander Widua
Bootcamp
Published in
4 min readFeb 1, 2021

--

An illustration of a typewriter with a particular paragraph colored.

Building a portfolio from scratch can be a daunting task. You’re staring at a blank canvas and the first brush stroke is always the most difficult one to make. Maybe you look at portfolios of your colleagues for inspiration or you look at portfolio themes which you could use. But it’s a trap. It’s easy to get caught up in all the million ways your portfolio could look like or the thousand tools you could use to build your folio — but the design of your portfolio shouldn’t matter at the beginning.

The purpose of your portfolio design is to support your portfolio content. This in turn means that your content should dictate what your portfolio looks like.

Your content should dictate what your portfolio looks like.

Doing it the other way round and creating your portfolio design first, and adding content as an afterthought, is like choosing a canvas size and then decide what to paint. Sometimes it works out but you’re restricted in size and might have to make compromises to make everything fit. Just because your portfolio theme doesn’t allow you to put long text passages shouldn’t mean that you should ditch them.

Instead, consider a content-driven approach to portfolio building. This means that you should start with writing your content first. And to get started with writing, you need nothing more than a minimal text editor. That’s it! A compelling story can be told through words and images alone. Your story doesn’t need fancy image grids or fade-in transitions. That’s why writing your content in a text editor helps and constraints you to focus on what’s important and put all other layout shenanigans and distractions to the back of your mind.

Words by Justin Jackson.

Here’s the gameplan. Fire up your favorite text editor and create an outline for your first project. Talk about why you chose this project or participated in it. What’s the context? What is the problem of your project and why does it matter? Talk about the process and challenges you overcome. Finally, round it off with the learnings you took away from the project and show the final result and deliverables.

The first time you write down the project, you shouldn’t worry so much about articulating yourself well — it’s more about formulating your thoughts into words. If you need any image assets for your content, don’t spend too much time choosing or editing the right picture. Drag a bunch of them in there or put [placeholder brackets that describe the image you want to use].

After finishing the first draft of your project, put it to rest for some time and then come back and read through it again. Maybe now decide on what image you want to use or maybe compress the last two paragraphs a little bit more. Just like any of your design projects, your content will need a few iterations, but slowly and surely you’ll work your way up to your first finished portfolio ‘page’.

Using this content-first approach to portfolio building has two major advantages: For one, it helps you to focus fully on the content and get to the heart of your project’s story. For another, having an finished project page helps you to make an informed decision about what your portfolio should look like. If you have longer text passages, maybe it makes sense to use a two-column layout. If you want to show a series of prototypes, an image masonry grid could highlight them. Your finished project draft gives you a blueprint of the building blocks you need for your final portfolio design.

Choosing a text editor

Choosing the right text editor comes down to preference. Virtually any editor that can format text and process images can be used and I’d stick to something you feel comfortable in using. I personally use Notion for all my article and portfolio drafts because the minimal interface allows me to focus on the content. And because it’s online I can access it anywhere. Google Docs does the same job well and the built-in version history allows you to jump back and forth between your iterations. So make a pick and start punching in these words.

👋

--

--