New Type of Redesign

When I normally think of redesigning a site, new color schemes and layouts are usually the first things that come to my mind. However, when I decided to spruce up the Blue Static website about a week ago, I wanted to pose myself a design challenge: I did not want to use anything but existing design elements to create my refreshed design.

To accomplish this redesign, the first thing I did was I found and isolated the elements and colors that I liked the most. Some people say that a good design starts out in black and white and then colors are added so that it’s color-agnostic. However, I find that when I’m designing–both for print and the web–if I don’t have a vague idea of the final color scheme, the design just won’t work. So I picked a few elements (namely the striped background and the navbar) to reuse all over the place. I then went to work on a design on paper.

Any good designer will start out on paper just to get a rough idea of how things should look. I have paper designs for Bugdar, Kalens (the demoed calendar product), and this website and the paper looks almost identical to the web version. Designing on paper is important because it allows you to visualize your design without having to write any code. Can you imagine creating an entire website and then scrapping it because you don’t like the way it looks?

I feel that whenever you are _re_designing something, you’re doing it because you did something wrong with the current design. Therefore, before I finalized the paper design, I decided to go through the old website and pick out elements I didn’t like and I made sure I addressed them in the final design. What didn’t I like about the old design? The navigation bar was far too large, so the new design cuts out about 80px of it; many of the banner images had a greenish color which really jarred with the blue, so now the images have all been hued to a more bluish tint; the text was too low-contrast, and so I changed the background to be white.

And when you look at the final design, those are really the only major changes. Everything else has just been ever-so-slightly lightened to make the design more welcoming (darker designs are generally harsher too look at).

Here’s the before-and-after shot: bluwww-redesign-dec06.png (172 KB)

So what’s to learn from this redesign?

1. Keep your design goals clear.

2. Do your layouts on paper first.

3. Don’t change things that don’t need to be changed.

On a side note, Bugdar 1.2.0 is coming along steadily as is ISSO3. I hope to have both of those finished by late April or early June.