2020

Republic of the Philippines

CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

ITEC 70:
MULTIMEDIA
SYSTEM

JOVELYN D. OCAMPO
INSTRUCTOR
DEPARTMENT OF COMPUTER STUDIES 0
 TABLE OF CONTENTS

Page

CvSU MISSION ............................................................................................................................ 2

CvSU VISION ............................................................................................................................... 2

COURSE DESCRIPTION ............................................................................................................. 2

INTENDED LEARNING OUTCOMES ................................................................................. 2

COURSE REQUIREMENTS ............................................................................................... 2

MODULE 01: WHAT IS MULTIMEDIA? ....................................................................................... 3

MODULE 02: TEXT AS MEDIA ELEMENT ................................................................................. 11

MODULE 03: UNDERSTANDING IMAGES ............................................................................... 21

MODULE 04: THE NEED FOR IMAGES .................................................................................... 29

MODULE 05: IMAGE EDITING SOFTWARE ............................................................................. 37

ADOBE PHOTOSHOP ..................................................................................................... 39

ADOBE LIGHTROOM ...................................................................................................... 45

MODULE 06: HOW LOUD IS LOUD? ........................................................................................ 50

MODULE 07: AUDIO EDITING .................................................................................................. 58

MODULE 08: VIDEO .................................................................................................................. 64

MODULE 09: EXPLORING ANIMATION .................................................................................... 72

MODULE 10: MULTIMEDIA ESSENTIALS ................................................................................ 83

KEY TO CORRECTION .............................................................................................................. 91

1
 COURSE DESCRIPTION

ITEC 70 – Multimedia System

This is an introductory course in digital media. It is

Republic of the Philippines intended for students from all backgrounds who are
CAVITE STATE UNIVERSITY interested in learning the foundational scientific
Bacoor City Campus concepts and the basic techniques of digital media
SHIV, Molino VI, City of Bacoor production.
Knowing about the connection between scientific
concepts and applications will help you in making
educated guesses, rather than relying on defaults or
recipes, in using tools and techniques in application
programs. The practical component of the course is
organized around learning about, and using various
software for manipulating digital sound, digital images,
and digital video.

MISSION PROGRAM OUTCOMES ADDRESSED BY

THE COURSE. AFTER COMPLETING THIS
Cavite State University shall provide
COURSE, THE STUDENTS MUST BE ABLE
excellent, equitable and relevant
educational opportunities in the arts, TO:
science and technology through
quality instruction and relevant 1. Attain the vision, mission, goals and objectives of
research and development activities. the university, campus and department;
It shall produce professional, skilled 2. Deliver a gender fair and gender sensitive
and morally upright individuals for instruction to students aligned with University goals
global competitiveness. and objectives;
3. Understand the core concepts of multimedia;
4. Learn the fundamental conceptual skills for
VISION effective visual communication;
5. Formulate a working definition of interactive
multimedia;
The premier university in historic Cavite
6. Demonstrate competence in using editing software
recognized for excellence in the programs;
development of globally competitive and 7. Apply gain skills necessary for the study of
morally upright individuals. advanced concepts and techniques in multimedia;
8. Develop skills involving design, manipulation, and
animation; and
9. Demonstrate the use of animation, digitalized
sound, video control, and scanned images.

JOVELYN D. OCAMPO COURSE REQUIREMENTS

Instructor, ITEC 70: Multimedia System
jovelyn.ocampo@cvsu.edu.ph 1. Major Examinations
2. Student’s Portfolio/Quizzes/Activities
3. Class Participation

2
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 01: WHAT IS MULTIMEDIA?

After the completion of the unit, students will be able to:

1. define multimedia;
2. discuss the importance of multimedia according to its uses; and
3. understand the essential components of multimedia application.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. It literally means “Many Media”.

a. Multimedia c. Edutainment

b. User Navigation d. Integrated media

2. These types of applications that were created with the intention of aiding learning but

infused with a twist of “fun” and “entertainment”.

a. Multimedia c. Edutainment

b. User Navigation and Control d. Integrated media

3. A model that incorporates several theories related to instructional design and learning

processes.

a. Multimedia c. Edutainment

b. Dales’s Cone of Learning d. Integrated media

4. It refers to the various forms of how information is presented.

a. Multimedia c. Digital Media Elements

b. User Navigation and Control d. Integrated media

5. Allows the user to traverse through the multimedia application through navigation buttons,

links and menus.

3
 a. Multimedia c. Edutainment

b. User Navigation and Control d. Integrated media

6. Shows an actual capture of a scenario, event, process, or procedure.

a. Image c. Audio

b. Text d. Video

7. Contains information that is meant to be seen or perceived.

a. Image c. Audio

b. Text d. Video

8. Releases information that is meant to be heard.

a. Image c. Audio

b. Text d. Video

9. Shows a representation or simulation of a scenario, event, process, or procedure.

a. Image c. Audio

b. Animation d. Video

10. Contains information that is meant to be read.

a. Image c. Audio

b. Text d. Video

4
INTRODUCTION TO MULTIMEDIA

1.1 Meaning

Multimedia literally means “Many Media”. It is something people can see, hear and read on

websites, radio, television, video games, phone applications, cinema halls and etc.

Multimedia can be defined as a combination of digitally manipulated media. These digitally

manipulated media are Text, Images, Audio, Video, and Animation. It is now integrated into

an interactive application that runs on computing and electronic devices.

1.2 Applications of Multimedia

Multimedia can be used in a variety of ways in different fields.

This can be applied in the following:

Business

The main priority of a business is its consumers. Consumers are those who buy products or

avail services offered by different businesses. In order to become successful, businesses

must satisfy their consumers. And for them to get consumers/customers, they need to

advertise and to market their products or their services.

Multimedia takes a big part in advertising and marketing products and services especially

online as of these days. It was used in different advertising and marketing tools such as

follows:

 Product Demonstration

 Product Customization

 Interactive Catalogue

 Virtual Tour – Virtual Tour was used by businesses who offers services such as

hotels and resorts.

 Interactive Forms and Polls – Interactive forms and polls were used to get

consumers information and feedbacks. Feedbacks are valuable information that will

5
 be used to make important decisions such as changes and improvement on products

or on services.

Home/Personal Use

Multimedia can also be used for home or for personal use. In fact, there are multimedia

applications that were intentionally created for home-makers and some for personal

entertainment.

Education

With the help of multimedia, students are no longer limited to textbooks. Multimedia provides

a more visual way to learn. Multimedia developers have helped educators to create media-

rich learning applications and instructional tools and this make teaching more interesting

and fun. Some examples are learning games, visual aids, tutorials and etc.

Dale’s Cone of Learning/Experience

Figure 1.1. Dale’s Cone of Learning

Dale’s Cone of Learning/Experience is a model that incorporates several theories

related to instructional design and learning processes. During the 1960s, Edgar Dale

theorized that learners retain more information by what they “do” as opposed to what

is “heard”, “read” or “observed”.

According to the cone, the least effective method at the top involves learning from

information presented through verbal symbols, such as listening to spoken words.

And the most effective methods at the bottom involves direct, purposeful learning

experiences, such as hands-on or field experience.

6
 Edutainment

Aside from considering multimedia to be used in education, this can be also used for

entertainment. There are some types of applications that were created with the

intention of aiding learning but infused with a twist of “fun” and “entertainment”.

These applications are known as Edutainment.

Examples:

 Learning Games

 Instructional Cartoons

1.3 Essential Components of Multimedia Application

There are three essential components to be considered in developing or creating a

multimedia application (Digital Media Element, Integrated Media and User Navigation and

Control). These components make the application present information more meaningful,

more attractive, and more useful.

Digital Media Element

Digital Media Element refers to the various form of how information is presented. This

includes the following:

 Text - are information that is meant to be read.

 Image - contains information that is meant to be seen or perceived.

 Audio - releases information that is meant to be heard.

 Video - shows an actual capture of a scenario, event, process, or procedure.

 Animation - shows a representation or simulation of a scenario, event or process.

Integration of Media

Media Integration means combining different media elements to show something more

meaningful.

Integrating media requires you to have good understanding of each media element and to

know how media elements complement or enhance each other. It is an advantage if you are

7
 familiar with different multimedia applications available in the market or if you have seen

good examples of multimedia applications.

To integrate media into an interactive multimedia application, it should be undergo the

process of Authoring.

Example of Authoring Tools

 Adobe Flash

 Adobe Authorware

 CourseLab

User Navigation and Control

Aside from considering how digital media element and integration of media in multimedia

application, you will also need to consider the User Navigation and Control.

User Navigation and Control takes a big part in multimedia application because it allows the

user to traverse through the multimedia application through navigation buttons, links and

menus.

And it has two types: Linear Structure which is guided through navigation buttons (next,

back and home) and Non-Linear Structure which is guided through menu and hyperlinks.

Most of the multimedia applications are non-linear.

1.4 Advantages of Multimedia Application

Multimedia Application has its advantages. It allows information to be presented in a more

attractive way, gets the interest of the user, can be entertaining and fun if it is created well

and it present messages in the form of rich-media.

1.5 Multimedia Revolution

The key factor in the multimedia revolution is the digitization. Digitization is the process of

converting information into a digital format. Older media like television, radio, and video

recorder only relied on magnetic tapes and analog transmission. On the other hand,

computer are digital and cannot handle analog.

8
 Early computers could only handle simple text and graphics. It is because of some

restrictions such as the processing power (CPU), the computer display which is small, and

text-based, and the storage capacity (RAM, Disk space).

Nowadays, modern computers have faster processing power, better display, good storage

capacity, and have additional hardware (speakers, audio and graphics card).

1.6 Summary

 Multimedia is a combination of text, images, audio, video and animation.

 There are two types of multimedia applications – linear and non-linear.

 Multimedia is widely used in business, education, for entertainment, at home, etc.

9
ACTIVITY:

Questions:

1. How is multimedia useful in daily life?

____________________________________________________________

____________________________________________________________

____________________________________________________________

____________________________________________________________

____________________________________________________________

____________________________________________________________

2. Can you imagine a life without multimedia? Explain.

____________________________________________________________

____________________________________________________________

____________________________________________________________

____________________________________________________________

____________________________________________________________

____________________________________________________________

____________________________________________________________

10
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 02: TEXT AS MEDIA ELEMENT

After the completion of the unit, students will be able to:

1. understand wordless;
2. discuss the importance of text even in multimedia application;
3. differentiate font to font style; and
4. demonstrate right usage of Text including the font properties and arrangement

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. The most common form of media used to display information that needs to be read.

c. Text c. Font Style

d. Font d. Font Family

2. It pertains to the style of lettering.

a. Text c. Font Style

b. Font d. Font Family

3. A group of similar typefaces.

c. Text c. Font Style

d. Font d. Font Family

4. It is generally used to emphasize text.

a. Text c. Font Style

b. Font d. Font Family

5. Fonts with short stems.

a. Serif c. Sans Serif

b. Script d. Decorative

6. It is also known as “Cursive Fonts”.

11
 a. Serif c. Sans Serif

b. Script d. Decorative

7. These are fonts without short stem.

a. Monospaced c. Sans Serif

b. Script d. Decorative

8. Fonts that were created as a mimic to the typewriter font.

a. Monospaced c. Sans Serif

b. Script d. Decorative

9. It is used to emphasize a word by making it standout thickly.

a. Italic c. Underline

b. Bold d. Strikethrough

10. It is used to highlight cited text.

a. Italic c. Underline

b. Bold d. Strikethrough

12
TEXT

2.1 Introduction

Text can be seen everywhere. It has become a part of our life. From reading newspaper,

posting status on facebook, sending messages using cellphones, reading captions in

televisions and movies and etc. Text consists of characters, punctuations, symbols and etc.

in order to convey a message.

Wordles

Wordles is a visual depiction of the words contained in a piece of text. We can learn from

wordles that the way text is presented and arranged can affect the messages and meaning.

ELBOW JUST BETWEEN IT’S A SMALL WORLD AFTER

YOU AND ME ALL

Figure 2.1. Wordles

2.2 Why Study Text?

Text plays an important role in relaying messages on the screen. Text is one of the most

important element of multimedia. It is an essential source of presenting information that most

the people can understand. Proper use of text, considering font style, size and color, is a

big help in conveying the idea and message to the readers. It is important to know how to

use text effectively in multimedia applications.

Readability Issues

In reality, it is difficult to a person to read text on screen than in print. People read text on a

computer screen at a rate of 28% slower than reading a book.

13
2.3 Implications of Text in Multimedia Applications

Though text is the basic element of multimedia, it should be kept minimum to avoid

overcrowding. Less text can be read easily unlike longer text which can be time consuming

and tiring to the eye. In multimedia application, text is commonly used in: Title - the name of

the application; Heading - a title at the head of a page or section; Body Text or Content - the

main content; Instructions - a direction; and in Labels.

2.4 Factors that affect Text

Font Properties

Font pertains to the style of letters.

Font Size refers on how big the letters are. Font size is measured in Points and it does not

describe the height or width of its character. The height of two different fonts (in both upper

and lower case) may differ. One point is approximately 1/72 of an inch.

Font Style are generally used to emphasize text.

Bold – used to emphasize a word by making it standout thickly.

Italic – used to highlight cited text.

Underline – limits its use to hyperlink or hypertext.

Font Color is used to achieve a good contrast and harmony between the text color and

background color or background image to ensure readability. It is also used to emphasize

text.

High Contrast
Animation is the optical illusion of Animation is the optical illusion of
motion created by the consecutive motion created by the consecutive
display of images of static elements. display of images of static elements.

Low Contrast

Animation is the optical illusion of Animation is the optical illusion of

motion created by the consecutive motion created by the consecutive
display of images of static elements. display of images of static elements.

Figure 2.2. Font Color and Background Color Contrast

14
 Figure 2.3 Font Color and Background Image Contrast

Text Properties

Text Alignment refers on how text is positioned. There are 4 major alignment options (Left

Align, Right Align, Center Align and Justified)

Text Margins refers on how wide a block of text appears to be. Reducing text margin,

reduces the number of word in each line. Thus, people can understand what they read

better.

Text Spacing refers on how lines of texts are spaced. The space between the lines of text

is called “Leading”. Examples of text spacing are double spacing, 1.5 spacing, single

spacing, no space.

2.5 Fonts

Most of us are familiar with word processing and know the processes of entering and editing

text and working with fonts and font sizes. Especially those who use word processing

software such as Microsoft Word.

Font

Font is also known as ‘typeface’. It pertains to the style of lettering.

Many fonts are available online and people can buy or download them free. These fonts

differ or classified according to the presence or absence of serifs, their spacing between the

characters, and their style such as bold or italic.

15
 Arial Georgia
Arial Black Impact
Comic Sans MS Times New Roman
Courier New Jokerman

Figure 2.4. Different Types of Fonts

Font Family

Font Family is a group of similar typefaces. Fonts within a family, however, differ each other

in style such as the weight (light, normal, bold, semi-bold, etc.) An example of a font family

is Arial, which consists of an Arial, Arial Black, Arial Narrow, Arial Rounded, and Arial

Unicode.

Arial Arial Rounded MT Bold

Arial Black Arial Unicode MS
Arial Narrow

Figure 2.5. Arial Font Family

Font Origin

Fonts are named after its designer or the design era it originated from.

Garamond was named after a Frenchman in the 14th Century – Claude Garamond. But

interesting fact about this font is that someone named Jean Jannon actually designed the

font.

Bodoni was credited to an Italian typographer Giambattista Bodoni in the 18th Century.

Baskerville was designed by an Englishman, John Baskerville in the 17th Century.

Major Categories of Font

Serif fonts are fonts with short stems or finishing strokes. The word “serif” actually means

“little foot”. Serif fonts are preferred fonts for printed materials with lengthy information like

newspapers, magazines and books. These type of font are more readable when printed

compared to the computer screen.

16
 Ex. Times New Roman, Garamond, Bodoni, Bookman Old Style

Sans Serif fonts are fonts without short stem or finishing strokes. The French word “sans”

means “without”. Sans Serif fonts are typically used for headlines, headings and

title/subtitles in printed materials. It is preferred for text on Web or Multimedia applications

because it is perceived to be more readable.

Ex. Arial, Tahoma, Century Gothic, Verdana, Helvetica

Script fonts are also known as “Cursive” fonts. Letters under this category are often

combined forming a script. Script fonts often used as font for formal invitations, poster and

greeting cards. These types of fonts should never be used as the font for the body text on

Web or Multimedia applications. These fonts are used sparingly.

Ex. Edwardian Script, Brush Script, Lucida Handwriting

Decorative fonts collectively include those fonts that were created for the purpose of adding

embellishment, style or theme. It is often used as font for posters and greeting cards. Just

like the script, these fonts should never be used as the font for the body text on Web or

Multimedia applications. These fonts are used sparingly.

Ex. Bonnet, Loverboy, Walt Disney

Monospaced fonts were created as a mimic to the typewriter fonts. All characters with these

fonts have equal width. It is often used for programming code and displaying formula. These

fonts are used sparingly.

Ex. Courier, Lucida Console

2.6 Installation of Fonts

Fonts can be installed on the computer by opening the Fonts folder through Windows

Explorer. Go to C:\Windows\Fonts. When the folder opens, select the fonts you want to

install from an alternate folder and copy and paste them into the Fonts folder.

After the installation of the font, you can now use it in any word processor or other

applications that supports font editing.

17
2.7 Recommendations

Here are few recommendations in using text on multimedia applications:

 Title should be at least point 32 while Headings should be at least point 28

 Body text should be at least point size 24

 Choose San-serif fonts

 Use blocks of text

 Use bullets when possible

 Be consistent with your choice of fonts, text layouts, and colors

2.8 Don’ts

 Do not use too many colors, fonts and styles

 Avoid making text all uppercase

 Use text chunks to avoid very long paragraphs

2.9 Summary

 Text is the most common form of media used to display information that needs to be

read.

 Font and font style are not the same.

 There are five major categories of font (serif, sans serif, script, decorative and

monospaced).

18
ACTIVITY: WORDLES

ITEC 70: MULTIMEDIA SYSTEM

2nd Semester A.Y. 2020-2021

Name: _____________________________ Date: ______________________________

Course, Year & Sec.: _________________ Score: _____________________________

Objective/s:
At the end of the activity, the student should be able to:
 understand wordles and the importance of text.

Instruction: Find the hidden meaning of the wordles below. Write your answer in the space provided.

1 2 3

HIS.TORY MEREPEAT wonalicederland

______________________ ______________________ ______________________

4 5 6

BAN ANA
BIRD Arrest
You’re

______________________ ______________________ ______________________

7 8 9
S
L
O SCOPE
BIG BIG
W Ignore Ignore

______________________ ______________________ ______________________

19
 10 11 12

AID AID AID o_er_t_o_ ICE3

______________________ ______________________ ______________________

13 14 15
chair
B
ESROH RIDING A E
DUMR

______________________ ______________________ ______________________

Instruction: Create your own wordles and provide its meaning. Use the box provided.

___________________________________________________

20
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 03: UNDERSTANDING IMAGES

After the completion of the unit, students will be able to:

1. understand how image illusions works;
2. differentiate raster and vector graphics;
3. enumerate raster and vector file formats;
4. demonstrate right image resolution; and
5. discuss vector hierarchy.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. It represents information visually.

a. Image c. Dimension

b. File Size d. Resolution

2. It is reflected in the width and height of an image.

a. Image c. Dimension

b. File Size d. Resolution

3. It describes how clear the image appears on screen or on print.

a. Image c. Dimension

b. File Size d. Resolution

4. These are real, photographic images.

a. Raster c. Raster and Vector

b. Vector d. None of these

5. It is comprised of objects.

a. Raster c. Raster and Vector

b. Vector d. None of these

21
6. An image format that is capable of displaying millions of color at once.

a. JPEG c. GIF

b. PNG d. TIFF

7. It is the ideal format for small navigational icons and simple diagrams and illustrations.

a. JPEG c. GIF

b. PNG d. TIFF

8. A raster file format that supports transparency.

a. JPEG c. GIF

b. PNG d. TIFF

9. It was most used with image scanning.

a. JPEG c. GIF

b. PNG d. TIFF

10. A file format developed by Adobe Systems for representing single-page vector-based

drawings.

a. AI c. GIF

b. SVG d. TIFF

22
IMAGES

3.1 Introduction

Images are also important in multimedia applications. We are 70% visual of the time, we put

effort on seeing. A picture really speaks a thousand of words. One photograph, or graphs

can illustrate a one or two pages of text.

Image Illusion

Images represent information visually. With image illusions, image can be perceived in

different ways by different people.

Figure 3.1. Image Illusions

3.2 Understanding Image

Images are considered as a beautiful media element. It represent information that needs to

be seen and perceived. When placing images in a multimedia application, it is important to

have a good understanding of what images are.

Types of Images

Images can be classified into two types:

Raster Image are real, photographic images. A raster image is composed of a mosaic of

colored squares called pixels or picture elements. Individual pixels can be seen when you

zoom-in the image. Each pixel has a color value in RGB (Red, Green and Blue).

Example: (255, 255, 255)

23
Vector Graphics is comprised of objects (shapes, lines, ovals, curve, etc.)

Image Dimension

Image dimension is reflected in the width and height of an image. We commonly measures

images by inches like 3x5 (3R) or 4x6 (4R). But these measures are more suitable for photo

printing. For digital images, we measure dimensions in pixels. For example, 800 pixels x

600 pixels.

Image Resolution and Quality

The resolution describes how clear the image appears on screen or on print. Screen

resolution is defined as the number of pixels per inch (ppi) while Print resolution is defined

as the number of dots per inch (dpi).

In higher quality image, there are more pixels seen within the measurement of an inch while

the lower quality image has fewer pixels within an inch.

Figure 3.2. Image Resolution and Image Quality

Increasing the PPI/DPI leads to a higher resolution image and higher image quality.

Images resolution for screen must be 72ppi – 96ppi, for photo editor 150ppi or 300dpi, and

for photo printing 300dpi to 2400 dpi.

Low Resolution vs High Resolution Images

Low Resolution images get distorted when they are enlarged. High resolution images do not

get distorted when they are enlarged. Enlarging the picture does not increase resolution.

Figure 3.3. Low Resolution vs High Resolution

24
 File Size

File size depends on the resolution of the image. It is important to find balance between

resolutions and file size.

File Formats

Images has its own file format depending on its type and its purpose.

Raster File Formats includes:

 JPEG (Joint Photographic Experts Group) pronounced as “Jay-Peg”. It is capable of

displaying millions of color at once. This format is the most common used format for

storing and displaying photographic images.

 GIF (Graphics Interchange Format) pronounced as “JIF”. It can be saved with a

maximum of 256 colors. GIF is the ideal format for small navigational icons and

simple diagrams and illustrations.

 PNG (Portable Network Graphics) is a higher resolution image. It is the raster file

format that supports transparency. It is widely used on the web today for displaying

a high quality images with transparent background.

 TIFF (Tag Image File Format) was most used with image scanning.

Vector File Formats includes:

 AI (Adobe Illustrator File) is a file format developed by Adobe Systems for

representing single-page vector-based drawings.

 SVG (Scalable Vector Graphics) files use an XML-based text format to describe how

image should appear.

3.3 Vector Hierarchy

A vector hierarchy has objects. Those objects has paths. And paths have anchor points.

Properties of Objects

Stoke Properties which applies to the path of an object. The stroke properties includes

weight, color, and style.

25
 Weight is the line thickness.

Color is the color of the line.

Style which is about being the line solid, dashed or dotted.

Weight Color Style

Figure 3.4. Stroke Properties

Fill Properties which applies to the area enclosed by the path. It includes color, gradient,

and texture.

Color is the color of the fill.

Gradient is a smooth-blended combination of two or more color.

Texture is the feel or the appearance of the fill.

Color Gradient Texture

Figure 3.5. Fill Properties

Strokes are essential. It is common for vector graphic designers to start with the outline

drawing before coloring the graphics. And fill add meaning to the graphics. Digitally colored

graphics can resemble 2D and 3D views.

3.4 Implications of Images in Multimedia Applications

Raster images are best used in multimedia application if you need to show actual, real, or

evidence of something or someone.

Vector graphics are best used in multimedia application when you need to:

 represent a brand (logo);

26
  show something at a dissected view such as parts of the hear, parts of eyes and

etc.;

 show something that cannot be captured with a digital camera;

 show cartoon drawing;

 represent spatial regions with a map;

 show creative illusions;

3.5 Image Programs

There are many photo editing software that we can use in order to enhance images or create

a vector graphics. For raster images, we can use the Adobe Photoshop, Adobe Lightroom

or even the MS Paint. And for such vector graphics, we can use the Adobe Illustrator or the

Corel Draw.

3.6 Summary

 Image is a “beautiful” multimedia element.

 Raster images are composed of pixels.

 Vector graphics are compromised by objects.

 A raster image can never be saved as a vector file format.

27
ACTIVITY: RASTER VS. VECTOR

ITEC 70: MULTIMEDIA SYSTEM

2nd Semester A.Y. 2020-2021

Name: _____________________________ Date: ______________________________

Course, Year & Sec.: _________________ Score: _____________________________

Objective/s:
At the end of the activity, the student should be able to:
 differentiate raster images and vector graphics

Essay: Differentiate raster images and vector graphics using your own words. Essay should be at
least 50 words. Also, state examples of each image types.

28
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 04: THE NEED FOR IMAGES

After the completion of the unit, students will be able to:

1. understand the importance of image in multimedia applications; and
2. demonstrate different image techniques appropriately.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. This camera are more expensive, heavier, and bigger but give better resolution, quality, and

focus.

a. Digital Camera c. DSLR

b. Web Camera d. Mobile Phone Camera

2. It refers to the removal of some parts of an image that may be unnecessary or clutter.

a. Straightening c. Cropping

b. Selective Color Change d. Photo Manipulation

3. It is adding creative elements to an image like interesting backgrounds, shape, text, and

other images that overlap each other.

a. Straightening c. Cropping

b. Selective Color Change d. Photo Manipulation

4. This technique shows that we can change the color on selected portions of an image.

a. Straightening c. Cropping

b. Selective Color Change d. Photo Manipulation

5. It is about rotating a picture a few degrees to straighten.

a. Straightening c. Cropping

b. Selective Color Change d. Photo Manipulation

29
IMAGES

4.1 The Need for Images

Multimedia applications should be developed in a more attractive way. Multimedia

applications “come to life” if it has good, useful images.

It is not exciting to just READ. It would be more exciting to SEE pictures that will describe

the subject matter. The image below shows how image can affect the excitement of the

people who will see it.

Figure 4.1. Text vs Text and Image

4.2 Using Image Appropriately

The trick to good multimedia application designs is to match the image with the intended

message or theme. We do not want to use images that are “extra” to the screen. These

types of images are just useless decoration.

In multimedia, knowing how to capture, select and use the right images are essential.

4.3 Where do we Get Images?

There are ways to get images; you can capture it your own or get it from online image

galleries.

Capturing Images (Digital Camera & DSLR)

The only way to capture digital images is with a digital camera.

30
Point and Shoot. These camera are compact, small and portable, and suitable for casual

and “snapshot” use. Images taken by this camera are stored in JPEG format. Some features

of it are as follows:

 Resolution of 3 – 15 megapixels or more

 Built-in flash

 Memory card slot for external storage

 Live preview on an LCD screen to frame the photo

 Autofocus, macro, and zoom capability

 Self Timer

Digital Camera vs. Film Cameras. Film cameras are also useful, but images would still have

to be processed and scanned to become a digital form. Digital cameras are more

advantageous over film cameras. It displays images on a screen immediately and can store

thousands of images on a single small memory device. It can also preview what has been

stored, Delete images to free storage space and can perform basic image manipulation and

editing.

DSLR vs. Point and Shoot. Digital Single-Lens Reflex camera are more expensive, heavier,

and bigger but give better resolution, quality, and focus. SLRs have a faster shutter speed.

It does not have much of a delay when clicking several snaps consecutively. SLRs allow

you to change lenses according to what you need to shoot Landscape photos – wide-angle

lens, Pugs and flowers – macro lens, and Animals – telephoto lens. SLRs take high quality

photos even in low lighting (without the flash). Taking pictures is within your control if you

use an SLR.

Other Camera Devices

Digital cameras are also incorporated into many other devices today. We can use

webcam, video cameras and mobile phones to capture images.

Transferring Images

Images from a digital camera need to be transferred to the computer so that you can

print them, share them with others, and back them up for safe keeping. There are

31
 two ways to transfer images: via USB Cable or via Memory Card and Memory Card

Reader.

Online Image Galleries

Online galleries or database provide royalty-free stock photos. Examples are iStockPhoto,

Flickr, and Shutterstock. Royalty-free means that you will pay a one-time to use the image

multiple times for multiple purposes (with limits). No one can have exclusive rights of a

Royalty-free image. The photographer can sell the image as many times as he/she wants.

4.4 Image Editing

Through image editing, photos can be enhanced and manipulated. Below are different

image editing techniques that can be done depending on how you would like your image

would look like.

Straightening

Straightening is about rotating a picture a few degrees to straighten. This will make the

picture more accurate representation of the object.

Figure 4.2. Straightening

Cropping

Cropping refers to the removal of some parts of an image that may be unnecessary or

clutter. It is usually done to improve framing, accentuate the subject matter and change the

aspect ratio.

32
 Figure 4.3. Cropping

Adjusting Brightness and Contrast

Brightness means how much bright or dark an image is while contrast means how sharp or

dull an image is.

Figure 4.4. Adjusting Brightness and Contrast

Removing Red-Eye

Red-eye occurs when the flash is too close to the person. This effect happens mostly in

people who have no “eyeshine” - usually those people with blue, green or gray eyes.

Figure 4.5. Removing Red-Eye

Adjusting Color Modes

Color modes are models that define the colors of the picture. It can be Colored, Grayscale

or Sepia.

33
 Colored Grayscale Sepia

Figure 4.6. Color Modes

Adjusting Saturation

Saturation is defined as the amount of gray in a particular color. A colored image with more

gray is considered less saturated, while a bright colored image, with little gray in it, is

considered highly saturated.

Ideal Saturation Low Saturation High Saturation

Figure 4.7. Adjusting Saturation

Adjusting Temperature

The temperature of an image is often a reflection of the lighting. Warm temperature creates

an image that is more yellowish or orange while a cool temperature creates an image that

is more greenish or bluish.

Original Cool temperature Warm Temperature

Figure 4.8. Adjusting Temperature

34
Adjusting Exposure

Low lighting leads to under-exposed picture or very dark pictures. Extreme bright lights can

lead to over-exposed pictures.

Original Under-Exposed Over-Exposed

Figure 4.9. Adjusting Exposure

Selective Color Change

This technique shows us that we can change the color on selected portions of an image.

Figure 4.10. Selective Color Change

Blur and Sharpen

Blur and Sharpen effects are also used to accentuate the subject matter among a crowded

or cluttered background.

Figure 4.11. Blur and Sharpen

35
 Photo Manipulation

Adding creative elements to an image like interesting backgrounds, shape, text, and other

images that overlap each other.

Original Manipulated

Figure 5.12. Photo Manipulation

4.5 Tips in Editing Images

 Duplicate the original images first before applying any changes.

 Take your time in editing.

 Learn editing techniques from experts.

36
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 05: IMAGE EDITING SOFTWARE

After the completion of the unit, students will be able to:

1. familiarize Adobe Photoshop and Adobe Lightroom Interface; and
2. use Adobe Photoshop and Adobe Lightroom tools appropriately.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. A raster graphic editor developed and published by Adobe.

a. Adobe Photoshop c. Adobe Illustrator

b. Adobe Lightroom d. None of these

2. It combines photo management and editing in one interface.

a. Adobe Photoshop c. Adobe Illustrator

b. Adobe Lightroom d. None of these

3. A version of Adobe Photoshop that was launched in the fall of 2003. It had great

improvements in the user’s control which made it very popular.

a. Creative Suite c. Creative Photo

b. Creative Cloud d. None of these

4. A tool use to make rectangular, elliptical, single row, and single column selections.

a. Marquee c. Magic Wand

b. Lasso d. Quick Selection

5. Makes a selection based on color and texture similarity when you click or click-drag the area

you want to select.

a. Marquee c. Magic Wand

b. Lasso d. Quick Selection

37
6. A tool that selects similarly colored areas.

a. Marquee c. Magic Wand

b. Lasso d. Quick Selection

7. It shows the name of the current catalog, along with the standard window buttons.

a. Title Bar c. Tool Bar

b. Panels d. Menu Bar

8. This is where we find various options and commands. For example the File menu, holds

options for opening, saving and closing documents.

a. Title Bar c. Tool Bar

b. Panels d. Menu Bar

9. It holds all of available tools.

a. Title Bar c. Tool Bar

b. Panels d. Menu Bar

10. It can be found on the right side of the Photoshop’s interface. It holds the most important

panel which is the Layers panel.

a. Title Bar c. Tool Bar

b. Panels d. Menu Bar

38
IMAGE EDITING SOFTWARES

5.1 Introduction

Images can be better and can be enhanced using different image editing software or

applications available in your laptops, desktop, or in mobile phones. One of the best known

image editing software is the Adobe Photoshop.

5.2 Adobe Photoshop

Adobe Photoshop is a raster graphic editor developed and published by Adobe Inc. available

for Windows and macOS. It was originally created in 1988 by Thomas and John Knoll.

Figure 5.1. Adobe Photoshop Logo

5.2.1 Photoshop Versions

Creative Suite

Photoshop CS was launched in the fall of 2003. It had great improvements in the user’s

control which made it very popular.

Photoshop CS, CS2, CS3, CS4, CS5, CS6

Creative Cloud

Starting in June 2013, the Adobe Creative Cloud was launched online. The program stopped

being Photoshop CS (Creative Suite) and became Photoshop CC (Creative Cloud).

Photoshop CC

39
5.2.2 Adobe Photoshop Interface

Figure 5.2. Adobe Photoshop Interface (CS6)

The Document Window

The Document window is the large area in the center of the interface where the image is

displayed. It's also where we edit the image. The actual area where the image is visible is

known as the canvas.

Menu Bar

The Menu Bar is where we find various options and commands. For example the File menu,

holds options for opening, saving and closing documents. The Layer menu lists options for

working with layers. Photoshop's many filters are found under the Filter menu, and so on.

Toolbar

Toolbar is also known as toolbox or tools panel. Toolbar holds all of Adobe Photoshop tools.

There are different tools that can be used for editing and retouching images, for adding text

and more.

The Panels

Panels can be found on the right side of the Photoshop’s interface. It holds the most

important panel which is the Layers panel. Layers panel is where we add, delete, or re-

arrange layers in the document.

40
The Zoom Level and Status Bar

At the bottom left of the interface, the current zoom level is displayed together with the Status

Bar. The status Bar displays the color profile of the image.

5.2.3 Tools and Function

Selection Tools
The marquee tools make rectangular, elliptical, single row, and single
column selections.

The Move tool moves selections, layers, and guides.

The lasso tools make freehand, polygonal (straight-edged), and

magnetic (snap-to) selections.

41
 The Quick Selection Tool Makes a selection based on color and texture
similarity when you click or click-drag the area you want to select.

The Magic Wand tool selects similarly colored areas.

Crop and Slice Tools

The Crop tool trims images.

The Slice tool creates slices.

The Slice Select tool selects slices.

Retouching Tools
The Spot Healing Brush tool removes blemishes and objects.

The Healing Brush tool paints with a sample or pattern to repair

imperfections in a image.

The Patch tool repairs imperfections in a selected area of an image

using a sample or pattern.

The Red Eye tool removes the red reflection caused by a flash.

The Clone Stamp tool paints with a sample of an image.

The Pattern Stamp tool paints with part of an image as a pattern.

42
 The Eraser tool erases pixels and restores parts of an image to a
previously saved state

The Background Eraser tool erases areas to transparency by dragging.

The Magic Eraser tool erases solid-colored areas to transparency with

a single click.

The Blur tool blurs hard edges in an image.

The Sharpen tool sharpens soft edges in an image.

The Smudge tool smudges data in an image.

The Dodge tool lightens areas in an image.

The Burn tool darkens areas in an image.

The Sponge tool changes the color saturation of an area.

Painting Tools
The Brush tool paints brush strokes.

The Pencil tool paints hard-edged strokes.

The Color Replacement tool replaces a selected color with a new color

43
 The Mixer Brush tool Simulates realistic painting techniques such as
blending canvas colors and varying paint wetness.

The History Brush tool paints a copy of the selected state or snapshot
into the current image window.

The Art History Brush tool paints with stylized strokes that simulate the
look of different paint styles, using a selected state or snapshot.

The gradient tools create straight-line, radial, angle, reflected, and

diamond blends between colors.

The Paint Bucket tool fills similarly colored areas with the foreground
color.

Drawing and Type Tools

The path selection tools make shape or segment selections showing
anchor points, direction lines, and direction points.

The type tools create type on an image.

The type mask tools create a selection in the shape of type.

The pen tools let you draw smooth-edged paths.

The shape tools and Line tool draw shapes and lines in a normal layer
or a shape layer.

The Custom Shape tool makes customized shapes selected from a

custom shape list.

44
 Navigation, Notes and Measuring Tools

The Hand tool moves an image within its window.

The Rotate View tool non-destructively rotates the canvas.

The Zoom tool magnifies and reduces the view of an image

The Note tool makes notes that can be attached to an image.

The Eyedropper tool samples colors in an image.

The Color Sampler tool displays color values for up to four areas.

The Ruler tool measures distances, locations, and angles.

The Count tool counts objects in an image.

5.3 Adobe Lightroom

It is a photo editing and management computer program developed by Adobe Systems,

designed to assist users in managing large quantities of digital images and doing post

production work.

Lightroom combines photo management and editing in one interface. Lightroom and

Photoshop share many of the same photo editing capabilities but with very different

strengths.

45
Lightroom's closest competitor is Apple's Aperture program which similarly provides photo

management and non-destructive editing capabilities.

Figure 5.3. Adobe Lightroom Logo

5.3.1 Adobe Lightroom Interface

Figure 5.4. Adobe Lightroom Interface

Title Bar

The Title Bar shows the name of the current catalog, along with the standard window

buttons. If it goes missing, along with the minimize/maximize/close buttons, press Shift-F

once or twice to cancel the Full Screen modes.

Identity Plate

The Identity Plate allows you to add your own branding to your catalogs. You’ll find the

settings under the Edit menu (Windows) / Lightroom menu (Mac) > Identity Plate Setup.

46
Panels

Panels can be opened and closed by clicking on the panel header. If you right-click on the

panel header, you can show/hide specific panels.

In that right-click menu you’ll also find Solo Mode, which automatically closes a panel when

you open another panel in the same panel group. It’s particularly useful when working on a

small screen.

Show/Hide Panel Groups

The left and right hand sides are called panel groups.

If you click on the black bars along the outer edges of the screen, you can show/hide the

left/right panel groups, as well as the Module Picker and the Filmstrip. Right-clicking on the

black bars gives additional options

Breadcrumb Bar

The breadcrumb bar has controls for the secondary window, as well as information about

the selected source folder or collection, the number of photos in the current view and the

number of selected photos. If you click on it, there’s a list of recent sources for easy access.

Module Picker

The Module Picker gives you access to the Library, Develop, Map, Book, Slideshow, Print

and Web modules. The selected module is highlighted, and you can click on another module

name to switch modules. If you right-click on a module name, you can hide modules from

view.

Filter Bar

When viewing Grid view, the Filter Bar will appear above the thumbnails. It allows you to

filter the current view to only show photos meeting your chosen criteria. If it goes missing,

press the \ key on your keyboard.

You can also access frequently used filters by clicking the word Filter on the Filmstrip.

Preview Area

The central area of the screen is the Preview Area or main work area.

47
Toolbar

The Toolbar gives easy access to often used tools. Press T on your keyboard if it goes

missing, and click on the arrow at the right hand end to choose which tools show in the

Toolbar.

Filmstrip

The Filmstrip is available in all modules and shows the set of photos you’re currently

viewing. When you select a different photo in the Filmstrip, the main Preview Area will be

updated too.

5.3.2 Sidebar Shortcuts

G = Grid View
E = Loupe View
C = Compare View
N = Survey View
Tab = Show/Hide Side Panels
Shift+Tab = Show/Hide AllPanels
Shift+F = Full Screen Mode
T = Show/Hide Toolbar
\ = Show/Hide Filter Bar

48
ACTIVITY: PHOTO MANIPULATION

ITEC 70: MULTIMEDIA SYSTEM

2nd Semester A.Y. 2020-2021

Name: _____________________________ Date: ______________________________

Course, Year & Sec.: _________________ Score: _____________________________

Objective/s:
At the end of the activity, the student should be able to:
 familiarize with image editing tools; and
 use different image editing techniques appropriately.

Instruction:
6. Choose any image from your gallery. Do not use image downloaded from the internet.
7. Using different tools and editing techniques, edit your chosen image. (Note: Any digital photo
editing software or application available on mobile phone, laptop or desktop is allowed.)
8. Paste your original and edited photo in the box below.
9. Indicate the software or application you have used.
10. Discuss the tools you have used and how it was used on the image.

ORIGINAL EDITED/MANIPULATED

Software/Application: ________________________________________________________
Tools:
_____________________________________________________________________________
_____________________________________________________________________________
_____________________________________________________________________________
_____________________________________________________________________________
_____________________________________________________________________________
_____________________________________________________________________________

49
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 06: HOW LOUD IS LOUD?

After the completion of the unit, students will be able to:

1. discuss how sound was produced;
2. differentiate mono and stereo channel;
3. understand how Home Cinema works;
4. identify the loudness of sound;
5. differentiate types of audio;
6. enumerate audio equipment and function;
7. understand audio file format; and
8. demonstrate right usage of audio.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. It uses two or more channels.

a. Mono c. Stereo

b. Micro d. Decibels

2. A term used to describe sound that comes from 1 channel.

a. Mono c. Stereo

b. Micro d. Decibels

3. The loudness or softness of sound.

a. Amplitude c. Decibels

b. Volume d. A or B

4. The measurement use to the loudness or softness of sound.

c. Amplitude c. Decibels

d. Volume d. A or B

50
5. Normal Decibel Range.

a. 20-30 dB c. 30-40 dB

b. 20-40 dB d. 40-60 dB

6. This type of audio affects emotions and moods of the listeners.

a. Background Music c. Voice Over

b. Sound Effects d. Speakers

7. It can also be referred to as narration.

a. Background Music c. Voice Over

b. Sound Effects d. Speakers

8. This type of audio gives an interpretation to a visual image on screen.

a. Background Music c. Voice Over

b. Sound Effects d. Speakers

9. It is a popular audio format, with excellent sound quality and small size..

a. WAV c. MP3

b. FLAC d. OGG

10. A Microsoft audio format, with lossless sound quality and large file size.

a. WAV c. MP3

b. FLAC d. OGG

51
THE POWER OF AUDIO

6.1 Introduction

Audio is the most sensuous element of multimedia. It can provide meaningful “speech”, the

listening pleasure of music, the startling accent of special effects, and the ambience of

mood-setting background.

Most of the audio used in a multimedia project are digitally recorded. Those Digital audio is

reproduced through a channel which is a speaker.

6.2 Mono and Stereo Channels

Sounds can be reproduced in two different classifications; mono and stereo.

Mono

Mono is a term used to describe sound that comes from 1 channel (unidirectional). All

elements of the sound recording are directed using one amplifier and speaker combination.

To the ear, all the elements of the sound, voice, instruments, and effects appear to originate

from the same point in space.

Stereo

Stereo uses two or more channels. The recorded sounds are mixed in such a way that some

elements are channeled to the left and some are channeled to the right. Listening to stereo

sound allows you to distinguish which sound is coming from which direction. Stereo sound

is more life-like and realistic experience because human being have 2 ears, it is natural that

we listen to sounds from two directions. The most prominent use of stereo sound is in music

where multiple sources of sound are present. When you are listening to a band play and

you have a sharp ear, you can distinguish the sound made by each instrument.

Mono vs Stereo

 Most radio channels that broadcast music (like FM stations) use Stereo. Those that

broadcast news only (like AM stations) use Mono.

52
  The equipment needed to record stereo sound is also a little bit more complicated

and expensive compared to equipment for mono.

 Recording mono sound requires only a single microphone. With stereo, you would

need multiple microphones.

 Most hand-held sound recorders can only record sound in mono.

6.3 The Concept of the “Home Cinema”

Home cinema stereo systems can have even more channels.

The term “home theater” refers to the ability to recreate the sound of a movie theater at

home.

Surround Sound

For any given of audio channels, there is an optimal physical setup for the speakers that

produces the best effect possible.

Standard Desktop

The standard desktop computer sound system has two channels. Speakers are used to

output sound. And to input sound into the computer, you will need a microphone.

6.4 How loud is loud?

The loudness or softness of sound is called amplitude or volume. This is measured in

decibels (dB).

Normal decibel range would be 20–40 dB

Decibel Scale

DECIBEL TYPICAL SOUND

0 Threshold of hearing

10 Rustle of leaves in gentle breeze

53
 10 Quiet whisper

20 Average whisper

20-50 Quiet Conversation

40-45 Hotel; Theatre (between performances)

50-65 Loud conversation

65-70 Traffic on busy street
65-90 Train
75-80 Factory (light/medium work)
90 Heavy traffic
90-100 Thunder
110-140 Jet aircraft at takeoff
130 Threshold of pain
140-190 Space Rocket at takeoff

6.5 Types of Audio

Audio has three types according to its uses. Those are as follows:

Background Music

Background music enhances the project. This type of audio affects emotions and moods of

the listeners. It also acts as a transition element between screens in multimedia projects.

Background music should be use in order to:

 Get attention immediately;

 Set the mood at the start of the application;

 Play when there is NO voice-over or narration playing; and

 “Fill-in” idle time or as transition towards another screen.

Voice Over

Voice Over can also be referred to as narration. This type of audio can be used to deliver

concrete information, a text replacement, or to simply give instructions. This type of audio

can be used to give instructions or explain a part of multimedia application or to established

good attention because people like to listen rather than read.

In order to use voice over appropriately, you should considered the following;

54
  Use appropriate level/age of voice;

 Use Same voice throughout the application; and

 Observed good grammar, pitch, intonation and pronunciation.

Sound Effects

This type of audio gives an interpretation to a visual image on screen. In multimedia project,

this sound effects serve as an indicator for mouse triggers or for feedbacks. Sound effects

should be:

 Use sparingly;

 Use to emphasize words or scenario only;

Having too much of this type of audio can be sometimes annoying.

6.6 Audio Formats

Different audio files are available depends on what you prefer and where to use those audio.

MP3 (MPEG-1 Audio Layer 3) is a popular audio format, with excellent sound quality and

small size.

WAV (Waveform Audio Format) is a Microsoft audio format, with lossless sound quality and

large file size.

MIDI (Musical Instrument Digital Interface)

FLAC (Free Lossless Audio Codec) a lossless format, with half size of WAV.

OGG (Ogg Vorbis) a Multi-channel supported audio format, with fine sound quality.

WMA (Windows Media Audio) a popular audio format, with low bit rate and fine sound

quality.

AIFF (Audio Interchange File) An Apple Macintosh native audio format.

APE (Monkey Audio)

55
6.7 Audio Equipment

In order to input, output and produced an audio, different equipment where used.

Use to To output
record sounds
sounds

SPEAKERS
MICROPHONE

Use to Use to
amplify listen to
weak audios
signals

AMPLIFIER HEADPHONES

Use to Use to edit

combine, or enhance
mix, and audios
balance
audios

SOUND MIXERS AUDIO EDITOR

6.8 File Size and User Control

Audio files should be compressed before using it in a multimedia application because

importing audio to your multimedia project or application makes the project/application file

size larger.

Most of the time, audio is completely embedded in order to lessen the file size of a

multimedia application. For the same reason, some multimedia developers choose to link

audio files externally.

Smaller audio files (still with maintained good quality) are better.

User Control

In any application, users were provided with controls for audio such as:

Volume that controls the loudness of the audio.

Play / Stop used to play or stop the audio.

Rewind / Forward used to playback audio.

56
 Repeat was used to repeat the playing audio.

Pause was used to temporary stop the audio.

6.9 Tips in Using Audio

 Determine the audio file formats compatible with the software you will use to develop

your multimedia projects.

 Carefully decide which type of audio is needed to support the message you want to

convey.

 Edit sounds to fit your project.

 Test the sounds to ensure they are timed properly.

57
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 07: AUDIO EDITING

After the completion of the unit, students will be able to:

1. familiarized with audio editing techniques; and
2. demonstrate right usage of audio editing techniques.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. This technique is used when you need to remove dead air (“silence”) at the beginning or

end of your file.

a. Multiple Tracks c. Time Stretching

b. Trimming d. Assembling

2. This technique suggest that two or more audio files can be combined.

a. Multiple Tracks c. Time Stretching

b. Trimming d. Assembling

3. In this technique, you can overlap multiple tracks of audio and export it later as a single

audio file.

a. Multiple Tracks c. Time Stretching

b. Trimming d. Assembling

4. It means to alter the length of the audio.

a. Multiple Tracks c. Time Stretching

b. Trimming d. Assembling

5. This gives an “alien-like” effect.

a. Fade-in c. Reversing

b. Fade-out d. Assembling

58
EDITING TECHNIQUES

7.1 Introduction

Audio can be enhanced through the use of different editing techniques. Enhancing audio

will make it more smooth, relax or even more enjoyable to the listeners. In order to enhance

an audio, you will need to install an audio editing software or application on your desktop,

laptop or mobile phones. Some of the applications you can used are Adobe Audition,

Mixpad, WavePad and etc.

7.2 Audio Editing Techniques

Here are some audio editing techniques that can be useful in enhancing your audio.

Multiple Tracks

In this technique, you can overlap multiple tracks of audio and export it later as a single

audio file.

Figure 7.1. Multiple Tracks

Trimming

This technique is used when you need to remove dead air (“silence”) at the beginning or

end of your file. This means removing “extra time” before the audio starts to play or extra

time after the audio has played. Removing even a few seconds can make a big change in

your file size.

59
 Figure 7.2. Trimming

Assembling

This technique suggest that two or more audio files can be combined. Cut and paste clips

of audio files to make a medley.

Figure 7.3. Assembling

Volume Adjustments

Some audio files are really soft when played in a multimedia application. An audio editing

program can amplify the sound.

Figure 7.3. Volume Adjustments

60
In other cases, if you are putting together many recorded audio clips in a multimedia project,

there is a chance that the audio files have varying volume. In order to provide consistent

volume level. Use a sound editor to normalize the audio files.

Format Conversion

Audio conversion software converts audio file formats from one form into another. There are

two reasons in converting audio file formats: Reduce file size and Compatibility issues.

Almost any uncompressed audio can be converted to a compressed format using an audio

editor or audio converter.

Fade-ins

Fade-in was used as an effect to gradually increase the audio volume to its maximum

defined value. It usually placed at the start of an audio file to have a smooth introduction.

Figure 7.4. Fade-In

Fade-outs

This technique was used as an effect to gradually decrease the audio volume towards

complete silence. It usually placed at the ending of an audio file to avoid stopping abruptly.

Figure 7.5. Fade-out

61
 Time Stretching

Time Stretching means to alter the length of the audio. Changing the speed or your audio

normally affect the pitch. Speeding up makes the pitch higher (like a chipmunk). Slowing

down makes the pitch lower (almost like a Darth Vader).

Figure 7.6. Time Stretching

Reversing Sounds

Reversing the words in a song gives an “alien-like” effect. This technique is not used too

often unless it is necessary for a sound effect.

Figure 7.7. Reverse

7.3 Background Noise

Background Noises are noises produced by traffic, pets or voices in the background.

It also refers to the hiss or hum present throughout the recording. Hisses and hums occur

from microphone signals or sometimes from human speech.

When recording an audio, you have to avoid these background noises in order to make

recordings clear especially when doing narrations.

62
ACTIVITY: AUDIO EDITING

ITEC 70: MULTIMEDIA SYSTEM

2nd Semester A.Y. 2020-2021

Name/s: Date: ______________________________

__________________________________
__________________________________
__________________________________
__________________________________
__________________________________
Course, Year & Sec.: _________________ Score: _____________________________

Objective/s:
At the end of the activity, the student should be able to:
 familiarize with audio file formats and audio editing softwares/applications; and
 use different audio editing techniques appropriately.

Instruction:
1. Form a group with a maximum of 5 members.
2. Create an audio drama or a music remix. (Note: Any audio editing software or application
available on mobile phone, laptop or desktop is allowed.)
3. Audio should be 3-4 minutes.
4. Export or saved the edited audio in .mp3 format.
5. Upload your project and exported file in your respective folder in google drive. (Link:
https://drive.google.com/drive/folders/1yqrZzBLkhJXnWQel2Ezd4Up9SrOHrlQN)
6. Provide your folder link in the box below.
7. Indicate the software/application you have used.

ACTIVITY LINK:

Software/Application: ________________________________________________________

63
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 08: VIDEO

After the completion of the unit, students will be able to:

1. define video;
2. familiarize with different video file formats;
3. familiarize with video equipment; and
4. apply tips in taking and producing a video.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. It shows an actual capture of a scenario, events, process, or procedure.

a. Video c. Video Cameras

b. Audio d. Video Editing Software

2. A device use to record video.

a. Video c. Video Cameras

b. Audio d. Video Editing Software

3. A tool use to enhance and edit videos.

a. Video c. Video Cameras

b. Audio d. Video Editing Software

4. Industry-Level Video format, with VHS picture quality and CD-like sound quality.

a. WMV c. MOV

b. MPEG d. MP4

5. Originally designed for Internet streaming applications.

a. WMV c. MOV

b. MPEG d. MP4

64
6. An Apple QuickTime format, widely used for network transmission, and compatible with

multiple platforms.

a. WMV c. MOV

b. MPEG d. MP4

7. Compression standard for network broadcast and video communication, with small size and

high picture quality.

a. WMV c. MOV

b. MPEG d. MP4

8. This allows you to see your video clips, pictures, music, animations and effects together as

a single movie.

a. Title Bar c. Preview Pane

b. Menu Bar d. Timeline

9. It shows how video clips, pictures, sounds, animations and other media elements fit together

in the movie.

c. Title Bar c. Preview Pane

d. Menu Bar d. Timeline

10. It is a free yet professional video editing software developed by Microsoft.

a. Windows Movie Maker c. Adobe Photoshop

b. Power Director d. Audacity

65
THE POWER OF VIDEO

8.1 Meaning

Videos was defined as it shows an actual capture of a scenario, events, process, or

procedure. Videos was also about recording of moving images.

8.2 Video File Formats

Just like images and audio, videos also have different file formats for different usage. Those

are as follows:

AVI (Audio Video Interleave)

Microsoft; Format which allows synchronous audio-with-video playback.

WMV (Windows Media Video)

Microsoft; Originally designed for Internet streaming applications.

MPEG (Moving Pictures Expert Group)

Industry-Level Video format, with VHS picture quality and CD-like sound quality.

MOV

Apple QuickTime format, widely used for network transmission, and compatible with multiple

platforms.

RM

RealVideo format, RealNetworks streaming media format, with low rate and acceptable

picture quality.

MP4

Compression standard for network broadcast and video communication, with small size and

high picture quality.

66
8.3 Video Production Comparison

BEFORE NOW
Still cameras is different from video Digital video cameras can also take still
camera. pictures aside from video.

Indoor videos have an orange tint. Digital video cameras automatically adjust
to available lightning.

Shaky video. Image stabilizing is built-into handheld

cameras to keep video steady.

Big and bulky video cameras. More compact and handy video cameras
which can be as small as your wallet.

Video editing requires special training and You can edit videos with an ordinary
commands a high price. computer and has allowed ordinary users
to produced amazing videos
To share video to a loved one, you have to Videos can be save to a CD or DVD or
send the whole VHS tape. even emailed to a loved one or friend.

Correct Equipment has to be available to Media Player is needed to view sent

watch the video sent. videos.

8.4 Video Equipment

In order to input, output and produced videos, different equipment where used.

VIDEO CAMERAS CAMERA TAPES EXTERNAL HARD DISK

MEMORY CARD CD/DVD WRITER BACK UP BATTERY

TRIPOD CAMERA LIGHTS HEADSET

67
 MICROPHONE VIDEO EDITOR

8.5 Windows Movie Maker

Windows Movie Maker is a free yet professional video editing software developed by

Microsoft. It is known for its simplicity and being user-friendly.

Figure 8.1. Windows Movie Maker Interface

Preview Pane

The Preview Pane in Movie Maker allows you to see your video clips, pictures, music,

animations and effects together as a single movie. Previewing the video allowing you to

make adjustments to the video without having to publish it first. As you watch a movie in the

preview window, the marker advances along the movie's timeline. Observing the marker lets

you see what portion of the movie's timeline to edit to achieve the desired effect.

Storyboard/Timeline

Timeline shows how video clips, pictures, sounds, animations and other media elements fit

together in the movie. The timeline shows audio tracks above the video and pictures on the

68
 timeline, with titles and credits appearing below the videos and pictures. Transitions and

visual effects are noted on the video clip or picture. Change the order of elements on the

timeline to change when they appear in the finished movie.

8.6 Tips in making videos

 Make straight, steady, and smooth videos

 Observe proper lighting

 Make sure to capture sound clearly

 Observe field of view

 Know where to put the Camera

 Label tapes properly or Rename digital files

 Edit your videos

69
ACTIVITY: ONE-MINUTE VIDEO

ITEC 70: MULTIMEDIA SYSTEM

2nd Semester A.Y. 2020-2021

Name/s: Date: ______________________________

__________________________________
__________________________________
__________________________________
__________________________________
__________________________________
Course, Year & Sec.: _________________ Score: _____________________________

Objective/s:
At the end of the activity, the student should be able to:
 familiarize with video file formats and video editing software/applications; and
 use different video editing techniques appropriately.

Instruction:
1. Form a group with a maximum of 5 members.
2. Choose 30 seconds to 1 minute highlight from the previous audio activity.
3. Add some moving images related with the audio activity. (Note: Any video editing software
or application available on mobile phone, laptop or desktop is allowed.)
4. Export or saved the edited audio in .mp4 format.
5. Upload your project and exported file in your respective folder in google drive. (Link:
https://drive.google.com/drive/folders/1yqrZzBLkhJXnWQel2Ezd4Up9SrOHrlQN)
6. Provide your folder link in the box below.
7. Indicate the software/application you have used.

ACTIVITY LINK:

Software/Application: ________________________________________________________

70
 CvSU Vision Republic of the Philippines CvSU Mission
CAVITE STATE UNIVERSITY Cavite State University shall provide
The premier university in Bacoor City Campus excellent, equitable and relevant
historic Cavite recognized for educational opportunities in the arts,
excellence in the development
Soldiers Hills IV, Molino VI, science and technology through quality
of morally upright and globally City of Bacoor, Cavite instruction and relevant research and
competitive individuals.  (046) 476 - 5029 development activities.
www.cvsu.edu.ph It shall produce professional, skilled
and morally upright individuals for global
competitiveness.

Name/s: ____________________________________________
Course, Yr and Sec. ____________________________________________ Total
Subject: ____________________________________________ Score:
Project Name: ____________________________________________

CATERGORY 20-16 POINTS 15-11 POINTS 10-0 POINTS SCORE

TIME The video is between The video is less than 5 The video is less than
30 seconds and 1 seconds short of 30 15 seconds short of 30
minute long as seconds minimum seconds minimum
instructed. requirement or 5 requirement or more
seconds longer than 1 than 15 seconds longer
minute. than 1 minute.
STILL IMAGES The video contains still The video contains still The video contains still
AND VIDEO images and/or video images and/or video images and/or video
CLIPS clips that significantly clips that most of the clips that do not add to
add to the presentation. time add to the the presentation or are
All the still images presentation. Most of unrelated to the topic.
and/or video clips help the still images and/or The still images and/or
to enhance the video clips enhance the video clips do not
understanding of the understanding of the enhance the
ideas presented in the ideas presented in the understanding of the
video video. ideas presented in the
project.
TRANSITIONS The video contains The video contains The video does not
coherent transitions transitions. Some of the contain any transitions.
from one image to the transitions distract from
next that do not distract the presentation or
from the presentation. there are more than 4
The transitions are types of transitions.
limited to 2-4 types of
transitions.
AUDIO The video contains The video contains The video contains no
audio that significantly audio but it does not audio.
adds to the help to enhance the
presentation. The audio understanding of the
also helps to enhance ideas presented in the
the understanding of video
the ideas presented in
the video.
OVERALL The video contains The video contains The video contains no
PRESENTATION effects that enhance the some effects but they visible effects.
overall presentation. may distract from the
presentation.

Comments/Suggestion:
_________________________________
_________________________________

Checked by: JOVELYN D. OCAMPO

Instructor

71
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 09: EXPLORING ANIMATION

After the completion of the unit, students will be able to:

1. discuss how animation started;
2. understand the principles of animation;
3. learn to conceptualized animated movie; and
4. familiarize with digital animation software;

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. A method of photographing successive drawings, models, or even puppets, to create an

illusion of movement in a sequence.

a. Animation c. Audio

b. Video d. Images

2. A disc with a string or peg attached to both sides invented year 1825.

a. Thaumatrope c. Phenakistoscope

b. Zoetrope d. Kinetoscope

3. It is a motion picture camera.

a. Thaumatrope c. Phenakistoscope

b. Zoetrope d. Kinetoscope

4. It was invented by Belgian Physicist Joseph Plateau.

a. Thaumatrope c. Phenakistoscope

b. Zoetrope d. Kinetoscope

5. Also known as “Wheel of Life”.

a. Thaumatrope c. Phenakistoscope

b. Zoetrope d. Kinetoscope

72
6. It cues or prepares the audience for a major action the characters is about to perform.

a. Squash and Stretch c. Ease-in and Ease-out

b. Arcs d. Anticipation

7. A traditional animation technique that animators commonly use to give animated objects

more realism and weight.

a. Squash and Stretch c. Ease-in and Ease-out

b. Arcs d. Anticipation

8. The visual path of an object or action.

a. Squash and Stretch c. Ease-in and Ease-out

b. Arcs d. Anticipation

9. It is any sequence of events with a beginning, middle, and an end.

a. Story c. Storyboard

b. Character d. Voice Recording

10. It is a visual script for your project.

a. Story c. Storyboard

b. Character d. Voice Recording

73
ANIMATION

9.1 Meaning

Animation is a method of photographing successive drawings, models, or even puppets, to

create an illusion of movement in a sequence. Animation is the process of designing,

drawing, making layouts and preparation of photographic sequences which are integrated

in the multimedia and gaming.

9.2 Drawing in Time

35,000 years ago, People have tried capturing a sense of motion in their art like painting

animals on wall.

1600 B.C. Egyptian Pharaoh Rameses II built a temple for the Goddess Isis with 110

columns. Each column had a painted figure of the goddess in a progressively changed

position.

During 1640, Magic Lantern was invented by Athonasius Kircher. It is also known as “Early

Slide Projector”. This attempt to project drawings on the wall.

On year 1824, Peter Mark Roget presents his idea of “Persistence of Vision” wherein it

explains the ability of the eyes to temporarily retain the image of anything just seen.

9.3 Early Animation Devices

Thaumatrope is disc with a string or peg attached to both sides invented year 1825 by John

Ayerton Paris. It is also known as “Turning Marvel” or “Wonder Turner”.

Phenakistoscope was invented by Belgian Physicist Joseph Plateau Simon Stampfer in

Austria year 1832.

Zoetrope was invented year 1867 by William George Horner. It is also known as “Wheel

of Life”.

74
 Mutoscope was invented by Thomas Edison. It was invented as a mechanized form of flip

book.

Kinetoscope is a motion picture camera that was also invented by Thomas Edison. George

Eastman helped him develop the film used in the early motion picture machines

9.4 Pioneers of Animation

Pioneers of Animations contributed a lot on today’s animation.

J. Stuart Blackton

He was the Fore-Father of Animation. Recognized on year 1896 as “Rapid-drawing

Cartoonist” for a series of Edison shorts. He uses Photographed drawings. He was also

known for his The Enchanted Drawing year 1900.

Blackton uses Stop-Motion technique and his animation was drawn on blackboards.

Winsor McCay

Known as “Father of character animation”. He was Well-known for his newspaper comics.

His works includes “Little Nemo in Slumberland” (1905 – 1914) and The Sinking of the

Lusitania” (1918), which is the first propaganda animation that takes 2 years to create and

composed of 25,000 drawings.

John Bray

Bray was the Founder of the first animation studio. He uses grayscale. His work includes

“Colonel Heeza Liar’s” (1913).

Fleisher Brothers

Max Fleischer invented the “rotoscope technique”.

A rotoscope is a device that originally used a movie projector to project a live-action image

onto the back of a frosted glass pane, which allowed an animator to trace over it for more

realistic animation. Betty Boop, Popeye, and Superman are some of their works.

75
 Otto Messmer

Otto Messmer was known for his “Felix the Cat” which was the first animated character

with personality.

Walt Disney

Walter Disney was a producer, director, screenwriter, voice-actor and an animator. One

of his work is the “Steamboat Willie” of year 1928, which was the first cartoon with sound.

9.5 Principles of Animation

Principles of animation was important in order to create a smooth and worthy animation.

Those principles includes the following:

Squash and Stretch

A traditional animation technique that animators commonly use to give animated objects

more realism and weight. When an object moves, its movement indicates the rigidity of the

object.

Anticipation

Anticipation cues or prepares the audience for a major action the characters is about to

perform. Examples of anticipation are starting to run or about to jump.

Arcs

The visual path of an object or action is called an “arc”. This could be the projectile of a

bouncing ball, the path of a moving arm, and even the movements of mouth corners during

a dialogue scene.

Ease In and Out

Ease In and Ease Out was used because object do not move in constant speed and moving

objects end gradually not abruptly. Acceleration for Ease In and Deceleration for Ease Out.

76
9.6 Conceptualizing an Animated Movie

Animation can be used for entertainment. It was used in movies or in games. To

conceptualize an animated movie, there are things you have to consider and steps to follow.

Step 1: Concept

Concept is about creating an original idea about any of these three elements that will make

the animation memorable.

new learning for

MESSAGE the audience

new character that

has never been
seen before

CHARACTER PLOT new setting and

build up events

Step 2: Story Line

A story is any sequence of events with a beginning, middle, and an end. Story is the most

important part of any animation because it make up the flow of the animation sequence.

Stories fall into two main categories: Fact – What actually happened (real events) and

Fiction – Events that are imagined to have happened.

4 Ways of Writing Stories

1. Something that happened to you. (fact)

2. Something that happened to someone you know. (fact)

3. Something imaginary based on a factual situations. (fiction/reality)

4. Something totally imaginary. (fiction/fantasy)

Whatever stories you will be writing, you should consider to include a dramatic twist or an

unexpected turn. Dramatic twist excites more the audience.

Step 3: Characters

In designing a character, we look at two aspects: the form and the face.

77
Our minds remember the form rather than the details so we should also think of a unique

form.

Proportion

A physical characteristic of form of a character. In

animated characters, height is measured in “heads”.

Views

FRONT SIDE BACK

Faces

The face of the character shows:

 Expression

 Personality

 Feelings

78
 Form + Face

Putting the form and face together

leads to an exponential number of

character design combinations.

Step 4: Storyboard

A storyboard is a visual script for your project. It is a Panel-like drawings of key scenes and

events. This will be a visualization of how animation will look and how the animation is

sequenced. And served as a step by step guide to creating the actual animation.

Step 5: Voice Over

After the concepts was made, story was written, characters were designed, and storyboard

was finished, the next step is to have the voice overs for your characters. Voices for an

animation is recorded before the actual animation is created. Voice Acting is the art of

providing voices for animated characters. Performers are called voice actors, voice

actresses, or voice artist. Once voice artist were ready, voice recording will be performed

wherein they will based on a script written by a scriptwriter for the character dialogues.

79
 Step 6: Animation

In the traditional animation process, animators will begin by drawing sequences of animation

on sheets of paper, one picture or “frame” at a time.

A key animator or lead animator will draw the key drawings in a scene, using the character

layouts as a guide. Every second of finished film consists of 24 frames, requiring 12 to 24

drawings, depending upon the speed of movement. The more frames in the animation, the

smoother the output.

Digital Animation

Software Used

 Adobe Animate

 Toon Boom

 Toufee

 Express Animator

 Anime Studio

9.7 Adobe Animate

Adobe Animate (formerly Adobe Flash) is a multimedia authoring and computer animation

program developed by Adobe Systems.

Figure 9.1. Adobe Animate Interface

80
 Figure 9.2. Adobe AnimateTools

The Three Types of Symbols

Graphic Symbols are reusable static images that are used mainly to create animations. Any

drawn vector/plain text/imported bitmap (photo), or combinations of these, can be converted

into a single controllable object: as a graphic symbol. They have only one frame in their

timeline.

Button Symbols are used for timeline navigation. They add interactivity to the movie and

respond to mouse clicks, key press or rollovers/rollout, and other actions. You define the

graphics associated with various button states (Up/Over/Down/Hit), and then assign actions

to the instance of a button. They have 4 frames in their timeline - one each for the up, over

and down states, and one to define the hit area of the button.

Movie Clip Symbols are reusable pieces of flash animation - consisting of one or more

graphic/button symbols - thus they are flash movies within your flash movie. They have their

own non-restricted Timeline that plays independent of the main movie's Timeline. The best

thing about using movie clips is that you can control them from action script - you can change

81
 their dimensions, position, color, alpha, and other properties and can even duplicate and

delete them.

9.8 Animation Uses

 Animation traditionally comes in the form of cartoons or movies. It is primarily

used for entertainment.

 In multimedia projects, these cartoons or movies have to be created separately,

then imported into an interactive application for viewing.

 Animation in multimedia projects are used for introductions, splash pages,

simulations, product demos, and presentations.

 Screen transitions (dissolve, fade out, zooms, etc.) are not considered real

animation. These are merely visual effects.

82
 Republic of the Philippines
CAVITE STATE UNIVERSITY
Bacoor City Campus
SHIV, Molino VI, City of Bacoor

MODULE 10: MULTIMEDIA ESSENTIALS

After the completion of the unit, students will be able to:

1. discuss hardware and software tools needed to develop a multimedia application;
2. demonstrate knowledge and skills in using different editing software application; and
3. differentiate commercial and freeware software.

PRE-TEST:

Instruction: Encircle the letter of your answer.

1. It’s the case that contains electronic components.

a. System Unit c. Motherboard

b. CPU d. Port

2. It allow devices to be plugged into the computer.

a. System Unit c. Motherboard

b. CPU d. Port

3. These are tools to use to navigate through the application easily.

a. Keyboard c. Video Input

b. Pointing Devices d. Reading Devices

4. It is an important input device to capture text.

a. Keyboard c. Video Input

b. Pointing Devices d. Reading Devices

5. These are light-sensing devices that reads graphics.

a. Keyboard c. Video Input

b. Pointing Devices d. Reading Devices

6. Devices that has the capability to record videos.

a. Keyboard c. Video Input

83
 b. Pointing Devices d. Reading Devices

7. Tool that allows multimedia developers to produce vector-based images.

a. Drawing Tool c. Image Editing Tool

b. Painting Tool d. Video Editing Tool

8. Tool that allows multimedia developers to produce bitmap images.

a. Drawing Tool c. Image Editing Tool

b. Painting Tool d. Video Editing Tool

9. Are specialized and powerful tool for enhancing and retouching existing bitmap images.

a. Drawing Tool c. Image Editing Tool

b. Painting Tool d. Video Editing Tool

10. These are used to adjust existing video clips through various features.

a. Drawing Tool c. Image Editing Tool

b. Painting Tool d. Video Editing Tool

84
HARDWARE AND SOFTWARE ESSENTIALS

10.1 Multimedia Computer

The System Unit is the case that contains electronic components.

Components of the System Unit:

Motherboard The main circuit board of the computer and most of the components of the

system unit are placed.

Processor is a small chip that contains integrated circuits that directs and control the entire

operations of the computer. Factors affecting the speed of the processor includes the

System Clock and Processor Technology. For multimedia computer, an Intel Core i5, Intel

Core2Quad, Intel Pentium 4 or AMD Athlon 64 will be good enough.

Primary Memory is an electronic components that stores instructions, data and results. It is

commonly called as RAM (Random Access Memory). Having more RAM, the faster the

computer responds. This memory reside on a small circuit board called the memory module

and is plugged into memory slots available on the motherboard. For a multimedia computer,

having a 2gb or more is recommended.

Adapter Bays are sockets on the motherboard that can hold adapters cards. Adapter cards

are electronic components that provide connections to external devices. Adapter cards

provide ports.

Ports allow devices to be plugged into the computer.

Drive Bays is where you can have your CD/DVD Drives, Hard Drives and other additional

secondary storage device securely attached to the computer.

85
 Power Supply is the component of the computer that converts AC electrical power to DC

power. If the power supply is not adequate to supply the needed power by your peripherals,

some of the peripherals will fail to work.

Multimedia Computer should have faster processor, adequate primary memory or RAM,

adequate amount of expansion cards and presence of ports that we would need to connect

to our multimedia components and devices.

10.2 Hardware

Hardware Issues listed below must be addressed.

 Not to optimize applications for high performance processors.

 Multimedia applications must run adequately on low specification CD-ROM drives or

develop program that will copy file requiring fast access on to the end user’s hard

disk drives.

 Test the multimedia application with a low specification monitor and declare a

minimum standard for end users.

Input Devices

Input devices are variety of input devices can be used for the development and delivery of

multimedia.

Common input devices for multimedia:

Keyboard is an important input device to capture text.

Pointing Devices are tools to use to navigate through the application easily.

 Mouse is a standard tool for interacting with a GUI. It is used to provide user input

such as pointing, clicking a button, dragging an object, selecting an item, and pulling-

down a menu.

 Trackball can determined location by having the fingers roll across the top of the ball.

 Touch Screen has a texture coating across the glass surface of the screen that is

sensitive to pressure.

86
  Stylus or digital pen is pressed on the tablet or board to determine the pointed

location.

Image and Picture Input was used to capture and save images. Digital cameras, web

cameras, and mobile phone cameras are examples of this.

Video Input are those devices that has the ability to record videos. It can be an analog video

camera, a digital video camera, a web camera or a mobile phone camera.

Voice and Sound Input includes microphone and sound cards.

Reading Devices includes scanners. Scanners are light-sensing devices that reads

graphics. Some scanners have built-in capabilities to read text through a technology called

OCR (Optical Character Recognition). Scanner has three types: Flatbed, Hand-held, and

Sheet-Feed scanner.

Output Devices

These are hardware components that convey information to users.

The media elements such as information are conveyed through the following:

Display devices are the monitors. There are two major categories of display: The Cathode

Ray Tube (CRT) and the Liquid Crystal Display (LCD). The energy consumption of LCD

monitors is lower than CRT. LCD monitors have lesser footprint and can have much larger

size. The cost of LCD monitors have dropped down tremendously in years.

Audio output devices includes speakers, headphones and headsets.

Printer is also important during multimedia applications development. It is used in printing

of storyboards, screenshots and other outputs. It has two major types: Inkjet Printers and

Laser Printers.

Storage device are non-volatile secondary storage devices. There are two factors to

consider in choosing storage devices: the capacity and speed.

87
 Hard Disk are high-capacity storage enclosed in airtight-sealed case for protection. For

multimedia, one or two hard disks is recommended. External Hard Disks can also be used

for backup and transfer storage since it is portable and can be plugged easily through USB

2.0.

Flash Memory Cards are primarily developed for mobile and small devices.

Optical Disc are used for backup and distribution of multimedia application.

As summary, a multimedia computer is recommended to have the following:

 2 Hard drives

 USB port 2.0 for external hard disk / USB flash drives

 Optical drives that can read/write on CDs and DVDs

 Memory Flash Card readers for portable devices

10.3 Software

There’s a lot of multimedia application software that can be used to create a multimedia

project or a multimedia application. These software helps us to create typography,

enhanced images, mixing audios, producing videos or create an animation.

Text Editing Tool

A word processor is a popular text editing tool. It is used to develop storyboards, content,

and some documentation requirements.

Ex. Microsoft Word, OpenOffice.Org Writer

Drawing and Painting Tool

Drawing tools allow multimedia developers to produce vector-based images.

Paint tools allow multimedia developers to produce bitmap images.

Ex. CorelDraw, FreeHand, Adobe Illustrator

88
 Animation Tool

Animation tools allow multimedia developers to produce animation. Advance animation tools

would include production of 3D animation.

Ex. Adobe Animate

Image Editing Tool

Image Editing tools are specialized and powerful tool for enhancing and retouching existing

bitmap images.

Ex. Adobe Photoshop

Sound Editing Tool

Sound Editing tools are used to adjust existing sounds or create your own sound.

Ex. Audacity, Wavepad

Video Editing Tool

Video Editing tools are used to adjust existing video clips through various features.

Ex. Windows Movie Maker, Cyberlink Power Director

Multimedia Authoring Tool

A multimedia authoring tools allows you to combine text, graphics, audio, video and

animation into an interactive multimedia application.

10.4 Commercial vs. Freeware Software

Commercial software or proprietary software is a computer that is not free. Freeware software

is a computer software that is available for use at no cost. Some of the freeware applications

are equally superior to their commercial counterparts. The major difference is when it comes

to support and presence of sophisticated features.

89
ACTIVITY: NEEDS FOR MULTIMEDIA APPLICATION

ITEC 70: MULTIMEDIA SYSTEM

2nd Semester A.Y. 2020-2021

Name: _____________________________ Date: ______________________________

Course, Year & Sec.: _________________ Score: _____________________________

Objective/s:
At the end of the activity, the student should be able to:
 discuss different hardware and software needed in multimedia.

Essay: Based on the previous discussion, discuss at least 3 hardware and 3 software essential in
multimedia. Essay should be at least 50 words.

90
KEY TO CORRECTION

MODULE 1: Pre-Test MODULE 6: Pre-Test

1. a 6. d 1. c 6. a
2. c 7. a 2. a 7. c
3. b 8. c 3. d 8. b
4. c 9. b 4. c 9. c
5. b 10. b 5. b 10. a

MODULE 2: Pre-Test MODULE 7: Pre-Test

1. a 6. b 1. b
2. b 7. c 2. d
3. d 8. a 3. a
4. c 9. b 4. c
5. a 10. a 5. c

MODULE 3: Pre-Test MODULE 8: Pre-Test

1. a 6. a 1. a 6. c
2. c 7. c 2. c 7. d
3. d 8. b 3. d 8. c
4. a 9. d 4. b 9. d
5. b 10. a 5. a 10. a

MODULE 4: Pre-Test MODULE 9: Pre-Test

1. c 1. a 6. d
2. c 2. a 7. a
3. d 3. d 8. b
4. b 4. c 9. a
5. a 5. b 10. c

MODULE 5: Pre-Test MODULE 10: Pre-Test

1. a 6. c 1. a 6. c
2. b 7. a 2. d 7. a
3. a 8. d 3. b 8. b
4. a 9. c 4. a 9. c
5. d 10. b 5. d 10. d

91