A while back I realised just changing a few colours and the mast image wasn’t enough for my blog anymore. So, I started working on a re-design of my site and made quite a few changes a short while ago. This has seen me through to the point I’m at right now, where I think a complete re-design from scratch is now necessary. { Latest Design at the end of this post }
So where do I start with this re-design?
I went right back to the beginning and asked myself a few important questions which would get me moving in the right direction before getting too bogged down with design.
What is the most important aspect of my site?
- Portfolio
- Services
- Call to action
- Social Network Links
What do I need to do different Graphically? How do I set myself apart, keeping with my own personality & style?
- Colour & Texture
- Graphically Rich
- Typographic treatment
How can I structure my site’s content more efficiently?
- Tabbed Content
- Highlighting Key site content in a hierarchical fashion
- Creating Focal Points
- More clear Divisions between content boxes
- Creating Layers of interest
Put together a list (using freemind to create a mindmap) covering everything currently on my site, and then adding those things I think are missing.
Following the list are a few sketches taking into account my elements and their hierarchical importance. The sketches below are very rough and only serve as a base from which to start. I was never going to solve the layout of my site through sketches alone and think this could be a bit restrictive intended to serve as …
Sketching it up
Wireframes
Wire framing on screen was the next step. It just makes sense establishing some of the layout before getting too caught up with graphics early on. Even if you do decide to change things later, you would have saved yourself at least a few hours of graphically changing the layout in your design programme.
Once I was happy enough with the general structure of my page I could now start playing with the colours and textures I wanted to work into the interface.
Getting Graphic
Now comes the fun part, and this is the part I love the most. To me this is more play than work in the beginning stages and I let myself go quite a bit here.
I start giving certain areas focus with colour and using some graphic elements.
In the early graphic stages I held onto a few older design elements from previous site designs but soon had to force myself to let go of these. Designing for yourself is the ultimate test of restraint and focus. I find I struggle to make even the smallest of decisions when designing anything for myself and I’m sure other designers out there can identify with me.
Going off on a graphical tangent
I realised early on in the Graphic development that colour was going to be a hard thing for me to deal with so I forced myself into throwing some colours around wildly.
Once you get into the design phase things can start getting complicated if you don’t restrain yourself, and being a bit of an illustrator I tend to like exploring visually rich interfaces. This can be a good thing and a bad thing and sometimes pulling in the reigns is necessary to keep things clean and uncluttered.
While I still want to keep things as visually rich as possible I know I need to give certain elements and page areas more focus than others. Currently I’m fine tuning this mock-up and planning for a few styles in the content.
Typography
Being a fan of sans-serif fonts I’ve decided to challenge myself in that regard and see how I can make use of a nice serif in the headlines and key areas. So far I like what I’m seeing, but have a few more elements I’ve been neglecting and am not done with the simplification process. I prefer to simplify from a more detailed design than the other way around so I throw alot into my designs and whittle away at it until I feel I have the right mixture.
Getting it back on track
Once I had reached a comfortable enough point with respect to the graphics of the page I decided to do an assessment of how I had implemented my requirements and what needed to be changed.
Due to projects on the go and planning of other business areas this site will probably take a few more weeks before go live.
I’d like to know what you all think of my design and what criticism or feedback you might have.
I’ve highlighted a few areas I now need to work on tweaking which I will spend about a week on in between my mammoth task list so bear with me.
Some areas which I thought needed work were:
- Portfolio – Needs better highlighting and needs to display slide-shows or randomly generated screen.
- Services Highlight Box – I need to put a call to action or a little intro to my services somewhere above the fold with a similar priority to my portfolio.
- Hire me call to action – Maybe in combination with my services call to action something which says hire me.
- clear description of what this site is – not sure if the first time visitor will understand at a glance what this site is about.
- Typography – typography needs to be cleaner, better spaced and more organized in certain areas. I need to minimize font sizes and colours and keep font differences meaningful.
- Colour Balances – Still working on cutting down the amount of bright colours so key areas have more focus. Need to get the focal hierarchy just right.
- White Space – breathing room is a problem at the moment. elements need their own space to live and be clearly legible while not being interfered with.
- Alignment – certain elements need to be pulled back into the loose grid and others which break out of the grid need to maintain the balance.
- Usage of icons – I need to decide whether I will use icons or not, and if so which areas deserve icons.
- Textures need to be minimized and graphical elements simplified as far as possible.
- Style layer needs polishing – finally the edges and finer details need pixel polishing and this will be the last task.
Ptah Dunbar says
whoa, awesome design! It’s cool to see how it evolved though, can’t wait to see it!
Daniel Lurie says
I think the new design is superb. go live already! 🙂
Nomad says
Thanks for the compliments guys, should be going live in the next few weeks after a few bits have been added, removed and tweaked. I’m still in the process of figuring out some of the other page templates as well but will go live with a standard template and then build on that.
Keep in touch