The office I work for is part of our university’s division of Outreach and International Affairs (OIA). I recently attended a communications seminar organized by OIA’s communications staff, and I found it chock-full of meaningful information that directly pertains to my work. You see, while my work focuses on the techy solutions, as a front-end developer, I have always regarded my role as within the realm of communications.
I’m not going to try to summarize the information from the seminar; to do so would do a disservice to the great presenters we learned from. Instead, I’m going to try to apply a couple of the lessons that I found inspirational. In one of the exercises, we were asked to come up with clear, easy-to-understand messages that explain our job function. So, what do I do, really, and why is what I do important?
You’ve heard the expressions “the clothes make the man woman person,” and “dress for the job you want, not the one you have.” Think of me as clothier, style consultant, and tailor for your stories and/or messages.
By way of illustration, have a look at the two characters pictured above. Let’s say you were told that each represents a major social media platform. Would you be able to guess which ones? (Let me know in the comments, and let’s get some discussion going.)
I’ve “dressed” each one up using just the colors and typefaces that the companies use for their “visual identity.” We humans form associations in our minds between the way something looks and everything else we know about a person, place, or thing. Marketers take advantage of this trait and use consistent design elements—including, but not limited to, color and typeface—to help you remember their company.
Just so I’m clear: I’m not suggesting that the associations that we have for certain colors are always appropriate. Examples of that are coming up next. And I’m also not saying that they’re universal; for some colors, perhaps a case could be made for them having the same kinds of associations for all members of the human species, cross-culturally, but in most cases the associations are learned. Take these two characters to the right, for example. If you’re not red-green color-blind and you were crossing a city street during rush hour, which one signals safety and which signals danger? (If you like, also note your cultural background if you respond in the comments.)
Consider these two characters to the left. Imagine it’s an old western TV show; the program is black and white, and so are the cowboys’ hats. Which one will rescue the damsel, and which one tied her to the railroad tracks to begin with? Now imagine it’s a story set a long, long time ago in a galaxy far, far away. Again, which side of The Force does our hero use?
One more color example: you’ve just gotten an invitation to a baby shower, and one of these two characters to the right is plastered all over the front. Do you, based on the color, have an initial supposition as to whether the baby is a boy or a girl? I fully expect that you do. If you’re familiar with cultural norms in the United States—whether you agree with them or not—you probably do know what the expectant parents are expecting.
And again, it’s not a question of whether it’s right or wrong for particular colors to be associated with particular things. My point is simply that they are—that they can be. And the associations can be very specific, as is illustrated by the first image in this article; different shades of blue can come to be associated with competing social media platforms.
So, good designers and marketers select one or more colors for a business’s visual identity that have existing meanings (in the cultural spaces where they’ll be seen) that are appropriate for the business. And then they hammer on them, using them consistently so that an association will start to form in people’s minds between the color(s) and the company.
It’s the same with typefaces, but this may be a more subtle point to illustrate. I’m going to fall back on some of my not-so-ancient history reading comic books. Comic book letterers will sometimes use different lettering styles to convey differences in tone of voice. Let’s try it out, shall we?
Here are two serif fonts. To me, the character on the left is trying awfully hard to convince us, the readers, that he is a very fancy person with lots of personality. It’s so important to him that we get how fancy he is that he’s willing to sacrifice being easily understood; he’s perfectly willing to cause eye-strain to get that point across. The character on the right, by contrast, wants to speak plainly (if in a bit of a friendly, knowledgeable way) so as to be clearly understood.
I may be getting some too-specific associations, because in my mind I’m comparing these serif-typeface options with a wide variety of other viable options that are out there. Plus, I’ve been doing this for a while; I’m acclimated to paying conscious attention to these details. But I maintain that these associations are working for you as well, whether you’re conscious of them or not. But what do you think?
From here on out, the comparisons are just going to get more and more subtle, so I’ll keep these comments brief. The difference between these two characters to the right should still be pretty easy to see. One of them “speaks” in letters that look more hand-drawn and casual, but that have a little bit of an “ancient” look to them. (The typeface is called “Reliq.”) The other speaks in a tone that looks more machine-drawn and neutral—so neutral, in fact, so as to convey next-to-no personality whatsoever.
Hand-drawn letters with a casual tone of voice can come in a variety of flavors, too. Here, to the left, we have our old friend Comic Sans standing in comparison to the same boring neighbor as the one above. Is Mr. Comic Sans nearly as dignified and intelligent as Ms. Reliq above? Not to my eye.
Let’s take this subtlety to an extreme and see how we do. To the right are two speakers. Can you see the difference in their tones of voice? Both of these typefaces are “cleaned up” so that they do not look hand-drawn. But one of them uses shapes that are a little more open (look at the letters /s/e/a/), and uses lines that are slightly wider at the ends than in the middle (look at the letter /I/). One of these typefaces has a reputation for being friendly-but-professional, and the other a reputation for being authoritative. (More authoritative than Mr. Boring above, though you may not be able to see the difference.) Which one is which, do you think?
Finally, let’s observe that all typefaces that are in the style known as “Blackletter” are not created equal. If you look closely (especially at the letter /o/), you’ll see that these two typefaces, though clearly different, have a lot in common. To me, one of these two characters is a pirate, and the other a fan of heavy metal music.
Most of the time, for most of my clients, the overriding design goal is to clearly communicate their stories and/or messages. But there is considerable leeway within that requirement to add a subtle tone of voice that reinforces how the client wishes to be thought of, whether casual or formal, friendly or authoritative, ninja or pirate.
I combine typeface choices with color choices that are appropriate for how the client wants their stories and/or messages to be presented, and combine that with design principles such as contrast, repetition, alignment, and proximity to make layouts that work, and are clean and clear. (In even the most casual of outfits, you don’t want missing buttons and the pants legs to be uneven.)
You know your story, your message. One of the important jobs of designers like me is to help you present it in its best light—to outfit it to succeed in the parts of the world it will be traveling.