Chapter 1. Introduction to Multimedia. Saurabh Gupta, AP-CSE, NIEC

Transcription

1 Chapter 1 Introduction to Multimedia

2 What is Multimedia? Multimedia is any combination of text, graphic art, sound, animation, video, delivered by computer or electronic means

3 What is Multimedia? Text Graphics Sound Animation Video

4 Multimedia takes may forms Greeting Cards Conferencing Movies Photo albums Image catalogs

5 Creating and Delivering Multimedia Graphic User Interface - GUI

6 Producing a Multimedia Project Requires a) creative skill b) technology tools c) organizational and business talent d) knowledge of ownership and copyright rules

7 Where Do You Begin? Study each element of Multimedia Read trade periodicals Visit web sites

8 Where Do You Begin? Learn tools to create or edit that element Learn to use texts and fonts effectively Learn how to make and edit colorful images Learn how to animate images into movies Learn how to record and edit sound

9 Types of Multimedia Interactive multimedia Hyperactive multimedia Linear multimedia

10 Interactive Multimedia Allows the user to control what and when the elements are delivered

11 Hypermedia Interactive Multimedia which provides a structure of linked elements through which the user can navigate

12 Multimedia Project Software vehicle, messages and content presented on a computer or TV screen Multimedia title - if sold or shipped to users with or without instructions Web page if on the www and composed of HTML or DHTML ( Dynamic Hypertext Markup Language)

13 Multimedia Project Linear - users watch from beginning to end Non-linear and interactive - users are given navigational control and can wonder through the content

14 Authoring Tools Multimedia elements are sewn together using tools like Authorware to provide facilities for creating and editing text and images have extensions to drive videodisc players and other peripherals playback the sound and movie elements created with other tools

15 Requirements Multimedia requires: large amounts of digital memory and network bandwidth; GUI ( gooey ) - a graphical user interface CD-Rom or DVD technology for storage In the future these may be replaced by connected fiber, and radio/cellular technology DVD Digital Versatile Disc

16 Delivering and Using Multimedia Multimedia demands bandwidth CD-ROMs hold MB (80 minutes of full screen video) DVD-ROMs hold GB Multimedia can be delivered on line

17 Why Multimedia? Multimedia enhances learning, memory and retention audio stimulation - 20% retention rate audio/visual - up to 30% retention rate interactive multimedia - up to 60% retention rate

18 Delivering and Using Multimedia Online uses include: Books and Magazines Movies News and Weather Education Maps Entertainment

19 Appropriate uses Business Schools Homes Public Places 1995 Al Gore - White House Challenge to connect every classroom, clinic, hospital to Information Superhighway by 2000

20 Delivering and Using Multimedia Virtual Reality

21 New Technologies VR- Virtual Reality Goggles, helmets, gloves, etc. place users inside a life-like experience View changes as user moves forward, left/right, etc. Composed of thousands of geometric to be realistic Will require new standards (VRML) for transmitting virtual worlds on the web

22 Results Multimedia will cause radical changes in teaching and learning Teachers will become mentors and guides along a learning path that is student centered (See pp ) Education will shift from the SAGE on the STAGE to the GUIDE at the SIDE of each student.

23 Chapter 2 Introduction to Making Multimedia

24 Stages of a Project Planning and costing-begin with an idea plan text, graphics,music, video develop graphic layout ( look and feel ) develop a structure and navigation system estimate time needed to complete prepare budget ( if necessary) work up a prototype

25 Stages of a Project Plan Develop an idea Identify objectives Identify skills and resources Develop a prototype Estimate time and cost

26 Stages of a Project Designing and Producing - perform each planned task Testing - test to be sure project meets objectives and needs of client Delivering- package and deliver to end user create CD-ROM, labels, etc. prepare user manual

27 What You Need Hardware Software Creativity Organization

28 Hardware The Macintosh as well as Windows PC offers a combination of affordability, and software and hardware availability. The Macintosh platform is better suited for multimedia production than the Windows platform. The hardware platforms provided by Apple are better equipped to manage both, sound and video editing.

29 Software Multimedia software provides specific instructions to the hardware for performing tasks. Software tools are divided into production tools and authoring tools.

30 Creativity and Organizational Skills In a multimedia project, being creative implies knowledge of hardware and software. It is essential to develop an organized outline detailing the skills, time, budget, tools and resources needed for the project.

31 Developing Multimedia To make multimedia, you need hardware, software, good ideas. To make GOOD multimedia you also need talent and skill, organization, time, money and the help of others. Teamwork is essential

32 Summary The basic stages of a multimedia project are planning and costing, design and production, testing and delivery. Knowledge of hardware and software, as well as creativity and organizational skills are essential for creating a high-quality multimedia project.

33 Sample Project You will create a multimedia demonstration of your company s new product, the Staplechase 3000 (a really nice stapler). The demonstration will highlight three key features of the product. End users will view the demonstration on the company s Web site. On paper, develop a basic plan for the project. The plan should include:

34 Project: The plan should include: A flow chart or timeline showing the basic flow of the project A list of hardware and software resources that will be required A list of skills that will be required A time estimate for project completion

35 Chapter 3 Multimedia Skills and Training

36 Skills and Background 1. What are some of the skills needed to develop good multimedia? 2. What is the responsibility of each member of the software team? 3. What background/training/skill is required of each?

37 Multimedia Development Team Project Manager Multimedia Designer Interface Designer Writers Video Specialist Audio Specialist Multimedia Programmer Multimedia Producer for the Web

38 Project Manager Responsibilities Overall project Day to day operations and budget Put together good core team Maintain the big picture the vision Background/skills Understand hardware & software Communication skills Good people skills- a good listener

39 Multimedia Designer Responsibilties: Overall content and structure Prepares blueprint for project: content, media, interaction Sometime overlaps with Interface Designer Coordinates team A) Graphic Designers B) Instructional Designers C) Information Designers

40 Multimedia Designer Background/skills Ability to analyze content structurally and match it with effective presentation Expert with different media types Ability to look at information from different points of view Interpersonal skills Understand resources- both technological and human Solid organizational skills, attention to detail

41 Multimedia Designer A) Graphic designer deals with visuals Illustrators ( Freehand) Animators ( Flash) Image processing specialists ( Photoshop)

42 Multimedia Designer Instructional Designers deal with subject matter Clear and proper presentation Knowledge of content

43 Multimedia Designer Information Designers deal with contents and navigation Structure content Determine user feedback and pathways

44 Interface Designer Responsibilities: Provides access to media and control to people who use it Makes interface transparent to users ( effective use of windows, icons, backgrounds, controls, etc.) Background/skills Familiar with different multimedia interfaces Knows authoring system, user testing Basic drawing skills

45 Writers Responsibilities: Create character, action, point of view, interactivity Write proposals, script actor s narration, write text screen( content writers) Background/skills: Background in marketing Ability to work within tight deadlines

46 Video Specialist Responsibilities: Coordinate videographers, sound technicians, lighting designers, set designers, script supervisors, production assistants, actors Background/skills: Skilled with QuickTime or MS Video for editing Macromedia Premiere for special effects

47 Audio Specialist Responsibilities: Locating and selecting suitable music and talent Scheduling recording sessions Digitizing, editing recorded materials Background/skills: Skilled in studio recording Fluency in MIDI Experience with sequencing software

48 Multimedia Programmer Responsibilities: Integrates multimedia elements into seamless whole using programming language or authoring system (Authorware) Coding displays to controlling devices Background/skills: Multimedia languages (C++, Java, Lingo) HTML, VRML, XML Ability to quickly learn new systems

49 Multimedia Producer for the Web Responsibilities: Coordinates set of pages for the web Background/skills: Knowledge of HTML, CGI scripts, Photoshop, etc.

50 Good Multimedia Many multimedia systems are too passive- users click and watch For fully interactive systems, designers need clear picture of what happens as user interacts Adaptive systems modify themselves based on user input ( intelligent tutors)

51 Chapter 4 Text

52 Overview Importance of text in a multimedia presentation. Understanding fonts and typefaces. Using text elements in a multimedia presentation. Computers and text. Font editing and design tools. Multimedia and hypertext.

53 Text in History Text came into use about 6,000 years ago

54 Revolution in Communication Using symbols for communication relatively recent - 6,0000 years old 15th Century- Johann Gutenburg printing press revolutionized information Recently - another revolution - the World Wide Web and its native language - HTML

55 The Power of Meaning and the Importance of Text Words must be chosen carefully Words appear in: Titles Menus Navigational aids Test the words you plan to use Keep a thesaurus handy

56 Using Text in Multimedia Typeface Arial Fonts Points Styles Leading Kerning Type terminology Courier Times

57 Fonts and Faces A typeface is a family of graphic characters that includes many type sizes and styles (such as Times, Arial, Helvetica) A font is a collection of characters of a single size and style belonging to a typeface family (such as bold, italic) Font sizes are in points 1 point = 1/72 inch (measured from top to bottom of descenders in capital letter) X-height is the height of the lower case letter x

58 Character Metrics

59 Factors affecting legibility of text Size. Background and foreground color. Style. Leading (pronounced ledding ).

60 Styles Examples of styles are boldface and italic Italic Bold Underlined

61 Leading and Kerning Computers can adjust the line spacing (called leading) and leading the space between pairs of letters, called kerning

62 Fonts and Faces PostScript, TrueType and Master fonts can be altered Bitmapped fonts cannot be altered The computer draws or rasterizes a letter on the screen with pixels or dots.

63 Cases When type was set by hand, the type for a font was kept in a drawer or case, The upper drawer held the capital letters, and the lower drawer held the smaller letters From this we get the terms uppercase and lowercase

64 Case Sensitive Password, and paths in a URL are case sensitive ( that is home is different from HOME ) It is easier to read words that have a mixture of upper and lower case letters rather than all upper case Computer terms use an intercap for readability as in PageMaker, or LastName

65 Serif and Sans Serif Type either has a little decoration at the end of the letter - called a serif or it doesn t - sans serif ( sans from the French meaning without) Examples ( Times - serif T ) ( Arial - sans serif T ) Use what is appropriate to convey your message

66 Using Text In Multimedia WYSIWYG - What you see is what you get! Aim for a balance between too much text and too little Make web pages no more than 1 to 2 screenfuls of text Bring the user to the destination with as few actions as possible

67 Text Font Design Tips Use the most legible font available Use as few different faces as possible ( too many called ransom-note typography Use bold and italics to convey meaning Adjust line spacing ( leading) Adjust the spacing between letters in headings to remove gaps Use colors and background to make type stand out Use meaningful word for links and menus

68 More Text Font Design Tips Anti-aliasing or dithering blends colors along the edges of letters to create gentle effect. Experiment with shadows Surround headlines with white space Try attention grabbing effect with color, word art or large drop letters at the beginning of text

69 Menus For Navigation A Multimedia project or web site should include: content or information navigation tools such as menus, mouse clicks, key presses or touch screen some indication or map of where the user is in the presentation

70 Buttons for Interaction Buttons are objects that make things happen when they are clicked Use common button shapes and sizes Label them clearly BE SURE THEY WORK!

71 Fields for Reading Reading from a computer screen is slower than from a book People blink 3-5 times/minute, using a computer and times/minute reading a book This reduced eye movement causes fatigue, dryness Try to present only a few paragraphs per page

72 Portrait vs. Landscape Monitor use wider-than-tall aspect ratios called landscape Most books use taller-than- wide orientation, called portrait Don t try to shrink a full page onto a monitor portrait landscape

73 HTML Documents Standard document format on the web is called Hypertext Markup Language ( HTML) Originally designed for text not multimedia - now being redesigned as Dynamic HTML ( DHTML), which uses CSS (Cascading Style sheets) and permits defining text choices. Specify typefaces, sizes colors and properties by marking up the text with tags (such as <B>, </B>)

74 HTML Documents The Font tag is used to specify the font to be displayed (if present) <font face = Verdana, Arial, Times > If those fonts are not on the system, the default is used ( see p for common fonts)

75 Symbols and Icons Symbols act like visual words to convey meaning, (called icons) MAC - trash can Windows - hourglass Icons and sound are more easily remembered than words It is useful to label icons for clarity See smileys in textbook (p. 61)

76 Animating Text To grab a viewer s attention: let text fly onto screen rotate or spin text, etc. Use special effects sparingly or they become boring

77 Computers and Text Mac standard - 72 pixels/ inch PC - VGA - 96 pixels/inch Screen ( 640 pixels across x 480 down, called 640 x480 resolution) Today much higher resolution possible

78 Fonts Wars Apple - Adobe PostScript page description font language describes an image in terms of mathematical constructs (Bezier curves) Can be scaled larger or smaller Currently > 6,000 typefaces available Apple & Microsoft created TrueType

79 Computers and Text Allow text to be drawn at any size without jaggies, by anti-aliasing the edges of the characters

80 Fonts and Characters Fonts smaller than 12 point are not very legible on a monitor Never assume the fonts installed on your computer are on all computers Stay with TrueType fonts ordinarily ASCII character set - most common Extended Character set - used for HTML UNICODE supports characters for all known languages

81 Unicode Developed in 1989 for multilingual text Contains 65,000 characters form all known languages and alphabets Where several languages share a set of symbols, they are grouped into a collection called scripts ( eg. Latin, Arabic, Cyrillic, Greek, Tibetan, etc.) Shared symbols are unified into collections called scripts

82 Unicode Numbers Mathematical symbols Punctuation Arrows, blocks and drawing shapes Technical symbols

83 Mapping Text Across Platforms Viewing a presentation on either MAC and PC reveals differences Fonts must be mapped from one machine to another If same font doesn t exist on the other machine, one is substituted ( called font substitution) To avoid this, convert to bitmaps

84 Representing Languages Some contain different symbols Others represent an entire concept with a single symbol (as in some Asian languages) Translating into another language is called localization

85 Font Editing and Design Tools Allow you to create your own fonts ResEdit for MAC Fontographer (from Macromedia) caan be used to create Postscript, TrueType and bitmapped fonts for MAC, PB, SUN includes a freehand drawing tool 3D programs, such as COOL 3D and HotTEXT, create special effects See text for descriptions

86 Font Editing and Design Tools Fontographer (from Macromedia)

87 Editing and Design Tools

88 Hypermedia and Hypertext Hyper media provides a structure of links Hypertext words are linked to other elements Hypertext is usually searchable by software robots

89 Hypermedia and Hypertext Multimedia - combines text, graphics and audio Interactive multimedia - gives user control over what and when content is viewed (non-linear) Hypermedia -provides a structure of linked elements through which user navigates and interacts

90 Hypermedia Structures Hypermedia elements are called nodes Nodes are connected using links A linked point is called an anchor

91 Hypermedia Structures Link - connections between conceptual elements (navigation pathways and menus) Node - contains text, graphics sounds Anchor - the reference from one document to another document, image, sound or file on the web Link anchor - where you came from

92 Hypermedia and Hypertext Doug Englebart - inventor of mouse 1965 Ted Nelson coined the word hypertext Computer-based hypertext systems will fundamentally alter the way humans think, approach literature and the expression of ideas Hotlinks - lead user from one reference to another

93 Using Hypertext Searching for words boolean search using AND, OR, NOT truncation - using only part of word, such as geo might yield result with geology, geography, George, etc. Search engines employ robots to visit web pages and create indexes.

94 Hypertext Tools Building or authoring builder creates links, identifies nodes, generates an index of words Reading both linear and increasingly non-linear Becoming more comfortable with non-linear hypertext systems will change the way we think.

95 Chapter 5 Sound

96 Overview Introduction to sound. Multimedia system sound. Digital audio. MIDI audio. Audio file formats.

97 Overview MIDI versus digital audio. Adding sound to multimedia project. Professional sound. Production tips.

98 Power of Sound Vibrations in the air create waves of pressure that are perceived as sound. Sound waves vary in sound pressure level (amplitude) and in frequency or pitch. Acoustics is the branch of physics that studies sound. Sound pressure levels (loudness or volume) are measured in decibels (db). Humans hear sound over a very broad range (see p. 91)

99 Sound Sound is energy, caused by molecules vibrating Too much volume can permanently damage your ears and hearing The perception of loudness depend on the frequency or pitch Harmonics cause the same note played on a cello to sound different from one played on a piano.

100 Using Sound in Multimedia You need to know How to make sounds How to record and edit sounds on the computer How to incorporate sounds into your multimedia project

101 Multimedia System Sounds System sounds are assigned to various system events such as startup and warnings, among others. Macintosh provides several system sound options such as glass, indigo, laugh. In Windows, available system sounds include start.wav, chimes.wav, and chord.wav. Multimedia sound is either digitally recorded audio or MIDI (Musical Instrumental Digital Interface) music.

102 Multimedia System Sounds Most computers have sounds ready to use

103 Multimedia System Sounds Mac and Windows have built in sound recorders

104 Multimedia System Sounds Windows system sounds are.wav files in the Windows\Media directory MS Office includes additional sounds You can add your own sounds by including them in the Windows\Media directory and selecting them from the Sound Control Panel

105 MIDI Audio MIDI is a series of musical instructions Click to play

106 MIDI vs. Digital Audio MIDI ( Musical Instrument Digital Interface) is a communications standard developed in the 1980 s for electronic instruments and computers. It allows instruments from different manufacturers to communicate.

107 MIDI vs. Digital Audio MIDI data is NOT digitized sound- it is music stored in numeric format Digital audio is a recording, which depend on your sound system MIDI is a score and depends on both the quality of the instruments and the sound system Quality depends on end user s device rather than on the MIDI device and is device dependent.

108 Making MIDI Audio Creating a MIDI score requires: Knowledge of music and some talent Ability to play a musical instrument Sequencer software Sound synthesizer Built into PC board Add-on for MAC MIDI can synthesize over 100 instruments

109 Making MIDI Audio You will need: Sequencer Software (Smart Score) A Sound synthesizer ( built into PC sound board, an add on for MAC) MIDI keyboard or device Ability to play the piano and music theory background or a hired expert

110 MIDI A MIDI file is a list of commands that are recordings of musical actions, that when sent to a MIDI player results in sound MIDI data is device dependent MIDI represents musical instruments and is not easily used to playback spoken dialog

111 MIDI Audio MIDI is a shorthand representation of music stored in numeric form. Since they are small, MIDI files embedded in web pages load and play promptly. Length of a MIDI file can be changed without affecting the pitch of the music or degrading audio quality. Working with MIDI requires knowledge of music theory.

112 Digital Audio Digital audio is a representation of the original sound Sampling rate is measured in kilohertz (khz) Click to play

113 Digital Audio Digital audio represents a sound stored in thousands of numbers or samples. Digital data represents the loudness at discrete slices of time. It is NOT device dependent and should sound the same each time it is played It is used for music CD s

114 Digital Audio The three sampling frequencies most often used in multimedia are CD-quality 44.1 khz, khz and khz. The number of bits used to describe the amplitude of sound wave when sampled, determines the sample size. Digital audio is device independent. The value of each sample is rounded off to the nearest integer (quantization).

115 Preparing Digital Audio Balance file size versus quality Set recording levels Edit the recording

116 Preparing Digital Audio Balance file size versus quality To calculate file size in bytes: Mono: sampling rate duration of recording in seconds (bit resolution 8) 1 Stereo: sampling rate duration of recording in seconds (bit resolution 8) 2

117 Digital Audio Editing Once a recording had been completed, it almost always needs to be edited. Basic sound editing operations include: trimming, splicing and assembly, volume adjustments and working on multiple tracks.

118 Digital Audio Editing Additional available sound editing operations include format conversion, resampling or downsampling, fade-ins and fade-outs, equalization, time stretching, digital signal processing, and reversing sounds.

119 MIDI vs. Digital Audio MIDI data and digital audio are like vector and bitmapped graphics: Digital audio like bitmapped image samples original to create a copy MIDI like vector graphic- stores numeric data to recreate sound

120 MIDI vs. Digital Audio MIDI data is device dependent; digital audio is not MIDI sounds (like vector graphics) are different on different devices; Digital sounds are identical even on different computers or devices.

121 MIDI Advantages MIDI file are much more compact and take up less memory and system resources MIDI files embedded in web pages load and play much faster than digital You can change the length of a MIDI file by varying its tempo With high quality MIDI devices, MIDI files may actually sound better than digital

122 MIDI Disadvantages MIDI represents musical instruments not sounds and will be accurate only if your playback device is identical to the production device MIDI sound is inconsistent MIDI cannot be easily used to reproduce speech

123 Digital Audio Advantages Digital audio sound is consistent and device independent A wide selection of software support is available for both MAC and PC A knowledge of music theory is not required for creating digital audio, but usually is needed for MIDI production

124 Choose MIDI data If you don t have enough RAM memory, or bandwidth for digital audio If you have a high quality sound source If you have complete control over the playback hardware If you don t need spoken dialog

125 Choose Digital Audio If you don t have control over the playback hardware If you have the computing resources and bandwidth to handle the larger digital files If you need spoken dialog

126 Digital Audio You can digitize sound from a microphone, synthesizer, tape recording TV broadcast, or CD s. Digitized sound is sampled every nth of a second. The more often you take the sample, the better the sound. Sample sizes are either 8 or 16 bits and common frequencies are11.025, 22.05, and 44.1 khz (See pp )

127 Digital Audio To prepare digital audio from analog media, record it from a device, like a tape recorder, into your computer using digitizing software. Balance the sound quality with your available RAM Set proper recording levels for a good clear recording

128 File Size vs. Quality Audio resolution determines the accuracy with which a sound is digitized. (More bits in the sample size produces better quality and larger files) Stereo recordings are more realistic and require twice as much storage space and playback time. Mono files tend to sound flat

129 Editing Digital Recordings Apple s QuickTime Player Pro provides for primitive playback and editing Sonic Foundry s Sound Forge is a more serious sound editor These can be used to trim, splice, volume adjustment and format conversion as well as special effects

130 Audio File Formats A sound file s format is a recognized methodology for organizing data bits of digitized sound into a data file. On the Macintosh, digitized sounds may be stored as data files, resources, or applications such as AIFF or AIFC. In Windows, digitized sounds are usually stored as WAV files. Both can use MIDI files (.mid)

131 Audio File Formats CD-ROM/XA (Extended Architecture) format enabled several recording sessions to be placed on a single CD-R (recordable) disc. Linear Pulse Code Modulation is used for Red Book Audio data files on consumer-grade music CDs.

132 Sound for the World Wide Web To play MIDI sound on the web wait for the entire file to download and play it with a helper application stream the file, storing it in the buffer and playing it while it downloads Streaming is dependent on the connection speed FLASH allows sound to be integrated in a multimedia presentation, controlled by buttons and saved as.mp3

133 Adding Sound to a Multimedia Project Decide what sounds you will need and include them in the story board or cue sheet. Decide whether to use MIDI or digital audio Acquire source material (record/buy) Edit the sounds Test the sounds to be sure they are timed properly

134 Adding sound to Multimedia CD- quality audio Standard is ISO 10149, a.k.a. the Red Book Standard Sample size is 16-bit Sample rate is 44.1 khz 11 seconds of audio uses 1.94 MB of space

135 Professional Sound The Red Book Standard- ISO ( 16 bits at 44.1 khz) allows accurate reproduction of all sounds humans can hear Software such as Toast and CD-Creator can translate digital files from CD s directly into a digital sound editing file or decompress.mp3 files into CD-Audio

136 Professional Sound Compression techniques reduce space but reliability suffers. Space can be conserved by downsampling or reducing the number of sample slices taken per second. File size of digital recording (in bytes) = sampling rate X duration of recording (in secs) X (bit resolution/8) X number of tracks.

137 Advanced Sound Management Scripting Languages such as Open Script (Toolbook), LINGO(Director), or Action Script ( FLASH) provide better control over audio playback Requires some programming knowledge

138 Production Tips Vaughn s Law of Minimums - there is an acceptable level of adequacy that will satisfy the audience; If your handheld microphone is good enough to satisfy you and your audience, conserve your money and energy.

139 Production Tips Recording on inexpensive media rather than directly to disk prevents the hard disk from being overloaded with unnecessary data. The equipment and standards used for the project must be in accordance with the requirements. Sound and image synchronization must be tested at regular intervals

140 Production Tips Audio recording - use CD s, or VCR tapes, or DAT ( digital audio tape) tapes Create a good database to organize your sounds, noting the counter and content Testing and Evaluating- (delaying a fast machine if needed to sync with animation)

141 Production Tips Copyright Issues Securing permission for the use of sounds and music is the same as for images Can buy royalty-free digitized sound clips DO NOT use someone s original work without permission!

142 Summary Vibrations in air create waves of pressure that are perceived as sound. Multimedia system sound is digitally recorded audio or MIDI (Musical Instrumental Digital Interface) music. Digital audio data is the actual representation of a sound, stored in the form of samples.

143 Summary MIDI is a shorthand representation of music stored in numeric form. Digital audio provides consistent playback quality. MIDI files are much smaller than digitized audio. MIDI is device dependent digital audio is not MIDI files sound better than digital audio files when played on high-quality MIDI device.

144 Chapter 6 IMAGES

145 Overview Creation of multimedia images. Creation of still images. Colors and palettes in multimedia. Image file types used in multimedia.

146 Before You Start to Create: Plan your approach using flowcharts and storyboards Organize your tools ( text, buttons, sounds, etc.) Use multiple monitors (especially for a program like Director where changes in one window are visible in the presentation window)

147 Making Still Images Bitmaps ( or paint graphics) used for photo-realistic images and detailed drawings Vector graphics used for lines, polygons and other mathematical objects Saved as GIF,JPEG,PNG files with compression

148 Making Still Images Stills are drawn in one of two ways and are usually compressed Bitmaps Vector-drawn graphics

149 Bitmaps Bitmap is derived from the words bit, which means the simplest element in which only two digits are used, and map, which is a twodimensional matrix of these bits. A bitmap is a data matrix describing the individual dots of an image.

150 BITMAPS A simple information matrix describing the dots or pixels which make up the image Make it with paint or drawing program Grab it and (save it) then paste it into you application Scan or digitize an image

151 Bitmaps Bitmaps are an image format suited for creation of: Photo-realistic images. Complex drawings. Images that require fine detail.

152 Bitmaps Bitmapped images are known as paint graphics. A bitmap is made up of individual dots or picture elements known as pixels or pels. Bitmapped images can have varying bit and color depths.

153 Bitmaps Available binary Combinations for Describing a Color

154 Bitmaps Bitmaps can be inserted by: Using clip art galleries. Using bitmap software. Capturing and editing images. Scanning images.

155 Bitmap Example Clipart

156 Clip Art Available from many sources on the web or on CD ( such as PHOTODISC) Often included with packages such as Corel Draw, Office, etc. Can manipulate some properties such as brightness, color, size Can paste it into an application

157 Clip Art Galleries A clip art gallery is an assortment of graphics, photographs, sound, and video. Clip arts are a popular alternative for users who do not want to create their own images. Clip arts are available on CD-ROMs and on the Internet.

158 Bitmaps Clipart Bitmap Software

159 Using Bitmap Software The industry standard for bitmap painting and editing programs are: Adobe's Photoshop and Illustrator. Macromedia's Fireworks. Corel's Painter. CorelDraw. Quark Express.

160 Bitmap Software Primitive Paint programs included with windows and MAC Director included a powerful image editor with advanced tools such as onion-skin and image filtering Adobe Photoshop and Fractal Design s Painter are more sophisticated painting and editing tools

161 Tip Use paint program for cartoon, text, icons, symbols, buttons, or graphics. For photo-realistic images first scan a picture, then use a paint or image editing program to refine or modify them

162 Bitmaps Clipart Bitmap software Capturing Scanning

163 Capturing and Editing Images Capturing and storing images directly from the screen is another way to assemble images for multimedia. The PRINT SCREEN button in Windows and COMMAND-CONTROL-SHIFT-4 keystroke on the Macintosh copies the screen image to the clipboard. From there you can insert it into a paint program or other application.

164 Advanced Image Editing Image editing programs allow you to insert and remove images from photos Enable you to alter and distort images, add and delete elements Morphing blends two images so that one seems to melt into the other

165 Scanning Images Everyday objects can be scanned and manipulated using tools such as Photoshop Traditional artwork created with pen and ink or watercolors can be created and scanned

166 Vector Drawings Vector graphics are defined using formulas RECT 0,0,200,200,RED,BLUE

167 Vector Drawing Used for lines, rectangles, geometric objects- stored mathematically CAD ( computed aided design) programs created complex and geometric renderings needed by architects and engineers Graphic artists use vector graphics to eliminate the jaggies Programs for 3-D animation use vector graphics for rotation,spinning and shading

168 How Vector Drawing Works Vector drawn object are drawn to the computer screen using a fraction of the memory space required by a bitmap. A vector is a line described by its endpoints, and sometimes direction A rectangle might be described as: RECT, 0, 0,200, 200 Starts at 0,0 and extends 200 pixels horizontally and 200 pixels downward from the corner ( a square) RECT, 0, 0,200, 200, red, blue This is the same square with a red border filled with blue

169 Vector- Drawn vs. Bitmaps Colored square as a vector contains < 30 bytes of data The same square as a bitmapped image would take 5,000 bytes to describe ( 200x200)/8) and using 256 colors would require 40K as a bitmap ((200x 200) / 8 X 8) Vector objects are easily scalable Sometimes a single bitmap gives better performance than many vector images required to make the same image

170 Converting Between Bitmaps and Vectors Most drawing programs offer several file formats for saving and converting images. Converting bitmaps to drawn object is more difficult and is called autotracing It computes the bounds of an object and its colors and derives the polygon that most nearly describes it It is available in some programs such as Adobe Streamline

171 Vectors vs. Bitmaps Vector drawings are easily scaled Vector files are usually smaller Calculation time can draw resources Bitmaps cannot easily be converted to vector Vector drawings require plug-ins

172 3-D Drawing and Rendering Drawing in 3-D on 2 2-D surface or screen takes practice and skill Software helps to render ( or represent) the image in visual form- but these programs have a steep learning curve. Object in 3-D space carry many properties, shape color, texture, location and a scene often contains many objects

173 3-D Drawing 3-D software usually offers: Directional lighting Motion Different perspectives

174 3-D Drawing 3-D creation tools include: Ray Dream Designer Caligari True Space 2 Specular Infini-D form*z

175 3-D Drawing 3-D objects combine various shapes

176 Modeling 3-D objects Start with a shape ( block, cylinder, sphere, ) You can draw a 2-D object and extrude or lathe it into the third dimension Extrude extends the shape perpendicular to the shapes outline A lathed shape is rotated around a defined axis to create the 3-D object.

177 Modeling 3-D objects Shapes can be extruded

178 Modeling 3-D objects or lathed

179 Modeling 3-D objects Once a 3-D object has been created, you can apply color and texture to make it look realistic To model a scene, place all the objects into 3-D space and set up lighting effects and shadows. Objects will reflect or flare where light is most intense.

180 Modeling 3-D objects Add a background or set a camera view from which you will view the scene Shading can be applied in many ways ( See p. 304) Finally, the scene must be rendered- using the algorithms to apply the effects you have specified on the objects Rendering requires great computer power and can often take hours for a single image

181 Modeling 3-D objects Gourand shading Flat shading Ray tracing Phong shading A scene can use different types of shading

182 Color Natural Light and Color Quantum Theory of Light (Max Planck 19 th Century and 20 th Century Niels Bohr photons) Atoms produce unique colors as light passes through Light travels in the form of photons, or quanta

183 Color Natural Light and Color Quantum Theory of Light Color is the frequency of visible light ROY G. BIV ( increasing frequencies) Infrared Visible Light Ultraviolet White light is a mixture of all the frequencies

184 Color Computerized color Computers combine red, green, and blue (RGB) light Bit depth determines the number of possible colors 1-bit 2 colors 4-bit 16 colors 8-bit 256 colors 24-bit 16,777,216 colors

185 Color Cornea of your eye focuses light rays onto the retina to stimulate rods and cones which transmit the patterns of color information to the brain. ( Cones are sensitive to red, green and blue light.) Green, blue, yellow.orange,purple, pink, brown black, gray and white are most common colors in all cultures.

186 Color Color and Culture Western culture: Red = anger, danger Black = death, funerals Eastern culture Red = happiness White = death, funerals ( Eastern Weddings and restaurants most often use RED ) Internet study (p.142) world s favorite color is blue

187 Color Psychology of Color how you perceive it Computer monitors produce color with red, green and blue light the ADDITIVE primary colors. Tiny red, blue and green dots on the screen, light up when bombarded by electrons. The reflected light from a printed page is SUBTRACTIVE primary colors ( cyan, magenta, yellow and a little black)

188 Color Computerized Color Monitors and Color most monitors today are set to display 640 X 480 pixels and 256 colors, can be adjusted for more Called VGA ( Video Graphics Array) Minimum configuration for Windows and MAC More colors requires more memory

189 Color Wheel

190 Color Models Additive Color: RGB Describes colors that emanate from glowing bodies such as lights, TV, and computer monitors In additive color models, mixing two colors results in a brighter color Overlapping colors from 3 projectors produces new colors: red+ green -> yellow green+ blue -> cyan red + blue -> magenta

191 Color Models - Additive

192 Color Models Subtractive Color : CMYK Most object reflect light Mixing two colors creates a darker one Similar to pain and printer s ink Primary colors are cyan, magenta, yellow, which are complements of red, green and blue, respectively Where 3 inks overlap, there is black ( gray)

193 Color Models - Subtractive

194 Color Computer Color Models Color of a pixel is expressed as the amount of red, green and blue ( RGB) HSB ( hue, saturation, brightness) and HSL ( hue, saturation, lightness) models specify color as an angle from degrees on a color wheel and saturation, brightness, and lightness as percentages. 100% Lightness = white Saturation is the intensity of the color Other color models are used for TV, photos and other media

195 Color Models - HSB

196 Color Palettes Palettes or color look up tables (CLUT) are mathematical tables that define the color of a pixel displayed on the screen Paint programs provide a palette tools for displaying available colors not uniform across programs or platforms Color graphics adaptors work with 256 shades of each color producing over 16 million colors (256 x 256x 256)

197 Color Models Varying Brightness Varying Saturation

198 Color Harmony Certain combinations of colors tend to be pleasing. They arise from the color harmony schemes: Monochromatic Complementary Analogous Triadic

199 Color Harmony Primary Colors Secondary colors Tertiary Colors

200 Color Harmony Schemes Primary colors: red, yellow and blue Secondary colors: obtained by mixing two primary colors - orange violet, green Tertiary colors: obtained by mixing equal amounts of a primary and secondary color - red-violet, blue-violet, blue-green, yellowgreen, yellow-orange, red-orange Warm (yellow, orange, red) or cool ( blue, green) colors

201 Color Harmony Schemes Monochromatic all colors have hues that are the same or within a few degrees of one another colors vary in saturation or brightness, but hue is consistent enhances cohesiveness to overall layout of web page

202 Color Harmony Schemes Monochromatic Examples

203 Monochromatic Example

204 Color Harmony Schemes Complementary uses a pair of complementary hues, which appear opposite one another on a color wheel one color is dominant, the other is an accent use the dominant hue to fill the large areas

205 Complementary Example

206 Color Schemes Analogous two colors which lie close together on a color wheel often echo the colors found in nature pleasing combinations ( such as orange, yellow, green) more interesting if the colors do not have the same brightness and saturation

207 Color Harmony Schemes Analogous

208 Color Schemes Triadic Any 3 colors, spaced equally around a color wheel Color hues form a triad Offers wide variety of choice and can create excitement Can be overpowering unless colors chosen vary in brightness and saturation, or the number of text and background are limited

209 Color Schemes - Triadic

210 Color in Text and Background Text should be legible Contrast between text and background is important Dark text on light background is best or one with high brightness and low saturation Avoid combinations that differ only in their blue component ( yellow on white) Avoid red-green, red-blue, magenta-green combinations which cause vibration and eye fatigue.

211 Palette Flashing Problem Palette Flashing occurs when you use a series of images each with its own color palette. When the new image replaces the older one a flash occurs on the screen - a serious problem in multimedia Solution use a single palette for all project images or fade each image to white or black before showing the next image since white and black are present in most palettes

212 Dithering Dithering is a process where the color value of each pixel is changes to the closest matching color value in the target palette, using a mathematical algorithm It averages the color over an area and is usually close to the original color Dithering software is usually built into image editing and multimedia programs

213 Image File Formats MAC has a single standard format PICT Windows uses device independent bitmaps DIBs written as.bmp files, which is a windows bitmap file TIFF ( tagged interchange file formats) are universal bitmap files used in desktop publishing Adobe creates.psd files for photoshop See pp for other formats

214 Image File Formats Be sure that your program can import the files that you create or save. Most common bitmap formats for the web are GIF and JPEG, since all browsers can display them

215 Chapter 7 Animation

216 The Power of Animation Animation grabs attention Transitions are simple forms of animation Wipe Zoom Dissolve

217 Principles of animation How Animation Works Persistence of vision Still images are flashed in sequence Frame rate measures the speed of change

218 Principles of Animation Persistence of Vision -biological phenomenon - an object seen by the human eye remains mapped on the retina for a brief time after viewing. Causes the visual illusion of movement, when images change slightly and rapidly

219 Principles of Animation Television video creates 30 frames per second Movies are shot at a rate of 24 frames per second and replayed at 48 frames per second Both are used to create motion and animation

220 Principles of Animation Cel Animation Keyframes identify the start and end of action The process of filling in the action is called tweening

221 Animation Techniques Cel Animation The technique made famous by Disney Progressively different graphics on each frame of movie film Clear celluloid sheets were used to draw each frame ( 24 frames/sec. * 60 sec/min) = 1440 separate frames needed to produce one minute of a movie

222 Animation Techniques Cel Animation Begins with keyframes (first and last frames of an action) Tweening the series of frames drawn in between the first and last Originally hand drawn and flipped through to check the motion Now replaced by computer generated graphics

223 Principles of Animation Computer Animation Kinematics is the study of motion of jointed structures

224 Computer Animation Based on the same model as cel animation Uses layers, keyframes, and tweening techniques Inks special methods for computing RGB pixel values, providing edge detection and layering so that images can blend or produce transparencies, inversions and effects Speed of the animation depends on computer; If it is display is greater than 1/15 sec, animation may seem slow and jerky

225 Kinematics Study of movement and motion of structures that have joints, (such as a person or a walking dog) Complex- need to calculate position, velocity, rotation and acceleration of all joint and body parts involved Inverse kinematics process of linking objects together and define their relationships and limits and then drag the parts and let the computer calculate the result ( for example, connect hands and arms and bent the elbow in various directions) Fractal Design s Poser a 3-D modeling program

226 Principles of Animation Morphing is the process of transitioning from one image to another

227 Morphing A special effect in which one image transforms into another Process involves connecting a series of key points, which are mapped from the start image to the end image to make a smooth transition ( See p.328)

228 Principles of Animation Animation file formats Windows Media.AVI,.ASF, or.wmv Apple QuickTime.QT or.mov Motion Video.MPG or.mpeg Flash.SWF Shockwave.DCR Animated GIF.GIF

229 Animation File Formats Director (dir) compressed into a Shockwave animation file (dcr) for the web Windows Audio Video Interleaved Format (avi) Macintosh ( quicktime, mov) Motion Video ( mpeg, mpg) Compuserv ( gif) Shockwave (dcr) Compression for Director is 75%+ turning a 100k file into a 25k file

230 Making Animations that Work Use animations carefully so your screens don t become too busy Animation tools Director Adobe GOLive GIF animators

231 Creating Animation Software helps create objects such as: A rolling ball

232 Creating Animation Software helps create objects such as: A rolling ball A bouncing ball s=1/2gt 2

233 Bouncing Ball Requires a series of rotations A knowledge of physics (s= 1/2gt 2 ) Ball will uniformly accelerate and decelerate by squares 1,4,9,16,. (as Galileo discovered) (See examples, pp )

234 Creating Animation Software helps create objects such as: A rolling ball A bouncing ball An animated scene

235 Chapter 8 Video

236 Overview Using video. How video works? Broadcast video standards. Analog video. Digital video. Video recording and tape formats. Shooting and editing video. Optimizing video files for CD-ROM.

237 Video Video is the most recent addition to the elements of multimedia It places the greatest demands on the computer and memory (using about 108 GB per hour for full motion) Often requires additional hardware (video compression board, audio board, RAID - Redundant Array of Independent Disks- for high speed data transfer)

238 Using Video Carefully planned video can enhance a presentation (eg. film clip of JFK, better than an text box of same message) Before adding video to a project, it is essential to understand the medium, how to integrate it, its limitations, and its costs

239 Using Digital Video Digital video has replaced analog as the method of choice for making and delivering video for multimedia. Digital video device produces excellent finished products at a fraction of the cost of analog.

240 Using Digital Video Digital video eliminates the imagedegrading analog-to-digital conversion. Many digital video sources exist, but getting the rights can be difficult, time-consuming, and expensive.

241 Video Clips Ways to obtain video shoot new film clips with a digital camcorder convert you own video clips to digital format acquire video from an archive - often very expensive, difficult to obtain permissions or licensing rights Be sure to obtain permission from anyone you film or for any audio you use!

242 How Video Works Light passes from an object through the video camera lens and is converted into an electrical signal by a CCD (charge-coupled device). High quality cameras have 3 CCD Signal contains 3 channels of color information (red, green, blue) and a synchronization pulse.

243 How Video Works If each channel of a color signal is separate it is called RGB ( preferred) A single composite of the colors and sync signal is less precise A typical video tape has separate tracks for audio, video, and control

244 Video Basics

245 How Video Works The video signal is magnetically written to tape by a spinning recording head following a helical path Audio is recorded on a separate straight track The control track regulates the speed and keeps the tracks aligned as the tape plays/records.

246 Video Basics

247 Broadcast Video Standards NTSC PAL SECAM HDTV Six different formats Aspect ratio is 16:9

248 Broadcast Video Standards National Television Standards Committee (NTSC): These standards define a method for encoding information into electronic signal that creates a television picture. It has screen resolution of 525 horizontal scan lines and a scan rate of 30 frames per second.

249 Broadcast Video Standards NTSC- National Television Standards Committee , ( never the same color ) 1 frame = 525 horizontal lines every 1/30 second 2 passes - odd/even lines, 60/second (60 Hz) interlacing - to reduce flicker

250 Broadcast Video Standards Phase Alternate Line (PAL) and Sequential Color and Memory (SECAM): PAL has a screen resolution of 625 horizontal lines and a scan rate of 25 frames per second. SECAM has a screen resolution of 625 horizontal lines and is a 50 Hz system. SECAM differs from NTSC and PAL color systems in its basic technology and broadcast method.

251 Broadcast Video Standards Advanced Television Systems Committee (ATSC) Digital Television (DTV): This digital standard provides TV stations with sufficient bandwidth to present four or five Standard Television (STV) signals or one High Definition TV (HDTV) signal. This standard allows for transmission of data to computers and for new Advanced TV (ATV) interactive services.

252 Broadcast Video Standards Several incompatible standards: NTSC (US, Japan, many other countries) PAL - (United Kingdom, parts of Europe, Australia, South Africa) SECAM - (France Russia, few others) HDTV - ( US ) - newest technology

253 Broadcast Video Standards HDTV- High Definition Television now available, allow viewing of Cinemascope and Panavision movies with aspect ratio 16:9 ( wider than high) (See p. 184) Twice the resolution, interlaced format Digitized then compressed for transmission

254 Broadcast Video Standards 4: 3 Aspect Ratio

255 Broadcast Video Standards 16: 9 Aspect Ratio

256 Integrating Computers and Television Television video is based on analog technology and international broadcast standards Computer video is based on digital technology and other image display standards DVD and HDTV merges the two

257 Analog Video Analog television sets remain the most widely installed platforms for delivering and viewing video. Television sets use composite input. Hence colors are less pure and less accurate than computers using RGB component. NTSC television uses a limited color palette and restricted luminance (brightness) levels and black levels.

258 Analog Video Some colors generated by a computer that display fine on a RGB monitor may be illegal for display on a NTSC TV. While producing a multimedia project, consider whether it will be played on a RGB monitor or a conventional television set.

259 Video Overlay System To display analog video (TV) images on a computer monitor, the signal must be converted from analog to digital form ( Where else does this conversion commonly take place?) A special digitizing video overly board is required for the conversion Produces excellent quality, full screen, full motion video, but costly.

260 Video Overlay System Many companies use computer based training (CBT) systems These require a computer and monitor cabled to a TV and video disc player. Overlay boards allow the video disc to be controlled by the computer and display the images on the computer screen.

261 Video Capture Boards Video overlay boards can capture or digitize video frames and play them back as QuickTime MPEG and AVI movies. Some also include audio input and sound management to interleave sound and images Some also offer compression and accelerate digitizing, or support NTSC video.

262 Differences Between Computer and TV Video Computer scan refresh rate = 480 lines/sec Computer scan is progressive ( noninterlaced) at HZ or higher TV scans at 525 (or 625) lines/sec, with interlacing at a frame rate of 60 Hz

263 Interlacing Effects The TV electron beam actually draws all the odd line, then all the even lines, interlacing them On a computer (RGB) monitor, lines are painted one pixel thick and are not interlaced. Displayed on a TV they flicker because they appear in every other field. To avoid this avoid very thin lines and elaborate serifs.

264 Differences Between Computer and TV Video TV broadcasts an image larger than the screen so that the edge of the image is against the edge of the screen. This is called overscan Computer images are smaller than the screen area (called underscan) and there is a border around the image

265 Computers and Video

266 Differences Between Computer and TV Video When a computer screen is converted to video the outer edges do not fit on the TV screen only about lines of the computer image are visible. Avoid using the outer 15% of the screen for graphics, or titles for use on TV Use the safe title area ( See p. 184)

267 Video Color Color reproduction and display are also different in TV and computers monitors Computers use RBG component video and produce more pure color NTSC TV uses a limited color palette and restricted luminance (brightness) and black levels

268 Working with Text and Titles for Video Productions Use plain, bold, easily read fonts Use light color text on a dark background Avoid color combinations like yellow/violet, blue/orange which vibrate Avoid black or colored text on white background

269 Working with Text and Titles for Video Productions Make lines and graphics at least two pixels wide Use parallel lines and boxes sparingly and draw them with thick lines Avoid hot colors Keep graphics and titles in the safe screen area

270 Working with Text and Titles for Video Productions Bring titles on slowly and let them remain on the screen sufficiently long, fade out Avoid busy screens- use additional pages instead

271 Digital Video Digital video architecture. Digital video compression.

272 Digital Video Architecture Digital video architecture consists of a format for encoding and playing back video files by a computer. Architecture includes a player that can recognize and play files created for that format.

273 Digital Video Compression Digital video compression schemes or codecs ( coder/decoder) is the algorithm used to compress (code) a video for delivery. The codec then decodes the compressed video in real-time for fast playback. Streaming audio and video starts playback as soon as enough data has transferred to the user s computer to sustain this playback.

274 Video Compression To store even a 10 second movie clip requires the transfer of an enormous amount of data in a very short time 30 seconds of video will fill a 1 GB hard drive Typical hard drives transfer about 1MB/second and CD- ROMs about 600K/second

275 Video Compression Full motion video requires the computer to deliver the data at 30 MB/second more than today s PCs and MACs can handle Solution- use video compression algorithms or codecs Codecs compress the video for delivery and then decode it for playback at rates from 50:1 to 200:1

276 Video Compression & Streaming Codecs ( such as MPEG, JPEG) use lossy compression schemes Streaming technologies are also used to provide reasonable quality, low-bandwidth on the WEB Playback starts as soon as enough data have been transferred to the user s computer instead of waiting for the whole file to download ( RealAudio and RealVideo software)

277 MPEG Standard developed by the Moving PIcturesExperts Group for digital representation of moving pictures and associated audio

278 Digital Video Compression MPEG is a real-time video compression algorithm. (Moving Picture Experts Group) MPEG-4 ( ) includes numerous multimedia capabilities and is a preferred standard. MPEG-7 (2002) (or Multimedia Content Description Interface) integrates information about motion video elements with their use. MPEG 21 under development

279 Digital Video Video clips can be shot or converted to digital format and stored on the hard drive. They can be played back without overlay boards, second monitors or videodiscs using QuickTime or Active Movie for Windows Analog video can be converted to digital or now created in digital form

280 Video Recording and Tape Formats Composite analog video. Component analog video. Composite digital. Component digital. ATSC digital TV.

281 Composite Analog Video Composite video combines the luminance and chroma information from the video signal. Composite video produces lowest quality video and is most susceptible to generation loss. Generation loss is the loss of quality that occurs while moving from original footage to editing master to copy.

282 Component Analog Video Component video separates the luminance and chroma information. It improves the quality of the video and decreases generation loss. In S-video, color and luminance information are kept on two separate tracks (Y/C) to improve the picture quality. Betacam is a new portable professional video format which lays the signal on the tape in three component channels.

283 Composite Digital Composite digital recording formats combine the luminance and chroma information. They sample the incoming waveforms and encode the information in binary (0/1) digital code. It improves color and image resolution and eliminates generation loss.

284 Component Digital Component digital formats add the advantages of component signals to digital recording. D-1 component digital format is an uncompressed format which has a very high quality image. It uses a 19 mm (3/4-inch) tape in order to save data. Several other digital component formats are DCT, Digital Betacam, DV format, DVCPRO, and DVCAM formats.

285 ATSC Digital TV These standards provide for digital STV and HDTV recordings that can be broadcast by digital TV transmitters to digital TV receivers. ATSC standards also provide for enhanced TV bringing the interactivity of multimedia and the Web to broadcast television.

286 Vaughn s Law of Multimedia Minimums Your goal is to produce multimedia that is adequate and does it s job but doesn t throw you into bankruptcy. Experiment with various levels of consumer grade equipment Professional sound and video equipment is very expensive

287 Recording Formats S-VHS and Hi-8 consumer quality Component (YUV) - Sony BetacamSP the professional standard for broadcast quality Component Digital- a digital version of the Betacam- best format for graphics > $900,000 and produces 15 minutes of video Composite Digital most common >$110,000

288 Shooting and Editing Video Shooting platform use a steady tripod or a camera with an electronic image stabilization feature to avoid shaky hand effect or use camera moves and moving subjects to disguise your lack of steadiness

289 Shooting and Editing Video Lighting performance is the main difference between professional and consumer camcorders Use a simple floodlight kit or natural daylight to improve the image Onboard flood lights can be used as fill light to illumine faces

290 Shooting and Editing Video

291 Shooting and Editing Video Chroma Key or Blue Screen - popular technique for making multimedia without the use of expensive backgrounds In shooting against a blue screen, be sure that the lighting is perfectly even and that actors are not too close to the screen so that color spills over on them

292 Shooting and Editing Video Composition Avoid wide panoramic shots Use close-ups, head and shoulders Remember the more a scene changes the slower the playback will be Keep the camera still, let the subject add the motion by walking, turning...

293 Using Video Tapes Fast forward new tapes and rewind them so that the tension is even (called packing ) Black-stripe the tape by running it through the recorder with the lens cap on -eliminates snowy noise Do not reuse tapes after editing Remove break off tab to avoid overwriting

294 Video Hardware Resolution Horizontal resolution -the number of lines of detail the camera can reproduce Different from the vertical scan lines on TV The lens, and number, size and quality of the CCDs determine the resolution Poor resolution = poor image

295 Consumer Grade Equipment Mass production at low cost; easier to use Cameras and camcorders that use HI-8 and S-VHS formats are superior to 8 mm and VHS systems HI-8 is most widely available tape format and best consumer grade

296 Making Tape Copies For demo or promo tapes use at least Super VHS ( HI-8 is best and allow unlimited copies to be made without degradation) Copying ( dubbing) depends on the tape format and the quality of the equipment being used Copy in SP mode- faster writing produces better images

297 Video Window Size Shrinking a digitized image improves it perceived sharpness ( Also happens when you switch from 19 to 13 TV) The image is crisper because the scan lines are closer together

298 Editing with Consumer VCRs Editing with 2 VCRs causes problems because the two machines are not in sync Editing software, such as Premier, or After Effects, has become more commonly used in multimedia

299 P*64 Video telephone conferencing standard for compressing audio and motion video images Encodes audio and video for transmission over copper or fiber optic lines Other compression systems are currently being developed by Kodak, Sony, etc.

300 Optimizing Video files for CD-ROMs CD- ROMs are an excellent distribution media for multimedia: inexpensive, store great quantities of information, with adequate video transfer rates Suitable for QuickTime and AVI file formats as well as those produced by Director, etc.

301 Optimizing Video files for CD-ROMs Limit the synchronization between video and audio AVI interleaves them QuickTime files must be flattened - to interleave the audio and video Use regularly spaced key frames (10 to 15 frames apart) Limit the size of the video windowthe more data the slower the playback

302 Optimizing Video files for CD-ROMs Choose the software compression algorithm carefully Sorenson codec is optimized for CD- ROM playback Cinepack algorithm, available with AVI and QuickTime, is also optimized for CD-ROM playback Use Norton speed Disk to defragment your files before burning the master

303 Chapter 9 Multimedia Hardware Mac vs. PC

304 Overview Macintosh versus Windows platform. Networking Macintosh and Windows computers. Connections. Memory. Storage devices. Input and output devices. Communication devices.

305 Which Platform Mac or PC? Select platform based on Personal preference Budget constraints Project delivery requirements Type and content of project materials Availability to target audience

306 Mac versus Windows The Macintosh platform: Was launched by Apple in Has a good built-in audio and highquality graphics capability. Includes hardware and software for digitizing and editing video and producing DVD discs. Makes multimedia project development easier and smoother.

307 Mac versus Windows The Windows platform: Is a collection of different vendor-neutral components that are tied together by the requirements of the Windows operating system. Initially focused on business computing and was not suitable for multimedia. However, it is now easier to find multimedia hardware and software for Windows as compared to the Macintosh.

308 MAC vs. PC Macintosh Since 1984 has been multimedia Good built-in audio Easy to learn GUI PC Intended for business System beeps and tiny, tinny speaker DOS screencommand driven Since late 1980 s provides multimedia capabilities

309 Macintosh Platform All Macs can play sound Latest include hardware for digitizing sound 8/16/24 bit graphics available Can digitize both sound and video Requires a mouse

310 Macintosh Platform Power Mac 1994 (RISC) reduced instruction set computing ( IBM/Motorola) 1997 G3 series clock speeds > 233MHz Higher performance than existing Pentium based windows machines 2003 G4 series clock speeds > GHz Dual processor Performance 20 times better than G3

311 Windows Multimedia PCs MPC Standard- manufacturers guarantee that software written to the MPC standard (labeled MPC compliant) will play on their machines. Three levels of minimum requirements: MPC1, MPC2, MPC3

312 Windows Multimedia PCs Level 1 ( MPC1) 16 MHz, 386SX, 2MB RAM, 30 MB drive CD-ROM, VGA video ( 16 colors) 8 bit audio board, speakers/headphones MS Windows with Multimedia Extensions package Not powerful enough to develop Multimedia Hardly powerful enough to play it

313 Windows Multimedia PCs Level 2 ( MPC2) 25 MHz, 486SX, 4MB RAM, 160 MB drive 2xCD-ROM, VGA/SVGA video 16 bit audio board, speakers/headphones, microphone

314 Windows Multimedia PCs Level 3 (MPC3) 75 MHz, Pentium, 8 MB RAM, 540 MB drive 4xCD- ROM, MPG support MPEG1 video playback Full motion video ( in small window) with TV quality CD quality sound

315 Networking LANs- local area networks Located within short distances ( such as a campus, or building) Allow sharing of resources such as printers Ethernet for crossplatform development WANs- wide area networks Used for long distances More expensive to install and maintain ISPs like AOL, MSN make it available and affordable

316 Networking Mac and Windows Networking is essential for direct communication and sharing of resources across platforms. Local area network (LAN), wide area network (WAN), and Internet connections provide connectivity and networking capabilities.

317 Networking In a LAN, workstations are located within a short distance. They are relatively less expensive. In a WAN, communication systems span great distances and are typically set up and managed by large corporations. They are expensive to install and maintain. A dial-up connection to the Internet through an Internet Service Provider (ISP) also enables communication.

318 Networking To establish communication between a Macintosh and Windows PC, install Ethernet system and client-server software. Ethernet is a method of wiring up computers. Client/server software is required for communication and transfer of files. Macintosh computers have built-in Ethernet networking, while Windows PCs require an additional Ethernet card.

319 Usually run Appletalk Networking Client/server software enables computers to communicate through an ISP MACs PCs Have ethernet built Need ethernet in cards Need DAVE to communicate with PC Usually run TCP/IP Need MACLAN to communicate with MAC

320 Connections SCSI ( scuzzy ) Small Computer System Interface lets you add peripherals ( up to 8) IDE- connect internal devices USB- universal serial bus- plug and play and hot swappable Firewire (IEEE 1394)- supports high bandwidth serial data transfer among multiple computers

321 Memory Sufficient memory must be allocated for storing and archiving files. Memory requirements of a multimedia project depend on the project's content and scope. The two types of memory are random access memory (RAM) and read only memory (ROM).

322 Memory and Storage Devices RAM ROM Floppy and Hard Disks Zip, Jaz and Syquest Zip 100MB Jaz 1 GB Optical Storage CD, CD-R, etc.) DVD (Digital Versatile Disk) upto 1GB DVD-video DVD-ROM

323 Input Devices Keyboards Mice and Trackballs Touchscreens Magnetic Card Encoders and Readers Graphic Tablets Scanners Optical Code Recognition (OCR)Devices Infrared remotes Voice Recognition Systems Digital Cameras Lightpens

324 Output Hardware Audio Devices Amplifiers and Speakers Monitors Video Devices Projectors CRT cathode ray tube LCD liquid crystal display Printers Injet laser

325 Communication Devices Modems ( Hayes Compatible) v.90 ISDN Integrated Services Digital Network DSL-Digital Subscriber Line Cable Modems

326 Modems Modems modulate and de-modulate analog signals. They provide connectivity through standard phone lines. Modems can be internal or external. Modem speed is measured in baud, and the standard modem speed should be at least 56 Kbps.

327 ISDN ISDN stands for Integrated Services Digital Network. It is used for higher transmission speeds by telephone. They transfer data at the rate of 128 Kbps. ISDN lines are used for networking, Internet access, and audio-video conferencing. They are more expensive than the conventional analog lines.

328 Cable Modems They provide Internet access at speeds 100 to 1,000 times faster than a telephone modem, over the same cable network that supplies the television signal. However, due to noise in the system, sending rates may be much slower than receiving rates.

329 Summary Macintosh and Windows are the two most common hardware platforms used in multimedia. LANs, WANs, Ethernet, and client-server software facilitate communication and connectivity among computers. Storage devices include floppy disks, hard disks, Zip drives, Jaz drives, MO drives, DVDs, and CD-ROMs.

330 Summary Input devices include keyboards, mice, trackballs, touchscreens, graphic tablets, scanners, OCR devices, infrared remotes, voice recognition software, and digital cameras. Output devices include audio devices, speakers, amplifiers, monitors, video devices, projectors, and printers. Communication devices include modems, ISDN lines, and cable modems.

331 Chapter 10 Basic Software Tools

332 Basic Tools - Overview Authoring system ( Authorware) Text Editing, Word Processing Tools ( Word) Painting and Drawing Tools 2D,3D Modeling and Animation Tools Image Editing Tools Sound Editing Tools Animation, Video, and Digital Movie Tools Utilities useful for multimedia

333 Text Tools Word Processors

334 Text Editing and Word Processing Each new tool has a learning curve Word Processor ( WORD ) for basic typing, also allows embedded multimedia elements OCR ( optical character recognition) software which turns bitmapped characters into electronically recognizable text can be used with scanners Can be imported into Word document BE CAREFUL of COPYRIGHT LAWS!!!!

335 Text-based tools Word processors: Are powerful applications that include spell checkers, table formatters, thesaurus, and pre-built templates for commonly used documents. Are used for creating project letters, invoices, and storyboards. Allow embedded multimedia elements. Microsoft Word and WordPerfect are Word processors. Often come bundled in an "Office Suite."

336 Text Tools Word Processors OCR Software

337 Text-based Tools Optical Character Recognition (OCR) software: Converts bitmapped characters into electronically recognizable ASCII text. Makes use of probability and expert system algorithms. Is very accurate and saves time and effort.

338 Graphics Tools Painting and Drawing Tools

339 Graphics Tools Painting and Drawing Tools 3-D Modeling Tools

340 Graphics Tools Painting and Drawing Tools 3-D Modeling Tools Image Editing Tools

341 Painting and Drawing Tools Most graphic programs use bitmapped images since they provide the greatest choice. Include the Eyedropper tool, Autotrace tool, and anti-aliasing, airbrushing, blending, and masking functionalities. PhotoShop, Fireworks, and Painter are painting software. CorelDraw, FreeHand, and Illustrator are drawing software.

342 Painting and Drawing Tools Painting Software (Photoshop) can produce bitmapped images Drawing software (Freehand, Corel Draw or Illustrator) can produce vector- based line art easily printed to paper Some combine the features of both

343 Painting and Drawing Tools Features include: An intuitive graphical user interface. Scalable dimensions. Multiple undo capability. Scalable text font support. Support for third-party special effect plug-ins. Layering capability.

344 Features of Drawing/Painting Programs Graphical interface Scalable dimensions to resize, stretch Ability to pour color, pattern in areas Ability to paint with pattern and clip art Customizable pen, brush, eyedropper Support for scalable text fonts Zooming and multiple undo s Object layering

345 Bitmapped vs. Vector graphics A bitmap is a set of pixels or a grid of dots which are displayed on the computer screen to forma an image Bitmapped images are more powerful for rendering fine detail and effects Vector images are stored as mathematical equations or algorithms that define the curves, lines and shapes in a picture Vector-graphics produced by programs such as FLASH load quickly

346 Bitmap vs. Vector Graphics Vector images have advantages over bitmaps: Vector images are scalable ( size can be changed without loss of quality Smaller file size usually results in faster internet downloads

347 3-D Modeling Tools Features include: Good color and palette management. Multiple dimension windows and unlimited cameras. Lathe and extrude features. Ability to drag and drop primitive shapes, sculpt organic objects. Color and texture mapping.

348 2D, 3D Modeling and Animation MiniCAD can translate 2D into 3D Good 3D modeling tools include: Multiple windows to view from the camera s perspective Ability to drag and drop into a scene Ability to create objects Color and texture mapping Ability to add realistic effects (fog, shadow..) Ability to add special lighting effects Ability to draw spline- based paths for animation

349 Image-Editing Tools Are specialized and powerful tools for enhancing and retouching existing bitmapped images. Features include conversion of image-data types and file formats, masking features, employment of virtual memory scheme, etc. Support third-party plug-ins.

350 Image Editing Tools Specialized tools for enhancing and retouching existing bitmapped images Some provide tools of drawing and painting packages Some can create images from scratched as well as import images from digital cameras, scanners. Original artwork or files made with drawing/painting packages

351 Features of Image Editing Tools (Example- Photoshop) See pp for complete list of features Multiple windows Conversion of major image formats Direct input from scanner, video sources Good selection tools for editing Good masking tools Multiple levels of undo s Color mapping controls Tools to retouch, blur, sharpen, lighten Geometric transformations.

352 Common Computer Graphics Formats.bmp - Windows bitmap.pic PC Paint graphics format.mac Macintosh MacPaint format.gif ( Graphics Interchange Format) common for graphics on the world wide web.jpg JPEG image (Joint Photographic Experts Group) platform independent used for photos.pcd Kodak s Photo CD format

353 Common Computer Graphics Formats.pict Macintosh standard image format.png - Portable Network Graphics Format approved by W3C to replace the GIF format for the web.tga targa video capture board format.tif ( Tagged image file format (TIFF).wpg Word Perfect graphics format

354 Other Graphics Clip Art extensive clip art libraries exist on the internet; many have general categories such as nature, icons, backgrounds, etc. Digitized Pictures captured from cameras, videos, etc.

355 Audio and Video Tools Sound Editing Tools Animation and Video Tools

356 Sound Editing Tools Enables the user to see music as well as hear sound. This is done by drawing a representation of sound in fine increments. Enable the user to create custom system beeps. System beeps are pre-packaged sounds that indicate an error, warning or special user activity.

357 Sound Editing Sound editing for digitized and MIDI sound let you see sound ( as a score or wave form) as well as hear it. Allows you to create sound and special effects Creative Labs Wave Studio often comes with PC sound boards; Mac users need to get Sound Edit16 or similar tools

358 Sound Objects Waveform Audio MIDI soundtracks Compact disc ( CD) audio MP3 files

359 Waveform Audio Similar to digital images, sounds can be digitized The waveform describes its frequency, amplitude and harmonics Digitized by sampling wave many times a second and stored as data in a.wav file

360 MIDI Stands for Musical Instrument Digital Interface MIDI stores the performance information needed for your sound card to play the music : notes on/off, duration, loud/soft/ timbre/tone and other special effects Stored as.mid file

361 Audio CD Stores up to 75 minutes of high quality sound Sampled at a rate of 44,100 /second Samples are 16 bits, with a range of 98dB ( from a quiet whisper to a loud scream)

362 MP3 Format Stands for MPEG Audio Layer 3 Audio file format that uses a code to encode (compress) and decode (decompress) recorded music into smaller files to transmit across the internet Software which creates MP3 files from an audio CD is called a ripper

363 Animation, Video, and Digital Movie Tools Animation is a sequence of bitmapped graphic scenes or frames, rapidly played back. Animations can be made within some authoring systems by moving objects or sprites to simulate motion. Moviemaking tools take advantage of QuickTime and AVI formats to create, edit, and present digitized motion video segments.

364 Animation, Video, and Digital Movie Tools Digital video editing and playback require a large amount of free disk space. When working with digital video, it is necessary to defragment and optimize the disk before recording and playing back movie files. It is necessary to compress movie files before delivery.

365 Animation, Video, and Digital Movie Tools Compression ratio is the size of the original image divided by the size of the compressed image. Compression can by lossy or lossless. Lossy schemes ignore picture information the viewer may not miss. Lossless schemes preserve the original data precisely.

366 Animation Frame Animation Vector animation Computational animation Morphing

367 Animation, Video and Digital Movie Tools Animations are often sequences of bitmapped graphics( frames), which are played back rapidly ( frame oriented) Authoring systems can create animation by rapidly changing the location of objects or sprites (objectoriented or vector animation.)

368 Animation Vector animation varies the beginning, length and direction parameters for the lines that define an image, such as in FLASH Computational animation allows you to move object across the screen by changing their x,y coordinates

369 Morphing An animation technique that allows you to blend two still images creating a sequence of in-between images that show one image metamorphosing into the other ( for example a race car changing into a running tiger )

370 Animation, Video and Digital Movie Tools Special hardware (video capture boards) are often needed to convert analog signal (camera) to digital (computer) more recently digital cameras and camcorders have become available (Adobe Premiere ) allows you to edit video clips assembled from camera videotape, scanned images, digitized audio or MIDI files

371 Video Formats QuickTime: Is a software-based architecture for integrating sound, text, animation, and video on Macintosh and Windows platform. Is an extensible system for multimedia delivery. Can deliver 3-D animations, virtual reality, and streaming audio-video on the Web. The three QuickTime elements are Movie file format, Media Abstraction Layer, and Media services.

372 Video Formats QuickTime (continued): Includes built-in support for ten different media types. Offers a comprehensive set of services. Allows embedded commands in HTML documents.

373 Video Formats Audio Video Interleaved (AVI): Is a Microsoft-developed format for playing full-motion interleaved video and audio sequences in Windows. Does not require specialized hardware. Is an inextensible, open environment. Lacks serious video editing features. The OpenDML format was developed to make AVI more functional.

374 Video Formats QuickTime and Audio Video Interleaved (AVI) formats support special algorithms, provide a methodology for interleaving, and allow organized streaming of data from disk into memory. Digital Versatile Disc (DVD) is a hardware format that uses laser light to store and read digital information.

375 Common Video Formats QuickTime from Apple for both Mac and PC AVI MS Audio Video Interleaved for Windows Both blend (interleave) audio and video Neither is currently capable of producing full screen images at 30 frames/second (TV standard)

376 QuickTime Multitrack recorder with almost unlimited range of tracks. Supports digitized video and sound, computer animations, MIDI data, and external devices ( CD-ROM players, videodisks, etc.) Provides imbedded support and services for 10 media types ( p.101) Provides embedded HTML commands

377 QuickTime Integrates sound, text, animation and video Can be used on the internet to deliver multimedia through plug-ins Provides the foundation for the new MPEG-4 Multimedia format for the web

378 QuickTime Movie file format- provides a standard method for storing audio, video, text Media Abstraction Layer describes how your computer should access the media Media Services- includes built-in support for different media types and offers services for: timing, synchronization, data compression, format conversion, audio mixing, special effects, media capture, movie controllers, etc. ( See p )

379 Some QuickTime Embedded Commands for HTML Powerful commands for controlling a QuickTime file can be embedded right in the HTML code: AUTOPLAY- starts movie automatically BGCOLOR sets background color for movie HEIGHT and WIDTH specifies size of movie in web page LOOP- plays movie in continuous loop VOLUME- sets default playback volume HIDDEN plays sound only

380 Windows Video Media Control Interface ( MCI) provides a uniform command interface for managing audio and video that interleaves them together in the file called AVI (audio video interleaved). AVI plays about 15 frames/second in a small window Lacks features needed for serious video/sound editing

381 Windows Video Features Playback from hard disk or CD-ROM Uses limited amount of memory Quick loading and playing Video compression available Some tools VidCap and VidEdit to capture and edit video ( see p. 116)

382 Movie Editors With desktop editing software and video digitizing boards you can digitize video clips, edit the clip, add special effects and titles, mix sound tracks and save the finished product on magnetic or optical media Reuires an enormous of hard drive space Software : Adobe Premiere Digitizing Boards: Targa, Creative Labs ( see p. 117)

383 Movie Compression Image compression algorithms are essential to deliver motion video and audio Massive amounts of data are needed to display a new screen image every 1/30 second Compression ratio of at least 5:1 needed to transmit over phone lines

384 Movie Compression Compression ratio- size of the original image divided by the size of the compressed image; usually only the part of the image that changes form image to image ( delta), The higher the ratio, the lower the image quality Image quality Lossy- ignores picture information that the viewer may not miss Lostless- preserves the original data precisely Compression/decompression speed ideally as fast as possible

385 Helpful Accessories Screen Capture Software Format Converter