Scroll down to see more

Portfolio Development

Portfolio Thumbnail shows landing page of portfolio website

Project

A fully responsive portfolio website created from scratch. This website uses next.js and directus to ensure fast load times by server-side rendering (SSR) and serving the most optimal media depending on the device and browser. Apart from a good performance, emphasis was also made on best practices and accessibility.

Used

Adobe XD
Next.js
React
Typescript

Date

2020

 

Portfolio Brainstorm

Inspiration

I gathered a collection of website/portfolio designs in the brainstorming phase.

Portfolio Adobe XD Design

Design

In Adobe XD, I created multiple iterations of the website design. In a second review, I chose the best design.

Portfolio Grid and Assets

Assets and Units

During the design phase, units were introduced and used for the layout. This simplifies the process of turning a design into code later on.

Portfolio live image

Result

The design from Adobe XD was translated into JSX and pure CSS.

Portfolio Audit

Website Audit

To ensure a good quality website the website was audited with Google Lighthouse during the development process.