INTRO + OLD SITE


As most designers will be able to tell you, old designs get pretty dull pretty quickly. Looking at the same design day in day out is not particularly exciting. So with this as my main reason I set about on a redesign of the site. This was however not my only reason for a redesign and the others will become more apparent throughout this article.

So, to your right you can see the old design. If you are a regular visitor you will know it well. I personally don't see anything wrong with the layout of this design however it was just getting old. It was also a technical nightmare that had been put together by myself when I was still uncomfortable with most web techniques that are pretty standard now. Since developing the old design my skills have increased and I have learnt a lot about HTML and how to put a site together properly, so this was what I set out to do with the new design.

 
 
Old site design - Home page + Profiles page


 
 


STAGE ONE - SKETCHES

The first thing I did was sit down with a notepad and write out what I wanted to have as sections. I looked through the old site and decided what sucked and what was cool and kicked out the stuff that sucked or was unnecessary. I then started sketching some possible ideas for layouts and tried to work out how the information would be displayed.

As Design is Kinky is a content based site I decided that there was no real need to have huge graphics or for the site to be overly designed. I wanted it to be simple to get around, quick to load but also funky looking.

 
 
One of the Notepad sketches I made

 
 
 


STAGE TWO - DESIGN

So after sorting out how the site was going to work I opened up Photoshop and started to play. One thing that tends to happen when I design is that, by some fluke, the first layout usually turns out to be the best one and this was the case in this instance.

I thought that the traditional top based navigation would be our best bet and I still liked the way the information was layed out on the old Home page design (links and news on the right and section highlights middle left) so I used this as a guide.

The style of the top graphic with the DiK logo is one that I have been playing around with a lot lately and therefore I tried to incorporate it into the top nav without it taking away from the functionality of the layout. I have always loved the look of thumbnails and especially randomly cropped ones so I decided to use them to highlight the latest happenings in the sections. This section has been setup to be easily rearrangable so that any section can be highlighted or taken off depending on what is happening with it.

I then extended the top corner design into the bottom bar that has been used to frame the design to keep it tight and simple. The links and rollovers and other elements have all been kept deliberately simple as after all they are just navigational elements.

 
 
The new Home page

 
 
 


STAGE THREE - DEVELOPMENT

As I mentioned above, one of the main reasons I wanted to redesign the site is that the development of the old one was downright horrible. I had absolutely no idea what I was doing and although I am by no means an expert now I have learnt quite a bit since then. So I set about developing the redesign properly so as to make my life much easier when updating and therefore allow for more frequent updates and enhancements.

My tool of choice for this was Dreamweaver which I had previously only used briefly. I know wonder how I lived without it.

The site is set out fairly basically only using frames on the Home page and using table structures throughout to arrange the layout. Nothing overly technical is used although I have started using CSS which is pretty wicked and has made my life much easier.

So that is the creative and technical process that went into the new Design is Kinky. We hope you like it and welcome your feedback. The next one will be even better!

 

 
 
New Profile page