New website
Sep 28, 2020 · Tags: Design intent, Webdesign
Redesigning your online portfolio is an anxiety-inducing task for every designer. Your website is usually the first thing potential employers (or in my case: clients) see when they look you up. You want to make a great first impression—and LinkedIn and various self-improvement experts will happily provide bullshit opinions on how to achieve a great first impression. (By the way, reading this advice-garbage is the fastest route to severe depression... or blind rage.)
After the first 1000 drafts and lots of over-thinking, I decided to keep this as simple as possible. Let's have a look at what decisions drove the new design.
Content
Content is a tough challenge. Entering the world of design consulting and innovation, you are not allowed to talk about your most relevant projects anymore.
The last commercial project I'm allowed to share is four years old. That leaves me with old or experimental projects to show on my portfolio.
Looking at the categories of previous projects, I realized that I worked across all design fields from Graphic Design all the way to Speculative Design and Bio Design. How do you convey that to potential clients who are only looking for a specific aspect of your work?
There are three options to deal with this:
- You only show the work that pays the bills and is trendy right now
- You show everything and risk to be seen as the jack of all trades
- You don't show projects at all
My first instinct is always to show less stuff and be the cool kid who only writes bullshit self-improvement and design leadership advice.
Unfortunately, I'm not that guy.
Furthermore, it proved to be incredibly useful in all conversations with potential clients to point at example projects even if they are older or experimental. I can't count the times I pulled up my website to show stuff quickly.
But one problem remains: Do you show all projects, or do you only show work of one specific category?
To make it short: I cheated a little bit. I decided to create two websites.
The first one is my personal website (yes, this one!). This site is like a catalog of projects and thoughts for my own reference (you might call it a digital garden). With the redesign, I decided to show more projects even if there is plenty of things I would do differently now. Ultimately, it allows me to brag about projects I did before it was cool (like this AR work from 2011) and show experiments in progress.
The second website will be a studio website (stay tuned) that allows me to talk more about my services as a designer with a commercial focus.
Principles and their implementation
With a concept for the content fixed, we can have a look at the design principles. These principles are mainly based on what I value as a user of other websites.
-
Speed matters
Content should load as fast as possible. A lot of websites are good looking but incredibly slow to load. This site should feel fast. -
Simplicity is key
My previous websites all had a focus on aesthetics (I'm a designer after all.) But for this iteration, I tried to keep the visual overhead as low as possible. There won't be any fancy color schemes and cool animations, and the site should still be usable even if you turn off custom fonts and scripts. The site structure reflects the simplicity aspect, too: There is only one navigation layer (it's only projects & journal for now.) -
Let's keep it familial
Instead of using publishing services like Medium or LinkedIn, I'd rather host my own content, accepting the risk of a small (or no) audience. -
Clear sender
It should be easy to reach me. My email address is everywhere in case you want to comment on anything. Instead of the main navigation, visitors see an email address and a link to my newsletter in the header area.
As with every principle, there might be limitations. For example, I haven't found a good way to include videos. Most of them are hosted externally, violating the principles 1 and 3. Let me know if you have a suggestion!
Inspiration
No design is ever developed in a vacuum. Here are three websites that heavily inspired my thinking about the redesign:
Jure Martinec's website
I love the simplicity, and the use of footnotes gives his site a pretty sophisticated look even though there isn't much content.
Solar-powered version of the low tech magazine
This site is optimized for extreme energy efficiency with dithered images and standard fonts. They even have an interesting write-up of their design approach.
100 rabbits' digital garden
What's not to love about them!? A nomadic studio on a sailboat, with a super clean and approachable website.
Technical aspects (the nerdy stuff)
Previously, I used Kirby as CMS. With the relaunch, I wanted to have a static site generator, and since I started to learn Rust, I went for Zola this time. The idea is that I'd be able to contribute to Zola's code as my knowledge of Rust deepens—although I might be a bit optimistic.
Every path (home/, projects/, journal/) has its own emoji as favicon. This works because of Lea Verou's cool idea to exploit SVG favicons.
Eventually, it will be possible to print articles directly with a nice layout to generate email-friendly PDFs.
What's next?
That concludes this overview of the relaunch. I'm sure there will be a need to adapt the layout as the site grows, but for now, I'll focus on the content (and the studio site.)