Katarina’s website

5 min readFeb 20, 2023

December 2017

I had just discovered Industrial design and started to do some sketches. Alongside that, I created my first design project Dryr, was working on Creatr and started to write my first blog post (‘Why complexity is essential’). And then my brother suggested to create a website to host all of these and upcoming projects in order to share them with other people. So I created a mockup of what I wanted it to look like.

June 2018

I then learned the basics of html and CSS and after a lot of trial and error finally pushed. This screenshot is the only thing that remains from that first design.

March 2020

I noticed that my website was really outdated. I had created so many other things I’m really passionate about and just wanted to share them. I had also discovered product design a couple of months before that and really wanted to make sure that I could display all of my future projects from this field. So I created some mockups again, resulting in a more complex design at first.

After realizing that this design was too noisy for my taste, I created a cleaner version.

A weekend of coding and some nights of tweaks later: here is that version of my website.

June 2020

I decided to improve my website again. On a visual side my main goals were to refine the typography, emphasize the visuals more and create icons myself to establish one style across the entire site. Additionally, I tackled the “more” page. Not only did I want to find a better way to organize the content, I also wanted to make this page more visible as these many side projects were often overlooked.
These are some of the new key elements.

Press enter or click to view image in full size

November 2020

After taking a step back from my website for a couple of months, I had new refinement ideas for a visual refresh. So I sketched rough wireframes of the components and implemented the code within a couple of days.

Over the next few feeks, I kept tweaking minor details to perfect the font sizes, margins, colors and more. I removed the text in the projects tab and the buttons on the portfolio page to create a more minimalist look. I also increased margins to create more whitespace and added a back to top button and dates to the bottom of projects.

April 2021

As a product designer, I care about the user experience with digital products and my website is no different. I wasn’t fully content with with the experience of my website so I revised the layout to enable easier navigation, increase the visibility of all of my projects while highlighting my best work. I created a Figma file with my website designs (yay finally!) and a personal design system just for the fun of it.

After some tinkering, I came up with the visual design as a foundation for my code.

It was way overdue for me to create clearer and more adaptable code so I created my refined website from scratch.

Some nights and weekends of coding later, I was finally able to publish my new and improved design.

January 2022

I lost track of what I did there… ops. It was probably more updates.

September 2022

I mostly worked on portfolio posts and adding summary sections to the top.

February 2023

I changed the visuals to represent myself better and optimized the website experience — especially for viewing my portfolio and reading about projects. These are my Figma designs so they aren’t 100% accurate.