1. No category

Before&After BAmagazine.com
®
i U X
How to use that typeface
That font you love won’t work just anywhere;
it has a style that needs to be complemented.
Here’s how to work to its strengths.
Continued 
Continued 
How to use that typeface 0677
Before&After BAmagazine.com
®
i U X
How to use that typeface
That font you love won’t work just anywhere; it has a style that needs
to be complemented. Here’s how to work to its strengths.
Ever spot a typeface that you really like and
can’t wait to use? It’s exciting, but go slowly.
Before you buy it, you’ll want to know if the
lines, shapes and little doodads that make it
so appealing here will work as well over there.
How to tell? Reading a typeface is a little
like reading a real face. Tiny differences in
the arch of an eyebrow, the curve of a lip and
the contour of a cheekbone convey real presence, personality and attitude. These need
complementary presence and “attitude” from
the other visual elements, or the result will be
awkward, weak or just funny looking. Here’s
how to do that.
University Roman Spotted on Monterey’s famous Cannery Row,
funky University Roman on this slab of a gift-shop sign is out of its
element. Its offbeat letterforms, opulent curlicues and toothpick
serifs are like a Mardi Gras costume in political science class. Not a
match. This is a typeface that wants to party! Let’s find it one!
2 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
3 of 13
i U X
Make a visual overview
Set the full alphabet and make a visual overview. Write down what you see.
Why write it down? To make sure you’ve actually seen it. Seriously.
A and e have extremely small counters,
or enclosed spaces.
Flamboyant University
Roman was introduced by
Letraset in 1972. It’s quirky
and popular as a display
typeface, especially on
greeting cards. It’s good
for more than that, as
we’ll see.
Other ­letters have REALLY BIG counters.
AaBbCcDdEeFfGgHhIiJj
KkLlMmNnOoPpQqRrSs
TtUuVvWwXxYyZz
1234567890!$%&?
Swashy tails
Characters like N and O that
in ordinary alphabets are
the same width are very different in University Roman
Conversely, characters like M
and T that are normally different are alike here.
Opulent swirls
and curlicues
Thick-to-thin stroke differences are subtle but present on every character.
If the signmaker on the previous page had been writing this stuff down, he
wouldn’t have affixed the V to his signboard backward.
3 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
4 of 13
i U X
Look at the details
University Roman is full of swashy idiosyncracies that give it a handmade,
Christmasy style especially suitable for fanciful and romantic topics.
N O Ee
PRAB Quilt
Serif extensions
rise above cap
height and drop
below baseline.
Asymmetrical
serifs
Exaggerated
sizes
Oddball character widths All straight letters are thin. Really thin.
All round letters are wide. Really wide—so wide that round lowercase
letters are wider than their uppercase counterparts! (Ee, above right)
Radical 50°- angle serifs and terminals! But only in lowercase!
Wacky x-heights Bulbous, rubbery letters have an Alice-in-Wonderland quality; some have HUGE tops, and some have HUGE bottoms
with no apparent rhyme or reason.
A tail long enough
to tickle three characters over.
4 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
5 of 13
i U X
Note strengths and weaknesses
The irregular proportions and embellishments that make University Roman an
entertaining display face make it very hard to read in text. Key is to keep it big.
University Roman, a display face . . .
Texture and flasp net exating end mist of it snooling. Spaff forl isn’t
cubular but quastic, leam restart that can’t prebast. It’s tope, this
fluant chasible. Silk, shast, lape and behast the thin chack. “It has
larch to say fan.” Why? Elesara and order is fay of alm. A card whint
not oogum or bont. Pretty simple, glead and tarm. Texture and flasp
Bembo, a text face . . .
Texture and flasp net exating end mist of it snooling. Spaff forl
isn’t cubular but quastic, leam restart that can’t prebast. It’s tope,
this fluant chasible. Silk, shast, lape and behast the thin chack. “It
has larch to say fan.” Why? Elesara and order is fay of alm. A card
whint not oogum or bont. Pretty simple, glead and tarm. Texture
Its irregularities make University Roman unsuitable
for text, where a rhythmic, medium typeface works best
(above). University Roman can be used for very brief pass­
ages (left), but for anything more than a sentence
or so, use a real text face.
Best of the
Season to you!
Chris & Robin
Big, tight, even University Roman looks best big. Its enormous,
round letters create a lot of internal white space that looks
­better when it’s squeezed out, so set your words tightly and as
evenly spaced as possible (below).
aloe
Even spacing Put more space between
straight letters, less between round.
5 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
6 of 13
i U X
Put it to work
The challenge now is to combine type with graphics in a coherent whole. To learn
how, let’s start at the end—with two cards that illustrate University Roman perfectly
tuned to its environment.
Card 2
Card 1
NOW THROUGH MARCH 28
Two beautiful cards The lines, shapes and colors of type and image
are so tightly integrated that the designs appear completely natural and
unforced. Both type and image are strong but together are greater than
the sum of their parts.
Masquerade
Your presence iS requested
for a festive evening of intrigue,
mystery and fantasy.
6 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
7 of 13
i U X
Look for common shapes
To find an image that goes with your typeface, start with shapes. Round letters go
naturally with round images. Avoid triangles, squares and ambiguous shapes, which
will compete and weaken your design.
Circles (Right) Round shapes are
­ bvious in the round letters, but look
o
at the smaller parts, too—the loops
and swirls and negative spaces that
are also round.
Teardrops (Below) Teardrops in the
image mirror those in the swashy S.
NOW THROUGH MARCH 28
OC Dbae
Complementary typeface (Above) Pair a fancy display face with an ordinary typeface for contrast
plus readability at small sizes. Look for similarities. What’s interesting here is how different Futura is
from University Roman, yet they have roundness in common.
7 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
8 of 13
i U X
Blend type and image using color and “edge”
Now bring the image into the type, which in this case means literally. Wrap the type
around the edge contours, then apply its beautiful gradients to the lettering.
Blend using color
Magenta to yellow (above) and
cyan to green (left) are light,
fresh combinations. Sample
color pairs from the image, add
to the ­color palette as gradient
swatches, then apply to the
type, which will take on a natural radiance that blends beautifully into the image.
NOW THROUGH MARCH 28
NOW THROUGH MARCH 28
Blend using a common edge Wrap the words tightly to the
contours of the image (left). As a rule with display type, you’ll
do this by eye, paying attention to the nooks, crannies and other
details that the software would miss.
8 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
9 of 13
i U X
Lay out the card
Place type and image on the small card, which confines and focuses
the design. A small, duplicate image activates the opposite corner and
completes the layout.
Splashy composition is beautiful in open space (left), but its elements must work on a card, which
confines them. Set as big as possible, bleeding beyond the lower
right corner (below).
Faint image activates a space
A smaller, lighter duplicate image in the
upper left activates the passive white
and balances the design.
NOW THROUGH MARCH 28
NOW THROUGH MARCH 28
NOW THROUGH MARCH 28
9 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
10 of 13
i U X
Party down!
Masquerade
Your presence iS requested
Intrigue, mystery, fantasy. For card 2, our fanciful typeface goes looking
for an ideal party image and finds it in a gold mask.
for a festive evening of intrigue,
mystery and fantasy.
Picking the right image is key To
illustrate a masquerade party, a mask is
a natural choice, but which one? A quick
search brought up a multitude of lavish
creations, all visually interesting.
Flowers, flourishes and detailed textures mimic the extravagant forms of University Roman. Monochromatic gold is direct and intense and will partner well with the
typeface. Multicolor masks (left, top) are so engaging they require the stage to themselves. Real faces are similarly distracting; instead of a powerful design, the viewer will
be wondering who it is. Remember: common lines and shapes.
10 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
11 of 13
i U X
The image then designs the page
With type and image together, now transfer the colors, ornaments and textures
of the mask to the rest of the page. Result—a unified, powerful design.
Ornamental border
Corners of the barely
there border—just
enough to frame the
page—mimic the image.
Masquerade
Your presence iS requested
for a festive evening of intrigue,
Masquerade
Sample two colors Combine light
to dark monochromatic golds sampled
from the mask into a gradient swatch,
then apply to the typeface. As we saw
earlier, the new radiance beautifully
reflects the qualities of the image (right).
mystery and fantasy.
Masquerade
Symmetrical mask is naturally “centered.”
Centered layout then doubles its power.
Your presence iS requested
for a festive evening of intrigue,
mystery and fantasy.
Woodcut Final, matching ornament punctuates
the page with a full stop, completing the design.
11 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
12 of 13
i U X
Article resources
Typefaces
1a
Colors
1 (a–b) University Roman | a) 112/82 pt
b) 46 pt
11 C0 M85 Y0 K5
2 Futura Light | 18/21.5 pt
12 C0 M15 Y90 K0
11
3 Futura Extra Bold | 10 pt
12
4 Adobe Caslon Regular | 10.7/17 pt
5 Adobe Wood Type Std Regular
2
3
13 C30 M45 Y80 K40
14 C10 M10 Y30 K20
6
Images
NOW THROUGH MARCH 28
Images: iStockphoto.com
5
8
7
6 (4836134)
7 (433813)
8 (2626360)
9 (1357805)
10 (3866203)
13
9
14
Masquerade
10
Your presence iS requested
for a festive evening of intrigue,
1b
Related articles
0677 | 0669 | 0660 | 0613 | 0269 | 0363
0649 | 0644
4
mystery and fantasy.
5
Article revised on 08/24/10
12 of 13 How to use that typeface 0677
Before&After ®
How to use that typeface
BAmagazine.com
13 of 13
Subscribe to Before & After
Subscribe to Before & After, and become a
more capable, confident designer for pennies
per article. To learn more, go to
http://www.bamagazine.com/Subscribe
E-mail this article
To pass along a free copy of this article to
others, click here.
Join our e-list
To be notified by e-mail of new articles as
they become available, go to
http://www.bamagazine.com/email
i U X
Before & After magazine
Before & After has been sharing its practical approach
to graphic design since 1990. Because our modern world
has made designers of us all (ready or not), Before &
After is dedicated to making graphic design understandable, useful and even fun for everyone.
John McWade Publisher and creative director
Gaye McWade Associate publisher
Dexter Mark Abellera Staff designer
Before & After magazine
323 Lincoln Street, Roseville, CA 95678
Telephone 916-784-3880
Fax 916-784-3995
E-mail [email protected]
www http://www.bamagazine.com
Copyright ©2008 Before & After magazine
ISSN 1049-0035. All rights reserved
You may pass along a free copy of this article to others
by clicking here. You may not alter this article, and you
may not charge for it. You may quote brief sections
for review; please credit Before & After magazine, and
let us know. To link Before & After magazine to your
Web site, use this URL: http://www.bamagazine.com.
For all other permissions, please contact us.
13 of 13 | Printing formats How to use that typeface 0677
Before&After BAmagazine.com
®
i U X
Before & After is made to fit your binder
Before & After articles are intended for permanent reference. All are titled and numbered.
For the current table of contents, click here. To save time and paper, a paper-saver format of this article,
suitable for one- or two-sided printing, is provided on the following pages.
For presentation format
Print: (Specify pages 1–13)
For paper-saver format
Print: (Specify pages 15–21)
Print
Format: Landscape
Page Size: Fit to Page
Save
Presentation format or
Paper-saver format
Back | Paper-saver format
®
Before&After
BAmagazine.com
i U X
0677
How to use that typeface 0677
How to use that typeface
0677
How to use that typeface
How to use that typeface
BAmagazine.com
That font you love won’t work just anywhere;
it has a style that needs to be complemented.
i U X
Here’s how to work to its strengths.
®
Before&After
Continued 
Continued 
How to use that typeface
That font you love won’t work just anywhere; it has a style that needs
to be complemented. Here’s how to work to its strengths.
2 of 13
University Roman Spotted on Monterey’s famous Cannery Row,
funky University Roman on this slab of a gift-shop sign is out of its
element. Its offbeat letterforms, opulent curlicues and toothpick
serifs are like a Mardi Gras costume in political science class. Not a
match. This is a typeface that wants to party! Let’s find it one!
1 of 7
Before&After | www.bamagazine.com
Ever spot a typeface that you really like and
can’t wait to use? It’s exciting, but go slowly.
Before you buy it, you’ll want to know if the
lines, shapes and little doodads that make it
so appealing here will work as well over there.
How to tell? Reading a typeface is a little
like reading a real face. Tiny differences in
the arch of an eyebrow, the curve of a lip and
the contour of a cheekbone convey real presence, personality and attitude. These need
complementary presence and “attitude” from
the other visual elements, or the result will be
awkward, weak or just funny looking. Here’s
how to do that.
0677 How to use that typeface
®
Before&After
How to use that typeface
Make a visual overview
3 of 13
A and e have extremely small counters,
or enclosed spaces.
BAmagazine.com
i U X
Other letters have REALLY BIG counters.
Set the full alphabet and make a visual overview. Write down what you see.
Why write it down? To make sure you’ve actually seen it. Seriously.
Flamboyant University
Roman was introduced by
Letraset in 1972. It’s quirky
and popular as a display
typeface, especially on
greeting cards. It’s good
for more than that, as
we’ll see.
4 of 13
3 of 13
Opulent swirls
and curlicues
i U X
How to use that typeface
BAmagazine.com
Thick-to-thin stroke differences are subtle but present on every character.
If the signmaker on the previous page had been writing this stuff down, he
wouldn’t have affixed the V to his signboard backward.
Swashy tails
AaBbCcDdEeFfGgHhIiJj
KkLlMmNnOoPpQqRrSs
TtUuVvWwXxYyZz
1234567890!$%&?
How to use that typeface
Characters like N and O that
in ordinary alphabets are
the same width are very different in University Roman
Conversely, characters like M
and T that are normally different are alike here.
®
Before&After
Look at the details
University Roman is full of swashy idiosyncracies that give it a handmade,
Christmasy style especially suitable for fanciful and romantic topics.
Oddball character widths All straight letters are thin. Really thin.
All round letters are wide. Really wide—so wide that round lowercase
letters are wider than their uppercase counterparts! (Ee, above right)
4 of 13
Serif extensions
rise above cap
height and drop
below baseline.
Exaggerated
sizes
0677
How to use that typeface
0677
How to use that typeface 0677
A tail long enough
to tickle three characters over.
Radical 50°- angle serifs and terminals! But only in lowercase!
Asymmetrical
serifs
N O Ee
PRAB Quilt
2 of 7
Before&After | www.bamagazine.com
Wacky x-heights Bulbous, rubbery letters have an Alice-in-Wonderland quality; some have HUGE tops, and some have HUGE bottoms
with no apparent rhyme or reason.
0677 How to use that typeface
®
Before&After
How to use that typeface
5 of 13
Note strengths and weaknesses
aloe
BAmagazine.com
BAmagazine.com
i U X
i U X
Even spacing Put more space between
straight letters, less between round.
Big, tight, even University Roman looks best big. Its enormous,
round letters create a lot of internal white space that looks
better when it’s squeezed out, so set your words tightly and as
evenly spaced as possible (below).
The irregular proportions and embellishments that make University Roman an
entertaining display face make it very hard to read in text. Key is to keep it big.
University Roman, a display face . . .
Texture and flasp net exating end mist of it snooling. Spaff forl isn’t
cubular but quastic, leam restart that can’t prebast. It’s tope, this
fluant chasible. Silk, shast, lape and behast the thin chack. “It has
larch to say fan.” Why? Elesara and order is fay of alm. A card whint
not oogum or bont. Pretty simple, glead and tarm. Texture and flasp
Bembo, a text face . . .
Texture and flasp net exating end mist of it snooling. Spaff forl
isn’t cubular but quastic, leam restart that can’t prebast. It’s tope,
this fluant chasible. Silk, shast, lape and behast the thin chack. “It
has larch to say fan.” Why? Elesara and order is fay of alm. A card
whint not oogum or bont. Pretty simple, glead and tarm. Texture
6 of 13
Its irregularities make University Roman unsuitable
for text, where a rhythmic, medium typeface works best
(above). University Roman can be used for very brief passages (left), but for anything more than a sentence
or so, use a real text face.
How to use that typeface
Best of the
Season to you!
Chris & Robin
®
Before&After
How to use that typeface
0677
Put
5 of 13
Put it to work
The
star
6 of 13
How to use that typeface
0677
How to use that typeface 0677
MYSTERY AND FANTASY.
FOR A FESTIVE EVENING OF INTRIGUE,
YOUR PRESENCE IS REQUESTED
MASQUERADE
Card 2
The challenge now is to combine type with graphics in a coherent whole. To learn
how, let’s start at the end—with two cards that illustrate University Roman perfectly
tuned to its environment.
Card 1
NOW THROUGH MARCH 28
3 of 7
Before&After | www.bamagazine.com
Two beautiful cards The lines, shapes and colors of type and image
are so tightly integrated that the designs appear completely natural and
unforced. Both type and image are strong but together are greater than
the sum of their parts.
0677 How to use that typeface
®
Before&After
How to use that typeface
7 of 13
Look for common shapes
BAmagazine.com
To find an image that goes with your typeface, start with shapes. Round letters go
naturally with round images. Avoid triangles, squares and ambiguous shapes, which
will compete and weaken your design.
Circles (Right) Round shapes are
obvious in the round letters, but look
at the smaller parts, too—the loops
and swirls and negative spaces that
are also round.
NOW THROUGH MARCH 28
OC Dbae
8 of 13
7 of 13
i U X
i U X
How to use that typeface
BAmagazine.com
Complementary typeface (Above) Pair a fancy display face with an ordinary typeface for contrast
plus readability at small sizes. Look for similarities. What’s interesting here is how different Futura is
from University Roman, yet they have roundness in common.
How to use that typeface
Teardrops (Below) Teardrops in the
image mirror those in the swashy S.
®
Before&After
Blend type and image using color and “edge”
4 of 7
8 of 13
0677
How to use that typeface
0677
How to use that typeface 0677
Blend using a common edge Wrap the words tightly to the
contours of the image (left). As a rule with display type, you’ll
do this by eye, paying attention to the nooks, crannies and other
details that the software would miss.
Before&After | www.bamagazine.com
NOW THROUGH MARCH 28
NOW THROUGH MARCH 28
Now bring the image into the type, which in this case means literally. Wrap the type
around the edge contours, then apply its beautiful gradients to the lettering.
Blend using color
Magenta to yellow (above) and
cyan to green (left) are light,
fresh combinations. Sample
color pairs from the image, add
to the color palette as gradient
swatches, then apply to the
type, which will take on a natural radiance that blends beautifully into the image.
0677 How to use that typeface
®
Before&After
NOW THROUGH MARCH 28
How to use that typeface
Lay out the card
9 of 13
NOW THROUGH MARCH 28
BAmagazine.com
i U X
i U X
How to use that typeface
BAmagazine.com
Faint image activates a space
A smaller, lighter duplicate image in the
upper left activates the passive white
and balances the design.
Place type and image on the small card, which confines and focuses
the design. A small, duplicate image activates the opposite corner and
completes the layout.
Splashy composition is beautiful in open space (left), but its elements must work on a card, which
confines them. Set as big as possible, bleeding beyond the lower
right corner (below).
10 of 13
9 of 13
Intrigue, mystery, fantasy. For card 2, our fanciful typeface goes looking
for an ideal party image and finds it in a gold mask.
Party down!
How to use that typeface
NOW THROUGH MARCH 28
®
Before&After
MYSTERY AND FANTASY.
FOR A FESTIVE EVENING OF INTRIGUE,
YOUR PRESENCE IS REQUESTED
MASQUERADE
10 of 13
0677
How to use that typeface
0677
How to use that typeface 0677
Flowers, flourishes and detailed textures mimic the extravagant forms of University Roman. Monochromatic gold is direct and intense and will partner well with the
typeface. Multicolor masks (left, top) are so engaging they require the stage to themselves. Real faces are similarly distracting; instead of a powerful design, the viewer will
be wondering who it is. Remember: common lines and shapes.
5 of 7
Before&After | www.bamagazine.com
Picking the right image is key To
illustrate a masquerade party, a mask is
a natural choice, but which one? A quick
search brought up a multitude of lavish
creations, all visually interesting.
0677 How to use that typeface
®
Before&After
How to use that typeface
11 of 13
The image then designs the page
How to use that typeface
Article resources
YOUR PRESENCE IS REQUESTED
MYSTERY AND FANTASY.
i U X
0677
Ornamental border
Corners of the barely
there border—just
enough to frame the
page—mimic the image.
BAmagazine.com
MASQUERADE
YOUR PRESENCE IS REQUESTED
FOR A FESTIVE EVENING OF INTRIGUE,
Symmetrical mask is naturally “centered.”
Centered layout then doubles its power.
i U X
How to use that typeface
BAmagazine.com
Woodcut Final, matching ornament punctuates
the page with a full stop, completing the design.
11 of 13
11 C0 M85 Y0 K5
Colors
12 C0 M15 Y90 K0
How to use that typeface
0677
How to use that typeface 0677
Article revised on 08/24/10
14 C10 M10 Y30 K20
13 C30 M45 Y80 K40
1 (a–b) University Roman | a) 112/82 pt
b) 46 pt
12 of 13
0677 | 0669 | 0660 | 0613 | 0269 | 0363
0649 | 0644
Related articles
10 (3866203)
9 (1357805)
8 (2626360)
7 (433813)
6 (4836134)
Images: iStockphoto.com
Images
5 Adobe Wood Type Std Regular
4 Adobe Caslon Regular | 10.7/17 pt
3 Futura Extra Bold | 10 pt
2 Futura Light | 18/21.5 pt
Typefaces
MYSTERY AND FANTASY.
FOR A FESTIVE EVENING OF INTRIGUE,
12 of 13
11
12
6
5
7
13
14
1b
4
5
6 of 7
Before&After | www.bamagazine.com
MYSTERY AND FANTASY.
FOR A FESTIVE EVENING OF INTRIGUE,
YOUR PRESENCE IS REQUESTED
MASQUERADE
NOW THROUGH MARCH 28
MASQUERADE
With type and image together, now transfer the colors, ornaments and textures
of the mask to the rest of the page. Result—a unified, powerful design.
MASQUERADE
®
Sample two colors Combine light
to dark monochromatic golds sampled
from the mask into a gradient swatch,
then apply to the typeface. As we saw
earlier, the new radiance beautifully
reflects the qualities of the image (right).
3
2
1a
Before&After
8
9
10
0677 How to use that typeface
®
Before&After
How to use that typeface
13 of 13
Subscribe to Before & After
Subscribe to Before & After, and become a
more capable, confident designer for pennies
per article. To learn more, go to
http://www.bamagazine.com/Subscribe
E-mail this article
To pass along a free copy of this article to
others, click here.
Join our e-list
To be notified by e-mail of new articles as
they become available, go to
13 of 13
7 of 7
BAmagazine.com
i U X
Before & After magazine
Before & After has been sharing its practical approach
to graphic design since 1990. Because our modern world
has made designers of us all (ready or not), Before &
After is dedicated to making graphic design understandable, useful and even fun for everyone.
John McWade Publisher and creative director
Gaye McWade Associate publisher
Dexter Mark Abellera Staff designer
Before & After magazine
323 Lincoln Street, Roseville, CA 95678
Telephone 916-784-3880
Fax 916-784-3995
E-mail [email protected]
www http://www.bamagazine.com
Copyright ©2008 Before & After magazine
ISSN 1049-0035. All rights reserved
Printing formats
0677
How to use that typeface 0677
How to use that typeface
You may pass along a free copy of this article to others
by clicking here. You may not alter this article, and you
may not charge for it. You may quote brief sections
for review; please credit Before & After magazine, and
let us know. To link Before & After magazine to your
Web site, use this URL: http://www.bamagazine.com.
For all other permissions, please contact us.
|
Before&After | www.bamagazine.com
http://www.bamagazine.com/email
0677 How to use that typeface