Tuesday 29 October 2013

OUGD504- Studio Workshop 3

Todays workshop focused on the function of a website, in particular the navigational elements.


In groups we had to make a list of common/uncommon navigational methods we have seen on websites:


We discussed our findings with the class. This gave me a better understanding of usability and the options available that could be applied to my design.



Next we had to write a flow diagram based on the content of my site. I was thinking it could get annoying having to go back to the homepage after every section so Im still not sure if the pages need to link together .



Next we had to deconstruct the homepage designs we had sourced by drawing grids on them to see the structure of the design.




The website above is minimal and extremely functional. It uses a three column grid to organise the content into the centre of the page. This maximises space and allows the eye to time to digest. The use of colour helps in breaking the information up into three sections which makes it really easy to navigate. I really like the overall design of this site. I want to use bright colours and flat design in my website so this is a good reference.



This site uses a similar layout to above. The content is split into three columns and centred. The links are at the top of the page which is really easy to navigate. I don't like how the contact information is on either side of the page displayed vertically so you have to tilt your head to read it.  



This page uses a 5 column grid with the logo centred at the top. The main links are under the logo which then leads the eye down to the five sub-categories. This site is more visual so the pictures work as links which is a technique I think works well. One section of my site is going to be design examples so this could be a good way to organise the content.



This layout uses a  mathematical equation to organise the content. The links are at the top right hand corner and it uses colour to distinguish the different link topics e.g orange is for the social networks. The overlapping images creates depth which is a technique I could incorporate into my designs to communicate the ideas of perception. 



This layout uses a nine column grid with the content evenly spaced. The navigation is at the top of the page and uses a search bar and drop down menu. Its pretty basic and very functional but I feel lacks impact. However the alternation of the size of circles creates a balanced layout. 

To summarise, similarities with every site are the display of links at the top of the page with a logo. I initially wanted to have my links at the bottom so I may need to re-think this when I come to designing my site.

No comments:

Post a Comment