Introduction to Multimedia

 Chapter 4
 Text

1 1
What is TEXT?
 Basic media for many multimedia systems.
 Text in the form of words, sentences and paragraphs
is used to communicate thoughts, ideas and facts in
nearly every aspect of our lives.

2
What is TEXT?
 Multimedia products depends on text for many things:
 to explain how the application work.
 to guide the user in navigating through the application.
 deliver the information for which the application was designed.

3
What is TEXT?

 Minimize the texts in multimedia

application
 Texts consists of two structures:
 Linear
 Non-Linear

4
What is TEXT?
 Linear
 A single way to progress through the text, starting at the
beginning and reading to the end.

5
What is TEXT?
 Non-Linear
 Information is represented in a semantic network in which multiple
related sections of the text are connected to each other
 A user may then browse through the sections of the text, jumping from
one text section to another.
Kancil Page

Belt Case Hungry Crocodile

Page Monkey Page Case Page
6
3.1 Why Text is Important in MM?

 Factors affecting legibility of text:

 Size.
 The size of the text
 Background and foreground color
 The color in which the text is written in / on.
 Style
 Also known as typeface and font
 Leading
 refers to the amount of added space between lines of type.
 Originally, when type was set by hand for printing presses, printers placed
slugs—strips of lead of various thicknesses—between lines of type to add
space.

7
3.1 Why Text is Important in MM?

 Factors affecting legibility of text:

 Background and foreground color (BG – Light colored, FG – Dark)
 Size.
 Style
 Leading

8
3.2 Text Technology
 Based on creating letters, numbers and
special characters.
 Text elements can be categories into:
 Alphabet characters : A – Z

 Numbers : 0 – 9

 Special characters : Punctuation [. , ; ‘ …] ,

Sign or Symbols [* & ^ % $ £ ! /\ ~ # @ .…]
 Also known Character Sets

9
3.2 Text Technology

 May also include special icon or

drawing symbols, mathematical
symbols, Greek Letter etc.

10
Font VS Typefaces
 Isthere a difference?
 How do we differentiate one with the other?

11
Font
 A ‘font’ is a collection of characters of a particular size and style
belonging to a particular typeface family.
 Usually vary by type sizes and styles.
 The sizes are measured in points
 This includes the letter set, the number set, and all of the special
character and diacritical marks you get by pressing the shift,
option, or command/control keys.
Arial Fonts

12
Typeface
 A ‘typeface’ is a family of graphic characters that usually includes
many type sizes and styles.
 A typeface contains a series of fonts. For instance, Arial, Arial
Black Arial Narrow and Arial Unicode MS are actually 4 fonts
under the same family.

Arial Typefaces Family

13
Font and Typefaces
 The technology of fonts and typefaces includes the following:
 Font styles - boldface, italic, underline, outline

 Font sizes - point, kerning, leading

 Cases – uppercase, lowercase, intercap

 Serif versus Sans Serif

14
Font Effects
 The technology of font effects in bringing
viewer’s attention to content:
 Case: UPPER and lower cased letter

 Bold, Italic, Underline, superscript or subscript


Embossed or Shadow
 Colours
 bStrikethrough

15
Font Effects Example

The Story The Prison The Characters

The Further Adventures Of Sang Kancil

Kancil purposely let himself go to prison to save his cousin Pelanduk
that has been wrongfully accused of murdering kura-kura using
CO2. Kancil forged the buaya crossings event and stealing the
precious rambutan across the river in order to be sentenced to a life
in prison.

The prison, a high security facility jungle prison located on no mans

land is impossible to break into and a place for high profile
criminals. Now that he is in, it’s up to his cunning skills and
technical know how to find his cousin and help him to escape and
prove his innocence.

1 2 3 4 5

16
Text Characteristic
This example shows the Times New Roman font
Ascender
an upstroke on a character
Capital Height x-Height

FD xhp
Point size Serif p -Height Descender
The down stroke 17below
the baseline of a character
Kerning of Text
Kerning
space between pairs of characters, usually as an overlap for
improvement appearance

Av Unkerned
Av Kerned
18
Leading of Text

Leading
spacing above and below a font or Line
spacing

Reading Line One

Leading
Reading Line Two

19
Types of Fonts

 Two classes of fonts

 Serif
 Sans Serif

20
Serif Text
 Decorative strokes added to the end of a letter's
 Serifs improve readability by leading the eye along the
line of type.
 Serifs are the best suited for body text.
 Serif faces are more difficult to read in small scale
(smaller than 8pt) and in very large sizes.

21
San Serif Text
 Sans serif faces doesn't have decorative strokes.
 A sans serif text has to be read letter by letter.
 Use sans serif faces for small (smaller than 8pt) and
very large sizes.
 Used for footnotes and headlines

22
Serif vs Sans Serif Fonts

 For computer displays, Sans Serif fonts

considered better because of the
sharper contrast.
Serif

San Serif

23
Types of Fonts: Examples
Examples
Examplesof
ofSan
SanSerif
Serif
fonts
fonts

Century
CenturyGothic
Gothic
Times
TimesNew
NewRoman
Roman
Arial
Arial
Bookman
Bookman
Comic
Comic Sans
Sans MS
MS
Rockwell
RockwellLight
Light
Impact
Impact
Courier
Courier New
New
Tahoma
Tahoma
Century
Century

Examples
Examplesof
ofSerif
Seriffonts
fonts

24
Using Text in Multimedia

 The text elements used in multimedia

are:
 Menus for navigation
 Interactive buttons
 Fields for reading
 HTML documents
 Symbols and icons

25
Using Text in Multimedia
Text applying guidelines:
 Be concise
 Use appropriate fonts
 Make it readable
 Consider type styles and colors
 Use restraint and be consistent

26
Font Editing and Design Tools

 Allow you to create your own fonts

 ResEdit for MAC
 Fontographer (from Macromedia) can be
used to create Postscript, TrueType and
bitmapped fonts for MAC, PB, SUN
includes a freehand drawing tool
 3D programs, such as COOL 3D and
HotTEXT, create special effects
 See text for descriptions

27
Font Editing and Design Tools

Text creating software:

1. ResEdit
 Introduced by Apple Text to design text as a
bitmap image.

28
Font Editing and Design Tools

2. Fontographer
 Developed by Macromedia
for Macintosh and Apple
 Use to edit the existing
font
 Freehand drawing tools is
used to design a font.

29
Fontographer

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

31
Hypermedia and Hypertext

 Multimedia - combines text, graphics and

audio
 Interactive multimedia - gives user
control over what and when content is
viewed (non-linear)
 Hypermedia -provides a structure of
linked elements through which user
navigates and interacts

32
Text in Hypermedia

33
Hypermedia Structures

 Hypermedia elements are called nodes

 Nodes are connected using a linked
point is called an anchor

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

35
Hypertext

36
Using Hypertext

 Searching for words

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

37
Hypertext Tools

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

38
How Text Can Be Used Effectively

1. Communicating Data
 Customer names and address
 Pricing information of products

39
How Text Can Be Used Effectively

2. Explaining concepts and ideas

 A company mission statement
 A comparison of medical procedures

40
How Text Can Be Used Effectively
3. Clarifying other media
 Labels on button, icons and screens
 Captions and callouts for graphics

41
Advantages & Disadvantages
Using Text
 Advantages:
 Is relatively inexpensive to produce
 Present abstract ideas effectively

 Clarifies other media

 Provides confidentiality (password)

 Is easily changed or updated

42
Advantages & Disadvantages
Using Text
 Disadvantages:
 Is less memorable than other visual media
 Requires more attention from the user than
other media
 Can be cumbersome – not elegant in
expression

43
Summary
 Multimedia applications and presentations invariably
rely to some extent on the use of text to convey their
message to users.
 Text has many characteristics that the developer can
modify to enhance the user expression.
 size, weight, typeface, style, colour, kerning,
tracking, etc.
 Just like any other media, it requires careful planning
and creativity.

44