Presentation+of+Information

= Presentation of Information = = Tracy Holbert = = =

= = = Definition and Description = = ﻿ =
 * < ==== The effective presentation of instructional materials incorporates specific principles of design and function. Just as experienced teachers ====

||

= Summary of Literature: Presenation of Information and Learning Theory =
 * ==== How we learn and how presentation of media interacts with our ability to attent, process and retain information has many schools of thought. ====

weaknesses and learning styles.
||

Design Essentials

 * Broadly speaking there are two fundamentals to consider when designing.
 * Composition
 * Organization and Formatting

====Composition, that is, what to include in the product is comprised from use text, graphics, audio and video elements. The components ==== ====should be used to compliment and enhance the desired learning goals. Alessi and Trollip (2001) discuss the limitation and ====

**Text** -

 * ====Focus on readability and spacing ====

**Graphics** -
 * A picture tells a thousands words, but overuse can be a distraction to the learning goal
 * Graphics should reinforce the main ideas and concepts being presented and not used as merely decoration that may distract the learner

**Audio** -
 * Benifical to support comprehension
 * High quality recording is essential
 * Allow for user control options

**Video** -
 * <span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">Like graphics video should be used sparingly and to support key concepts
 * <span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">Keep edicational videos short and to the point
 * <span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">Allow for user control options

to draw the reader to key ideas.
====**<span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">C.R.A.P. **<span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">- ==== <span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">Made popular by Robin Williams in his book //The Non-Designer’s Design Book//, the acronym C.R.A.P. (contrast,

<span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">These design elements are explained below.
||

__ Contrast __
==== Contrast provides readers <span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">﻿ with visual clues which define and separate dominant and subordinate ideas within the presentation ====
 * ==== **Contrast** helps to differentiate and distinguish between information elements such as the headline, subtitles, body text and graphics. ====

[]
||

__ Repetition __

 * ==== The cohesion of a design in large part is a reflection of the repetition of the layout. Consistent use of typeface characteristics such as font, ====

general rule use no more than two font types in your product one for your headlines and on for the body text.
||


 * [[image:warhol5.jpg width="234" height="245" caption="Repetion Andy Warhol, Flowers 1970"]] || [[image:155da_design13.jpg width="302" height="250" caption="Repetition in print media"]] ||
 * || Image from [] ||

__<span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%;">Alignment __

 * ==== Alignment within your design pertains to use of space and balance of text and visual elements. Good alignment refers to how the different ====

[]
||


 * ~ [[image:align-non_example.gif width="405" height="276" caption="Alignment Non Example"]] || [[image:align-left.gif width="269" height="281" caption="Alignment Left"]] ||


 * [[image:align-center.gif width="271" height="275" caption="Center Alignment"]] || [[image:align-right.gif width="274" height="282" caption="Alignment Right"]] || [[image:align-break.gif width="275" height="272" caption="Alignment Break for Emphasis"]] ||

<span style="font-family: Arial,Helvetica,sans-serif; font-size: 110%;">__ Proximity __
plan and sequence a learning objective to scaffold understanding, the proximity of information organizes and groups ideas together to create an
 * While designing the layout of your product consider how your information is organized into meaningful “chunks”. Much the same way an instructor will

Below find a link to a short video demonstrating repetition, alignment and proximity.
<span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">Use the blue back arrow icon in the upper left side of the screen to navigate back to this wiki page. <span style="font-family: Arial,Helvetica,sans-serif; font-size: 120%; margin: 0in 0in 0pt;">﻿[] ||

<span style="color: #000000; font-family: Georgia,serif; font-size: 150%; line-height: 0px; overflow: hidden;">

 * <span style="background-color: #d5d2d2; font-family: Arial,Helvetica,sans-serif; font-size: 130%; margin: 0in 0in 0pt;">[[image:Proxmity_Non_Example.gif width="244" height="318" caption="Proximity Non Example"]] || [[image:Proximity_good_example.gif width="267" height="326" caption="Proximity Good Example Image fromhttp://desktoppub.about.com/od/proximity/Proximity.htm "]] ||

<span style="color: #000000; font-family: Arial,Helvetica,sans-serif; font-size: 130%; overflow: hidden;">References

 * About.com. (2011). //Desktop Publishing.// Retrrieved April,9,2011 from []
 * Alessi, S. M., Trollip, S. R. (2001). //Multimedia for learning: Methods and development.// Boston, MA: Allyn and Bacon.
 * Berdan, R. (2004). Composition and the elements of visual design. In Photo Composition Articles. Retreived from []
 * Brown, A (n.d.). //Visual design basics: Creating effective handouts, flyers and brouchures//. Teaneck, NJ: Consortium of MS Centers
 * Ormrod, J. (2011). //Educational Psychology.// Boston, Ma: Allyn & Bacon.
 * Soza, T. (2009). Visual Literacy: The missing piece of your technology integration course. //TechTrends, 53//(2), 55-58.
 * Yeh, H., Cheng Y. (2009). The inlfuence of the instruction of visual design principles on improving pre-service teachers' visual literacy. //Computers and Education, 54//, 244-252