PMF0101 MULTIMEDIA FUNDAMENTALS

TOPIC 1B
MULTIMEDIA ELEMENTS
LECTURE 2: TIME INDEPENDENT | TEXT
 LEARNING OBJECTIVES
• Understand the elements of text
• Explore different types & categories of fonts
& typefaces
• Familiar with character set
 WHAT IS TEXT ?
• Basic multimedia elements – words,
sentences & paragraphs
• The easiest to manipulate
• Usage …
communicate convey information
opinions, ideas & / describe abstract
facts in nearly ideas that have no
every aspect of our visual / aural
lives component
(emotion / feeling)
 Perspectives

the way the text is what lies behind the

presented text

easy to read interactive

link/hypertext

well-designed
(font, color & size)

the meaning &

importance it carries
 Special
Alphabet characters
Numbers
characters Punctuation
Sign/Symbols

THREE CATEGORIES OF TEXT

 FONTS
A collection of characters of a specific font
size, font style of a typeface.

N Cambria 72 point bold

S Calibri 72 point underline

CHARACTERISTICS OF FONT
 TYPEFACES
• Graphic representation / the shape of
characters.
• Contains a series of fonts
• Example Calibri, Arial Narrow and Cambria
Arial Typefaces Family
Arial
Arial Black
Arial Narrow
Arial Rounded MT Bold
Arial Unicode MS
 FONTS STYLE
• include bold, italic, underline, shadow
effects & outlining
• outlining - emphasizing with a text box with
borders & shading

font
 FONT SIZES
• the distance from the top of the capital
letter to the bottom of the descenders in
the letter
• measured in points
• one point = 0.138 inches or 1/72 of an inch
ADDITIONAL CHARACTERISTICS
OF FONT
• an upstroke on a
character, can be found
Ascender in the letters “h”, “b” and
“d”

• a down stroke below a

character, can be found
Descender in the letters “p”, “q” and
“y”
ADDITIONAL CHARACTERISTICS
OF FONT

Leading • spacing above

(pronounced & below a font
“ledding”) (line spacing)

Reading Line One

Leading
Reading Line Two
ADDITIONAL CHARACTERISTICS
OF FONT

• spacing between
characters
Tracking • the extra space
uniformly applied to all
letters
ADDITIONAL CHARACTERISTICS
OF FONT

• the space between pairs of

characters (character
spacing)
Kerning • certain pairs of letters will have
more / less space than other
pairs
FONTS CASES

Upper
Intercap
case

Lowercase
TYPES OF FONTS

Font
Serif types

Sans-
Serif
 Font
Serif types

Serif Text San-

Serif

Use decorative strokes/ flags at the end of a

letter

For printed copy

• Helps to improve readability by leading the

eye along the line of type
• Best suited for body text

For computer display

• More difficult to read in small scale

• Useful as Title / Headlines
 Font
Serif types

Sans Serif Text San-

Serif

It does not have decorative strokes/ flags at

the end of a letter

For printed copy

• Has to be read letter by letter

• Best suited for headlines & bold statements

For computer display

• Display sharper contrast for the text – even

for smaller size
 Font
Serif types

SERIF VS. SANS SERIF FONTS San-

Serif

For computer displays, Sans Serif fonts

considered better because of the sharper
contrast.
Serif

San Serif
 COMPUTER AND TEXT
Software used to draw the shapes of the
character / text thru computer display &
printing

PostScript TrueType Bitmap

 POSTSCRIPT
• Page Description Language
• Uses mathematical construct (Bezier curves)
• Allows the character to be scaled
bigger/smaller; able to be finely printed.
• It is not focused on individual character of a
font but the whole pages of text
• Needs licensing
• Needs special software to display
• Example: Adobe’s PostScript
 TRUETYPE
• Page Description Language
• TrueType is joint effort by Apple & Microsoft.
• Uses mathematical construct - quadratic
curves outline
• No special software needed to display
• No licensing needed
• In 2007, they introduced OpenType which
combine the best features of PostScript and
TrueType
 BITMAP
• It is images of characters
• Each letter you type will actually insert an
image representation of the letter
• The major disadvantage :
• it requires a lot of memory & the quality
decreases when scaled
 BITMAPPED AND
VECTOR FONTS
• Bitmaps require one bitmap for each size
• File size increases as more sizes are added.
• Require a lot of memory.

• Vector fonts can draw any size by scaling

the vector drawing primitives
mathematically
• File size is much smaller than bitmaps.
• TrueType and PostScript are vector font formats.
 BITMAPPED AND
VECTOR FONTS

A bitmapped font A vector font

 FONT APPEARANCE
Rasterization
• Font is drawn on the screen one pixel at a time
• Jaggies are the jagged edges you see
when a bitmapped image is resized
• It caused edges of the font will appear
jagged & make it more difficult to read.

HOW TO RESOLVE??
 FONT APPEARANCE

Anti-aliasing Technique
• Blend the font into the background color.
• This technique minimizes the jagged edges
making for smoother overall appearance.
• It substitutes additional pixels in other colors
to fool the brain into thinking it is seeing
continuous lines
 FONT MAPPING
A process of specifying which font should
be the substitute

WHY???
• Fonts & characters are NOT cross-platform
compatible
• Fonts may not be available on the user’s
machine

OTHER SOLUTION!!
• convert the text into bitmaps
 TEXT CODING & DECODING
• Data are represented as two discrete states :-
• on / 1
• off / 0
• Binary system is a number system that has just
2 unique digits 0 and 1 called bits.
• The combination of 0s and 1s (Byte) that
represent characters
TEXT CODING & DECODING

CODING
ASCII SCHEMES

EBCDIC
TEXT CODING & DECODING
 ASCII CHARACTER SET
It is a 7-bit character coding system

ASCII
• Number / value to 128
• Lower & uppercase letters
• Punctuation marks
• Arabic numbers
• Math symbols
• Control / non-printed characters (carriage
return, line feed, tab & form feed)
Non-printed
Character
 UNICODE
• 16-bit architecture for multilingual text and
characters encoding
• It can accommodate more than 65000
characters including characters from all
known languages & alphabets in the world
UNICODE
 USING TEXT IN MULTIMEDIA
• The text elements used in multimedia are:
• Menus for navigation
• Interactive buttons
• Fields for reading
• HTML documents
• Symbols and icons
 USING TEXT IN MULTIMEDIA
• Basic guidelines :
• Be concise
• Use appropriate fonts
• Make it readable
• Consider type styles and colors
• Use restraint and be consistent
 USING TEXT IN MULTIMEDIA
• Choose fonts that are more readable e.g.
sans serif fonts (versus serif fonts)
• Keep the number of font typefaces in a
presentation to a minimum - too many
fonts can be distracting
• Text should not be too close to a picture
/video
• Consider color, font and sizing when
placing text over graphics
 SOME ONLINE TOOLS
• https://coolsymbol.com/cool-fancy-text-ge
nerator.html
🅟🅜🅕⓿➊⓿➊
🅜🅤🅛🅣🅘🅜🅔🅓🅘🅐 🅕🅤🅝🅓🅐🅜🅔🅝🅣🅐🅛
• http://www.glyphrstudio.com/
• https://fontark.net/farkwp/