AvB Portfolio Redesign

My old portfolio fits its time well, but does a poor job conveying my current level of expertise. Not only was the content not updated in 5 years, but the branding no longer fitted, either. My implementation skills have grown further in the same time so I replaced the old wordpress front-end with a blazingly fast ReactJS front-end.

First things first, I updated my own branding. The multi-coloured flat style was refined into a minimalistic look, starting with the logo. The transition from flat and colourful to minimalistic represents creating more elegance through the removal of complexity.

The transition to the new logo creates elegant simplicity through the removal of complexity

The old logo was refined to become more minimalistic, essentially becoming no more than 3 lines. As a result the new logo is cleaner, more readable, and symbolic of the elegance of simplicity I aim to accomplish in all my designs.

Start with the Process

When it comes to User Experience the most important thing is the experience, of course! Before creating screens I stepped into the shoes of my target audience, represented by the persona of Hunting Harold. Hunting Harold is a professional recruiter. His goal is to find the right person for the job. In his search he wants to see qualifications(commonly found in a resumé), and examples of work that will wow him. To reach this goal he takes several steps that I modeled in a service blueprint.

The steps Hunting Harold takes, and how my site should fit to his goal

The thing Hunting Harold has the least of is time, so he places a premium on getting an impression fast. He also needs to add information into an HR system, so it benefits him to have the resumé in a file he can just import. Therefore my site contains my resumé as a PDF, both a version that is text-based and ideal for HR systems, as well as a graphical version more suited to impressing human eyes.

Design Mobile First

Nowadays people spend more time online on a mobile device than on a traditional desktop or laptop. As a consequence it is more important than ever to design Mobile First. It is quite possible Hunting Harold’s first visit to my site is on his phone, so I created a mobile design, keeping the process for Hunting Harold in mind.

The home page makes clear who I am and offers easy and clear navigation
The projects page slides open, showcasing my projects.
The project page, showing a brief description and then the whole story.


Over the last 5 years my implementation skills have taken a leap. For my new site I wanted the experience to feel buttery-smooth, like a good app on a mobile device. Navigation should be fluid and any loading should not feel disrupting.

To accomplish this I put a ReactJS front-end on my wordpress site. This allowed me to take complete control of the front-end and deliver that frictionless experience I am aiming for.