This website doesn't get redesigns often. I published the first version around 3 years ago, in March 2023. I didn't want to be that developer who spends 200 hours making a website to publish one post and forget about it, so I just put together something that looked decent and that was it. A year later I updated design slightly, but it was still pretty much the same website.
And it stayed without much changes for 2 years. I mean, I always wanted to make it better (isn't it a natural desire in anyone with personal project?). But it was working well enough for me to keep postponing it.
But finally, at the end of 2025 I decided it's time. And you can see the results already. So make yourself some tea and join me as I yap about design decisions, brag about cute components I made, and bitch about Figma.
Learning week
In the company I work for, there is a perk with rather unassuming name "Learning week". It's basically 5 paid days off which you can spend learning something adjacent to your job. Wonderful perk, if you ask me.
At this point I learn something new about software engineering constantly, even without active effort, so I didn't want to pick anything SWE-related for my learning week. All developers will be replaced by AI soon anyway, it's so over chat. My natural next pick was design.
As a responsible adult with unhealthy love for planning, I started with deciding what exactly I want to learn and writing a plan for those 5 days. I had a feeling that main limiter for me is lack of practice, rather than lack of theory, so I made sure to include plenty of practice in my learning week. For a topic I picked "Design systems".
It's quite adjacent to software development, as developers are often one of main consumers of design systems. And if I want to work on junction of engineering and design, knowing how to make a design system that looks good, works well, and is easy to implement and use surely is valuable. And I personally struggled with scaling design systems in response to project growth before, so this was a nice opportunity to learn some theory and get some practical skills that could help me in the future.
I included quite a bit of resources about design systems and Figma (another skill I wanted to improve), but biggest part of my learning week was a practice project. I wanted to pick something real, but not too big so I'll be able to ideally finish it in 5 days1. And that's when I remembered about this website. Finally, all puzzle pieces clicked together.
Previous designs and what I wanted to change
As I said, previous design was quite alright. I liked general direction and colors. Typography was quite good if I'm being modest. If you're here for the first time, here is a copy of the old website so you can take a look.
But there were couple of problems with that design. There was no system behind it, every time I added new component or implemented new layout I just tinkered with it until it looked good enough. Over time that led to a bunch of components that used similar colors and spacing, but still didn't feel like they fully belong together.
And this tinkering part often took significant time and felt like I'm just bruteforcing rather than making any decisions backed by logic. This led to another friction: when I had a cool idea for a post or page that would require custom component, I often postponed doing it or didn't do it at all because making this component was such a drag.
Another problem was a need to balance between my desire to do some weird, whimsical personal stuff on the website and my other desire to keep this website somewhat professional. I love when personal websites are really personal and not sterile bio written in 3rd person on white background.
And in recent years I had bigger and bigger desire to make my website more personal. I added /now page, but that wasn't enough, I wanted to publish posts unrelated to SWE (or tech at all), add weird widgets to the website, and give it more personality in general. But at the same time I wanted to keep it somewhat professional, so people who visited for React articles could find React articles and not guestbook, visitors counter, my 5 favorite soup recipes, and photos of my lunch in Tatras.
How it went
It went quite well actually!
I severely underestimated how long it will take, but it was quite obvious from the start that this will happen. 5 days was barely enough to read through selected articles, establish the foundation of the system, build basic components, and compose basic pages like main, about, posts index. I started working on components for posts (e.g. callout, note, etc.) and post page itself, but I still had to do quite a bit of adjustments to those after learning week. The whole personal layer (about it in a minute), and, of course, implementing the design system took place after my learning week ended as well.
From the side my average day during learning week didn't look too different from a work day. There was no secret technique (unfortunately!). I woke up as usual, made myself some coffee and sat on my computah for the next ~8 hours (sometimes more). The first couple of days I spent part of the day reading and watching materials I preselected, but by far most time was spent in Figma practicing.
And what can I tell ya, I don't like that software at all. I mean, I knew that even before the learning week. But I also know that it's de-facto standard in UI design, and I know many, many designers who both love it, and produce some of most stunning designs I have seen. So I wanted to give it another try, perhaps I held it wrong previously.
Well, that didn't really work out. I found Figma rather limiting in some aspects and cumbersome to use in others. As I mentioned, I know it does work for many people, but perhaps not for me. For wireframes, nothing beats pen and paper for me. And for high fidelity designs, I prefer to do those directly in code. Especially when it comes to components.
Some things are quicker to do in Figma, but while going through components and pages for new design I often found myself thinking that I could implement the same design directly in code in the same time or even quicker. Not everything, but all in all, code is just quicker (and less frustrating) for me. And as a bonus you spend much less time on implementing the design system, as you have almost everything built already.
I also gave a try to Figma MCP: connected it to Cursor and asked Claude Opus to implement new design. It worked okay. I still had to do quite a bit of steering, manual edits, and handholding, it was very, very far from "send Figma link to the agent and come back to fully implemented design". But I must admit even with that, implementation took less time than I'd need if I do everything by hand. I just had greater expectations ¯\_(ツ)_/¯.
Results
Finally, let's take a look at the results. I mean you're looking at the results for the last 5 minutes already. But now it's time for me to yap about them too.
New layout and components
To address the lack of freedom and flexibility, I started with changing the base layout of the website to a three-column layout. Multicolumn layouts are nothing new, but this particular decision was inspired by Yann-Edern's personal website (which looks cool, take a look yourself). Previous single column layout worked really nicely to focus attention on long blogposts, but outside of that it was boring. New layout gives me much more flexibility too: instead of one configuration I now have four. Moreover, I can mix and match those on the same page to make it even more visually engaging. For example, this page uses all 3 columns for post cover image to make it stand out, but blog post itself takes only two columns to keep line length manageable and free up right column for extra content like sidenotes.
Besides new layout, there are new pre-made components. So now I can implement more of my ideas and better convey what I want to convey without spending time to build components for it first. You already saw new sidenotes and commentary components. I wanted to make them for a long time and now I love them so much I need to restrain myself to not use them too much. Another long awaited addition is photo thumbnail/lightbox components. As an example, here it's used to display how Figma file with new designs looks like.
And of course a lot of existing components like buttons and callouts received new coat of paint too.
Personal layer
Although I very much like the whole project, this has to be my favorite part of it.
I mentioned that I wanted to make this website more personal, but still keep a somewhat professional look. Balancing is hard, so instead why not let user choose which version they want to get? I split this website into two layers: base one which is a bit more reserved and professional, and an optional opt-in personal layer on top. Mode switch is placed in the footer, but just because I like you, here, have another copy so you don't need to scroll all the way down and back.
When enabled, you'll see some additional elements that are hidden by default. Other elements can slightly change their styles. For example, when personal layer is enabled, asterisks in <hr /> are replaced with hedgehogs. What do you think 'h' in 'hr' stands for?
Isn't that cute? Apparently Wei Huang just found hedgehogs cute and included them in Work Sans (font used on this website) and I wholeheartedly agree.
In addition to some commentary, there are personal pages (like mentioned /now page) and personal posts (of which there are none, but I'm working on fixing this). Feel free to explore website with personal layer enabled and see if you can spot the differences.
I quite like this solution. First of all, because it gives me a pass on being as goofy as I want. But secondly, and more importantly, I think this makes the personal part of the website feel more intimate. When you find the switch and enable it, I want it to feel like you're going from stranger into closer circle. Of course switch is visible to anyone willing to scroll to the bottom of the page, so it's not some closed club just for a selected few. But the fact that you need to do mindful action to see the personal part of my website is enough to invoke that feeling. And because the personal layer often adds more meta and/or personalized commentary regarding topic, it makes the fourth wall crack a little. Or at least that was my intention, you tell me if it succeeded.
In the end
Even though I still have a couple of ideas, specifically for personal layer, I had to cut them from the scope because this project already took a lot of time. But even so, it was a joy to work on it. Well, maybe except some parts with Figma.
All in all, I think learning week is a wonderful perk. If your company offers something like that — take it. You might be surprised how much you can learn in just 5 days. If your company doesn't offer anything like that — I think it's worth doing it even in your own time, if you have something you're passionate about and want to improve.
It forces you to approach learning in more systematic way which might be annoying at first. It certainly was for me. I hated all hours I spent looking for materials on topics I was interested in and planning what exactly I'll do during the week. But in the end it was very much worth it and it allowed me to have a very productive learning week.
Spending whole week designing also reminded me how much I enjoy design. I mean I knew it already, I wouldn't pick it for my learning week otherwise. But without regular practice you tend to forget the feeling of joy you get from an activity, and so you start to do it less, that memory of joy becomes more distant, and poof, you're in negative feedback loop. Learning week was a nice way to break out of the loop for me.
I'm sure you have couple of activities like this yourself. Do you enjoy drawing but didn't do it for a long time? Making music? Sewing? Photography? Commit to learn and practice it for 5 (or 3, or 8, or 13) days and I'm sure you'll enjoy it and wonder why you didn't do it sooner.
Footnotes
I, in fact, did not finish it in 5 days.
↩
