1. Multimedia
Mr. Sanchez

2. Multimedia Defined Issues Identify the Use
Integration of text, still and moving images, and sound to communicate.
Issues
Time
Longer downloads
Bigger learning curve for designer
Search engine unfriendly
Balance choices for the purpose
Identify the Use
Ask
Who is your audience and what is your message?
How will the setting or interface look?
Which multimedia elements fit into the interface and compliment the message?
What is the outcome expected?

3. Words in Multimedia
Words can be:
Written
Spoken
Sung

4. Images in Multimedia Images can be: Drawings Charts Diagrams Paintings
Photographs
Buttons
Animation
or video
Note: images will be discussed in depth further into this lecture.

5. Sound in Multimedia Sound, also called audio, can be:
Voice-over or narration
Sound effects
Music

6. Audio and the Web Delivery File Types Download file Embedded Streaming
Larger file=longer download time
Embedded
Does not allow download - BAD
Streaming
Users listen as the connection is made
Uses buffer
Livecasts
File Types
.wav, .mp3

7. Video in Multimedia
Video can be:
Live
Recorded

8. Video and the Web Requires high bandwidth and player Types File Types
Download, streaming
Internet TV
File Types
.avi, .flv, .mov, .mpg,

9. Multimedia Productions
Defined:
Storytelling through the use of text, still and moving images, and sound.
Types of multimedia productions
Presentations
Tutorials
Games
Simulations
Web pages

10. Understand image file formats and when to use an image file type.
Working with Images
Understand image file formats and when to use an image file type.

11. Image Importance Images… Good Images… illustrate content
are crucial for name recognition and branding
provide backdrops for other activities
offer a means of navigating a Web site
Good Images…
are aesthetically pleasing
communicate well
use minimal bandwidth
relevant to the page’s purpose
are small files

12. Digital Imaging Concepts
Pixels
short for “pixel element”
smallest unit displayed by a monitor
provide color information

13. Color Models Color Models RGB - red, green, blue CMYK Grayscale
handles image colors and display differently
chosen based on purpose
RGB - red, green, blue
used for electronic display mode
format: R, G, B in decimal and hexadecimal form
or FF0000
CMYK
Cyan, Magenta, Yellow, black (K)
used for print media
Note: never go from CMYK to RGB
Grayscale
256 shades of gray
each pixel has a brightness value.
0=black, 255=white

14. Resolution Defined: Output resolution
The number of pixels present in a monitor’s height and width or dots per inch (dpi)
The higher the resolution the more detail
Monitor Resolutions
800x600, 72 or 96dpi
1024x768, 72 or 96dpi
1162x864, 72 or 96dpi
LCD Monitors have fixed resolutions
Output resolution
Dictated by the output device

15. Bitmap/Raster Image
Vector Image

16. Graphic Formats Bitmaps/Raster Vector Most common
Original
Bitmaps/Raster
Most common
Each color is an individual value
Composed of small squares
Large images = large file sizes
Use for photos, drop shadows, soft or blurry edges
Distorts when stretched
Sub-types
JPG, GIF, PNG
Vector
Color is a mathematical equation
Size changes force mathematical re-calculation
Increasing the image does not increase the file size
Use for line art, shapes and illustrations
Does not distort because color is recalculated
AI, WMF
Distorted

17. File Types – Electronic Media
Original
GIF
Raster
Platform independent
Limited to 256 colors
Use for broad expanses of color – no photos
Supports transparency
Lossless format
During compression, color info is not lost
GIF89a
Animated gif
Static images together in motion
Does not require a plug-in
Distorted

18. Image File Formats – Part 2
JPEG (Joint Photographic Experts Group)
Raster
Supports 16+ million colors
Compressed automatically
Results in image degradation
Lossy format
As compression increases, colors are dropped from the image
Will display differently on a MAC

19. Image File Formats – Part 3
PNG (Portable Networks Graphic)
Combines the best of GIF and JPEG
Supports compression and high bit depth
280 thousand billion colors
Page Description Languages (PDF)
Describes the layout of a printed page of graphics and text
Requires a Adobe Reader plugin to view online

20. Image File Formats – Part 4
SVG (Scalable Vector Graphics)
Uses XML to describe shapes in 2D
Allows the image to become an object
Supports animation, fills, and gradients
Use for line art and shapes
Microsoft uses it to embed images in ed document.
<?xml version="1.0"?>
<shape xmlns=" xmlns:svg="
<name>Circuit - NPN Transistor</name>
<icon>npn.xpm</icon>
<connections>
<point x="0" y="0"/>
<point x="6" y="-4"/>
<point x="6" y="4"/>
</connections>
<aspectratio type="fixed"/>
<svg:svg width="3.0" height="3.0">
<svg:line x1="0" y1="0" x2="3" y2="0" />
<svg:line x1="3" y1="-3" x2="3" y2="3" />
<svg:line x1="3" y1="-2" x2="6" y2="-4" />
<svg:line x1="3" y1="2" x2="6" y2="4" />
<svg:polyline points="5,4 6, ,3.0769" />
</svg:svg>
</shape>

21. Image File Formats – Print Media
Business cards, brochures, flyers, etc.
Formats
Eps
Encapsulated Postscript
Tif or tiff
Tagged Image File Format
Pct
Picture File
Print Media files…
cannot be used on the Internet
are 150+ dpi in resolution

22. End