Principles of Multimedia and Contiguity

1,102 views
977 views

Published on

This is my presentation on principles of multimedia and contiguity for EDTECH 513 - Multimedia at Boise State University, Summer 2009.

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,102
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Principles of Multimedia and Contiguity

  1. 1. Teaching Multimedia and Contiguity Principles Using Static Multimedia EDTECH 513: Summer Semester 2009 Robert Kilner
  2. 2. <ul><li>Instructional Objective: </li></ul><ul><li>At the conclusion of this lesson, students will be able to describe, explain and provide examples of multimedia and contiguity principles as they apply to good practice in the fields of curriculum and education. </li></ul>
  3. 3. Principles of Multimedia <ul><li>Multimedia principles state that when creating a multimedia presentation, both words and graphics should be included, but the graphics selected MUST support learning. </li></ul><ul><li>Neither by itself is good enough to convey the proper message. </li></ul>
  4. 4. An Example of Good Use of Multimedia This is a good use of multimedia because it includes both text and graphics to go along with the text. The text and graphics support learning as they provide introductions to each section. These are called explanative graphics. Most of the graphics can be clicked on to enter various other parts of the site.
  5. 5. An Example of Poor Use of Multimedia This site is a poor example as it only includes links with no descriptions and graphics to support the text. Even the text does nothing in the way of supporting learning.
  6. 6. Another Example of a Poor Use of Multimedia This AT&T site from Canada is a poor use of multimedia since there are entirely too many “Decorative” graphics. That is, graphics that do not add to the learning process.
  7. 7. Different Types of Useful Graphics <ul><li>Decorative – Added for aesthetic appeal or for humor. </li></ul><ul><li>Representational – Illustrate the appearance of an object. </li></ul><ul><li>Organizational – Show qualitative relationships among content. </li></ul><ul><li>Transformational – Illustrate changes in time or over space. </li></ul><ul><li>Interpretive – Make intangible phenomena visible and concrete. </li></ul><ul><li>Relational – Summarize quantitative relationships. </li></ul>
  8. 8. Different Types of Graphics and Their Uses A video showing two effective sales approaches. An animation showing genes passing from parents to offspring. Transformational, Interpretive Guidelines that result in completion of a task; cause-and-effect relationships Principle An animated illustration of how to use a spreadsheet. A diagram with arrows showing how to install a printer cable. Transformational A series of steps resulting in completion of a task Procedure Animations of how the heart pumps Still diagrams to illustrate how a bicycle pump works. An animation showing how a virus invades a cell. Transformational Interpretive Relational A description of how something works Process A tree diagram of biological species. Three excel formulas to illustrate formatting rules Representational Organizational Interpretive Groups of objects, events or symbols designated by a single name Concepts A screen capture of a spreadsheet. A table of parts’ names and specifications Representational, Organizational Unique and isolated information such as specific application screens, forms, or product data Facts Example Useful Graphic Types Description Content Type
  9. 9. Principles of Contiguity <ul><li>Principle #1: </li></ul>Always place printed words near corresponding graphics. Users should not have to click back and forth between pages or scroll up and down a page to tie the information and graphics together. The picture above is a set of diagrams with instruction for origami. Each picture represents a step described by the text below it.
  10. 10. An Example of Good Use of Contiguity <ul><li>The diagram above shows levels of poverty within Italy and next to the numbers are text on how each step was compiled. This is a good example since it includes text directly next to the graphics they discuss. </li></ul>
  11. 11. An Example of Poor Use of Continuity The picture above shows directions on how to assemble Disney’s “Wall-E.” However, there are no instructions whatsoever, so the reader is left to try to figure it out for themselves, without any guide to lead them or help them troubleshoot.
  12. 12. Another Example of a Poor Use of Contiguity Here, the text does not match the graphics, therefore, the principle of contiguity is violated.
  13. 13. Contiguity Principle #2 <ul><li>Spoken words that describe an event should play at the same time as the graphic depicting the event. When a graphic is a video showing how to perform a task, the narration describing each step should be presented at the same time as the action shown on the screen. </li></ul><ul><li>In the example at the right, when a country is clicked on in the correct sequence, a text box appears at the right with details, and a voice comes over the speakers to discuss the conquest of those lands. </li></ul>
  14. 14. Assessment Question 1 <ul><li>Which of the following pictures below is an example of a website that demonstrates a good use of multimedia? </li></ul>If you answered A. you are correct, since it shows both graphics and text. A. B.
  15. 15. Assessment Question #2 <ul><li>Which of the following pictures is an example of a good use of the continuity principle of design? </li></ul>A. B. If you selected slide “B,” you are correct. Slide B demonstrates the sustainability of resources in Baltimore, Maryland. Each part represents a different resource and the description of where it falls into the rankings and what the color wheel means are in close proximity to the graphics.
  16. 16. Resources <ul><li>http://www.sustainlane.com/us-city-rankings/cities/baltimore </li></ul><ul><li>http://pro.sony.com/bbsc/ssr/cat-digitalsignage/resource.solutions.bbsccms-assets-cat-digsignagedev-solutions-vspns7solutions.shtml </li></ul><ul><li>http://www.ssw.com.au/ssw/Standards/Rules/RulesToBetterWebsitesLayout.aspx </li></ul><ul><li>http://www.att.ca </li></ul><ul><li>http://www.creativecommons.org </li></ul>

×