This document provides an introduction to basic design principles for logos and web graphics. It discusses key principles like white space, contrast, proximity, alignment, repetition, and complimentary colors. Learners will understand these principles, learn to create a simple logo using graphics software incorporating several design ideas, and demonstrate comprehension through a homework assignment finding an external image using one or more principles. The objectives are for all learners to understand the terms, most to apply ideas in their own work, and some to fully explain how principles are used.
4. HOW DID YOU DO?
WHAT CHARACTERISTICS DO THESE
LOGO DESIGNS SHARE?
5. 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
7. 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
9. 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
10. 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.
14. 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!
16. 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!
18. White Space
White 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.
19. 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
Text
Shapes
20. 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
21. 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
