Friday, 4 June 2010
Wednesday, 5 May 2010
Evaluation
My task was to produce a website of a chartity of my choice and to expand of research leading up to my final peice. It had to contain four pages, my own set of pictures, logo, navigation bar, text and a video. I have chosen to do a child abuse programme as i think it's extremely important children are safe and happy through out their childhood and i dont condone any form of child cruelty. I have added a video on my website, and some charity websites include videos, some don't some just have slide shows of photos. My website is trying to shock people to how important it is for a child to seek help if they are in any kind of danger, real charity websites also do this.
My website is targeted at children and young adults that suffer from abuse, or people who want to donate and to make a difference or people who are interested in the subject like social workers and so on. It shows the audience that not all people in todays culture are safe so it represents them as being a vunerable social group within society, because my website shows that people need to seek help.
The kind of media institution might distribute my media product could be television, as things like comic relief which have big distributions from the BBC which could show live on tele what the charity have done and help them raise more money by publicity.
My audience would be attracted by the big colour i have used, i have used green and black as they work well next to each other and they also aren't too 'in your face'. I think maybe i could have used one more colour to get that little bit more attention, though i do think it still looks good. Also i used a good size font that people can read without struggling and i also used black font. I chose a font that it easy to read also. I used a white back ground, and the logo is black and green and is placed in the top left corner as that is where the logo is recognised in web conventions.
I've learnt a lot about technologies from the process of constructing this website as i have learnt about web conventions, colour theory, photography, composition and non verbal communication, i have also put on my blog other terms to help me undertstand further. I have also learnt that its very important you research before you go making your website, and researching into previous children websites was the best thing i did, as it gave me ideas to better my final peice. I made my website by using the programme WebPlus 10 and by using this i learnt how to put together a website, connect each page with the navigation bar that i made on photoshop. Also I learnt how to use photoshop better by producing my logo on there.
Looking back at my preliminary task, i have learn't how much work goes into the media, esspecially websites and designing them and researching helped me get a better concept of website design. The preliminary task also helped me with target audience as i went to look on primary school websites because it helped me specifiy in making a website for children and parents. Also i had to analyze primary school websites which helped me pick out the important features in a website. I have enjoyed the preliminary task as it has also improved my research skills.
My website is targeted at children and young adults that suffer from abuse, or people who want to donate and to make a difference or people who are interested in the subject like social workers and so on. It shows the audience that not all people in todays culture are safe so it represents them as being a vunerable social group within society, because my website shows that people need to seek help.
The kind of media institution might distribute my media product could be television, as things like comic relief which have big distributions from the BBC which could show live on tele what the charity have done and help them raise more money by publicity.
My audience would be attracted by the big colour i have used, i have used green and black as they work well next to each other and they also aren't too 'in your face'. I think maybe i could have used one more colour to get that little bit more attention, though i do think it still looks good. Also i used a good size font that people can read without struggling and i also used black font. I chose a font that it easy to read also. I used a white back ground, and the logo is black and green and is placed in the top left corner as that is where the logo is recognised in web conventions.
I've learnt a lot about technologies from the process of constructing this website as i have learnt about web conventions, colour theory, photography, composition and non verbal communication, i have also put on my blog other terms to help me undertstand further. I have also learnt that its very important you research before you go making your website, and researching into previous children websites was the best thing i did, as it gave me ideas to better my final peice. I made my website by using the programme WebPlus 10 and by using this i learnt how to put together a website, connect each page with the navigation bar that i made on photoshop. Also I learnt how to use photoshop better by producing my logo on there.
Looking back at my preliminary task, i have learn't how much work goes into the media, esspecially websites and designing them and researching helped me get a better concept of website design. The preliminary task also helped me with target audience as i went to look on primary school websites because it helped me specifiy in making a website for children and parents. Also i had to analyze primary school websites which helped me pick out the important features in a website. I have enjoyed the preliminary task as it has also improved my research skills.
Final Website & Drafts
I designed my website on WebPlus 10, this programme helps you design websites. I designed my navigation bar and logo Photoshop.
This is my 'Help and Advice' page
This is my homepage
This is the 'About our Charity' page
This is my "How to help" page which includes a video
This is my 'Help and Advice' page
These are my draft designs
PHOTOS
Logo designs & Final Logo
This my final logo design that i chose to use on my charity website. I prefered this one was it was more eye catching that my other design. Also I think it represents a child abuse charity website more, because its got to hands as part of the logo which represents help, and i added coloured text to make it stand out more. I think maybe i could have added more colour somewhere else on the logo, but i'm still happy with this design.
This is my other design, that i haven't used for my website. I think i should have used colour other than just using black and white. I don't think this logo stands out as much as my other one and i dont think it represents my charity as well as my other one.
What Makes A Good Logo
What makes a good logo? Well firstly your logo has to somehow represent what your logo is advertising. In this case I'm doing a charity for child abuse so i have found logo's from charities for child abuse. It's important for a logo to contain a good amount of colour, and something eye catching. Also if it's good bright colours, in this case it would be very valid as it will catch the eye of a child in need of help. It wouldn't be very good if you did a logo for a child abuse website with it not representing something or a message to do with your charity. For example, the NSPCC logo has a big full stop on their logo, and their message is to put a "STOP" to child abuse. Also the kidscape logo has a kite, and a kite is something a child would play with and a childs imagination a kite is like an escape root. Whatever your website is about, it must be eye catching and must grab the audience, because people arn't going to take as much notice if it isn't grabbing their attention. Also characteristic's of an effective logo is if it portrays the company/organisation in a positive way, for example "Help A Child" its a postive manner.
Wednesday, 28 April 2010
Colour theory
When designing your website it is important that you consider what colours your using. Colour cobination is a really important part of colour theory and designing your website. If your using lot of different colours, it could make your page look too busy and that can make it hard for the audience to find the information their looking for. On the other hand if your not using enough colours, it can make your page look boring which could make the website look less appealing the the audience.
A common rule is to use 3 colours.
First of you should have a primary colour, which is the main colour your going to be using. Then you should apply a "secondary colour" as this colour should be chosen that it backs up your primary colour well. Then you should have a "highlight colour" which is used to emphasize certain parts of the page. The highlight colour is the colour that contracts more with the primary and secondary colour, but it should only be used with moderation.
Analog colours are the colours that sit on the side of any other colour, the secondry colour is normally an analog colour.
Complementary colours are colours that stand out and contrast against eachother. Often complementary colours are used as highlight colours.
Using split complementary colours can give your design a high level of contrast but not as exstreme as complementary colours alone.
Triad colours are used when you want to have a design that is colourful but balanced.
A common rule is to use 3 colours.
First of you should have a primary colour, which is the main colour your going to be using. Then you should apply a "secondary colour" as this colour should be chosen that it backs up your primary colour well. Then you should have a "highlight colour" which is used to emphasize certain parts of the page. The highlight colour is the colour that contracts more with the primary and secondary colour, but it should only be used with moderation.
Analog colours are the colours that sit on the side of any other colour, the secondry colour is normally an analog colour.
Complementary colours are colours that stand out and contrast against eachother. Often complementary colours are used as highlight colours.
Using split complementary colours can give your design a high level of contrast but not as exstreme as complementary colours alone.
Triad colours are used when you want to have a design that is colourful but balanced.
Photography, Composition and Non Verbal communication
Good design elements
Eyeflow - Elements in the picture that guide the viewer's eye through the whole frame.
Dominant element - In Photography 'Dominant elements' there is normally one subject for the photo. The subject may be either a one object, or a number of objects.
Simplicity - Only what is essential to the picture is included in the actual image.
The Rule of Thirds - When taking a photo, having the main subject in the centre of the photo with lots of background space is the most common way to take a photo but it's the least appealing way. Using a grid you can choose where to crop your photo to make it look more interesting that the audience will find the photos more appealing.
Diagonal rule - According to the diagonal rule the important parts of the picture should be placed along these diagonals, waterways, and fences placed diagonally, are generally perceived as more dynamic than horizontally.
Non Verbal Communication
It's important to take pictures can communicate many things to the audience. In a photo its important about what message you are trying to give off to the audience.
Expression is importantand is based on conventionalised cultural codes, instantly recognisable.
Eye contact - directly towards the consumer (appealing to them) or involved within the scene of the ad.
Pose-static or active - often corresponds to expression. Can also be a symbol of status.
It's also important to take notice of what your model in your photo would be wearing as the clothes communicate with the audience.
Touch- ritualistic touching (products) conveys emotion and manner. Grasping and holding is functional is important.
Body movements also important, it relates to the function your model/actor is doing.
Positional communication
Reciprocal- relationship with two people in which each person is the centre of the other’s attention.
Divergent- both actors/models attention is diverted towards something else.
Object- the attention of each person is focused towards the same thing.
Semi-reciprocal- one actors/models attention is focused on the actors, whose attention is somewhere else.
I haven't used my own pictures as this is only research.
Eyeflow - Elements in the picture that guide the viewer's eye through the whole frame.
Dominant element - In Photography 'Dominant elements' there is normally one subject for the photo. The subject may be either a one object, or a number of objects.
Simplicity - Only what is essential to the picture is included in the actual image.
The Rule of Thirds - When taking a photo, having the main subject in the centre of the photo with lots of background space is the most common way to take a photo but it's the least appealing way. Using a grid you can choose where to crop your photo to make it look more interesting that the audience will find the photos more appealing.
Diagonal rule - According to the diagonal rule the important parts of the picture should be placed along these diagonals, waterways, and fences placed diagonally, are generally perceived as more dynamic than horizontally.
Non Verbal Communication
It's important to take pictures can communicate many things to the audience. In a photo its important about what message you are trying to give off to the audience.
Expression is importantand is based on conventionalised cultural codes, instantly recognisable.
Eye contact - directly towards the consumer (appealing to them) or involved within the scene of the ad.
Pose-static or active - often corresponds to expression. Can also be a symbol of status.
It's also important to take notice of what your model in your photo would be wearing as the clothes communicate with the audience.
Touch- ritualistic touching (products) conveys emotion and manner. Grasping and holding is functional is important.
Body movements also important, it relates to the function your model/actor is doing.
Positional communication
Reciprocal- relationship with two people in which each person is the centre of the other’s attention.
Divergent- both actors/models attention is diverted towards something else.
Object- the attention of each person is focused towards the same thing.
Semi-reciprocal- one actors/models attention is focused on the actors, whose attention is somewhere else.
I haven't used my own pictures as this is only research.
Planning and Research
The layout of these charity websites are all very similar and all have some sort of pictures on them. There is a minimal amount of information that is important. All four websites i have looked at have a great use of colour and are eye catching that all go together. The colours on the websites are not too "in your face" and don't clash which makes the websites appealing to the audience. The main colours used on these websites are blue, red, green, yellow with black text. The target audiences for these websites are parents and children. The use of navigation is really good as nearly all four have pictures around the navigation bars. Also all the navigations bars are highlighted and are easily found on the websites.
Photo's and pictures are used really well as i've already mentioned that there are cartoon drawings and pictures around places like the navigation bar and around the top of the home page which will catch the audiences attention.
The text is used really well as there is only next that is needed on there, sometimes websites can put too much text on and tend to "waffle" which can bore the audience. So it's important to be straight to the point and explain well.
The logo's are mainly text that has being characterised and made eye catching by using bright colours and large text. Short and simple words are best for logos.
The over all design of the websites are all very eye catching and more importantly they all appeal to their target audiences and will keep the audience interested and give them the information they need.
Charity website design
These screen shots are screen shots of my rough design of a website i designed to learn the basic's on how to design a website. Doing this will benefit me when i come to designing my charity website. I think i did well for my first attempt at designing a website but i think there is room for improvement, esspecially pieces like the logo. I think the logo could have been more detailed and more recogition that it is a primary school logo. Also i think i could have used more colours that dark blue with black writing but i think i did well when it came to information about the school and the layout of the front page and the fonts and font sizes i used were well chosen. I think if i had used more pictures it would have made my rough design more appealing to an audience and would have shown them more qualities of the school. I didn't use my own photos because this research. The target audience for my rough design is parents and children.
Preliminary task
Layout
These two wesites are both education websites, but one if a primary school for young children and the other is a college website for young adults. The layouts in both of the websites are very similar. They both have a large picture on the right hand side and a navigation bar on the left hand side. Both logo's are in the top left hand corner and at the bottom of the home page there are links and contact information.
Use of colour
Use of colour
The use of colour in both websites are completely different to eachother. The primary school website is bright blue and the picture is outlines with a yellow frame. There is also a lighter bright blue used for the back ground. The writing is white and it contrasts well on a bright blue back ground as it's easy to read off.
The college website has a white/bluey back ground, and a dark blue strip across the top of the website which remains on every other page. The navigation bar is a purple/bluey colour and the writing is black writing on the light back grounds and white writing on the darker backgrounds.
The target audience
The target audience
Both websites show clearly what their target audience is aimed at. The primary school one is aimed at parents and adults, and maybe some children, and it stands out and catches people's eye. The college website is aimed at young adults/adults so it doesnt have to be quite as catchy as its not a childrens college.
Ease of use/navigation
Ease of use/navigation
The navigation bar in both websites are on the left hand side and it is made easy to use, and you can clearly see how it works.
Photos and images
Photos and images
The use of images were used well, they both had a large image on the right hand side of the home page, which makes both websites stand out and eye catching. The college picture on the actual website was a slide show of photo's and one was of the school, and the primary school photo is a picture of the school. Putting a picture of the premesis is showing users what the places look like, so they can see if it appeals to them.
Use of text
Use of text
The use of text on the primary school website was used well as there wasn't too much text on the home page, sometimes too much text can put people off as they don't want the hassle of having to take in a lot of information all at once. On the other hand the college home page had more information on, which isn't nessassarily a bad thing as there wasn't a great amount.
Logos
The primary school logo is of a flag and then across the flag the name of the school is written in yellow writing. The logo is eye catching, and is a similar sort of design to other primary school logos i have seen. The college logo wasn't quite as eye catching, it's a white square with a tick in it with writing saying "Lincoln College".
The overall design of both websites would be rather appealing to their target audiences, i think that they have great design conventions and have used sensible colour choices and the over all design.
Good web design and conventions
A convention is either colours, shapes, fonts, layouts or patterns that have become so reconizable over the years that they connote things that don't actually have to say what it's use is, and there is hundreds of them. For example a yellow triangle on a road sign stands for 'warning', which has crossed over to become the convention in software.
Design conventions are usful because over time it becomes easier to design a website by using these conventions because people now reconize what each convention sign means over time. Also, design conventions not only make designing a website easier, it also makes it easier for the users using the website.
Design conventions should be used all the time, because it's like not putting a disabled sign on a disabled toilet door.
Some examples of design conventions
If you see a set of words seperated by "" , vertical lines at the bottom of a web page, you automaticly think that they are a set of links within the web site you're on.
An area of screen that looks like a button (raised or rectangular) will conventionally perform an action when clicked with the mouse.
Design conventions are usful because over time it becomes easier to design a website by using these conventions because people now reconize what each convention sign means over time. Also, design conventions not only make designing a website easier, it also makes it easier for the users using the website.
Design conventions should be used all the time, because it's like not putting a disabled sign on a disabled toilet door.
Some examples of design conventions
If you see a set of words seperated by "" , vertical lines at the bottom of a web page, you automaticly think that they are a set of links within the web site you're on.
An area of screen that looks like a button (raised or rectangular) will conventionally perform an action when clicked with the mouse.
Subscribe to:
Comments (Atom)
