Visual Design for Instruction: Using Graphic Design Principles to Improve Legibility and Readability

Transcription

1 Visual Design for Instruction: Using Graphic Design Principles to Improve Legibility and Readability Abbie Brown, PhD Professor and Author: Instructional Design/Technology

2 Legibility and Readability Readability = understandability One s ability to receive the intended message of the whole document Legibility = clarity of words and images One s ability to determine what the letters and pictures are supposed to be

3 Readability Example (the good) Comedy and Tragedy Classical comedy is often presented as the rise in fortune of a sympathetic central character. Classical tragedy is often presented as the downfall of a basically good person who suffers based on a fatal error or misjudgment. The masks of Thalia (the muse of comedy) and Melpomene (the muse of tragedy) are a traditional symbol of theater arts.

4 Readability Example (the bad) Classical comedy is often presented as the rise in fortune of a sympathetic central character. Classical tragedy is often presented as the downfall of a basically good person who suffers based on a fatal error or misjudgment. Comedy and Tragedy The masks of Thalia (the muse of comedy) and Melpomene (the muse of tragedy) are a traditional symbol of theater arts.

5 Legibility Example (the good) Comedy and Tragedy Classical comedy is often presented as the rise in fortune of a sympathetic central character. Classical tragedy is often presented as the downfall of a basically good person who suffers based on a fatal error or misjudgment. The masks of Thalia (the muse of comedy) and Melpomene (the muse of tragedy) are a traditional symbol of theater arts.

6 Legibility Example (the bad) Comedy and Tragedy Classical comedy is often presented as the rise in fortune of a sympathetic central character. Classical tragedy is often presented as the downfall of a basically good person who suffers based on a fatal error or misjudgment. The masks of Thalia (the muse of comedy) and Melpomene (the muse of tragedy) are a traditional symbol of theater arts.

7 We apply tested and reliable visual design principles to increase the readability and legibility of anything we want people to read and understand. Design Tip: Use images with faces to attract readers. People immediately focus attention on faces (human, animal, or cartoon).

8 Basic Visual Design Principles Contrast Repetition Alignment Proximity The unfortunate acronym - Williams, 2008 Why a duck? We ll be using this image in our examples of contrast, repetition, alignment and proximity. It s a thematic element (repetition) more on this in just a moment.

9 Examples of C.R.A.P. in action Getting our ducks in a row

10 Contrast Getting our ducks in a row

11 Repetition Getting our ducks in a row

12 Alignment Getting our ducks in a row

13 Alignment Getting our ducks in a row

14 Proximity Visual Design Principles! Getting our ducks in a row

15 Proximity Visual Design Principles! Getting our ducks in a row

16 Proximity Visual Design Principles! Negative Space Getting our ducks in a row

17 Design Critique

18 Telecommuting Working from home full-time or part-time is an attractive option for some people. Ensuring telecommuters have the resources they need to be productive employees takes careful planning and regular systemic evaluation. It might come as a surprise to know that over 20% of Londale, Inc. staff telecommute at least three days a month. Londale, Inc. A division of P.L. Enterprises

19 Londale, Inc. A division of P.L. Enterprises Sending a Thank You note can help establish a warm, personal connection with prospective client. The note can thank the client for taking a meeting with you, formalizing a business relationship, or acknowledging a gesture on the client s part. Thank You Notes

20 Working for Londale, Inc. Corporate and personal goals working in concert. Full-time or Part-time? Career Training Employee Benefits Retirement Planning

21 Design Critique Advertisements and Labels

22

23

24

25

26

27

28

29

30

31

32

33 Visual Design for Instruction: Using Graphic Design Principles to Improve Legibility and Readability Abbie Brown, PhD Professor and Author: Instructional Design/Technology