INTRODUCTION TO MULTIMEDIA

a. CHAPTER 1: MULTIMEDIA CONCEPTS

Objectives
Upon the completion of this chapter, the students will be able to:

● Define multimedia and list some examples.

● Enumerate the disadvantages and advantages of multimedia.
● List the components of multimedia system.
● Identify the different objects of multimedia.
● Explain virtual reality and its relationship to multimedia.
● List examples of multimedia standards those are relevant to the field.
● Enumerate and explain the stages of multimedia application development
in the correct sequence.
● Categories multimedia software according to the phase they are used in the
life cycle of a multimedia system.

1.0 Introduction to Multimedia

1.1.1 What is Multimedia?

Multimedia is the media that uses multiple forms of information content and
information processing (e.g. text, audio, graphics, animation, video, interactivity) to
inform or entertain the user.

Multimedia also refers to the use of electronic media to store and experience
multimedia content. Multimedia is similar to traditional mixed media in fine art,
but with a broader scope. The term "rich media" is synonymous for interactive
multimedia.

1.1.2 Objectives of Multimedia

The objectives of a multimedia system are as follows:
● to send information
● educate the public
● provide entertainment

1.1.3 Advantages of Multimedia

The use of multimedia offers many advantages:
1. Enhancement of Text Only Messages: Multimedia enhances text only
presentations by adding interesting sounds and compelling visuals.
2. Improves over Traditional Audio-Video Presentations: Audiences are more
attentive to multimedia messages than traditional presentations done with
slides or overhead transparencies.
3. Gains and Holds Attention: People are more interested in multimedia
messages which combine the elements of text, audio, graphics and video.
Communication research has
 shown that the combination of communication modes (audio and visual)
offers greater understanding and retention of information.
4. Good for "computer-phobics": Those who are intimidated by computer
keyboards and complex instructions are more comfortable with pressing
buttons with a mouse or on a screen.
5. Multimedia is Entertaining as Well as Educational.

1.1.4 Disadvantages of Multimedia

Multimedia also poses some limitation as follows:

1. Information overload. Because it is so easy to use, it can contain too much

information at once.
2. It takes time to compile. Even though it is flexible, it takes time to put the
original draft together.
3. It can be expensive. As mentioned in one of my previous posts,
multimedia makes use of a wide range of resources, which can cost you a
large amount of money.
4. Too much makes it unpractical. Large files like video and audio has an
effect of the time it takes for your presentation to load. Adding too much
can mean that you have to use a larger computer to store the files. In case
you want to upload it onto the Internet, there are a few factors to keep in
mind, for example bandwidth and the user’s abilities.

1.1.5 Components of Multimedia

A multimedia system includes the following components:

1. Capture Devices
-- Video Camera, Video Recorder, Audio Microphone, Keyboards, mice,
graphics tablets, 3D input devices, tactile sensors, VR devices.
Digitizing/Sampling Hardware
2. Storage Devices
-- Hard disks, CD-ROMs, Jaz/Zip drives, DVD, etc
3. Communication Networks
-- Ethernet, Token Ring, FDDI, ATM, Intranets, Internets.
4. Computer Systems
-- Multimedia Desktop machines, Workstations, MPEG/VIDEO/DSP Hardware
5. Display Devices
-- CD-quality speakers, HDTV,SVGA, Hi-Res monitors, Colour printers etc.

1.1.6 Objects of Multimedia

Different objects of Multimedia are:
1. Text is the information mix of alphabets, numerals and special characters.
2. Image is a visual representation of something.
3. Graphics are visual images or designs on some surface, such as a wall,
canvas, screen, paper, or stone to inform, illustrate, or entertain.
4. Audio is sound within the acoustic range available to humans. Audio
files are usually compressed for storage or faster transmission.
5. Video is the representation of moving images with the mix of Audio.
 6. Animation is the process of creating the illusion of motion and shape
change by means of the rapid display of a sequence of static images that
minimally differ from each other.

1.1.7 Convergence of Multimedia (Virtual Reality)

At the convergence of technology and creative invention in multimedia is virtual
reality, or VR. Goggles, helmets, special gloves, and bizarre human interfaces
attempt to place you “inside” a lifelike experience. VR is an extension of
multimedia-it uses the basic multimedia elements of imagery, sound, and
animation.

1.1.8 Multimedia Standards

The standards situation for multimedia is quite complex. On one hand it is a fast
moving area, where some standards have been promoted but not accepted. Some
standards are in preliminary phases, and after heavy investment, the might not end
up with full acceptance. On the other hand, because multimedia involves a lot of
fields, standards for the different fields might be relevant.
For example, the following incomplete list of multimedia standards, can give an
idea of how many standards might be interesting for multimedia:

● CCITT/ISO (now ITU – T) standards for multimedia include F.700, G.711, G.721,
G.722, G.725, H.221, H.242, H.261, H.320, HyTime, IIF, JBIG, JPEG, MHEG, MPEG,
ODA, T.80, X.400, G.723, G.726, G.727, G.728, G.764, G.765, H.200, H.241, H.243,
T.120
● Internet standards include IP Multicast, MIME, RTP, ST-2, RFC 741, Xv and mvex
● W3C standards are also very relevant
● Proprietary standards are Bento, GIF, QuickTime, RIFF, DVI, MIDI.

1.1.9 Multimedia Software

Different software’s used at various phases in the life cycle of multimedia system include:

● 2D animations
▪ Macromedia Director
● Macromedia Flash
● DVD production
▪ DVD Studio Pro
▪ MYDVD
● Adobe Illustrator
● Adobe Photoshop
● Macromedia Fireworks
● Microsoft Publisher
● Adobe Captivate
● Camtasia Studio
● Adobe After Effects
● Adobe Premiere
● Web pages
▪ Adobe Contribute
▪ Adobe Golive
 ▪ Macromedia Dreamweaver

1.1.10 Stages of Multimedia Application Development

A Multimedia application is developed in stages as all other software are being
developed. In multimedia application development a few stages have to complete
before other stages being, and some stages may be skipped or combined with
other stages. Following are the four basic stages of multimedia project
development :

1. Planning and Costing : This stage of multimedia application is the first

stage which begins with an idea or need. This idea can be further refined by
outlining its messages and objectives. Before starting to develop the multimedia
project, it is necessary to plan what writing skills, graphic art, music, video and
other multimedia expertise will be required. It is also necessary to estimate the
time needed to prepare all elements of multimedia and prepare a budget
accordingly. After preparing a budget, a prototype or proof of concept can be
developed.

2. Designing and Producing : The next stage is to execute each of the planned
tasks and create a finished product.

3. Testing : Testing a project ensure the product to be free from bugs. Apart
from bug elimination another aspect of testing is to ensure that the multimedia
Multimedia Systems- M.Sc(IT) 8 application meets the objectives of the project. It
is also necessary to test whether the multimedia project works properly on the
intended deliver platforms and they meet the needs of the clients.

4. Delivering : The final stage of the multimedia application development is to

pack the project and deliver the completed project to the end user. This stage has
several steps such as implementation, maintenance, shipping and marketing the
product.

1.2 Graphics and Image Data Representations

1.2.1 What is Resolution?

Resolution is the number of pixels (individual points of color) contained on a
display monitor, expressed in terms of the number of pixels on the horizontal axis
and the number on the vertical axis. The sharpness of the image on a display
depends on the resolution and the size of the monitor. The same pixel resolution
will be sharper on a smaller monitor and gradually lose sharpness on larger
monitors because the same numbers of pixels are being spread out over a larger
number of inches.
1.2.2 Basic Differences of Graphic Formats

1.2.2.1 GIF (Graphics Interchange Format)

Use GIF for simple web graphics with limited colors. GIF files are the smallest of
the four because they are always reduced to 256 colors, making for fast-loading
visuals. That said, GIF is not recommended for files with a large range of colors,
like photographs or other detailed imagery. But if you are working with small
graphics like banners, charts and buttons, GIF is the best format for the job.

1.2.2.2 PNG (Portable Network Graphic)

Choose PNG when you need a small file that maintains its original quality. PNG
files support millions of colors, plus varying degrees of transparency — so they are
perfect for graphic image files, like logos and infographics. However, PNG is not
compatible with all software or applications. If your goal is to find a file format for
widespread use, PNG might complicate the process. But if you need a format that
supports millions of colors for your logos and small images, PNG is for you.

1.2.2.3 JPG (Joint Photographic Experts Group)

JPEG is the go-to format for online photos. It supports a full spectrum of colors,
and almost all devices and programs can open and save to the JPEG format —
making it the most universal of the four. JPEG files are ideal when you want to
keep file size down and don’t mind giving up a little quality to create a very small
file. That said, JPEG quality drops when images are edited and saved. If you plan
to continually edit your files, JPEG is not the format for the job. But if you need
to display photos online, JPEG is just right.

1.2.2.4 TIFF (Tagged Image File Format)

TIFF is best for any bitmap images that you intend to edit. TIFF does not
compress to make for smaller files, because they are meant to preserve quality.
TIFF files offer options to use tags, layers, and transparency, and are compatible
with photo manipulation programs like Photoshop. If you are looking for a small
file or a web-friendly format, TIFF is not recommended. But if you plan to edit
digital images in a working storage format, consider TIFF your go-to.
1.3 Color Theory in Design

1.3.1 What are CMYK and RGB?

RGB is additive, projected light color system. All colors begin with black
"darkness", to which different color "lights" are added to produce visible colors.
RGB "maxes" at white, which is the equivalent of having all "lights" on at full
brightness (red, green, blue).

CMYK (Cyan, Magenta, Yellow and Black) is a subtractive, reflected light color
system. All colors start with white "paper", to which different color "inks" are
added to absorb (subtract) light that is reflected. In theory, CMY are all you need
to create black (applying all 3 colors at 100%). Alas, that usually results in a muddy,
brownish black, so the addition of K (black) is added to the printing process. It
also makes it easier to print black text (since you don't have to register 3 separate
colors).

Most screens (computer, phone, media player, television, ect) are RGB, the pixels
have little subpixels that just show red, green or blue.

Most printers print in CMYK color.

So if you are ever doing something for a screen, use RGB, if you doing something
for print, use CMYK.

1.3.2 Similarity
This design has similarity because the individual elements that make up the design have
the same basic shape characteristics

When objects looks similar to one another, viewers will often see the individual
elements as part of a pattern or group. This effect can be used to create a single
illustration, image or message from a series of separate elements.

Attention is drawn to the different element in this composition because it breaks the
pattern of similarity

The similarity between different elements can be shape, colour, size, texture or
value. The more commonality that individual elements have, the greater the sense
of coherence, thanks to similarity.
This cover for the Beatles' album Hard Day's Night uses the principles of similarity and anomaly

A particular element can be emphasized when it's dissimilar, breaking the pattern
of similarity. This effect is called an anomaly.
1.3.3 Continuation

In this example the eye is led through the first design element towards the star that
aligns with the curve

Continuation is the principle through which the eye is drawn along a path, line or
curve, preferring to see a single continuous figure than separate lines. This can be
used to point towards another element in the composition, and is seen where a
line is cut through one object, often in a curve, aligning perfectly with a secondary
element.
This illustration consists of 4 lines that meet at the central point, but we prefer to see two
intersecting lines rather than 4 lines that converge

1.3.4 Closure
The World Wildlife Fund logo uses the closure principle to describe a panda, even though
the shape is not fully closed

Closure is a common design technique that uses the human eye's tendency to see
closed shapes. Closure works where an object is incomplete or the interior space of
an element is not fully closed, but the viewer perceives a complete shape by filling in
the missing information. This technique is often associated with stenciled artwork,

but is also closely associated with logo forms.

1.3.5 Proximity (aka grouping)

The arrangement of boxes on the left are not close enough to have proximity, while the
group on the right is perceived as a single whole element

Proximity uses the close arrangement of elements to create a group association

between those objects. If individual elements are also similar, they will tend to be
perceived as a single whole, even though they are separate elements.
The shapes don't have to be regular to achieve proximity. Similar shapes arranged
together to describe a bigger image, such as this illustration of a flame

Proximity or grouping can be achieved with lots of different commonality

including shape, colour, texture, size or any other visual attribute.
1.3.6 Figure/ground

Figure and ground often uses the idea of light and shade to help create an image that
jumps out from a series of shapes

This principle describes the eye's tendency to see and separate objects from their
surrounding background. A classic example uses a vase/candlestick illustration to
show two faces peering at each other, but you can also see this effect in a variety
of logo designs. It works because human eyes want to see the figure (foreground
object) and background (ground) as two different planes of focus.
MC Escher's famous woodblock Sky and Water 1 (1938) uses the figure and ground principle

Everything that is not figure is considered ground, which can be used to create
some interesting visual effects and tricks, particularly when the designer or artist
introduces deliberate ambiguity - a favourite technique of the surrealist MC
Escher.

1.3.7 Symmetry and order

Put simply, this principle says that a composition should not provide a sense of
disorder or imbalance, as otherwise the viewer will waste time trying to locate
the missing element, or fix the problem, rather than focusing on the message or
instruction.
The symmetrical figure that makes up the windmill shown below provides a sense of order and
balance

You can achieve symmetry by providing a good balance or sense of symmetry in

your design elements, such as the windmill illustration below. This provides the
viewer with a feeling of harmony.

1.4 Text in Multimedia

Text might be the simplest portion of a multimedia experience, but it is often the
most important. Below are some of the important issues we need to consider
when using a text.

Typography is the process of selecting and arranging typefaces, sizes, and

spacing requirements for a layout, be it for multimedia or the Web. Typography
gives a page a certain personality and an overall feeling.

1.4.1 Size
Text is measured in points. Point size of the type is determined by measuring the
height of the type body. The point size is found by measuring the distance from
the uppermost limit of an upward-reaching letter (ascender), such as b, f, h, k, or
l; to the lowermost limit of a downward- projecting letter (descender), such as g,
j, p, or y.

1 point equal 0.0138 inch and 72 points equals 1 inch. So a 72 point font will be 1 inch in
height.
Text sizes usually used for body content is 9- to 12-points. Display sizes usually
used for headlines, titles, and subheadlines (subheads) is 14 points and larger.

1.4.2 Type Font

Type Font is the collection of all the letters, figures, symbols, punctuation, and
special characters of a particular typeface in a certain point size.
1.4.3 Family
A Family of type consists of all variations of a single typeface and includes the
different weights, width, slants, and styles, such as italic, boldface, lightface,
condensed, expanded versions, thin, ultra light, heavy and compressed.
1.4.4 Typeface
Typeface is an entire family of letters of a particular design. Typefaces have a
profound effect on the design of your work. Each has a personality of its own. A
typeface either has or does not have serifs. Serifs are the ending strokes on the
arms, stems, and tails of some typeface designs. If a typeface has serifs it is termed
a roman typeface. Mostly used for body text because they are more readable than
the 4 other font types. Examples of serif fonts include but are not limited to
Times New Roman, Palatino, Courier, Times, and Garamond.
Sans serif (without serifs) fonts do not contain the ending strokes. They are easier
to read at very large and especially at very small sizes and are good for captions,
very small text (6 points and
smaller), and for titles and subheads (14 point and larger) to contrast body text.
Examples of sans serif fonts include but are not limited to Helvetica, Universe, and
Futura.

1.4.5 Color
The Color of type refers to the overall tone, or texture, of the type; the lightness or
darkness, which varies from one typeface and style to another; and also the
evenness of the type as determined by the spacing.
1.4.6 Leading
Leading is the term used to refer to the vertical spacing between lines of type
(Line Spacing). It is measured in points from the baseline of one line to the
baseline of the next line. The amount of leading can add to or detract from how
well the text looks.

1.4.7 Letter Spacing

Letter spacing refers to the amount of space between individual characters. It can
degrade the word shapes and make them harder to read. Kerning is the process of
subtracting minute increments of space from between certain character pairs in
order to improve their fit and therefore make them more eye-appealing.

1.4.8 Tracking
Tracking is a character-spacing option that permits the user to specify a small
increment of space that is to be uniformly removed from between all characters.
1.4.9 Some Guidelines in Using Text in Multimedia
Below are some suggested guidelines when using text in multimedia:

1.4.9.1 WATCH YOUR TEXT COLOR

The human eye can see approximately 7,000 different colors. Some color and color
combinations are soothing while others can cause headaches and visual fatigue.
Red text represent danger and the color yellow is an eye irritant.

Different cultures interpret colors differently. In the United States, white is a

symbol for purity, whereas in other cultures it is used for death and funerals.

Color blindness affects text color.

1.4.9.2 USE BOLDFACE CAREFULLY

Place key terms in boldface for emphasis.

1.4.9.3 THINK BEFORE YOU UNDERLINE TEXT

The rules are underlining are different for printed text in a magazine and text on a website.

1.4.9.4 DO NOT TYPE IN ALL CAPITAL LETTERS

Typing in all capital letters is analogous to yelling at a person. Use capital letters
for emphasis and title casing only.

1.5.9.5. WATCH YOUR TEXT SIZE

The size of the text matters. If the text size is too small eyestrain can occur, if it is
too large, few words will fit in the screen window which can frustrate the viewer.
1.5.9.6. WATCH THE FONT SELECT
Make sure the font or font family is readable on several systems (Mac and PC).
Fancy fonts like script can be illegible and common fonts like Courier are boring.
Look for fonts that stand out and are easy to read.
Exercises
1. Identify and discuss multimedia standards.
2. Identify and discuss components of multimedia.
3. Develop multimedia titles for industrial, educational and personal application.
4. Examine multimedia applications against multimedia principles, standards, and
techniques.

References
http://buc.edu.in/sde_book/multi_system.pdf

http://www.dtic.upf.edu/~jblat/material/doctorat/multimedia_standards.html

https://maiaangel03.wordpress.com/lesson-1-introduction-to-multimedia/

http://whatis.techtarget.com/definition/resolution

http://www.smartimage.com/whats-the-difference-between-gif-png-jpeg-and-tiff/

http://graphicdesign.stackexchange.com/questions/60/what-is-the-differenc
e-between-cmyk-and-rgb- are-there-other-color-spaces-i-shou

http://www.makeuseof.com/tag/5-basic-principles-graphic-design-take-granted-everyday/

http://www.colormatters.com/color-and-design/basic-color-theory

http://www.tigercolor.com/color-lab/color-theory/color-theory-intro.htm

http://www.creativebloq.com/graphic-design/gestalt-theory-10134960

http://coachmattjames.weebly.com/uploads/1/0/4/6/10463504/1.01_guidelines_f
or_using_text_in_mu ltimedia.pdf.