an introduction to web graphics lesson 1 (c by)
Post on 27-Jan-2015
107 Views
Preview:
DESCRIPTION
TRANSCRIPT
An Introduction to Web Graphics
Lesson 1 – Design Principles and Logos
WHAT IS A LOGO?WHERE MIGHT YOU SEE LOGOS?WHY ARE LOGOS IMPORTANT?
TIME FOR A QUIZ
Whose logo is this?
HOW DID YOU DO?WHAT CHARACTERISTICS DO THESE LOGO DESIGNS SHARE?
Objectives and Outcomes
Objectives• Understand basic design principles of
white space, contrast, proximity, alignment, repetition and complimentary colours
• Learn how to create a logo using graphics software
Outcomes• All: Will be able to say what these
words mean• Most: Will use some of these ideas in
their work• Some: Will use most of these ideas
and explain how they’ve been used
• All: Will have created a simple logo• Most: Will have created a simple logo
with a coherent design• Some: Will think about audience and
produce an appropriate design
PROXIMITY
Proximity
• The distance between things in a design has an impact on how they relate to one another
• Elements close together appear to have a stronger relationship than those further apart
CONTRAST
Contrast
• Contrast works in several different ways• Most obvious example of contrast is the
colour of text against a background– Easier to read text that contrasts highly with the
background• Can also include all sorts of differences
between elements– Make something different so that it stands out– Helps indicate what’s important
Contrast
• This is an example of poor contrast. The colour of this text is not different enough from the background colour. Higher contrast is far easier to read.
This text is much easier to read than the text above. Tests indicate that white wording on a black background is harder to read than the black text on a white background.
COMPLIMENTARY COLOURS
This is a complex area but, put simply, ‘opposite’ colours work often well together!
Is the opposite true?
REPETITION
Repetition• Saying the same thing or using the same
design component several times to get a point across
• Use of a consistent theme• Common in nature – the brain accepts it
quickly!
ALIGNMENT
Text Alignment• Can enhance or detract from appearance of page.• Can significantly affect readability
Aligned left is most common. This provides a consistent starting point for each new line. The eye of the reader becomes used to easily finding the beginning of a new line
Centre alignment makes finding the beginning of a new line of text much
more difficult. Each line tends to be a different
length. As a result it is much more tiring to read text with centre
alignment. The eye is constantly guessing and
searching for the start point. In addition, centre alignment causes
odd line lengths. These odd lengths cause a sort of
"choppiness" in how the text reads. It lacks the smooth flow that tends
to occur with left alignment.
Right alignment seldom serves a useful purpose if readability is a
concern. While it may be used in an artistic way, the use of right
alignment for significant amounts of text should be avoided.
The odd starting points of the text cause the eye to search and the appearance in bulk of such text
can be off-putting to some viewers. Always remember that
people tend not to read anything that is too difficult or annoying!
WHITE SPACE
White SpaceWhite space isn't always white – it’s a graphics design term and refers to the space between objects in a design. So the area between text and a photograph is "white space" even it’s another colour.
Create Your Own Logo• You’re going to create a logo for an
imaginary company called Pad Blazer who make games for mobile phones
• Use Fireworks• Try to incorporate some or all of the
principles we discussed:-– White space– Proximity– Repetition– Alignment– Contrast– Complimentary colours
• Keep it simple• Think about audience
600 x 600
TextShapes
Objectives and Outcomes
Objectives• Understand basic design principles of
white space, contrast, proximity, alignment, repetition and complimentary colours
• Learn how to create a logo using graphics software
Outcomes• All: Will be able to say what these
words mean• Most: Will use some of these ideas in
their work• Some: Will use most of these ideas
and explain how they’ve been used
• All: Will have created a simple logo• Most: Will have created a simple logo
with a coherent design• Some: Will think about audience and
produce an appropriate design
Homework
• Find a picture or graphic that demonstrates one or more of the design principles we discussed today
• white space, contrast, proximity, alignment, repetition and complimentary colours
Bring it to the next lesson
top related