Design

I wanted something different for my self, something fresh, and idea was brewing in my head. I realized that what will make my website different from others will be is its colors and style.

So before i started drawing concepts on paper i had to decide what kind of webpage i was going for. A blog or a content driven webpage. After a small brainstorming session there was no doubt in my mind that a content driven webpage was the correct one to use.

• A blog is mainly categorized by a singe frequently updated feed of entries posted to a single page in reverse-chronological order.
• A content driven webpage can be described as a collection of theme categorized entries, and thats what i was going for.

This will reflect on the navigation and on the main layout of the webpage.

Here is the first sketch of the webpage layout

  

There are lots of neat designs out here for a content driven site. Like roskilde.dk and www.trafikstyrelsen.dk, sites that i had worked on in the past working for Webtop and Cabana A/S. They are both content driven and they had some structural quality's that i wanted to reflect in my site design. But i did't want the cooperative look and feel that they had, i wanted to create my own graphical footprint. Something that will differ from the rest of WWW out there. So i decided to base the design on a subject that is most dear to me.. and that is Doodling.

I love drawing small fast sketches,..cute ,..and not so cute monsters,.. industrial design,.. characters ,. you name it. It's allays fun.

I had a clear picture of what kind of navigational items i wanted, so i started drawing a monster for each one of them,.. Her is a scan of my monsters. If you are wondering why they are in blue inc, that's because when i doodle i don't use pens instead of pencils (c:

  

The next step was to choose a main pallet for the website. My main goal was to separate top-navigation and content and footer areas with color,  to get a clear separation of content. So i chose a neutral grayish color for top navigation background, and more potent colors for footer and content areas.
I wanted to give the content area the most potent color, to emphasize its import ans compared to other areas.

Now where i had defined all the base components i had to draw and color the rest.

So after I've scanned my monster sketches in to my computer, I've drawn out a vector for each one of them. It was a very time consuming task each monster consists of dusins of vector masks, but at the end i was pretty satisfied with my design.

So her is the final layout.

  

Each of the areas are separated by a wavy pattern which makes the transition from one area to another softer and more pleasing to the eye. Each monster in the top-navigation menu is designed in such manner so it will give the reader a hint of its' menu's content. I wanted to have a soft layout with a good contrast, so i am using round corners every-ware it's possible.

Now where the main design is done it is time to write the Front-end template for this webpage. It will only consist of HTML, Javscript and CSS.