Ian Holden – Online Portfolio

This is the fourth iteration of my online portfolio website. It serves as a home for my blog posts and online projects.

  • Gatsby
  • React
  • WordPress
  • AWS
  • #ffffff
  • #f2f2f2
  • #a6a6a6

Design Decisions

I chose a monochromatic colour palette for this project. In my previous portfolio website designs, I have struggled to define a colour palette that can represent my ‘brand’. This project was no different. Because of this, I decided to use this struggle as a feature in this portfolio site’s design.

What is this portfolio trying to do? The primary objective is to show off my work! With this in mind, I realised that colour could be introduced by the project content. I use shades of grey for the portfolio’s primary and secondary colours and the project content adds the colour. For interactive content such as buttons and links, I have used colour to highlight these areas.

The site’s monochromatic colour scheme allows the coloured interactive sections to stand out to the user.

Content

I wanted to pay close attention to the the blog and project sections on this project. It was important that the content is legible and offered as few distractions as possible.

Blog and project pages have been designed with legibility in mind.

Pulling elements from my previous portfolio designs, music will always be a feature on my site. I have reintroduced song lyrics in the footer. Lyrics are a perfect way to show my love for music and also highlight the values that I hold in my work.

Tech Stack

This project became a playground for my development in building websites with Gatsby. Gatsby offers great website performance and user experience out of the box.

Gatsby also allows you to use a content management system to drive the data behind your site. This was helpful as I had previously built my websites with WordPress which meant that I could continue using the data in WordPress but I can remove and build my own bespoke frontend in React.

WordPress holds most of the content for the site.

Infrastructure

I use a local instance of WordPress to create the content before I generate the site and host it on Amazon S3.

I liked the idea of using WordPress locally as opposed to hosting it on a server as it adds a layer of security to the tech stack.

It was important to maintain low running costs on this project. The architecture of this project lends itself very well to this. My site does not require a server to run. All files are statically generated locally and hosted on an S3 bucket which gets served across Amazon’s CDN Cloudfront. This makes it very cost-effective to run!


© Ian Holden 2020

“I don’t want to live my life doing stuff I don’t like to do. I just want to spend my time on creating something true.” – Nikola Sarcevic