In this presentation we examine the use of Contrast, Repetition, Alignment and Proximity as elements of good design, found in the Joshua Tree Epiphany.

1. WHAT IS
the JOSHUA
TREE
EPIPHANY?
V1.01 DIGITAL MEDIA & MULTIMEDIA DESIGN
By Gabriel D’Amato

2. THE JOSHUA
TREE EPIPHANY
is C.R.A.P.
THERE ARE FOUR BASIC
PRINCIPALS THAT MAKE
UP THE JOSHUA TREE
EPIPHANY.
CONTRAST: Avoid elements on the page that are similar
to one another.
REPETITION: Repeat visual elements of the design
throughout the entire piece.
ALIGNMENT: Every element should have some visual
connection with another element on the design.
PROXIMITY: Items that relate to one another should be
grouped close together in the design.
*JOSHUA TREE EPIPHANY (DESIGN)
The Joshua Tree Epiphany is the application and
recognition of four basic design principles that make up
a good design (Contrast, Repetition, Alignment and
Proximity). The theory was developed by Robin Williams
the designer, NOT the actor.
http://www.ratz.com/
YOU SHOULD REMEMBER THIS

3. BAD
DESIGN
WHY IS THIS BAD?
There are a few things that make this a
bad design if looked at with the Joshua
Tree Epiphany in mind, but what are they?

4. GOOD
DESIGN
WHY IS THIS BETTER?
Compared to the previous design, why
exactly does this design please the eye
more?
Point out CONTRASTING elements.
Find instances of REPETITION.
What about the ALIGNMENT?
Find elements using PROXIMITY.

5. GETTING USED TO USING THE JOSHUA TREE
EPIPHANY CAN TAKE SOME TIME.
• CRITIQUE OTHER PEOPLES DESIGNS. TRY TO FIND
JOSHUA TREE ELEMENTS.
• BE CRITICAL OF YOUR OWN DESIGNS BEFORE YOU ASK
FOR INPUT.
• GET SOME INSPIRATION FROM OTHER DESIGNERS…
THEN DO BETTER.
• PROSPECTIVE EMPLOYERS WILL BE IMPRESSED THAT
YOU KNOW THE TERMS, AND CAN SITE EXAMPLES.
• USE THE ELEMENTS IN EVERY DESIGN, NO MATTER
WHAT THE FORMAT.
NEWBIE TIPS:
TRUE STORY

6. A CLOSER
LOOK at
CONTRAST
CONTRAST IS ONE OF
THE MOST EFFECTIVE
WAYS TO ADD VISUAL
INTEREST.
In order for contrast to be effective, it must be strong.
Don’t be a wimp about it.
If two items are not exactly the same, then make them
different. Really, really different.
Contrast attracts the eye faster than almost any other
design element.
You can contrast anything. Fonts, Colors, Negative
Spaces, Shapes, Textures, you name it.
The best designers are the ones who can add natural
contrast without being too “in your face about it”.
*CONTRAST (DESIGN)
Contrast refers to the arrangement of opposite elements
(light vs. dark colors, rough vs. smooth textures, large
vs. small shapes, etc.) in a piece so as to create visual
interest, excitement and drama.
https://sites.google.com/site/principlesofdesignsite/home/contrast
BE THAT KIND OF DESIGNER

8. REPETITION
REPETITION
REPETITION
REPETITION IS WHAT TIES
A DESIGN WITH LOTS OF
DIFFERENT ELEMENTS
TOGETHER.
Repeat aspects of the design, throughout the entire
composition and watch it all come together in the end.
You can use repetition with almost any element you can
put your mind to (fonts, shapes, colors, text styles,
images, spatial elements, negative space, etc).
Using a pre-made color palette is a form of repetition
(assuming you actually stick to the palette that is).
Repeat the same fonts, but use the entire font family
(bold, italic, light, etc). Just make sure that elements
that are the same use the same repetition rules.
Repetition can also be knows as Design Patterns,
Consistency and Cohesive Design.
*REPETITION (DESIGN)
Repeating visual elements such as line, color, shape,
texture, value or image tends to unify the total effect of a
work of art as well as create rhythm. Repetition can take
the form of an exact duplication (pattern), a near
duplication, or duplication with variety.
https://sites.google.com/site/principlesofdesignsite/home/repetition-pattern-
GET GOOD WITH TYPOGRAPHY

9. FIND THE
ELEMENTS
PICK OUT AT LEAST 5 ELEMENTS OF THE DESIGN
THAT ARE REPEATED.
On the next slide are two different parts of a newsletter
that use the same design elements. See if you can
pick out at least five elements that are repeated
throughout the design.
BONUS: CAN YOU IDENTIFY MORE THAN 10?

11. A QUICK
WORD about
ALIGNMENT
ALIGNMENT IS VITALLY
IMPORTANT IN LAYOUT
DESIGN BECAUSE IT …
…allows you to arrange elements in a way that matches
how people naturally scan the design.
…helps balance the overall design so that it is visually
appealing to the viewer.
…creates a visual connection between related elements of
a design (similar to but not the same as Proximity).
Alignment (like the name suggests) is all about organizing
elements relative to a line or margin.
This doesn’t have to be a literal line in your design; in fact,
it’s usually an invisible margin implied by the way your
design is arranged.
The two basic alignment principles are edge
alignment and center alignment.
*ALIGNMENT (DESIGN)
Alignment is the arrangement of elements in a straight
line, or in correct or appropriate relative positions with
other elements.
REMEMBER THIS FOR SURE

12. THIS DESIGNER NEEDS TO FIND A NEW JOB

13. THIS DESIGNER COULD DO BETTER

14. THIS DESIGNER AND I CAN BE FRIENDS

15. ABOUT
PROXIMITY in
GOOD
DESIGN
IN A NUTSHELL:
PHYSICAL CLOSENESS
IMPLIES A RELATIONSHIP.
When pieces of a design are scattered all over, the design
appears unorganized.
Group relevant items together to make them seen as one
cohesive group.
Items or elements that are NOT related to one another
should NOT be in close proximity to each other.
IF USED PROPERLY, PROXIMITY WILL INSTANTLY
SHOW THE VIEWER VISUAL CLUES TO THE
ORGANIZATION OF YOUR DESGIN.
Don’t be afraid of negative space in your designs.
*PROXIMITY (DESIGN)
Proximity, as defined by the "Universal Principles of
Design," states that elements that are close together are
perceived to be more related than elements that are
further apart. Proximity in web design is most commonly
achieved by grouping information.
THAT IS A ROOKIE MISTAKE.

17. FIND MORE
EXAMPLES
GO ONLINE AND FIND EXAMPLES OF GOOD &
BAD USE OF THE JOSHUA TREE EPIPHANY.
Use every designers best friend (google.com) to find at
least 5 examples of both GOOD and BAD application
of Contrast, Repetition, Alignment and Proximity in
designs of any kind.
Be sure to find examples of bad applications of each
kind!