Issuu on Google+

Multimedia Basics


Multimedia  Defined 

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?   


Words in Multimedia  Words can be:   

Written Spoken Sung


Images in Multimedia  Images can be:       

Drawings Charts Diagrams Paintings Photographs Buttons Animation or video

3rd Qtr 10%

4th Sales Qtr 9%

2nd Qtr 23%

1st Qtr 59%

Note: images will be discussed in depth further into this lecture.


Sound in Multimedia  Sound, also called audio, can be:   

Voice-over or narration Sound effects Music


Audio and the Web Delivery 

Download file  Larger

Embedded  Does

file=longer download time

not allow download - BAD

Streaming  Users

listen as the connection is made  Uses buffer  Livecasts

File Types 

.wav, .mp3


Video in Multimedia  Video can be:  

Live Recorded


Video and the Web Requires high bandwidth and player Types  

Download, streaming Internet TV

File Types 

.avi, .flv, .mov, .mpg,


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


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


Image Importance 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


Digital Imaging Concepts Pixels   

short for “pixel element” smallest unit displayed by a monitor provide color information


Color Models  Color Models

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 255.0.0 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


Resolution  Defined: 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


Bitmap/Raster Image

Vector Image


Graphic Formats

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 Sub-types 

AI, WMF

Distorted


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

 GIF89a    

compression, color info is not lost

Raster Animated gif Static images together in motion Does not require a plug-in

Distorted


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


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


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 emailed document.

<?xml version="1.0"?> <shape xmlns="http://www.daa.com.au/~james/dia-shapens" xmlns:svg="http://www.w3.org/2000/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,4 5.6154,3.0769" /> </svg:svg> </shape>


Image File Formats – Print Media 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


Multimedia Basics