1 / 53

The best layout feature with…

The best layout feature with…. Visual Graphics for Instructional Design. require a few standard. rules. ONTRAST. LIGNMENT. IMPLICITY. ROXIMITY. MPHASIS. EPETITION. 1. CONTRAST. Visual Graphics for Instructional Design. Color. Image. Typography (font). CONTRAST.

odele
Download Presentation

The best layout feature with…

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. The best layout feature with…

  2. Visual Graphics for Instructional Design require a few standard rules

  3. ONTRAST LIGNMENT IMPLICITY ROXIMITY MPHASIS EPETITION

  4. 1 CONTRAST

  5. Visual Graphics for Instructional Design Color Image Typography (font) CONTRAST

  6. Visual Graphics for Instructional Design Color Image Typography (font) [ Distinguish the contrast ]

  7. Visual Graphics for Instructional Design contrast hard to see

  8. Visual Graphics for Instructional Design contrast Must be high contrast to be easily seen

  9. Low contrast is for camouflage

  10. Easiest way to check high contrast is if picture has clear definition when in black & white

  11. This is grey scale black & white

  12. This is pure high contrast black & white

  13. Low contrast pictures are not clear in black & white

  14. Constructivism multimedia But sometimes you purposely want confusion animation Theories of Theories of Learning typography Information Processing graphics Desktop publishing

  15. 2 ALIGNMENT

  16. Text1 Text2 Images ALIGNMENT

  17. Text1 Text2 Images [ Arrange in a parallel order ]

  18. Visual Graphics for Instructional Design Focus Graphic Layout Proportion The focus of the visual stimuli must very clearly reflect and emphasize its objective Focuson the page with no one section is heavier than the other. Or, a designer may intentionally throw elements out of balance to create tension or a certain mood. .

  19. Visual Graphics for Instructional Design balance can be symmetrical

  20. Visual Graphics for Instructional Design OR balance can be asymmetrical

  21. asymmetricalbalance

  22. Graphic Layout Proportion Center focus alignment is most Powerful but beware of poor division of information because it can cause disruption in reading

  23. Graphic Layout Proportion Center focus alignment is most Powerful but beware of poor division of information because it can cause disruption in reading Focus Division of Information

  24. Graphic Layout Proportion But beware! Center Focus Alignment is NOT good for multiple layer or long presentations. Center Focus tends to imply “self-containment”, thus implying “the end”. It is most effective when designing a “one-off” visual, like a poster. For longer information, if it must be symmetrical, a better layout would be the Forced Justify.

  25. Graphic Layout Proportion However, the Forced Justify_alignment_is very difficult to control, as you mayfind_funny_gaps_in_between text that cannot be controlled.

  26. Visual Graphics for Instructional Design best rule to remember…

  27. 3 SIMPLICITY

  28. SIMPLICITY

  29. Keep your message simple • Use text and graphics absolutely necessary to get your point across. • Superfluous graphics can interfere with understanding. • Overabundance of fonts or colors can distract. SIMPLICITY

  30. [ Simplify your presentation ]

  31. Visual Graphics for Instructional Design Simplicity is the best policy “Superfluous graphics can interfere with understanding” Anglin, G., Towers, R., & Levie, H. (1996). Visual message design and learning: The role of static and dynamic illustrations. In D.H. Jonassen (Ed.), Handbook of Research for Educational Communications and Technology . New York: Simon and Schuster Macmillan.

  32. Visual Graphics for Instructional Design Graphics four functions: Levie, W.H. & Lentz, R. (1982). Effects of text illustrations: A review of research. Educational Communications and Technology Journal, 30 (4), 195-232.

  33. Issues to consider in Graphics: Misanchuk, E., Schwier, R. & Boling, E. (in press). Visual design for instructional multimedia

  34. Visual Graphics for Instructional Design Text Should also be simple “An overabundance of fonts or colors can distract rather than assist learning” Levie, W.H. & Lentz, R. (1982). Effects of text illustrations: A review of research. Educational Communications and Technology Journal, 30 (4), 195-232.

  35. Consistency & Simplicity Do NOT use more than three (3) font variations: Size Typeface Effects

  36. Consistency & Simplicity Do NOT use more than three (3) font variations: Size Typeface Effects …by the way notice the Focus

  37. Powerful Presentations using Creative Media for Instructional Design with maximum Impact & Effect Strategy & Tactics Using both graphics and text “The Whole is More Than the Sum of Its Parts” Wertheimer, M. (1924). Gestalt theory. Social Research, 11, translation of lecture at the Kant Society, Berlin.

  38. Gestalt Theory figures adapted from examples in: Mullet, K. & Sano, D. (1995). Designing visual interfaces: Communication oriented techniques. Englewood Cliffs, NJ: Prentice Hall

  39. 4 PROXIMITY

  40. PROXIMITY proximity or closeness creates a bond between people and between elements on a page. How close together or far apart elements are placed suggests a relationship (or lack of) between otherwise disparate parts.

  41. Gap between Texts Gap between Graphics Gap between Texts and Graphics PROXIMITY

  42. Gap between Texts Gap between Graphics Gap between Texts and Graphics [ Do a suitable space within object ]

  43. 5 EMPHASIS

  44. EMPHASIS

  45. [ You should have one main item ]

  46. 6 REPETITION

More Related