Creating the  best materials Design principles based  on research
Why should I pay attention to this?  <ul><li>Empirical research conducted by  </li></ul><ul><li>Richard E. Mayer, Professo...
Multimedia Principle <ul><li>Students learn better from words and pictures than from words alone  </li></ul>Words
What can I do?  <ul><li>Add clipart to handouts </li></ul><ul><li>Use concept mapping such as Inspiration and Mindmeister ...
Spatial contiguity principle <ul><li>Students learn better when corresponding words and pictures are presented near rather...
What can I do?  <ul><li>Instead of adding images at the top or corners of your work, consider incorporating the images int...
Temporal contiguity principle <ul><li>Students learn better when corresponding words and pictures are presented simultaneo...
What can I do?  <ul><li>In PowerPoint, use your custom animation to have images and text enter together.  </li></ul>
Coherence Principle <ul><li>Students learn better when extraneous words, pictures, and sounds are excluded rather than inc...
What can I do?  <ul><li>Ask yourself if you’re adding extras because you should or because you want to do so.  </li></ul><...
Modality principle <ul><li>Students learn better from animation and narration than from animation and on-screen text.  </l...
What can I do?  <ul><li>Consider PhotoStory where you can add narration to your images.  </li></ul><ul><li>Attend an audac...
Redundancy Principle <ul><li>Students learn better from animation and narration than from animation, narration, and on-scr...
What can I do?  <ul><li>With this principle, less is more.  </li></ul><ul><li>Eliminate all but essential text and increas...
Individual differences principle <ul><li>Design effects are stronger for low-knowledge learners than for high-knowledge le...
Give me some guidelines! <ul><li>The following slides are a good set of guidelines to use.  </li></ul><ul><li>Of course yo...
Orient Users <ul><li>Provide information on each screen or webpage that tells users where they are in the presentation.  <...
Justify Text Appropriately <ul><li>Everything should be left justified except for numbers in a table, which should be righ...
Limit Type Styles <ul><li>Do not use more than three type styles per screen.  </li></ul><ul><li>Consider one style for hea...
Limit Colors <ul><li>Do not use more than three or four colors per screen.  </li></ul><ul><li>Use color to </li></ul><ul><...
Standardize use of colors <ul><li>Set up a color scheme and use it consistently.  </li></ul><ul><li>Consider using blue as...
Enhance Text with Graphics  and Interactivity <ul><li>Do not produce or accept screens that are only text.  </li></ul><ul>...
Eliminate Superfluous Items <ul><li>Every object on the screen should have meaning.  </li></ul><ul><li>Consider removing b...
Upper and Lowercase <ul><li>DO NOT USE ALL CAPS!  </li></ul><ul><li>Research shows that for most people it is easier to re...
Keep Text Lines Short  <ul><li>Keep line lengths between eight and ten words when creating materials.  </li></ul>
Single Spacing <ul><li>Use a double space between paragraphs rather than using an indent.  </li></ul>
Simplify the Structure <ul><li>Make it as easy as possible for users to find the information.  </li></ul><ul><li>Strive fo...
Limit the Focus <ul><li>Feature one idea per screen.  </li></ul><ul><li>Consider a new page on your website section for ea...
Provide Emphasis <ul><li>Use  bold ,  italics , or  underlining  to emphasize ideas.  </li></ul><ul><li>Strive for consist...
Know your audience <ul><li>Consider your purpose and your audience before you start.  </li></ul><ul><li>If it is a handout...
Do Not Flash <ul><li>Do not use flashing text to get the attention of the viewer.  </li></ul><ul><li>This makes it hard to...
Use Lists  <ul><li>Use bullets, numbers, and checkmarks when you can especially on webpages.  </li></ul><ul><li>˙  4 </li>...
Navigate consistently <ul><li>Keep navigation buttons in the same position from one screen to the next.  </li></ul><ul><li...
Do not stack text Stacked text  (vertical text)  is hard to read.
Include multiple graphic types <ul><li>Pictures are just one type of visual. </li></ul><ul><li>Consider adding charts, map...
Organize the Screen <ul><li>Group objects for meaning and better visual clarity.  </li></ul><ul><li>Use a border or white ...
Size Matters <ul><li>Size determines importance to a viewer.  </li></ul><ul><li>Be sure to resize your images to reflect t...
Placement Matters <ul><li>Location also determines importance.  </li></ul><ul><li>Items at the top appear to have more imp...
Additional resources <ul><li>www.webstyleguide.com </li></ul><ul><li>www.colin.mackenzie.org/webdesign </li></ul>
References  <ul><li>Gagne, E.D., Yekovich, C.W., & Yekovich, F.R. (1993).  The cognitive psychology of school learning .  ...
Upcoming SlideShare
Loading in …5
×

Creating The Best Materials Design Principles

0 views
1,284 views

Published on

Published in: Business, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
0
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
69
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Creating The Best Materials Design Principles

  1. 1. Creating the best materials Design principles based on research
  2. 2. Why should I pay attention to this? <ul><li>Empirical research conducted by </li></ul><ul><li>Richard E. Mayer, Professor of Psychology at UC Santa Barbara supports these principles as good practice. </li></ul><ul><li>Dr. Mayer has published a wealth of research on multimedia learning. </li></ul>
  3. 3. Multimedia Principle <ul><li>Students learn better from words and pictures than from words alone </li></ul>Words
  4. 4. What can I do? <ul><li>Add clipart to handouts </li></ul><ul><li>Use concept mapping such as Inspiration and Mindmeister </li></ul><ul><li>Add animations and/or clipart to your presentations </li></ul>
  5. 5. Spatial contiguity principle <ul><li>Students learn better when corresponding words and pictures are presented near rather than far from each other on the page or screen. </li></ul>
  6. 6. What can I do? <ul><li>Instead of adding images at the top or corners of your work, consider incorporating the images into the text. </li></ul>Change a picture into a watermark and type over top of it.
  7. 7. Temporal contiguity principle <ul><li>Students learn better when corresponding words and pictures are presented simultaneously rather than successively. </li></ul>
  8. 8. What can I do? <ul><li>In PowerPoint, use your custom animation to have images and text enter together. </li></ul>
  9. 9. Coherence Principle <ul><li>Students learn better when extraneous words, pictures, and sounds are excluded rather than included. </li></ul>
  10. 10. What can I do? <ul><li>Ask yourself if you’re adding extras because you should or because you want to do so. </li></ul><ul><li>Share your presentation with a friend and ask him or her to help you eliminate distracting extras. </li></ul>
  11. 11. Modality principle <ul><li>Students learn better from animation and narration than from animation and on-screen text. </li></ul>
  12. 12. What can I do? <ul><li>Consider PhotoStory where you can add narration to your images. </li></ul><ul><li>Attend an audacity training to understand how to add audio files. </li></ul><ul><li>(Look for an upcoming training.) </li></ul>
  13. 13. Redundancy Principle <ul><li>Students learn better from animation and narration than from animation, narration, and on-screen text. </li></ul>
  14. 14. What can I do? <ul><li>With this principle, less is more. </li></ul><ul><li>Eliminate all but essential text and increase your use of narration. </li></ul>
  15. 15. Individual differences principle <ul><li>Design effects are stronger for low-knowledge learners than for high-knowledge learners and for high-spatial learners than for low-spatial learners. </li></ul>
  16. 16. Give me some guidelines! <ul><li>The following slides are a good set of guidelines to use. </li></ul><ul><li>Of course you know your students better, but these are general rules of thumb to guide your choices when creating materials. </li></ul>
  17. 17. Orient Users <ul><li>Provide information on each screen or webpage that tells users where they are in the presentation. </li></ul><ul><li>Use headings and captions to show your organization </li></ul>
  18. 18. Justify Text Appropriately <ul><li>Everything should be left justified except for numbers in a table, which should be right justified. </li></ul>
  19. 19. Limit Type Styles <ul><li>Do not use more than three type styles per screen. </li></ul><ul><li>Consider one style for headings, another for captions, and another for text. </li></ul><ul><li>Be consistent so students can catch on to your system. </li></ul>
  20. 20. Limit Colors <ul><li>Do not use more than three or four colors per screen. </li></ul><ul><li>Use color to </li></ul><ul><ul><li>Attract, hold, or direct attention </li></ul></ul><ul><ul><li>Show relationships </li></ul></ul><ul><ul><li>Enhance data </li></ul></ul>
  21. 21. Standardize use of colors <ul><li>Set up a color scheme and use it consistently. </li></ul><ul><li>Consider using blue as a background because the human retina has fewer blue-sensitive cells than for any other color. </li></ul><ul><li>Avoid the following combinations: </li></ul><ul><ul><li>Red on green, green on blue, and red on blue. </li></ul></ul>
  22. 22. Enhance Text with Graphics and Interactivity <ul><li>Do not produce or accept screens that are only text. </li></ul><ul><li>Text should be accompanied by charts, illustrations, diagrams, and links </li></ul>
  23. 23. Eliminate Superfluous Items <ul><li>Every object on the screen should have meaning. </li></ul><ul><li>Consider removing borders that don’t contribute information and clipart art that is only vaguely related to your topic. </li></ul>
  24. 24. Upper and Lowercase <ul><li>DO NOT USE ALL CAPS! </li></ul><ul><li>Research shows that for most people it is easier to read the traditional upper and lowercase type. </li></ul>
  25. 25. Keep Text Lines Short <ul><li>Keep line lengths between eight and ten words when creating materials. </li></ul>
  26. 26. Single Spacing <ul><li>Use a double space between paragraphs rather than using an indent. </li></ul>
  27. 27. Simplify the Structure <ul><li>Make it as easy as possible for users to find the information. </li></ul><ul><li>Strive for consistency within a presentation and with your webpages. </li></ul>
  28. 28. Limit the Focus <ul><li>Feature one idea per screen. </li></ul><ul><li>Consider a new page on your website section for each project, idea, etc. </li></ul>
  29. 29. Provide Emphasis <ul><li>Use bold , italics , or underlining to emphasize ideas. </li></ul><ul><li>Strive for consistency so viewers can follow. </li></ul>
  30. 30. Know your audience <ul><li>Consider your purpose and your audience before you start. </li></ul><ul><li>If it is a handout, you can use a smaller font than you would for a whole group presentation. </li></ul>
  31. 31. Do Not Flash <ul><li>Do not use flashing text to get the attention of the viewer. </li></ul><ul><li>This makes it hard to focus. </li></ul><ul><li>Instead, use color and location to call attention to the information. </li></ul>
  32. 32. Use Lists <ul><li>Use bullets, numbers, and checkmarks when you can especially on webpages. </li></ul><ul><li>˙ 4 </li></ul>
  33. 33. Navigate consistently <ul><li>Keep navigation buttons in the same position from one screen to the next. </li></ul><ul><li>If you use action buttons in PowerPoint, remember to have them look the same and appear in the same place. </li></ul>
  34. 34. Do not stack text Stacked text (vertical text) is hard to read.
  35. 35. Include multiple graphic types <ul><li>Pictures are just one type of visual. </li></ul><ul><li>Consider adding charts, maps, tables, diagrams, or photographs </li></ul>
  36. 36. Organize the Screen <ul><li>Group objects for meaning and better visual clarity. </li></ul><ul><li>Use a border or white space background to make groups stand out to the viewer. </li></ul>
  37. 37. Size Matters <ul><li>Size determines importance to a viewer. </li></ul><ul><li>Be sure to resize your images to reflect the level of importance you want to convey. </li></ul>
  38. 38. Placement Matters <ul><li>Location also determines importance. </li></ul><ul><li>Items at the top appear to have more importance to the viewer. </li></ul><ul><li>Think of it like the newspaper-the bigger story has a large headline high up on the page. </li></ul>
  39. 39. Additional resources <ul><li>www.webstyleguide.com </li></ul><ul><li>www.colin.mackenzie.org/webdesign </li></ul>
  40. 40. References <ul><li>Gagne, E.D., Yekovich, C.W., & Yekovich, F.R. (1993). The cognitive psychology of school learning . Boston: Little, Brown. </li></ul><ul><li>Marcus, A. (1991). Graphic design for electronic documents and user interfaces . New York: ACM Press. </li></ul><ul><li>Horton, W. (1991). Illustrating computer documentation . New York: Wiley. </li></ul><ul><li>Mayer, R.E. (2001). Multimedia Learning . Cambridge: Cambridge University Press. </li></ul>

×