Multimedia: Visual Communication
    An Introduction to Basic Principles

    Project Based Learning Process for Development The Big Six Authoring Tools Your Computer
    Design Principles Type Color Graphics Links and Navigation
    Rules of Navigation Tips Evaluating the Resource Resources
    Back to Home

    A. Project based learning

    • learner-centered
    • authentic content and purpose
    • challenging
    • the design and development of a product, presentation, or performance is involved
    • collaboration and cooperative learning is required
    • incremental and continual improvement
    • teacher facilitated
    • explicit educational goals are identified
    • rooted in constructivism
    Back to Top

    B. Process for development of multimedia product

    1. Establish criteria and assessment methods
    • Clarify content to be addressed
    • Match content to state standards
    • Identify skills to be applied
    • Identify processes to be demonstrated
    • State methods and measures for assessment
    2. Establish assumptions
    • Purpose is to present information
    • Serves a specific audience
    • Follows Big Six Strategies1
    • Make it innovative (Do not repackage, redesign)
    • Make it simple
    • Make it hot and cool
    • Make it deep, fun, cheap
    3. Determine project focus and audience (“Start With the End in Mind”)
    a. Generate ideas/build consensus
    • Brainstorm (unleash creativity through new metaphors)
    • Categorize/classify
    • Look for associations/connections
    • Look for likenesses/differences
    • Find themes
    • Create essential questions related to topic
    b. Determine type of project
    • Linear visual presentation (sequential, one end)
    • Interactive visual presentation (multiple pathways; branching)
    • Video
    • Print document
    • Other
    c. Identify audience
    • General public (limited)
    • General public (global)
    • Instructor
    • Other
    d. Identify technology resources
    • Audio tape recorders
    • Cameras (still, video, print)
    • CD-ROM (reader and writer)
    • Computer and software
    • Internet access
    • Other
    4. Identify skills needed
      Stages of Adoption
      • Understanding of worldwide audience
      • Graphically and technologically literate
      • Distill; be specific and succinct
      • Perform as a team player
      • Possess high level of communication skills
    5. Develop a proposed plan
    • Articulate assignment in three paragraph proposal
      Paragraph 1: state the essential question
      Paragraph 2: identify the subject, audience, type of project
      Paragraph 3: identify the standards to be addressed in the project
      Paragraph 4: describe needed resources (hardware, software, kinds of resources needed)
    6. Review and share proposals
    • Discuss proposal's relation to the project
    • Feasibility of proposal
    • Relevance of proposal to the essential question
    • Discuss skills, time, resources needed
    • Priorities to accomplish project
    • Group responds to team proposals with what they liked and any suggestions
    7. Develop storyboard, script, or outline
    • Use of index cards, post-its, paper, software (Inspiration) or a draw program
    • Identify tasks, role, responsibilities of team members
    8. Engage in work; execute an effective process
     

    9. Publish
      
    10. Assess projects with respectful, constructive feedback
    Back to Top

    C. The Big Six Skills: An Information Problem Solving Approach

    1. Task definition (define the problem, identify information needed)
    2. Information seeking strategies (determine range of possible sources, evaluate sources)
    3. Location and access (locate sources intellectually and physically, find information within)
    4. Use of information (engage/internalize information, extract relevant information)
    5. Synthesis (organize information, present new knowledge)
    6. Evaluation (judge product for effectiveness, judge problem solving process for efficiency)
    1 © Michael B. Eisenberg, Robert E. Berkowitz, 1990
    Back to Top

    D. Authoring Tools

    • Time-based (Macromind Director) -> Living Books
    • Cards and stacks (HyperCard, HyperStudio, Digital Chisel, mPower, eZedia) -> Myst
    • Object oriented (Apple Media Tool, ScriptX, Authorware) -> Imagination Express
    Back to Top

    E. Know your Computer

    • Microprocessor
    • Hard drive capacity, secondary storage devices available
    • Digitizing capabilities and connectors: scanner, digital camera, camcorder
    • Capturing software for video
    • Amount of RAM in computer
    • Software available
             QuickTime Pro, HyperStudio, iMovie, Microsoft Office, VR Authoring program
    • Peripherals available
             scanner, digital camera, video camera, microphone, CD-ROM discs/drive/recorder
    Back to Top

    F. Understand the Design Principles2

    • Contrast

    • Avoid elements on the page that are merely similar. If the elements (type, color, size, line, thickness, shape, space, etc) are not the same, then make them very different. Add contrast through your typeface choices, line, thicknesses, colors, shapes, sizes, space, etc. Be strong!
    • Repetition

    • Repeat visual elements of the design throughout the piece (color, shape, texture, spatial relationships, line thicknesses, sizes, etc). This develops the organization and strengthens the unity. Repetition is similar to consistency. Look at the possibility of adding elements just to create a repetition.
    • Alignment

    • Every element should have some visual connection with another element on the page. This creates a clean sophisticated, fresh look. Be conscious of where you place elements. Always find something else on the page with which to align, even if the two objects are physically far away from each other.
    • Proximity

    • Items relating to each other should be grouped closely together. This helps organize information and reduces clutter. Squint your eyes slightly and count the number of visual elements on the page by counting the number of times your eye stops. If there are more than three to five items on the page, try to group separate elements together into a closer proximity so that one visual unit is created.
      2 Williams, Robin; The Non-Designer Design Book
    Back to Top

    G. Working with Type

    • Legibility

    • All races, families and family members have unique characteristics. These characteristics help determine whether the
      typeface is appropriate for the body, headline, subhead & caption.
        
      Sans serif fonts are very legible on a monitor while serif fonts make printed copy easier to read. 

      Fonts that are script, cursive, and non cross platform should be made into a graphic object before using in a multimedia project. 
      Use fonts which are cross platform such as:

        Sans serif: Arial, Comic Sans MS
        Serif: Times, Georgia, Verdana
    Family: Times Roman/Times
    These members have traditional, conservative personalities and are characterized by varying line thicknesses; serif font; good for extensive body copy especially for printed copy.
    Family: Comic Sans MS
    These typefaces are very readable and are good for small children's books; however, they create darker pages because of the monoweight.
    Family: Arial
    Few of these typefaces have thick/thin transition. 
    Measuring Type
    • Type is measured in points from the top of the letters, the ascenders, to the bottom of the letters, the descenders.
      • There are 72 points in an inch.
      • There are 12 points in one pica and six picas in one inch.
      • Type is never measured by the width of the letters.
    • Printed type:
      • body type -10 and 12 points.
      • headlines - 24 points or larger
    • Projected visuals
      • body type - 24 points or larger
      • headlines - 36 points or larger
      • (Long narrow rooms need larger fonts.)
    Leading (the space between lines of type)
    • Double spaced type has double the leading of the size of type.


    Kerning (the space between letters)

    Back to Top

    H. Color

      Purpose
        First, determine
        • why you are using the color?
        • what is the purpose or function of the color?
        • what information does it add?


        Color, like all elements of design, needs to have a reason and purpose. (Think about a traffic light. Are colors important?)
        When to use color

        • Some photos and graphics need color.
        • In photographs black and white shows more detail and contrast than color.
        • Color can particularly helpful in informational graphics such as diagrams explaining a process.
          
        Color Blindness
        Remember that many are color blind and cannot distinguish between colors such as red/green.
          
        Psychology of color
        Eyes are attracted to warm colors (reds) and move away from cool colors (blues, greens).
         
        • Red - warm color; associated with fire. Depending upon the length of exposure, red can increase blood pressure; considered stimulating and exciting. Be careful about using too much red as it can easily overpower other elements on a page. Red used in advertisements brings the highest returns from women.
        • Yellow - warm color associated with happiness. Yellow reminds people of a warm sunny day and gives hope.
        • Blue - cool color; associated with sweetness. Sugar is often packaged in blue containers. Blue is the favorite color of the majority of people and is considered the safest color to use in design. Blue works well as a background color. Blue is known to have a calming effect on people. Blue used in advertisements, brings the highest return from men. Dark blue is considered the color of quiet colors work well for black background.
        • Purple - associated with royalty, religion, and ceremony.
        • Green - warm or cool color depending upon the brightness selected. Green is associated with astringency and trees but still remains one of the most popular colors.
        • Brown - men associate brown with wood and leather while women associate brown with leather and furs; like blue, brown is safe.
           
        Most effective: use ONE color and let others compliment.
        Watch colors - be sure they compliment, not fight!


      Color Considerations

      • Contrasts, weights, structures, form and direction of typefaces must be considered.
      • Determine the feelings to convey
      • Audience of the publication: age level? reading level?
      • Publications whose main purpose is to offer news to the readers generally use few type faces with clean or traditional characteristics.
      • Decorative type for body is inappropriate. Body copy is almost always a plain style with serifs
      • Publications or screens that are more featured oriented can use headline type with more ornate characteristics.
      • When producing a collaborative project, a type style sheet should be developed for consistency.
      • Plain, bold, italic, underline, shadow, outline, condensed, and extended are examples of type styles.
    Back to Top

    I. Graphics

    Graphic formats:
    • Common kinds of graphics used in presentations: photographs, clip art, illustrations, tables and graphs, movies
    • Graphics are assigned a file format by the program with which they are created:

    • PICT - common Macintosh format
      TIFF - Tagged Image File Format; bitmapped
      EPS - Encapsulated post script; object oriented; a language that describes lines and shapes; creates a space to fill
      GIF - originated by CompuServe; Graphic Interchange Format; preferred for inline Internet graphics
      JPEG - Joint Photographic Equipment Group; newer Internet standard; smaller files
      PNG - Portable Network Graphics
    Graphic tips
    • Graphics should be used to either illustrate or inform. They can be used to explain complicated information, illustrate a point, tell a story visually, add information to a story, attract attention, or entertain.
    • Cropping out unnecessary information makes the point of the pictures stronger because it removes distraction.
    • Some photographs and illustrations may need to be cropped and resized. When you crop a picture it allows you to enlarge what is left of the illustration.
    • For ethical reasons, do not alter content, including the use of morphing programs without permission.
    Action in Graphics
    • The action to the action of the content?

    • What direction are the people in the picture looking?
      Are there any pronounced diagonal lines that focuses the eye in a particular direction?
    Captions
    • Captions, or cutlines, are considered part of the graphic.
    • Make sure that the captions are set in different kind or style of type than the body copy.
    • Captions should add to, not repeat, the information in a graphic.
    • According to the Fair Use Guidelines for Multimedia, all graphics must have copyright information incorporated with the graphic. This means that the copyright information (©, owner, date) must be grouped into the image and all are one image.


    Graphic Design Hints

    • Work your design around the optical center of the page. The optical center is slightly about the mathematical center of the page and slightly to the left.
    • Irregularly-shaped art grabs the eye
    • Have a specific purpose for a graphic. Do not just use it for decoration.
    • Make sure that the eye does not “go off the page” because of the graphic
    • Do not crowd the layout! White space is important, but do not trap white space within an object or graphic.
    • If the message of the graphic is eye-catching or powerful then the graphic could be used in a large size, or be the dominant element on a page.
    • Charts, diagrams and tables can be useful for explaining information that is too complicated to digest in written form.
    Back to Top

    J. Links and Navigation

    • Navigational - moving from place to place
    • Hot text - explanations, glossary, more information








    10 Rules of Navigation
    1. Avoid simple page turners
    2. Keep written text simple.
    3. Use the 50% rule (50% white space)
    4. Communicate clearly & concisely.
    5. Use the active voice.
    6. Show - do not tell
    7. Use consistent screen formats.
    8. Provide help.
    9. Keep users engaged
    10. Content must meet goals and objectives
    Back to Top

    K. Final Tips

    Caution
      • Watch transitions—if it does not add to the product, do not use.
      • Cropping out unnecessary information in a graphic makes the point of the pictures stronger because it removes distractions.
      • Be concerned about ethical behaviors
      • Scripts, cursive, and novelty type are like hot sauce - use them sparingly!
      Content
      • Personal
      • Meaningful
      • Relevant
      Remember…
      • Include citations—do not plagiarize
      • Copyright—different from citations
      • The original intent
      • Keep focused
      • Black letters emphasize tradition
      • Use type from a few families rather than a wide variety of families (fonts)
      • The minimum for visual presentations is 24 points. The headings should be a minimum of 30 points.
      • Watch transitions - if it does not add to the product, do not use.
    Back to Top

    L. Evaluating the Resource
     

    With the plethora of resources available today on the Internet, CD-ROMs, and laser discs, one must now question the authenticity and accuracy as well as the relevancy of the information. A skill that must be taught is the evaluation of the information, quality and reliability.

    Internet:
    1. Look at the URL (Uniform Resource Locator) to determine the domain of the Internet Service Provider housing the Internet resource. Common domains include

    .edu - education
    .gov - government
    .org - nonprofit organization
    .com - commercial

    The commercial domains usually sell space for web pages and this is the location for many personal web pages. Many times personal web pages can be identified with a tilde (~) preceding the name of a folder. Regard these a bit more cautiously.

    2. Validate the author by observing the author's affiliation and qualifications. Note the page creation/revision date.

    3. Validate the information with at least one other source (print, electronic encyclopedia, authenticated web page).

    4. Additional resources for evaluation Internet pages:

    Resources

    In closing
    Tie the product closely to the process of information literacy and Technology Applications process, knowledge, and skills


      Back to Top

      Back to Day 1
      © Patsy Lanclos 1998-2004
      All Rights Reserved