Just launched my new site

After more than two years, I jumped once again on the redesign train. Today, I’ve published my new, redesigned and coded-from-scratch website. While the visual changes might be obvious, the whole structure under the hood changed as well, allowing me to quickly publish new content and serve up blazing fast pages to the steadily growing crowd of monthly visitors.

New design

I started by collecting some inspiration. Drawing the first wireframes back on February, I created a mood board containing more than 100 website screenshots, photos and code snippets of things I liked about other portfolio sites, magazines, photography and copywriting. I was finally able to completely redesign my site in June.

Goals

1. My new site should tell a little bit more about me than the current one. Potential clients keep asking me basic things like, “What have you done before? Have you worked with a client from industry X before? Have you ever designed for this device?” Those are questions that a personal site and portfolio should answer so the client will not need to contact me.
2. A fresh look. My personal style has evolved over the past two years.
3. Professional copywriting. I’ve always written my own copy for all pages of my site, which has resulted in amateur-style designer speech. Of course, I will keep writing my own blog posts and some basic copy (e.g., for the work sub pages), but I wanted something professional for the main pages.
4. An updated portfolio with my latest work.

New code

I once again seriously underestimated the amount of time I would need to build a really great website that works on all possible resolutions, devices and pixel densities.

Goals

1. Completely rewrite anything. Don’t repeat the same mistake like I did the last time when I did a redesign, when I just fixed the new code on the old one without generally refactoring.
2. Responsive and full retina support.
3. A more flexible development environment, an easier way to publish new content without losing control and automatic deployment from the master branch.

CMS

Nope. I researched this a lot, but somehow, all existing solutions were either missing some important feature or are simply too much for a site like this (I’m looking at you, Wordpress). I was really hoping to use Anchor 1.0, but unfortunately it’s not done yet and the idiot who’s building it seems to be busy with other things.

What I did instead is a self-build “semi”-CMS: flat content containing files, a few template helpers and some basic functions for routing and providing the correct assets.

Development environment

For a project of this scale, a great environment for development is a real time-saver. Grunt is now watching my files, and a few plugins are automatically compiling my LESS code, automatically prefixing the CSS, and minifying and validating the JS as well as compressing PNGs and JPGs.

There’s no more uploading changed files manually via FTP. Development of new features happens on feature branches that are merged into staging once completed. Staging is automatically pushed to a testing domain, and commits on master are automatically deployed at the live site.

What’s next?

I’m planning to be a bit more active on my blog. I’m currently working on a massive improvement of the iOS Design Cheat Sheet that will evolve into a real design documentation and on my first ebook: “Mastering Design with Sketch”.