Elements and Principles of Design

1. Elements &
Principles
of Design

2. What is Design?
In general, it is a plan or drawing
produced to show the look or function
something. GRAPHIC DESIGN is the
process of visual communication through
the use of fonts, space, images, and color.

3. Elements vs. Principles
We’re going to talk about ELEMENTS of
design and PRINCIPLES of design.
Elements Principles
Line, shape, color,
value, texture, size, and
space.
These are the materials
you build designs with.
Contrast, repetition,
alignment, and
proximity.
These are rules that help
you organize and place
the materials.

4. Elements vs. Principles
Elements Principles
These are the materials
you build designs with.
These are rules that help
you organize and place
the materials.
hello

5. Elements of Design: Line
Lines can be used for a wide range of purposes: stressing
a word or phrase, connecting content to one another,
creating patterns, dividing up space, and much more.
Options:
Straight
Curved
Horizontal
Vertical
Thick
Thin
Dotted
Broken
Lines can create a sense of
movement or direction in your
design.

6. Elements of Design: Shape
Put lines together to create height and width, and you have
a shape. Shapes can be used to create patterns, organize
and divide space, and draw the viewer’s attention.
Options:
Geometric (triangles,
circles, squares, etc.)
Natural (plants,
animals, people, etc.)
Abstract (icons,
freeform graphic
representations)

7. Elements of Design: Color
Color is used to generate emotions, create unity, make
something stand out, and generally create visual interest.
Options:
Warm vs. Cool
Bright vs. Muted
Primary vs. Secondary
Neutral Colors
Complementary Colors + +

8. Elements of Design: Color
Blue-orange
complementary
colors in movie
posters is
overdone

9. Elements of Design: Value
Value is how light or dark an area looks. Use value to
create depth and light, to lead the eye, or to emphasize.
A gradient helps us
visualize value: Any color has a range of value.

10. Elements of Design: Texture
Texture refers to what the surface of an object looks and
“feels” like. In graphic design, you can mimic the look of
different textures to add depth, contrast, and visual interest.
Options:
Wood
Cement
Glitter
Fabric
Paint
Glass
Metal
Paper

11. Elements of Design: Size
Size is how small or large something is. Interesting
choices regarding size can attract attention or define the
importance of an element in the design.

12. Elements of Design: Space
Space is the area around or between elements of the
design. It can be used to separate or group information.
Used effectively it can lead the eye through a design.
Options:
Positive Space:
the space the
subject takes up.
Negative Space:
the space
surrounding the
subject.

13. Elements of Design: Text
Different texts have different moods. They can be clean and
modern, classic and professional, Casual and fun, aggressive,
mature, immature, historical, futuristic, and so on. Try to match
fonts together that you believe complement each other.
Options:
Serif fonts: hello hello (have “hooks”)
Sans-serif fonts: hello hello
Script fonts: hello hello hello
Artistic fonts: hello hello

14. We just saw
elements of design:
the materials!
Next we will look at
principles of design:
the rules!
TEXT

15. Principles of Design: Contrast
Separate elements in a design should stand apart from one
another. Think of contrast as a noticeable difference
between elements. You can achieve contrast using different
colors, textures, and sizes next to each other.
Color contrast
Value contrast
Texture contrast
Size contrast
BAD
GOOD

16. Principles of Design: ContrastFaux-pas!
When an element
of your design (like
text) should be
clearly visible to
the viewer, make
sure to create high
contrast!

17. Principles of Design: Repetition
Repeating elements helps to create patterns. When you
repeat the use of any design element, it also creates
cohesiveness. For example, if you use a blue border on one
image, using blue borders on the other images creates unity.

18. Principles of Design: RepetitionFaux-pas!
No
repeating
fonts,
no
repeating
colors,
no
repeating
shapes!

19. Principles of Design:
Alignment
Alignment means that objects in the design are
visually connected so that nothing feels out of place
or disconnected. Objects “line up” with each other
when they are supposed to.
The elements on this page are not in alignment.

20. Principles of Design: Alignment
The elements on this page are now better aligned!
Alignment means that objects in the design are visually
connected so that nothing feels out of place or
disconnected. Objects “line up” with each other when
they are supposed to.

21. Principles of Design: Alignment
Alignment means that the spacing around objects is
EQUAL, EVEN, or SYMMETRICAL on all sides.
The space between objects is EQUAL.
The space on the outer margins of the page is also the
SAME on both sides.

22. Principles of Design: Alignment
Alignment means that the spacing around objects is
EQUAL, EVEN, or SYMMETRICAL on all sides.
The space between objects is equal
on all sides.

23. Principles of Design: AlignmentFaux-pas!
Margins are all different sizes.
None of the objects are “lined up.”

24. Principles of Design: Proximity
Proximity is how close or far away objects are from each
other. If two elements are related, they should be placed in
close proximity to each other. Doing so increases viewer
comprehension of the design.
Imagine how strange it would
look if you put distance between
and image and its label…
My Dog

25. Principles of Design: Proximity
Proximity is how close or far away objects are from each
other. If two elements are related, they should be placed in
close proximity to each other. Doing so increases viewer
comprehension of the design.
Imagine how strange it would
look if you put distance between
and image and its label…
My Dog

26. Principles of Design: Proximity
Group related things together.
What order are
you supposed
to read this text
in? Group
related text
together.
Faux-pas!