1
Multimedia Design and Development
Text and Fonts
Text looks like the easiest medium to create and the least expensive to transmit,
but there’s more to text creation than meets the eye!
First, effective use of text requires good writing, striving for conc
iseness and accuracy.
Advertising wordsmiths sell product lines with a logo or tag lines with just a few words
Similarly, multimedia developers are also presenting text in a media
-
rich context, weaving words
with sounds, images, and animations
Design label
s for multimedia title screens, menus and buttons using words with the precise and
powerful meanings
Which feedback is more powerful: “That answer was correct.” or “Terrific!”
o
When is “Terrific” more appropriate or effective?
o
Why is “quit” more powerful th
an “close”? Why does UM uses “out” instead?
Why is the title of a piece especially important?
o
It should clearly communicate the content.
o
It should get the user interested in exploring the content.
Let’s discuss some of your proposed project titles.
Som
e guidelines for writing effective script:
Write for your audience, bearing in mind your audience’s background and interests
o
Can you assume that your audience knows what the traveling saleman problem is?
Yes, if your audience is CS faculty; no, if it’s CS
undergraduates.
o
When should you use a casual, idiomatic style or a formal, business
-
like style?
Again, it depends on your audience.
Recommended reading for writers:
The Elements of Style
, by William Strunk, full of pithy advice
and rules of thumb:
o
Say it i
n active voice:
“Genetic algorithms were invented by John Holland in 1970’s.”
vs.
“John Holland invented genetic algorithms in the 1970's.”
o
Avoid wordiness: “computer algorithm” vs. just “algorithm”
o
Avoid high
-
falutin’ phrases: “appropriate incorporated” v
s. “using”
Write and rewrite, bearing in mind that users won’t read much on a screen.
2
Fonts
Once you’ve chosen your words, you need to decide how to present them, using a typeface and font
See
http://www.eecs.lehigh.edu/~glennb/mm/pics/typefont.jpg
(from Vaughan)
a
typeface
is a family of graphic characters that usually includes many type sizes and styles
e.g., Times, Courier and Helvetica are typefaces, each of which include many size
s & styles
a
font
is a collection of characters of a single size and style, belong to a typeface family
typical font
styles
are boldface, italic, bold italic, and underlined
font
sizes
are expressed in terms of points, where one point is .0138 or 1/72 inch
,
where size is the distance from the top of capital letters to the bottom of descenders
in lower
-
case letters such as
g
and
j
.
Times is a typeface; Times 12
-
point italic is a font
In computerese, however, people say “font” when “typeface” would be more ac
curate.
Leading
(pronounced “
ledding
”) is the space between lines of text
Lopuck recommends increasing the leading to improve readability of text on a screen
Character metrics
are the measurements of individual characters
Vector
-
based fonts permit changes
to character metrics for interesting effects;
bit
-
based fonts do not
Kerning
is the spacing between character pairs
Some fonts have variable kerning (e.g., Times), so have fixed kerning (e.g., Courier)
When is fixed kerning more desirable?
(Computer code)
What about variable kerning?
A
serif
font has little decorations at the end of each letter stroke
Times and Century Schoolbook are examples of serif fonts;
Arial
is a
sans
serif
font
On printed pages, serif fonts are traditionally used for body text
becau
se they help guide the reader’s eye along the line of text
Headlines use
sans serif
text
Computer screens, with 72
-
dpi (dots per inch), don’t provide as much resolution as print,
so it can be argued sans serif fonts are more legible in small sizes
hence, U
M standardized on 12
-
point Arial font (in Windows)
PostScript vs. TrueType
For the Macintosh, Apple chose a resolution of 72 pixels per inch,
corresponding to standard font resolution for print of 72 points per inch
This allows desktop publishers to have
WYSIWYG, approximately
Mac also standardized pixels as square
-
shaped, so that measurements are even on all sides
On the PC side, VGA imitated these standards
(earlier, EGA had an aspect ratio of 1.33:1, taller than wide)
VGA and Mac standardized no 640 x
480 square
-
pixel screens,
now the defacto baseline for multimedia production
So far, the good news...
Apple also spearheaded desktop publishing by adopting Adobe’s PostScript
page description language for printing to Apple’s LaserWriter
Until then, char
acters were stored in a bitmap table representing every character at every size
PostScript
is vector
-
based, describing each character in terms of mathematical constructs
3
(Bezier curves), so that each character can be scaled
This facilitates drawing charact
ers at various sizes and in various resolutions
A problem with PostScript is that it represents fonts for printer and screens separately
Adobe Type Manager accesses a font’s outline in the printer font,
and scales it to display to the right size on a scre
en
Apple apparently didn’t like Adobe’s approach, so they later (circa 1989) introduced
TrueType
you only need one file per font, for either printer or screen, nor do you need ATM utility
TrueType also uses a quadratic curves outline font method,
which Ap
ple and others claim produces a smoother characters
Now Truetype is generally available on all Windows and Macintosh systems
Both PostScript and TrueType fonts allow text to be drawn on any size without
jaggies
or jagged edges on the outlines of a characte
r, such as in a bold italic style
Anti
-
alaising
exploits color by blending (or dithering) the colors along the edges of letter
Authorware 5 now boast support for anti
-
aliasing
See
http:/
/www.eecs.lehigh.edu/~glennb/mm/pics/MacPCfnt.jpg
for comparison
Since PostScript and TrueType are now fairly universal,
it’s fairly safe to use them without worrying about portability,
though not all fonts are identical on each platform
Authorware and Di
rector point out possible problems with mapping fonts
and suggests possible solutions
For example, Arial on Windows apparently maps approximate to Helvitica on Mac
However, these are not exactly equivalent, so porting text is not trivial!
Also, special ch
aracters, such as curling quotation marks, rarely map properly.
One way to solve font mapping problems is to convert text into bitmaps
If you want to use other fonts, you either create them yourself,
or obtain from a font manufacturer (sometimes known as a
type foundry
),
such as Adobe, and Bitstream, Monotype, etc.
These and other interesting fonts are available on the web, e.g.,
www.bitstream.com
Some more heuristics about choosing text fonts:
For small type, avoid decorative fonts; strive for legibility
Use as few different typefaces in a piece, but vary the style and size where it looks good
Also experiment with different colors and different backgrounds
In blocks of text, use ample
leading
, i.e., space between lines of text
Avoid scrolling text; test sh
ow that users will gloss over all your information!
Keep length of each line short. Lopuck recommend keeping line length under 3".
User’s eyes can get lost finding the next line if the lines are too long.
I try to end each line with a punctuation mark if
possible.
Use anti
-
aliased text for a gentle and blended look for titles and headlines
For attention
-
grabbing headlines, try graphically altering the text,
using a font editing tool such as ResEdit or Fontographer,
or use drop shadows or three
-
dimensional
effects
Surround headlines with plenty of white space
Enter the password to open this PDF file:
File name:
-
File size:
-
Title:
-
Author:
-
Subject:
-
Keywords:
-
Creation Date:
-
Modification Date:
-
Creator:
-
PDF Producer:
-
PDF Version:
-
Page Count:
-
Preparing document for printing…
0%
Σχόλια 0
Συνδεθείτε για να κοινοποιήσετε σχόλιο