Colour Theory

Complementary- a colour that is opposite to another colour on the colour wheel, so both are very different.

Monochromatic-  comes from a single base colour, and is extended using shades tones and tints. Tints are achieved by creating white and black to the colours making them darker or lighter.

Multi- coloured- lots of different colours that may contrast between one another.

This is an example of a website using a complimentary colour scheme. The logo of the shop is orange and the discount banner below is blue. Both these colours are on opposite sides of the colour wheel which makes both colours stand out.

This is an example of a monochromatic colour scheme on a website. There is 3 different shades of pink, from light to dark. Using this colour scheme is very simple but still effective. It makes the white and black font stand out from the pale coloured backgrounds.

This is an example of a multi-coloured website.  It has over 6 different colours on it. This can be a very effective colour scheme because it spots the viewers attention as soon as they go onto the page, using multi-colours also makes it look fun and exciting.

Experimentation with Colour Samples

Here are 5 examples of colours that came to mind when i heard a certain word. They are all using the colour schemes: complementary, monochromatic and multi-coloured.

The effect i was hoping to achieve with this colour sample is monochromatic. The reason why i did this because as the red shade gets lighter it might show someone getting more angry as time goes on.

 

I would say that this colour scheme is a complementary colour scheme. This is because even though all the colours are different, the are all pastel colours with compliment each other.

 

I would say that this colour scheme is complementary as the two main colours used are opposite on the colour wheel. I have chose these colours because yellows/ oranges remind me of the sun and sand and blues remind me of the sea.

This is a monochromatic colour scheme. A black or darker colour has been used each time to make the shade a darker coloured blue. I chose to do the colour blue because cold/ snow and frost is all associated with it.

This is a multi-coloured colour scheme. I think this represents woman because they are the type of colours i would associated woman to wear or like. I think that woman can like varied colours so thats why they are all different.

 

 

Mood Board different styles of navigation

MoodBOARD– pdf

The usability for the primary, secondary drop-down, and mega menus are all different from one another. For example, when using the primary navigation it is probably the easiest navigation to find/ use on the website. This is mainly because i has all the key elements normally on the main page of the site. All the key elements are pretty much self explanatory and let you navigated round the site quickly. When using the secondary drop-down element you may not find it on every website, and if it is on the website it will usually be found not as easily as the primary. For example, if you wanted to find ‘frequently asked questions’, you may have to go to ‘about us’ first on the primary navigation to then find it. The mega menus are a very handy source of navigation when you’re on a website with a considerable amount of pages. It is a very simple element to use when you are looking for something specific.

Visual Cues

Highlighting certain words and creating text emphasis on a website make them stand out, as they may be seen as more important than everything else. In this instance you could see that the ‘up to 60% off wedding’ is highlighted because it is a big discount. This works well because it is very eye catching. The colour red also indicates

By using instructional text on your website, it makes it very user friendly with being able to easily allocate the customer with where they need to go. Having fingers pointing at things and arrows it makes the website a lot easier to follow and understand.

 

Another way to use instructional text is by using buttons to tell you what to do. For example ‘Shop now’ and ‘Click to enter’. These buttons can also be a great persuasive technique because it is making our customers easily buy something within a click, or sign up within a click making it so easy to do so.

Using bright/bold colours on your home page make it a lot more eye catching for any customer who visits yours sight. By using two colours that contrast with each other, makes the photos pop at you. Also, by using coloured photos of people it draws peoples attention, show in recent studies.

 

 

 

 

 

 

Tracking and leading

Tracking- This is the adjustment in spacing throughout an entire word.

Leading- This determines how the text is spaced.

Below are examples where i have used tracking and leading. The following screenshots i have written in sans, sans serif and handwritten.  In my opinion, i think by changing the tracking and leading it makes the text easier to read as it is more clear. I noticed from my examples that they use tracking and leading in books, to make them easier to read.

Below is a bad example of tracking and leading, where it has been done incorrectly. You can do this by using the wrong numbers ad spacing between letters.

 

 

Typography

 

Typography: style or appearance of text

• text
• forms
• styles
• spacing
• punctuation
• communication

Serif-

Formal, traditional and  classic. These fonts are often found in common newspapers. For example, the screen shots above are very formal and from ‘The Sunday times’, which is a newspaper article that is aimed at an older audience.

 

Sans Serif-

Modern, informal, clean and easier to read. These fonts are the most popular fonts to date as they are very modern and easiest to read when using technology. For example, the screenshot above shows bold headlines on a newspaper website using sans serif, which is very bold and easy to read. The screenshot above is from ‘www.mailonline.com., which is a modern newspaper website.

 

Handwritten-

Personal and creative. These fonts are mainly found within logos, to make them personal  and original to the company. The screenshot above is from ‘www.harrods.com’, which is a big brand with their logo on a lot of products, so everyone knows a Harrods logo when they see one.

Here are 4 different phrases, where i have chosen a font to reflect on what it is saying.

The first one ‘pure poetry’ i did in a handwritten font because poetry is a personal subject and a lot of the time written out my hand.

The second saying ‘work hard dream big’ i have written in sans serif. This is because i wanted something big and bold that would stand out to the audience, as it is a inspiring quote.

The third saying ‘explore the world’ is also in sans serif. I chose this font because the phrase is very simple but delicate, so i thought something quite simple would fit well.

The last phrase ‘Keep of the grass” is a serif font. The reason i chose this font is because it is a very serious phrase, it is also a very bold font so it would catch the eyes of someone walking by.

Audience

The two sites i have chosen to compare are: Daily Mail Online and The Telegraph

The Daily Mail is a website mainly aimed at a younger audience. The design for the website is pretty basic, easy to understand and use. On the top tool bar it gives headings to break down your search. A lot of the headings at the top are topics that young people would be interested in, for example: Sport, Tv & Showbiz, Health, Fashion Finder etc. As soon as you go onto the main page of the website there are photos of well known young celebrities and the latest ‘gossip’ ,which will be the first thing young people would be interested in when looking at the news. In the ‘don’t miss’ toolbar there are a lot of stories about celebrities, which a lot of the older audience would not know who they are.

The Telegraph is a website mainly aimed at the older generation. One of the main differences visually when you go onto the site is the font of the writing, young people may see it as ‘old fashioned’ as it is the same type of font you see on a newspaper and not a webpage. Another difference is the content of the websites. The topics on the tool bar are: News, Business, Opinion, Money etc. These type of topics are stereotypically ones that the older generation would be interested in so pulls that audience in to go onto that website. Furthermore, the main stories on the front page aren’t to do with young celebrities and gossips, they are to do with political stories and older celebrities such as Brad Pitt, and problems that are going on in the world.

Understand the principles of interactive media design – Task 2

The two websites i looked into are http://www.asos.com and http://www.thomasgun.com. The reason why i chose there two are because you can highlight big differences between the two.

The good website is: http://www.asos.com

The reason why i thought this was a good website is because first off i think as soon as you go onto the site the design is very visually pleasing. It gives you a clear indication of how to get to the male and female clothes by using different colours, and is very simple to understand and use. Another reason why the website is visually pleasing is because of the photography on the site. The photos on the main page have been well thought about and they have taken into mind the season we are in, they have an option ‘Shop holiday’, as they know people will be shopping for summer so they know how to bring the customers in. All of the photographs and text are styled the same, so when you are browsing through it looks very neat and uncluttered. Another feature i liked about the website was when you click on the product it gives you a video of the clothing as well as the photographs, which is also a good way to get the audience to visual what the clothing looks like on.

In general the structure of the website is very useful. It gives you lots of options to break down what you are looking for to find is fast and efficiently, it gives you options to break it down into: size, colour, style, brand etc. The content is very logically organised because when you scroll over the woman’s and all the options come up they are all in alphabetical order, so it makes what your looking for very easy to find. On each page there is just enough content. For example, when you are looking at a piece of clothing it gives you a lot of information on the item itself: product details, brand, material, size and fit.

The bad website: http://www.thomasgun.com

When you first go onto the Thomas gun website, as you scroll down the page there is too many pictures and writing. I thought this wasn’t visually pleasing  because i didn’t know where to look as there was too much going on and it looks very cluttered. Another reason why it isn’y visually pleasing is because there isn’t a colour scheme with the site. A lot of the banners, promotions, discounts, bold writing are all in different colours which make the site look unclean. The photographs on the site are all different to one another also. Some of the photos are of people modelling the clothes and some are of the clothes being hung up, some photos have even been taken outside.

The structure of the website is pretty basic. The tool bar at the top of the website isn’t in proportion to the rest of the website. It is very small and only on one side of the website, when the tool bar goes across the whole of it. Furthermore, the content on the tool bar isn’t logically organised. The types of clothing are just in any order, which makes it harder to locate what you are looking for. There isn’t much content when you look into the actual clothes itself. It only tells you basic information about the item and doesn’t go into depth.