Background
I am not a fan of web development
I used to be scared of web design and code, as I had bad experiences in uni trying to learn CSS and HTML.
After deciding a Figma proto presentation isn't going to cut it as a senior product designer, I pulled up my socks, bought a domain, and started tinkering around on Webflow directly. Sweating too many tiny details and getting stuck with bugs, I left it in a "this-will-do" state and put it on pause... for 3 years.
Collaborating with AI
Once I developed my skills, I redesigned this website in May 2026. I started tinkering around on Webflow before realizing it's better to go back to Figma and start from scratch.
At the time of design, Figma's browser plugin had just come out, and so did Claude's ("dangerous") Fable model. Finally, help had arrived.
I was curious what it would be like to use AI as a design partner. I connected Figma and Webflow's MCPs to Claude, and used it to grab styles from my design and implement them on Webflow. Setting up page layouts was fine, but for animations, the live clock, and design feedback, Claude was great.
I used the Fable for 2 days until it was banned, then I continued with Opus 4.8 for more complex tasks, and Sonnet 4.6 for basic questions. After a while, I got the hang of it and used Claude less and less.
Also, I finally know the difference between a div and a container.
Design
Typography
Designed using Manrope and PT Mono. Manrope is for headings, subheadings, body copy and whatever needs to be properly legible.
PT Mono is for smaller details like timestamps, little tags on each project, captions etc. liked the idea of giving more technical parts a monospace typeface.
Color
It's mostly black on a warm off-white, with one blue spot color. I wanted to keep things minimal, so the blue is used for hover states or emphasis. I just really, really like this blue.
