Saturday, 17 March 2012

Layout ideas

Now that I have my logo and have decided what pages my site will feature, it is time to start looking at layout ideas. Here I have drawn up two basic wireframes showing the possible layout structure of my website. The one on the left shows the navigation attached to the content section, this was formed of an idea I saw on another website where they used what looked like tabs coming out of the content as navigation, the content section on this design is made to stay the same size and is to be fitted with a scroll box or similar to hold the content section at the right height, the header and footer navigation are separate from the content box. On the right hand side you can see my design where the content box is not restricted to a certain height, in this idea the content box is as long as it need to be, the footer navigation is at the bottom on the page and may be attached depending on how long the content is, the side navigation is separate and so is the header.



After drawing these up I did some sketches which you can find in my book and these developed into mock ups which you can see below.

This design is strongly based on the wireframe on the right hand side above, the navigation on the left is separate from the content box and matches the design of my logo, the footer navigation at the bottom also matches the rainbow colours and the background is a neutral polkadot pattern to give texture but not over power and this colour is also very gender neutral which is good for a site that needs to cater for both sexes. 

This is the same design but with a tab like navigation which has come from the first wireframe above. I made this change as I though the navigation in the first mock up looked too clunky and out of place.

This design is based strongly on the first wireframe I made, this design has a strong, interesting background with the scroll box content to hold the page at the right size and the tap navigation on the left hand side. I prefer this design to the one above, however I will pitch all three to my client and see which they prefer. 




No comments:

Post a Comment