I redesigned (again), for more than a few reasons. I was happy with v2, but not nearly satisfied enough.
Posted under
Comments
Related Entries
Thinking for a LivingThe new Thinking for a Living site has jumped to one of my favorite destination points on the web, bringing a new standard to interaction design.
Typographic MapsDetailed typographic maps showing street level detail using nothing but type.
Is “Cleaner” More Usable?The age old debate of aesthetics vs usability. In particular, if a cleaner site actually equals better usability through user experience.
Say Hello v3
Jan 10, 2010
Initials sketches for the new layout
Well, version 2 of this site lasted an entire five months. It wasn’t in the plans to redesign so quickly, but a quick burst of ideas struck me one night and I ran with it. I was happy with v2, but not nearly satisfied enough. I tend to tweak habitually, but this time I took a new approach and started to plan accordingly.
To realign or redesign
This surely isn’t a simple realignment and I intended it that way. One of the problems I saw with v2 was that it lacked key points of interest, namely dedicated “About” and “Contact” page. Since this site started out primarily as a personal portfolio site, these areas were admittedly lacking.
I also needed to do a little in-house cleaning. The last design had a lot of lingering WP code from v1 of this site, so I decided I should start with a fresh WP install and re-write most of the custom functions used here. Scrapping my old database wasn’t what I initially wanted to do, but I thought it would be better in the long run.
Type, spacing & color
The most obvious design change was switching from a darker layout to a lighter layout. A lighter layout allows this layout to “breathe” a bit more. A tint of purple to highlight links contrast well against the background, not to mention tying in my new logo identity (more on that below). I also utilized a much more efficient grid structure, where I customized each page accordingly instead of sticking to a single templated look. I paid extra attention to the details, efficient levels of whitespace and clean, solid lines throughout. Perhaps my new favorite look is how I designed the new Notebook pages, and how they are laid out now. This new site structure, I believe helps the site flow much better than it had previously.
It’s no secret that my favorite designers exemplify superb typographic ability. I wanted to express my passion for type by releasing a new typographic logo, set in the beautiful FF Din. After toying with a few different type combination’s for the body copy, I decided to mix the cleanliness of Helvetica Neue/Arial along with the elegance of capped Hoefler Text/Georgia for headers. My ultimate focus is to improve the site’s interface and readability with what you could call “standard” typeface choices, but I believe they do the best job to fit the content.
Last thoughts
I wanted a design that I could stick with for years down the line and I’m proud of the results thus far. Not only is this design significantly cleaner in my opinion, but the code has its fat trimmed significantly, making it more efficient and easier to update/tweak for the future … a design habit that I have gratefully fallen victim to in this circumstance.
2 comments
Feb 1, 2010 at 6:43 pm
Eric
David, you’ve done a great job with the redesign. As I write this, I realize my only critique, if I may, is the heavy font-weight on the input areas of your comments/contact forms.
Feb 2, 2010 at 1:12 am
David Trang
Hi Eric, agreed re: bold font-weight and it was something I overlooked as I tend to do with form fields (especially my own!). Thanks for your comment and input.