Design Strategies to make you're stuff look good.

1. Design
Strategies
to Make
Your Stuff
Look Good
With thanks to RobinWilliams

2. 1. Contrast
2. Repetition
3. Alignment
4. Proximity

3. 1. Contrast
2. Repetition
3. Alignment
4. Proximity

4. The principle of Proximity
Make sure related items on the
canvass are placed physically close
to one another.

5. Proximity
Non-designers tend to string words, phrases and graphics all
over the place, taking up lots of room so there won’t be any
empty space. There seems to be a fear of white space.
The page then seems to be cluttered and unorganized, and
the information is not instantly accessible to the reader.
Don’t make the reader work! We’re lucky to have readers, so
give them a break!
Group related items together—move them physically close to
each other so the related items are seen as one cohesive group
rather than a bunch of unrelated bits.

6. Proximity
There are five, maybe six, entry points on this business card. That’s
too many. Where do you start reading? Maybe you start with where
the person works. But then where? Nothing seems to go together.
Your eyes jump around the card, not knowing where to stop to read.

7. Proximity
But look at this card. Items that belong together have been put
together. Now this card makes sense. You eyes will stop three times,
not five. Your eyes don’t scatter all over the card. This card is easier
to read.

8. Proximity
Bad business card
Better business card

9. Proximity
UNIVERSITY OF MICHIANA
WHAT’S NEW FROM
COOPERATIVE EXTENSION
THE BABY PLACE
December 2002
What items above should be grouped into closer proximity? The two
items at the top left corner are in close proximity, implying a
relationship. Should these two have a relationship?
WHAT’S NEW FROM . . .
The Baby Place
University of Michiana
Cooperative Extension
December 2002
Was this your logical conclusion? Have the proper relationships been
established?

10. WHAT’S NEW FROM . . .
The Baby Place
University of Michiana
Cooperative Extension
December 2002
Notice a few other changes:
We’ve changed most of the letters to lowercase, which gives more
room to make the flag stronger.
The corners have been changed from rounded to straight, giving it a
cleaner, stronger look.
The graphic was enlarged to make it a better visual element.

11. Proximity
National Honor Society
Flower sale
Initiation
Car Wash
Tutoring students
Band
Trip to Washington D.C.
Concerts
Marching at games
Popcorn sales
Parent night
Chess club
Weekly games
Winter tournament
Holiday game sale
Computer Tech Club
Computer assistance
Job shadowing
Community game night
Jazz Dance Club
Winter recital
Spring recital
Halftime show at two games
National Honor Society
Flower sale
Initiation
Car Wash
Tutoring students
Band
Trip to Washington D.C.
Concerts
Marching at games
Popcorn sales
Parent night
Chess Club
Weekly games
Winter tournament
Holiday game sale
Computer Tech Club
Computer assistance
Job shadowing
Community game night
Jazz Dance Club
Winter recital
Spring recital
Dance at two games

18. Proximity
Photography Workshop
Michigan State University
Saturday, Feb. 1, 2003
Photo Beginnings
Know your camera
Lighting
Seeing your Work
Processing film
Developing prints
Darkroom strategies
Saturday, Feb. 8, 2003
Advancing your Skills
Burning and dodging
Pushing film
Sports photography
Saturday, Feb. 15, 2003
Open to all
All workshops in Room 243
Communication Arts Building
Michigan State University
Cost per workshop: $25
For registration information, please call (517) 353-6761.

19. Proximity

20. The principle of Alignment
Choose an invisible line and line
elements along it. Don’t throw things
on the page arbitrarily.

21. Alignment
Every item on the page should have a visual connection with
something else on the page.
When items are aligned on the page, a stronger, cohesive
unit is created.
Even if the elements are physically separated form each
other, it they are aligned, there is an invisible line that connects
them, both in your eye and your mind.
Don’t throw things on the page arbitrarily. Find an invisible
line and place items against it.

22. Alignment
345 Cedar St.
St. Paul, MN 55101-1057
(651) 222-5011
Remember this card? Everything is
scattered all over here. It looks
unorganized and is hard to follow.
Lauri Hopple
Senior Editor/Visuals
(651) 228-5535
Lhopple@pioneerpress.com
When we place items along
a line, whether actual or
imaginary, items begin to
look more organized.

23. Alignment
The invisible line runs
along the right hand side,
connecting the text.

24. Alignment
The Search
for Students’ Rights
By Maria Johnson
March 18, 2002
JRN 430
This is a typical report cover,
right? This standard format
presents a dull, almost amateurish
look, which may influence
someone’s initial reaction to the
report.

25. Alignment
The Search
for Students’ Rights
By Maria Johnson
March 18, 2002
JRN 430
The strong flush-left alignment
gives the report cover a more
sophisticated impression. Even
though the author’s name is far
from the title, that invisible line of
the strong alignment connects the
two text blocks.

26. Alignment
You are warmly
invited to
attend!
Centered. Really rather dull.
You
are
warmly
invited
to
attend!
If you are going to center text,
at least make it obvious.

27. Alignment
You
are
warmly
invited
to
attend!
Experiment with uncentering
the block of centered type.
You
are
warmly
invited
to
attend!
If you’re going to center the
type, experiment with making it
more dramatic in some other
way.

28. Alignment
PANDA FACTS
The Panda Bear is a probably the most famous
Endangered Animal. The Panda lives in six small
areas located in China . In China they call the Panda
"Xiongmao", which means Giant Cat Bear. The Panda
was believed to have magical powers that could ward
off natural disasters and evil spirits. Writings about the
Pandas can be traced back 3,000 years. They were
even kept as pets by Chinese Emperors. The Panda
was first introduced to the Western world in 1869 by a
French missionary. He sent a pelt to a Museum in
Paris.
PANDA FACTS
The Panda Bear is a probably the most famous
Endangered Animal. The Panda lives in six small
areas located in China . In China they call the Panda
"Xiongmao", which means Giant Cat Bear. The Panda
was believed to have magical powers that could ward
off natural disasters and evil spirits. Writings about the
Pandas can be traced back 3,000 years. They were
even kept as pets by Chinese Emperors. The Panda
was first introduced to the Western world in 1869 by a
French missionary. He sent a pelt to a Museum in
Paris.

29. Alignment

30. Alignment

37. The principle of Repetition
Repeat some aspect of the design
throughout the entire piece.

38. Repetition
Choose some element to repeat:
typeface
boldness
an icon
a bullet
spatial relationships
a thick rule line
color, etc.
The repeating element can be anything a reader will visually
recognize.
Repetition can be thought of as consistency. It is a conscious
effort to unify all parts of a design.

39. Repetition

40. Repetition

41. Repetition

42. Repetition

45. The principle of Contrast
If you are going to use contrasting
elements, make sure they really
contrast.

46. Contrast
Contrast is one of the most effective ways to add visual interest
to your page—a striking interest that makes you want to look at the
page—and to create an organizational hierarchy among different
elements.
The important thing to remember is that for contrast to be
effective, it must be strong. Do not be a wimp!
Avoid elements on the page that are merely similar. Use contrast
with typefaces, type size, color, line thickness, etc.
It two elements on the page are not exactly the same, then make
them different. Really different.
Examples of contrast
Large type, small type
Graceful oldstyle font with a bold sans serif font
A thick line with a thin line
Widely spaced lines with closely packed lines
A small graphic with a large graphic, etc.

47. Contrast

48. Contrast

49. Contrast
Which one do you like better?

50. Contrast

55. Contrast

56. Contrast

57. Contrast

58. The End