1. The document discusses visual principles for instructional design including ensuring legibility, reducing cognitive load, focusing attention, and engaging the audience. 2. It addresses elements of visual design like icons, text formatting, color, alignment, and use of grids to guide the eye across a layout. Principles of design discussed include the rule of thirds, asymmetry, proximity, and consistency. 3. Examples are provided of how to use visual storyboards, checklists, and other planning tools to apply these design principles when creating visuals to enhance instruction.

1. Visual Principles Robert Heinich

2. Goals of Visual Design1. Ensure legibility 2. Reduce effort (cognitive load) 3. Increase active engagement 4. Focus attention Example: http://www.kidsknowit.com/ Example: http://pbskids.org/

3. Role of Visual Design Reference Iconic symbol Motivate Attention Elicit emotion Simplify Storage/Retrieval Organize Illustrate relationships Increase comprehension Audience ConsiderationsVisual Literacy level

4. Age/Development (section vs. whole)

5. Culture

6. Socioeconomic background

7. Preference Effectiveness Practice time Decode: View Critique Analyze Encode: Create Produce Sequence

8. Visual Design Processes Procedures Elements What visual and verbal components will enhance the display? Patterns What underlying pattern(s) will you choose for the elements? Arrangement How will you arrange the elements within the pattern?

9. Visual ElementsAnalogic Writing a Narrative Essay Realistic Organizational

10. Verbal ElementsLettering Style Serif ("feet") - printed text San Serif (no "feet") - online text Limit 4 (bold, italic, fonts, etc.) Size Lowercase - 1/2" = every 10 feet of viewing distance Spacing O P T I C A L S P A C I N G Color Contrast Audience needs

11. Visual AppealSurprise! Texture Interaction

12. Have you ever read a document where the author hasdecided to center a long-ish block of text (kind oflike I am doing here?) Isn't it a little harder to read thistext when it's centered than it would be if it were left-justified?We might argue that it is just a matter of convention, thatwe are just used to reading text that is left justified. Butthe principle of alignment suggest that creating astrong implied line connecting objects on the pagecreates cohesion.

13. Pattern Establish an underlying pattern to decide how the viewer's eye will flow across your display. Major factors that affect the overall look: alignment of elements

14. shape

15. balance

16. style

17. color scheme and appealAlignment Placing elements within a display so they have clear visual relationship to one another.Right hand alignment

18. Grids keep complex alignments all lined up.

19. It's okay to break alignment when it serves a specific purpose such as to intentionally create tension or draw attention to a specific element of the page. (Also an example of asymmetical balance.)

20. Rule of Thirds, Shape and Balance "Rule of Thirds" - elements arranged along any of the one-third dividing lines take on importance and liveliness. Shape - use a pattern that attracts and focuses attention. Balance - balance is achieved when the "weight" of the elements in a display is equally distributed.

21. all over balance rule of thirds and asymmetrical balance

22. use of shape

23. Color Scheme Complementary colors lie opposite each other on a color wheel. Analogous colors lie next to each other on the color wheel.Warm colors exciteCool colors calm

24. Color Appeal Cheerios uses complementary colors to appeals to consumers. The main colors are warm, exciting colors. Johnson's uses analogous cool colors to appeal to consumers.

25. ArrangementProximity - put related elements close together. Directionals - are used to direct the viewers to "read" the display in a particular sequence. Contrast - Dark figures show up best on light grounds and light figures show up best on dark grounds. Consistency - Be consistent in use of elements on computer screens, overhead slides, or handouts. Examples http://coe.sdsu.edu/eet/articles/designprin1/start.htm

26. Using directionals Proximity

27. Visual Planning ToolsStoryboard Lettering, Size, Spacing Drawing, Sketching, Cartooning

28. Visual Design Checklist

29. Visual Application Challenge With your group, create a visual to utilize in your final class project using the principles discussed.

30. ReferencesHeinich, R, Molenda, M, Russell, J.D., & Smaldino, S.E. (Ed.). (2002). Instructional media and technologies for learning: visual principles. Columbus, Ohio: Merrill Prentice Hall.