March 31, 2016 - No Comments!

Website Redesign – Part 1

James Stiff Website: Screenshot

Well, I’ve been freelance now for just over three weeks so I thought it would probably be a good idea to give this humble website a bit of an overhaul.

The current site has seen some iteration. It’s gone from WordPress to Jekyll and back to WordPress (a long story), but it is essentially the same temporary placeholder I hastily knocked together four years ago. In a classic case of cobbler’s children having no shoes, I’m slightly ashamed to admit that I ended up using a free theme running on a self-hosted installation of WordPress.

The brief

I’ll keep it fairly simple: Design a website that communicates my skills and services, acts as a showcase for my work and provides a way for potential clients to get in touch. I’d like to keep the blog too please. Thanks.

I’m going to attempt to document the process as best I can. I should warn you though, the process might not be pretty. Since I’m going to be my own client, I’ll be cutting lots of corners and taking shortcuts that I wouldn’t dream of on a proper, paying gig.

Sketches

I quickly sketch out a rough sitemap and wireframes for the Homepage. A couple of points worth mentioning:

  • I’d usually wireframe the entire site for the benefit of a paying client but I’m not paying myself, so tough.
  • You’ll notice they’re really messy and barely legible. See the previous point.

Sitemap and Sketch

Homepage Wireframes

Moving swiftly on.

Initial concepts

Having amazed myself with awesome pencil skills, I fire up Photoshop and start on initial homepage concepts.

Homepage Initial Concept 01

According to my ever-diplomatic wife, my first effort sucks. The white space is fighting with the content. I’m sure there are some other words said but I’ve glazed over. Removing the content boxes and going full bleed seems to help matters.

Homepage Initial Concept 02

At this point, I decide to down tools and take the kids to the park. I’ll sleep on the second attempt and review it with fresh eyes.

Published by: stiffy in Blog

Comments are closed.