1. Design for Effective Communication
Desktop Publishing
Design
for
Effective Communication

2. Design to enhance communication
We write to communicate.
Pretty does not help this if the document is not read.
Are you Communicating or just making pretty shapes?
You won’t recognize a Joshua Tree if you don’t know what it is.

3. Design Principles C R A P ontrast epetition lignment roximity
Designing for effective Communications
Principles devised by Robin Williams – Graphic Design teacher
Link to Using CRAP

4. G R I T Proximity Refers to how close together items appear on a page.
roup
elated
tems
ogether
Keep unrelated items further apart.

5. Consider The grouping (Proximity) adds sense to the words.
Enfield 5085
Grand Junction Road
(618)
David Roberts
Enfield High School
Enfield High School
David Roberts
Grand Junction Road
Enfield 5085
(618)
Nice balanced business card – looks balanced.
Eye does not know where to go next.
What gets the attention? Then what?
The grouping (Proximity) adds sense to the words.

6. Consider this SIR ROBERT HELPMANN MEMORIAL THEATRE
SOUTH AUSTRALIAN THEATRE GUILD
WHAT’S HAPPENING IN
THEATRE COOPERATIVE
WHAT’S HAPPENING IN
SIR ROBERT HELPMANN MEMORIAL THEATRE
SIR ROBERT HELPMANN MEMORIAL THEATRE
SOUTH AUSTRALIAN THEATRE GUILD
THEATRE COOPERATIVE
DECEMBER 2001
DECEMBER 2001
Which things belong together now?

7. Lists can be difficult Proximity (grouping) adds sense. Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Early learning
Language arts
Science
Maths
Books
Teacher tools
Videos
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound
Proximity (grouping) adds sense.
Early learning
Language arts
Science
Maths
Books
Teacher tools
Videos
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound

8. Proximity Close objects - single visual unit.
Logical path through a document.

9. The purpose of proximity
Organisation
More likely to be read and remembered
Better use of white space

10. Using proximity Avoid too many elements on page
Avoid the 4 corners and middle
Avoid equal spacing
Strengthen relationships that exist
Don’t create relationships between unrelated elements

11. Alignment Place nothing on the page at random
All items should have a visual connection to other items on the page.

12. Consider The elements on this card were all aligned with each other.
David Roberts
(618)
Enfield High School
Enfield High School
David Roberts
David Roberts
Enfield High School
Grand Junction Road
Grand Junction Road
Enfield 5085
Enfield 5085
Grand Junction Road
(618)
(618)
Enfield 5085
6Nice balanced business card – looks balanced.
Eye does not know where to go next.
What gets the attention? Then what?
Improving Proximity improved the connections.
A stronger invisible line connects all elements.

13. Alignment Typical report cover – all centred
Report On History of Desktop Publishing
Report On History of Desktop Publishing
By David Roberts Enfield High School
By David Roberts Enfield High School
Hard left alignment – more sophisticated.
Invisible line connects two distant elements.

14. Aligned Centre You are warmly invited to attend!
Centred – dull and boring
You are warmly invited to attend!
You are warmly invited to attend!
You are warmly invited to attend!
Make the centring obvious
Try setting the centred off-centre
Experiment with making centred text more dramatic

15. Alignment
Every element on a page has a visual connection with some other element.
Provides unity on the page

16. The purpose of Alignment
Organisation
Unification – the elements look as if they belong together
Can determine the ‘look’ of the page – sophisticated, formal, fun, serious.

17. Using Alignment Be conscious of where an element is being placed.
Always look to align each object with another object.
Try to avoid multiple alignments.
Centre consciously – not because it is the easy way out.

18. Repetition Repetition leads to Consistency.
Repeat some aspect of design throughout the whole document.
Bold font
Thick line (rule)
A bullet
A colour
A particular format
Spacial relationships
Repetition leads to Consistency.

19. Remember this list Originally there were some headings.
Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Early learning
Language arts
Science
Maths
Books
Teacher tools
Videos
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound
CD ROMs
CD ROMs
Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Educational
Early learning
Language arts
Science
Maths
Teacher tools
Books
Teacher tools
Videos
Hardware & Accessories .
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound
CD ROMs
Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Educational
Early learning
Language arts
Science
Maths
Teacher tools
Books
Videos
Hardware & Accessories
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound
CD ROMs
Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Educational
Early learning
Language arts
Science
Maths
Teacher tools
Books
Videos
Hardware & Accessories
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound
CD ROMs
Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Educational
Early learning
Language arts
Science
Maths
Teacher tools
Books
Videos
Hardware & Accessories
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound
Better use of Proximity improved readability.
Repetition of bold headings is better.
Repetition of bullets and rules is better still.

20. Repetition
Use existing elements to improve consistency. Turn them into repetitive graphic symbols.
Strengthen headings and subheadings and format them using the same font and style.

21. Repetition Repetition of visual elements throughout a document
Provides unity on the page
Essential on multi-page documents
Also called Consistency

22. What are repeated on all these?
Repetition at work
What are repeated on all these?

23. The purpose of Repetition
Unification – the elements look as if they belong together
Adds visual interest to the page

24. Using Repetition Extend consistencies by emphasizing them.
Consider adding elements to create repetition.
Avoid overdoing repetition.
Be aware of the value of Contrast.

25. Contrast Created when two things are different.
If two things are not the same …….
Make them…….
Really different.
Don’t be a wimp!

26. Contrast – not a new concept
epetition
lignment
roximity C P A R
How did we create the contrast?

27. You are warmly invited to attend!
Contrast
You are warmly invited to attend!
How did we create the contrast?

28. Contrast How did we create the contrast? CD ROMs . CD ROMs
Children’s CDs
Educational CDs
Entertainment CDs
DVDs
Educational
Early learning
Language arts
Science
Maths
Teacher tools
Books
Teacher tools
Videos
Hardware & Accessories .
Cables
Input devices
Mass storage
Memory
Modems
Printers and supplies
Video and Sound
How did we create the contrast?

29. Contrast
How did we create contrast?

30. Contrast
How did we create contrast?

31. Something else which helps
WHAT’S HAPPENING IN
SIR ROBERT HELPMANN MEMORIAL THEATRE
SOUTH AUSTRALIAN THEATRE GUILD
THEATRE COOPERATIVE
DECEMBER 2001
WHAT’S HAPPENING IN
Sir Robert Helpmann Memorial Theatre
Which things belong together now?
SOUTH AUSTRALIAN THEATRE GUILD
THEATRE COOPERATIVE
DECEMBER 2001
Where is the contrast greatest?
Block capitals are poor for contrast!

32. Contrast For contrast to work, things can not be similar.
Different elements must be very different.

33. The purpose of Contrast
Adds visual interest to the page.
Helps with organization of information.

34. Using Contrast Most often achieved through choice of typeface. Font
Size
Style
Colour
Weight of line can be useful

35. Improving Design Skills
Decide on the focus.
Make it big and bold
Set in upper/lower case
Decide on the groups.
Set the groups together (Proximity)
Leave space between the groups
Arrange elements on a strong alignment.
Remove conflicting elements

36. Improving Design
Comment on the Design Principles

37. Contrast All the same font Reduces contrast
All block capitals Reduces contrast
Heavy border Reduces contrast By reducing white space
Logos in corners Reduces contrast By reducing white space

38. Repetition All the same font Good repetition
(Perhaps 2 fonts would be better, allowing Contrast)
Logos in corners Good repetition But cause problems by reducing white space

39. Alignment Text aligned with graphic top and bottom
Everything centred Boring alignment
Logos all aligned with each other

40. Proximity They are Theatre Supplies Poor proximity
Little grouping of text Poor proximity
And belongs with Professionals Poor proximity
People mixed up with objects Poor proximity
Phone number poorly grouped Poor proximity
Properties hyphenated Poor proximity
Quotes are Obligation Free Poor proximity

41. Improve Me Decide on the focus. Decide on the groups.
Make it big and bold
Set in upper/lower case
Decide on the groups.
Set the groups together (Proximity)
Leave space between the groups
Arrange elements on a strong alignment.
Remove conflicting elements

42. Bibliography
Tollett, J and Williams, R. 2001, Design Workshop, Peachpit Press, Berkeley
Williams, R. 1994, The Non-Designer’s Design Book, Peachpit Press, Berkeley
Weildon, C. 1990, Communicating or Just Making Pretty Shapes, Newspaper Advertising Bureau of Australia Ltd, North Sydney