Typography | Display Type: Quirky and Loving It

Display Type: Quirky and Loving It

Animated G by Dutch designer, Erik van Blokland.

Type is an expressive medium; it can be nuanced or noisy.

In the first lecture, we looked at the nuts and bolts of type and at some of the details that make the type work. In the second lecture, we looked at the character of a typeface and how that can both influence and enhance the tone, mood, and hierarchy of a design. In this final lecture, we'll cut loose a little by exploring the category of type called display typography.

This category isn't intended for book reading. It's meant to convey emotion and intrigue. It's not meant to be invisible and quiet on the page, but attention-getting—, look at me! In this lecture, think of type as musical notes or paint on a brush.

The Voice of Advertising

In our first two lectures, we looked closely at the traditional practice of typography. Much of its lore and history comes from the world of the book.

This makes sense because for most of human history (and arguably, even today) the book has been the primary form of written communication.

In this lecture, I'd like to look at the other end of the continuum—the display typography used in advertising and posters.

Display typography appeals to the emotions more than the intellect. It does not lecture plainly from behind a wooden desk, but entertains on stage with tap shoes and a song.

Display type is all about communicating with an emphasis on emotions, as in this ad for Ram trucks by The Richards Group.

Theatrical Communication

"The essential [thing] is to excite the spectators. If that means playing Hamlet on a flying trapeze or in an aquarium, you do it." —Orson Welles

I'm not sure how many advertisers have read Orson Welles. But they certainly understand the quote above. In it, Orson is trumpeting the attention-getting power of theatrics. And he ought to know. After all, Welles was able to convince the nation it was being invaded by men from Mars in his radio play, War of the Worlds.

How can type designers be theatrical? I believe that designers (as communicators) have a lot to learn from the dramatic arts. To command the attention of the viewer, type cannot afford to be impersonal. It must have both a face and a character.

Jim Rose Circus/Sideshow. Designer Ashleigh Talbot used display typography to evoke the sensational signs of the circus sideshow.

This reminds me of a talk I once attended by author Kurt Vonnegut. As he described the points of tension, resolution, and climax in one of his stories, he drew across a chalkboard a chart with many hills and valleys. After plotting the diagram he drew a straight line—with an occasional bump—through the middle and pronounced "...and here is your life."

Vonnegut is pointing out the use of the dramatic in storytelling as compared with daily life. And at times I think this is the job of the designer as well. We need to give dramatic expression to mundane communications. Typography can be one of the tools in your visual repertoire.

Exercises in Observation

Here's a funny story. Sometimes my designer friends and I sit around in the college courtyard and assign typefaces to passersby. Marcelle says, "There goes a Bodoni Italic." Gregor says, "Here comes old Garamond out for a walk."

Sounds a bit juvenile perhaps, but this observation exercise is one that aspiring actors do to practice emulating personalities and characters. Actors can look at your posture, stature, and the way you move to analyze basic body language. Other signals might be your dress or facial expressions. Have you ever watched a mime performer transform him or herself from happy to sad without saying a word? In many cases, they can change mood and emotion by a simple slouch, gesture, or eye movement.

The best typographers can do that with the way they present words and text. Designers call the creation of logomarks for corporations or institutions visual identity work.

Two logomarks using very different personalities of display type

Identity Politics

Visual identity creation is as old as print publishing itself. So says Daniel Boorstin, former U.S. Librarian of Congress, who has written numerous books about American society and has some insightful accounts of the influence of printing, communication, and advertising on society and culture.

An early type design mimics the effect of type signage blowing in the wind.

In a book called The Image, Boorstin details the "graphic revolution" that begins with early book printing but really comes of age in the Industrial era of mass-communication. Newspapers and magazines ushered in a period of new imaging techniques—photography and engraving—and also advertising.

He remarks that an image... "is not simply a trademark, a design, a slogan or an easily remembered picture. It is a studiously crafted personality profile of an individual, institution, corporation, product, or service."

A notion of identity can be communicated through the "body language" of typography—its posture, cadence, and verve.

Choosing an Identity

Suppose you are asked to create logos for two companies: General Motors and Gourmet Collection. First, you invest some serious time in researching each company's identity. Who are they? What do they make or do? What values do they want to project? Your creative brief should answer these questions and more.

Next, you print out a range of typefaces at different sizes, to find the right company "face."

Below, I set each of the sample company names in two typefaces. Both are very exaggerated: Bickham Script is delicate and fanciful and Impact is no-nonsense, heavy, and blunt. Maybe you know some people with the same personalities? Which typeface do you think best fits the "personality" of company?

Not too hard, I hope. The script typeface makes more sense to use with Gourmet Collection than General Motors. Advertising icon David Ogilvy wrote: "You now have to decide what image you want for your brand. Image means personality. Products, like people, have personalities, and they can make or break them in the marketplace."

So, here is a more complex visual quiz. In town, there are three Italian restaurants all named Leonardo's. In fact, they're all owned by the same family, but each venue has a unique personality and menu to target a different market. Take a look at the fonts below and try to decide which one best fits the character of each restaurant.

1) Leonardo's on Green Street is a pizza joint. The kind of place you go with friends after the ball game. Beer is on tap. Prices are moderate. They have a jukebox which plays old time rock 'n' roll.

2) Leonardo's on Brown Avenue is upscale. They serve authentic handmade pasta dishes and not much pizza. Red wine is the popular accompaniment. Jazz is played on Fridays.

3) Leonardo's on White Boulevard is almost like fast-food. Pizza by the slice and a fun place for family and kids. Coca-Cola is served here. Top 40 pop music is piped into the dining room.

So what are your choices? Here's which one I would choose and why. For the upscale Leonardo's I'd use typeface 5 or 1. Both have an elegant demeanor. They are serif faces and classical in feeling.

For the fast-slice Leonardo's, the best choice might be 3. It is certainly a fun and gestural face but all of its quirks might get distracting after a while.

For the beer 'n' pizza Leonardo's, I'd look for a casual and friendly face, like a good buddy. I keep getting drawn to number 10. It's sort of middle-of-the-road and unpretentious.

Remember that selecting a font is only the first step in a design. We could apply different colors, arrange the letters differently, use all uppercase, add ornamentation, or use a graphic along with the type. Whatever we do, it should help clearly communicate the personality and mood.

Let's look at Leonardo's again in a video tutorial, this time with some different typefaces to choose from:

Type Is Image, Too

Designers who design with type understand that type rarely works alone. Typography is a communication tool that should work hand-in-hand with illustration and layout to create a complete message.

Roll over this magazine layout for Utne Reader (Design: MSP Communications) to see the perfect integration of image and text in a layout.

Don't let type choice be an afterthought. Make it harmonize in both style and composition with the rest of your design work.

What's the deal with the illustration above? It is a magazine spread from the Utne Reader in which the type on the page echoes the illustration. It is a great example of the integration of type and image.

Roll over the illustration (right) with your mouse and you can see that the arrangement of the type reflects and responds to the illustration. The outline of the life-saving ring is defined by the main body of type. The O is elongated to almost exactly reflect the shape of the ring itself. And finally, the word "solitaire" is fragmented like the bones in the helpless fish.

Below is another example of how type and image work together. It's a layout from Rolling Stone magazine, an industry icon for layout designers.

Rolling Stone magazine spread. Roll over the image to see the placement of type. Art director, Fred Woodward, 1994.

What I've done in the graphic above is eliminate all of the typography. I've left only the illustration and basic composition and color. Those certainly set a style. If you use your mouse to roll over the image, however, you can see the type jump into place.

The style and color of the illustration accounts for much of the look and feel of this layout. Do you think the art director considered the integration of the type? It obviously isn't just "stuck on" as an afterthought. The type has a lot of personality itself.

This magazine spread—like most design work—was a team effort. Fred Woodward was the acclaimed art director, but the designer was Catherine Gilmore-Barnes, who dealt with the layout and composition of all the elements. The illustrator, Malcolm Tarlofsky, was most likely commissioned for just this one article. And in this case, there was a calligrapher too; Anita Karl rendered the blackletter-style FLY.

In-Your-Face Type

Sometimes a type designer will choose to forget all that uptight stuff about fine typography and throw history and tradition out the window. You saw this in Lecture One when you learned about Neville Brody, the master of this very approach.

Let's look at a number of examples from designers Licko, Heine, Medina, and Segura who approach type design from various angles.

Narly by Zuzana Licko.

Display typefaces aren't neutral and quiet in their design. They have a very strong personality and trendy style which limits them to specific uses and applications. This face, Narly, would be great for some display copy in a grunge-hacker high-tech advertisement—but not in that many other situations. Designer Zuzana Licko used a font bitmap as a starting point and "evolved" the visual variations from that basic form.

The typeface Remedy below is also very distinct in character and attitude. It's easy to pick out of a crowd. Because it's so strong, a little bit of it goes a long way. In the beginning, it may have been interesting and exciting, but it soon became trendy and overused in the 1990s. Its novelty was gone. Such is the life span of display faces...

Remedy Double by Frank Heine

Remedy is distributed by Emigre and was designed by Frank Heine who lives and works in Germany. Where does inspiration come from for display type designs like Remedy? Maybe it's just in the air? In the late 1980s, there were a number of examples of a similar quirky-style hand lettering.

A drawing by artist, Keith Haring. And playful type from the album covers of bands: Living Colour, Prince, and Deee-Lite.

One of the earliest samples is for the logotype for the band Living Colour, by a design team called the Thunderjockeys. You can see similar work in other album covers such as those of Prince and Deee-Lite.

I think you can also see a resemblance to the artwork of Keith Haring who was an influential NYC artist at the same time. It is composed of simple line drawings and primitive shapes that you might see in totems and tattoos. Typographer Frank Heine brought those forces and styles together—whether consciously or unconsciously—in the typeface Remedy.

Modern Display Type Designers

To continue our exploration, let's take a look at a series of contemporary display type designers draw inspiration from the world around them.

Pablo Medina

The typographic design of Pablo Medina reflects his cultural environment. He is influenced by the unpretentious, sometimes imperfect designs hand lettered by sign-painters in communities in North Bergen, New Jersey and Manhattan's East Village where he lives. From these neighborhoods, he extracts typographic forms and visual experience.

One of his recent typefaces, Union Square, is based on the mosaic tile work found in the subway system of New York City. His typefaces are based on local culture as opposed to the sameness of our 24-hour global info-culture.

Medina used tile mosaics in the subway stops as a reference for his typeface Union Square.

Carlos Segura

Cable station TNN (now defunct) identity graphics. Design: Segura Inc.

You might know Carlos Segura from his Chicago-based firm Segura Inc. or from his popular digital type foundry T-26. Like Pablo Medina, Segura has a Cuban heritage. He was born in Cuba and emigrated to Miami. Jobs at a number of advertising agencies eventually brought him to Chicago.

T-26 began in 1994 as a way for Segura to distribute his own fonts but it soon became a conduit for many others to showcase their type work. T-26 now hosts hundreds of typefaces designed by scores of designers worldwide.

In art4d magazine he describes the philosophy behind the foundry: "At the time, it was very difficult to find 'experimental' type without going through an extensive search, or drawing it yourself, so we focused on a plan that was to build a 'community' of global designs from sources that were being ignored, such as new, up-and-coming talent and students."

Neo Bold by Carlos Segura, one of his first faces

Similarly, in another interview, Segura says an important purpose behind T-26 was to open the doors of the exclusive, cloistered world of type design to innovative design made possible by new desktop computer technologies. "If you were a beginner, or an unknown font designer, your chances of being taken seriously were slim at best by the top foundries of the time. We opened the doors of opportunity to everyone who wanted to send us something to look at. And we got some amazing stuff."

At Fontworks, Segura explains that typography is a creative, expressive medium—and that he treats type as an image: "We don't view typography as just a vehicle for doing words. For us it's more of a canvas to paint the feeling of what you're saying about body language rather than text as language." I think this echoes the point of this lecture, that typography can be dramatic and expressive.

Gunnlaugur Briem

Like Segura, Icelandic designer Gunnlaugur Briem believes that typography is about more than merely a way to display language. His fonts show a sensitive awareness of the people who will come into contact with them. In 1990, he was tasked with updating the main typeface for the prestigious London Times, and in 1995 he was called upon by Iceland's Library for the Blind to create a font that artfully combined Braille symbols and Latin lettering.

Gunnlaugur Briem's BriemGauntlet is based on traditional Icelandic woodcarving.

Briem's font BriemGauntlet taps into Icelandic history, modeling itself after a traditional style of Icelandic woodcarved lettering. The resulting font is ornamental and distinctive, not only a carrier of information but also a symbol of cultural heritage.

As Briem points out on his Web site, we already have more than enough masterpiece typefaces, but we still have a constant demand for "different flavors, a variety of emphasis, wood types, hobgoblins." Briem's work has shown a consistent ability to adapt typography to unique design challenges without losing a sense of individual expressiveness.

Jonathan Barnbrook

Jonathan Barnbrook collaged together a variety of typefaces to quote Tibor Kalman in his provocative 1999 billboard installation.

British designer Jonathan Barnbrook brings a strong social conscience to his work, and he is not afraid to express bold or controversial opinions in his designs. A two-time art director for editions of political magazine AdBusters, Barnbrook is well-known for his billboard project "Designers, stay away from corporations that want you to lie for them" (a Tibor Kalman quote), which debuted at the 1999 AIGA conference in Las Vegas.

Barnbrook embeds nods to his causes and beliefs into all his work, even down to the allusive names of his fonts: Newspeak, Prozac, Shock and Awe, and Doublethink. He has stated that he believes design should serve as "a weapon for social change," and he admits a lack of patience with typography that strives to be "neutral" or "transparent."

You can see this embrace of both progressive politics and bold, non-transparent typography in Barnbrook's Prozac font, which is distributed through Barnbrook's own VirusFonts foundry. Prozac was created as an experiment "to make a universal alphabet with as few shapes as possible." The entire font is based on six shapes, which are rotated and/or flipped to generate different forms. Barnbrook explains the philosophy behind this experiment as a call to analyze the goal of typography: "We wanted to hint at the relationship between simplifying letterforms and the complexity of meaning conveyed through words."

Jonathan Barnbrook's Prozac is a highwire typographic feat: it uses only six shapes—rotated and flipped in various ways—to create an entire font.

Barnbrook's work is a good example of display typography that elevates the medium, lacing letterforms with challenging ideas.

Display Type in Print and on Screen
Print Advertising

ecially true in advertising design. At most you'll be reading only a headline or small bit of copy, not pages and pages. I think most advertising relies mostly on clever copy writing and strong photography or illustration to communicate a concept. So it's difficult (but not impossible) to find examples of ads which use typography alone as the primary communication tool.

But don't get the idea that decorative and ornamented type is something new. You can see illustration at work in the decorative letters used in manuscripts for hundreds of years.

In The Americans: The Democratic Experience (1973), Daniel Boorstin tells us that before the American Civil War (1860s) most advertising was quite restrained, particularly in the true and honorable domain of newspapers.

Many newspapers used the "Agate Rule" which required ads to be set at a particular point size: 5.5 points. That's very tiny. And they included no illustrations or images and fit within a standard type column. I suppose it would look something like a modern-day classified ad.

After the war however, display advertising was born—ads spread across many columns and included engraved illustrations, ornaments, and large-scale type.

Its not surprising that P.T. Barnum, the circus showman and tall talker, was also a figure at this time.

The ingenuity of advertising was (is) driven by commerce. Please buy my soap rather than the other guy's soap! At the time, it was department stores like Macy's and Lord & Taylor that were the entrepreneurs.

Levi's Jeans. Design: Jennifer Morla Design.

In the Levi's advertisement by Jennifer Morla (above) the handwritten playful type style make perfect sense with the concept—remembering a childhood game. It recalls doodling in school notebooks.

We've come a long way from the old-school agate rule!

Making Type Ad(d) Up

Richmond Virginia Neighborhood Watch program. Design: The Martin Agency.

Some advertising is almost pure type and here is an example. The concept of the advertisement isn't communicated through a photo but completely through type arrangement.

This Neighborhood Watch ad uses the arrangement of type to generate a sense of unease by breaking the traditional column layout and even using the letter d to push outside of the border of the ad. There is also a sense of depth, as the type—panic, panic, panic, panic—seems to jump off the page, getting closer each time.

The body copy seems to be typeset well—using all the good rules of traditional typesetting. The piece brings both aspects together—jazzy display typography with conventional rules of typesetting.

The Electronic Word

Throughout history, books, newspapers, and advertisements have successfully used display fonts to draw attention. Today, book cover designs still use display fonts, and newspapers all over the world use them for their respective names. Magazines, advertisements, and film all use display fonts incredibly creatively to convey messages.

The teaser trailer for the 2011 horror film 11-11-11 made very creative use of typography in motion to communicate an anxious and foreboding mood. Click here to watch the trailer on YouTube.

However, by the end of the last century, two new players had come on to the block: the computer and the Internet. Digital media has since revolutionized communication globally.

To achieve this remarkable breakthrough, many contemporary type designers and typographers seized the bull by the horns and both designed new typefaces and modified classical typefaces (including display faces) for use solely on screen.

Betatype is one foundry working entirely on typefaces for screen use. Apertura (above) is one such typeface.

The ever-growing, fantastic, and extensive choice of screen-ready typefaces available to digital media designers will contribute to the supremacy of electronic type over the printed word. However, this superior position can and will only be attained with effective and deliberate use of typography, whose basic principles and rules are identical to those of print typography. In both forms of media, a good piece of typography is the most unique and most powerful tool to convey a message with character, mood, and tone and, most importantly, clarity.

Web sites are so commonplace and reasonably easy to build that there is a plethora of exceedingly unpleasant-looking and badly functioning sites out there. This is great news for designers, especially when clients come knocking on the door with a host of complaints about their existing sites. They may say thing like, "The web site isn't attracting any significant traffic, doesn't reflect the character of the company, and the pages are too difficult to read." These are just a few of the common complaints; the list goes on!

Similar to print design, Web sites can be categorized by their function, which in turn influences the use of specific typefaces to reinforce their messages and their general "look and feel." Advertising Web sites tend to be bold like the Nike Running and Jeep sites below. The corporate logo stays in the top left corner, but numerous typefaces are used to convey the mood and tone.

Notice how Nike Running and Jeep don't use unusual display typefaces, but treat classic faces in a display manner.

Entertainment sites are often a little more sophisticated with their use of type and imagery. SHSK'H is an avant-garde music label; the information is succinct and clear.

SHSK'H uses two body faces, a unique layout, and motion to create a hierarchy.

Experimental sites tend to be more adventurous with their use of type. A good example of this is the Fontstruct site, geared towards designers. Notice that the logo uses a display face, and the display faces that they are promoting fill the main areas of the design.

Fontstruct lets you create your own typefaces and promotes this with display type.

On community and social sites, the typographic style will often reflect the friendly environment (tone and mood), The typefaces are easy to read and are supported by pleasant colors. TokBox reflects an approachable, no nonsense site.

A display face is only used for the corporate logo and one word ("fun") on tokbox. Friendly sans serifs keep the rest of the design clean and easy to navigate.

We have come a long way from the Encarta '95 CD-ROM, which pioneered the concept of information design on screen, and information sites are still essential to the digital experience. The challenge to designers is to create sites that can convey vast amounts of information clearly and retain a mood and tone relevant to the owner of the site. A successful example is the Spectra Visual Newsreader below. Notice that as an information site, it stays away from the fun and frolic of display type and gets right to the point with the simplest of sans serifs.

Spectra Visual Newsreader, using simplicity of type to better convey information

Type design, like other art forms, is all about situation and context. If I wear crazy clothes, two different socks, and dance on the tables at the design office, it won't go over too well with the director (not to mention most of the clients). But everyone expects me to do this at the studio parties.

Typography is the same way: sometimes reserved, sometimes outlandish, and always of personality. In the following Quick Crit, take a look at how one student conveyed the personality of a famous (and outlandish) person.

What mood are you in? Let's find out in our final project.

Discussion Share your thoughts on typography with other students at the Discussion Boards. Exercise Create a typography composition to express the personality of a famous person.