Part of the Girls Do Digital free courses on Digital skills.

1. D e s i g n & B r a n d i n g
D e s i g n P r i n c i p l e s & T e n e t s

2. Principles of Design: Just Remember CRAP
T H I N G S T O A L W A Y S K E E P
I N M I N D
C o n t r a s t
If things are not styled
exactly the same, they
should be very different
and distinguishable.
Contrast and hierarchy
often draws the eye first to
successful design.
R e p e t i t i o n
Visual elements should
match in style by repeating
common characteristics:
colors, shapes, textures,
patterns, spacing, line
weight, fonts, sizing,
shapes, and graphic styles.
A l i g n m e n t
Nothing should be placed
randomly on the page.
Things should either line
up exactly or be
intentionally placed in a
grid-style layout to create
symmetry for the eye.
P r o x i m i t y
Items and graphic elements
related to each other should
be placed physically close to
one another, so as to
become one visual “group”.
Information should be
organized in like units.

4. CONTRAST
Good design follows information
architecture, creating levels. Text
should be styled noticeably different
in a way that creates contrast. Colors
and elements, likewise, should be far
apart enough to be clearly separate
and legible.

5. Examples of Contrast

6. REPETITION
I prefer to refer to this as “consistency” rather
than repetition. Good design should use the
same typography hierarchy, the same color
scheme, and have a uniform or similar layout
structure between pages (think website). This
is especially important throughout a brand!
Everything related to a brand should look like
it goes together. It shouldn’t look identical, but
it should look consistent in style and aesthetic.

7. Repetition Examples

8. ALIGNMENT
Elements on a page need to line up,
linearly or with centering both
vertically and horizontally. Using a
grid is the best way to do this.

9. Alignment Examples

10. PROXIMITY
Physically, like information
should be with like, different
pieces of information should
be separate. White space
creates minimalism and
division between elements,
and should be maximized for
the cleanest look and feel.

11. Proximity Examples

12. The rule of thirds states that if you take
a canvas and divide it into three equally
sized horizontal sections and three
equally sized vertical sections, the
resulting grid provides a sort of
“roadmap” that helps you choose where
to place your design elements. This is
related to the golden ratio, which is
what the human brain finds most
aesthetically pleasing.
Three More Pieces
E v e r y d e s i g n e r s h o u l d k n o w
R u l e o f T h i r d s C o n c e p t o f B a l a n c e G e s t a l t T h e o r y
Balance is the positioning and overall
symmetry in placement of elements
vertically and horizontally in a design.
Generally, balance should either be as
symmetrical as possible or intentionally
and distinctly asymmetrical. Balance is
the distribution of visual weight within
your design. It’s about achieving visual
and psychological equilibrium using
different design elements.
Gestalt Theory is a more complex
concept to grasp than most of the
others. It means that the design’s
psychological effect is greater and
more memorable than the sum of its
parts. Gestalt principles describe how
viewers group different objects and
elements together into a single,
coherent whole if disparate elements
are arranged in a particular way.
1 2 3

13. Rule of Thirds
The rule of thirds states that if you
take a canvas and divide it into three
equally sized horizontal sections and
three equally sized vertical sections,
the resulting grid provides a sort of
“roadmap” that helps you choose
where to place your design elements.
This is related to the golden ratio,
which is what the human brain finds
most aesthetically pleasing.
1
2
3
4
The human eye typically follows this pattern:

18. Concept of Balance
Balance is the positioning and overall
symmetry in placement of elements
vertically and horizontally in a
design. Generally, balance should
either be as symmetrical as possible
or intentionally and distinctly
asymmetrical. Balance is the
distribution of visual weight within
your design. It’s about achieving
visual and psychological equilibrium
using different design elements.

19. Symmetrical Balance: Symmetrical balance
does what it says– it balances a design using
symmetry. By reflecting certain design
elements from left to right or top to bottom,
you can create a strong sense of balance.

20. Asymmetrical Balance: Asymmetrical balance achieves
balance through contrast, often by balancing elements of
similar or equal weights rather than creating an identical
mirrored image. For example, several smaller elements will
balance out one larger element.

21. Gestalt Theory
Gestalt Theory is a more complex
concept to grasp than most of the
others. It means that the design’s
psychological effect is greater and
more memorable than the sum of its
parts. Gestalt principles describe
how viewers group different objects
and elements together into a single,
coherent whole if disparate elements
are arranged in a particular way.

22. Simplicity: The law of simplicity indicates
that our mind perceives everything in its
simplest form. Elements together can be
used to create a simpler shape, and the
brain will draw that shape’s conclusion.

23. Figure-Ground: Based on the eye’s tendency to see and
separate objects from their surrounding background.
Depending on how you arrange and balance figure and
ground, you can direct your audience’s eye towards
specific focal points and use these elements to
communicate or complement your message.

24. Proximity: We perceive elements as belonging to the
same group if they are laid out closely together, and
can arrange them into a single shape or outline image.

25. Similarity: We perceive elements as belonging to the
same group if they look like each other. The principle
of similarity can be triggered using color, size,
orientation, texture and even fonts. This can also be
used to show contrast and individuality.

26. Continuity: Elements are visually associated if they
are aligned with each other. Lines are perceived as
a single figure insofar as they’re continuous. The
smoother their segments are, the more we see
them as a unified shape.

27. Closure: Closure is based on the human eye’s
natural tendency to see closed shapes. When an
object is incomplete or the interior space of a
particular design element is not fully enclosed, the
viewer unconsciously completes the shape.

28. The way to learn design is to 1)
observe the design you see
around you and 2) to just start
doing it! Go to www.canva.com
and start playing!

29. D e s i g n & B r a n d i n g
D e s i g n P r i n c i p l e s & T e n e t s