Creating a Logotype Depends More on the Means Than the End

The process of designing a type-based logo is similar to that of designing a shape-based logo. Both logos need to convey a message, do it quickly and appease the client’s taste.

All of these objectives can be accomplished by defining goals, favoring message over convention and questioning our assumptions as designers—even to the point of considering Arial or Helvetica.

Anyone who designs a logo faces many questions. What should it look like? In what formats will it be presented? Does a particular color scheme need to be followed? As rough drafts are refined, the urge to find a general “solution” overrides the importance of these initial questions, which often end up neglected. When design becomes a question of preference, the end result is debatable.

Graphic design is a process of solving problems through visual communication. The process of designing a logo can be regarded as a series of steps that solves a series of questions. This article tells the story of a process that focuses on those questions.

 

What’s the Project?

Smalls, Middleton & Bigman, a fictional law firm, hires a professional design company to develop its company logo. Problems begin with its initial requirements:

  • It must be easily recognizable.
  • It should work at all sizes, including for business cards, letterheads and billboards.
  • It should look professional.

These could apply to any logo for any company. So, the designer asks for more information about the company itself.

  • In what specialties does it excel?
  • What sets it apart from competitors?
  • What brings clients back for business?

Smalls, Middleton & Bigman is an aggressive new firm specializing in regional real estate deals. Its owners want to make a dent in the established market. Most of its staff were born and raised in the area that it covers. They are locals who understand the region’s history and politics and could rattle off a list of the best barbecue places in town. Although the principal partners have many contacts, the firm has no repeat business because it has no clients yet.

Everyone involved agrees that starting with the right logo is important, especially in a market with 20-year veterans who advertise actively. While the competition uses law books and scales of justice in its imagery, SM&B wants to emphasize its memorable names.

The designer immediately sets out to create a logotype.

 

The Importance of Shape

A logotype is a graphical trademark that uses type as its primary or only element. Like an icon, it expresses a message, but with letterforms alone. A logotype should communicate the name of the company and reflect its personality.

The temporary letterhead created by the firm’s secretary is quickly rejected.

logos in arial, times and papyrus

Seasoned type designers might roll their eyes at the sight of Arial, Times New Roman or Papyrus (or of a letterhead created in MS Word), but that response smacks of snobbery.

Which of the above logos tells people what the law firm specializes in? Which one sets the firm apart from its competitors? When we ask whether these are solutions to problems, then we’re using design as a means of problem-solving.

The examples above aren’t logotypes. They’re just text. How do we tell people non-verbally what the law firm does? That is, not with text alone.

 

“It’s Ugly” Isn’t Reason Enough

What about Arial, Times New Roman and Comic Sans makes designers cringe? It’s not necessarily the letterforms. Helvetica, for example, is a well-designed geometric typeface that dates back to 1957.

At a glance, Helvetica is rather plain. But that’s because we’re used to it. Look again:

diagram of consistencies in helvetica's design
  • The uppercase A steps outside of its container on the left to accommodate its acute point.
  • The round counters in b, c, d, g, o, p and q match precisely.
  • The ascenders and feet have a uniform width, even when they end at an angle or curve.
  • The x-height of most letters may as well have been cut with a razor.
  • There are only three variations of diagonal angles.

Overall, it’s hard to imagine a more legible face (though some have tried). But its success turned into a dilemma. Faces such as Helvetica lack impact because they are common. Common typefaces blend into the background. We see them everywhere. Anyone can use them.

Rejecting Helvetica, Times, Arial, Papyrus or Comic Sans is justified if it’s inappropriate or if a better alternative exists, not because we just don’t like it.

a logotype set in helvetica

Above, the SM&B logotype is set in Helvetica at two sizes. Whether large or small, it is legible, modern, and sensible. It’s a good start, but rather plain. Nothing about this logotype presents the law firm as aggressive, young or specialists in real estate. Except for the fact that law firms are often named after three people, this logotype could be for anything.

A typeface speaks volumes about the company’s character:

examples of text set in different typefaces

Above, the statement “We’re a law firm” is written in different voices. As in the movies, delivery can change the same line into a comment, a joke, a question or a threat. When Meg Ryan smiles and says, “I’ll be back,” she means something different than Arnold Schwarzenegger. Likewise, four different law firms could each use a different one of the above typefaces, but guess which three would have trouble finding business?

 

Viewing Type, Not Reading Text

If you work on a logotype long enough, you’ll reach a point when the word in the logotype starts to look funny. Something’s odd about the text. Has it always been spelled that way?

If you’ve just noticed that it contains a peculiar combination of letters, then congratulations: you’ve stopped reading the words and started looking at the shapes of the letters. The effect is stronger when you set the words in a variety of font styles. (Unfortunately, staring at the examples in this article won’t work. For a taste of type nirvana, play around with a program that lets you experiment with fonts up close.)

The name SM&B is already set, so the designer can take his time choosing the right typeface for it.

revised logotypes in appropriate typefaces

Above, our law firm’s name is set in four different—and more appropriate—serif typefaces. The differences are subtle, but two immediately stand out: the ampersand and the letter S. (Look closely: setting it in large type helps you notice the details.)

ampersands in various typefaces

Originally an abbreviation for the Roman “et” (“and” in English), the ampersand can take on unique personalities. Above, six fonts show how wide the variety can be. For SM&B, the important question remains: which best suits a young aggressive real-estate company?

diagram that highlights parts of ampersands

All of the ampersands “flow” (i.e. have a sense of motion), but they take radically different approaches. Choosing an ampersand is not about which looks nicest, but about which sets the appropriate mood.

  • Jenson’s bar is balanced like the scales of justice, which is too close to SM&B’s competitors.
  • Warnock’s combination of hard angles and refined lines makes it the most modern.
  • The ornate style of Palatino looks more like calligraphy than an aggressive law firm.
  • Giovanni, which curves inward, is either introspective or self-centered—neither of which fits SM&B’s personality.
  • Baskerville’s vine-like swirls are the least appropriate.

The question is, what shape(s) best communicates energy, professionalism and real estate?

No less important are the serifs:

diagram that highlights serifs in different typefaces

Each letterform ends in a distinct serif (although Minion and Giovanni are close).

Warnock and Palatino don’t quite fit. They are clunky compared to Baskerville and Jenson, whose serifs flow from the S shape. Minion and Giovanni’s serifs are subtle accents to the letterforms.

Eventually, the designer settles on the Warnock ampersand and the Giovanni letters.

a logotype that uses ITC giovanni and Adobe Warnock

A few extra tweaks add to the sense of motion:

  • A gap enhances the ampersand’s “hop.”
  • Right-aligning the last word balances the white space in the upper-right and lower-left corners.
  • Using bold instead of Giovanni Book lends greater intensity.

So, how do we convey the professionalism and capacity of a firm that does not yet have years of experience? Which font says “fresh and new”? A serif face whose tails are kept to a minimum.

 

Text Informs. Color, Style and Font Emote.

People “read” and “view” logotypes at the same time. Reading text is informational: people interpret the words and relate them to other information. Absorbing text is emotional: people get a sense of the company’s character and attitude, and this is determined by font choice, color, placement and size.

For example:

the words blue, green and yellow set in orange, purple and dark sea green

The text of each word contradicts its hue. But if you processed the text before the style, then you followed the pattern that most people follow. When people see text, they look for a literal message. The message (for example, the mood) is absorbed much less consciously but is no less important.

At this point, one might ask what colors SM&B’s logo should be? But choosing colors isn’t the goal. Communication is the goal.

Instead of looking for colors that he likes, the designer returns to the original problems. Specifically, how do we convey specialization in real estate? Treating color choice as a solution, not an arbitrary preference, leads to a revelation. Most law firms use dark blue, red, gold and white. SM&B wants to stand out. Earth tones solve the problem of how to avoid conformity while conveying the firm’s real estate specialization.

earth tone color palette

The designer and law firm start reviewing earth tones. Representing lawyers with browns and greens is unusual, but the decision isn’t arbitrary. The color scheme solves a design problem.

the giovanni and warnock logotype with earth tone colors

The order of blue, green and brown suggests a landscape, but not explicitly so.

variations on the colored logotype

The designer tries a few variations, which don’t add anything. Gradients, for example, are a solution with no problem.

So, how did we manage to say that this is a real-estate law firm without actually saying “Real estate law firm?” through color.

 

The Right Questions Lead to the Right Answers

The story of SM&B’s logotype is about process, not solutions. The final logotype depends as much on personality and good sense as the client and designer’s tastes. Any of the proposed solutions are open to debate, as a logotype should be. But the questions that sparked the process by which the logo was created should not be forgotten.


Written exclusively for Webdesigner Depot by Ben Gremillion. Ben is a freelance web designer who solves communication problems with better design.

How do you approach icon, logo or logotype design? How do you communicate identity in a simple logo? Contribute your ideas in the comments below.

  • http://www.truenorthe.com Courtney

    I like how you broke down the process of logo design. Thanks for the informative article. I do disagree with the final color choice. This article is to be an example only, so I shouldn’t get all bunched up over the color issue.

  • http://www.ksnagra.com Kanwaljit Singh Nagra

    Very interesting read, haven’t done many logos in my time as a designer, but I would definitely like to get more into it. This article provides various aspects to think about beyond a shape based logo :D

  • http://www.natashastorm.co.za Storm

    Really interesting post! Good read!

  • http://www.creativeindividual.co.uk Laura

    I think this has been the most useful article on logo design I have read so far. There are quite a few which go into the importance of thumb-nailing, but don’t show the importance of understanding the brief or the client in the first place. And it was nice to understand why you would chose each typeface, and why you chose that combination of colours. Great read, thank you.

  • http://www.webmaster-directory.og Sheryl James

    I loved the Text Informs part specially if you have numerous form of fonts it helps alot.

  • http://paulgalbraith.com Paul Galbraith

    Great article, especially for those starting out with logo design in general. It’s all too easy to choose a favourite typeface without actually thinking about what the letterform says about the business it represents.

  • http://eserrano.com E. Serrano

    You are completely right to separate taste from the meaningful elements themselves. A logo needs to convey a unique mensage to depict the main ideas of a company through a concise message. And this is often achieved through subtle, meaningful details.

    So that’s why comments like “it is ugly” don’t help at all. The right discussion isn’t about “nice” or “ugly”, but about “working and meaningful” or just “don’t working”. But it is obvious that you customer won’t happily accept a logo that she finds “ugly”.

    So, how do you educate your customers about the importance of objective, meaningful and appropriate elements in your designs? In my experience, the best way of doing so is breaking up the logo design and explaining it in the same fashion that you did.

    Tell your customers about symbolism, typography and color in a way that they understand. Keep this explanation as close to their objectives as possible.

    When people fully understand the process and meaning behind the graphics, they just don’t focus on a subjective “ugly” or “pretty” discussion. They start to see how the new brand depicts all their key ideas.

    A professional logo design process would then be as follows:
    1. Understand your customer’s business. What would depict their main ideas? What would work for them?
    2. Create a meaningful image. Good design experience will lead to something “objectively good looking”.
    3. Explain why the image depicts the main company ideas. Write about it in a way that is easy to understand for your customers.

    Many people just start the process in 2. creating a image they like. But understanding what a customer needs and how to depict their corporate images (1.) is extremely important. And if you skip the explanation about why their new logo works for them (3.) you will probably face pointless discussions about “I don’t like this logo because it is ugly”.

    Explaining the symbolism in your corporate identity design will turn that argument into a much more productive reasoning: “I see how this logo design represents my company”.

  • http://www.platopress.com poch

    This is one of the best basic logo designing tutorial I ever read. Bravo!

  • http://www.vectelligence.com Ilie Ciorba

    The article is just amazing, we usualy don’t to much attetion to the fonts while they are communicating so much about our personality and style to the readers.

  • http://www.creativebeacon.com James George

    This is truly a fantastic article, and it really takes an intelligent approach to logo design. it isn’t simply about “picking” a font and slapping color on it and “Ta-da!” It is about a process involving problem solving and how to help a client communicate their certain message. You also showed how a different look can communicate an entirely different message altogether. This will give many designers much to consider when designing a logo for their clients. Great article, well though out and well explained…Bravo!

  • Omniszron

    Yeah, the final colour scheme is ugly, but that’s not the point. The point is, that design is a logical process and doing it “by the gut” is not the way to go. I think this article conveys this message very clearly. Great read!

  • Kyle

    No offense, but this is kind of a joke. Typing the name and then screwing around with justification doesn’t mean you have a logo. All you’ve done is typeset some text in a certain font. If someone were to pay you for a logo, at freelancing rates, and you gave them this, they would laugh in your face.

    Albeit, no rule is graphic design is unbreakable.

    #1 Four colors in a logotype design is a little rediculous. Consider what the colors mean… Can you convey the real estate aspect with just green and blue, or green and brown, or blue and brown… If only 2 colors mean something to the design, only use two colors. If only one communicates something, just stick with one. A one color logo meaning something will work harder than a 4 color logo that looks colorful.

    #2 If you are going to typeset a logo, make sure you are good at typesetting. Watch your tracking and kerning and make sure everything is spaced properly. For instance there are slight spacing issues between the M and I/ T and O in Middleton. the last line seems spaced further down than it should be leaving a gap between bigman and middleton. The computer just sets the type defined by it’s own preset parameters, It’s up to you the designer to make sure it flows perfectly.

    #3 You might be better off sub-contracting a graphic designer for your logo design needs.

    • http://www.poweredonmedia.com Shaun

      I had many of the same thoughts. I feel this is a solid article, unfortunately it is a prime example brand/logo creation by a web designer (as others have noted).

  • Arlen

    Hmmm… I wasn’t going to make a comment, but a gradient in a logo? That’s going back to the 1980’s early 90’s. I design for a variety of media. Started out with digital (interactive CDs, websites) then moved to print and branding. I had a good number of years of art & illustration behind me before I entered the design industry and before I did so, but nothing prepared me for branding. I learned everything about print and identity design from very close friends who were friends and that took a while to understand the process. Your article is good but it’s an example of why typically web or digital media designers do not make good logo/brand designers.

    Leading and kerning are two of the most important things when it comes to creating a type–based logo. Something which is not mentioned here or paid attention to in the article. A logo type is not necessarily just text typed and placed either. With the sense of colour and depicting as a non–law firm, I beg to differ. Colours such as these create trust, but are not necessarily associated just with real–estate. They could be misinterpreted for gardening centre (a stretch I know).

    One thing you didn’t mention was that for print, you need to introduce Pantone colours which are solid colours that allow not only for colour consistency, but keep the cost of printing down on short runs such as letterhead and business cards. Typically designs created in RGB and converted to CMYK do not work all that well unless you think in advance due to CMYKs lack of colour spectrum, and CMYK cannot truly recreate a Pantone colour. So lots of thought process needs to be taken when dealing with just that area.

    I’m not trying to ruin your article. It’s a great one, however, you need to expand the fact that there is more to it than just picking a typeface (which I like the detail and showing the differences), and some colours. I think if this was actually a client that more could have been done to make it more cohesive to bring it all together. As it stands I see 4 separate elements (even as black and white), where they need to come together more. Leading needs to be adjusted as well as the kerning. A much larger ampersand (and more elegant one) would help bring it all together. More colours doesn’t make it better, but can in–fact cheapen the experience.

  • Arlen

    I noticed a line typo…

    I learned everything about print and identity design from very close friends…

    should have read: I learned everything about print and identity design from very close friends who were DESIGNERS…

    my apologies.

  • http://rachel.learnless.info/ Rachel

    Nice.. Great concept

  • http://sexidesign.com Melody

    Had comic sans, papyrus, and all those other commonly used fonts not been so used by “non-designers” I wonder if designers would even care so much.

  • http://99designs.com Jason Aiken

    Nice article – cheers!

    Jason

  • http://www.simonigomes.com Simoni Gomes

    Very good post! Call us for the details that make a difference!

  • http://www.alejandroperazzo.com Punta del Este Real Estate

    just in time

  • http://www.bertrandlirette.com Bertrand

    @Kyle @ Arlen : I think you missed the point here : this article wasn’t about telling you what is a good idea or not for this logo but more HOW to make a logo. Or make this anything design related. Things like “Think before you make something” or “don’t go with your personal taste”, etc.

    I think it’s one of the best article I’ve read in the last couple of days. Good job!

  • Kyle

    @ Bertrand

    I’m not saying it is or isn’t a good idea for this logo. I don’t care about the logo at all. I’m saying when designing a logo, you’ve got to consider a heck of a lot more that what’s above. It’s a disservice to make people believe that you can create a good logo in Microsoft Word with the right fonts and colors. Like Arlen reiterated (although I don’t agree with him about the gradients… Their coming back full force), Logotype design is all about spacing, tracking, kerning, ligatures, etc.

    I realize this post is aimed to web designers, being that this is a web design blog. So imagine if there was a post titled “Creating an organized user interface” and the body of the post just explained HTML tables.

  • http://www.justgraph.com MyLogo

    Good Article!

  • http://benthinkin.net/ Ben Gremillion

    While it’s true that the sample logo leaves room for improvement, it was meant as example of the process, not a photo-ready comp. Fact is, I spent more time developing the explanation than the imagery in this post. The original draft incorporated art, texture and the importance of testing at different sizes. But a comprehensive explanation of logo design would fill books. The process can be explained without delving into more specific techniques.

    The point is that good design uses chooses typefaces, colors and treatment for based on how they present whatever they represent. Craftsmanship is execution; thought process is problem-solving.

  • http://understandinggraphics.com/design/21-ways-lines-communicate/ Connie Malamed

    This is a good article and I think critics should realize the limitations of writing for the web. It’s assumed that one article can’t replace years of experience or volumes of books so it’s not necessary to say this every time you write a post. It’s pretty obvious. What these types of articles do (and I write many of them), I believe, is encourage people to do their own study and exploration by pointing them in the right direction. It’s often the tip of the iceberg. Now go discover the iceberg on your own kind of thing.

  • Rae

    you comment about looking at a word so long it starts to look funny, as though it’s spelled wrong, happens to me all the time! glad to know I’m not crazy!

  • http://www.ukpb.co.uk/ Buy My House

    Startling article thanks for sharing.

  • http://www.idsketch.com/ sticker printing

    Nice Designing and selecting fonts and coloring.

  • http://knowledgecity.com Jae Xavier

    L-O-L! I was laughing at parts of this article because it always happens to me:

    “The temporary letterhead created by the firm’s secretary is quickly rejected.”

    “If you work on a logotype long enough, you’ll reach a point when the word in the logotype starts to look funny. Something’s odd about the text. Has it always been spelled that way?”

    ‘If you’ve just noticed that it contains a peculiar combination of letters, then congratulations: you’ve stopped reading the words and started looking at the shapes of the letters.”

    Makes for good insider conversation.

  • http://www.blackartsstudio.com Dave Black

    Not a bad article, but there’s a little bit too much corporate wankery for me.

    “It must be easily recognizable. It should work at all sizes, including for business cards, letterheads and billboards. It should look professional.”

    Really? Professional, you say? What’s the alternative, do you usually design sloppy, shoddy unprofessional logos? And recognisable too – as opposed to instantly forgettable?

    There’s no point in stating the obvious. There’s nothing in the above description that would differentiate one client’s logo from any other’s – they’re all “professional” and “recognisable”, aren’t they? We’re designers. Are we making mission statements and action item lists, or are we creating something that doesn’t fit on a spreadsheet?

  • http://www.jasoncorns.com Jason

    I have never been a typophile, and I may never be; as such, designers can tell something is not quite “there” with my designs.

    I may never be a typophile, but articles like this may just help me bridge the gap. Thanks for the hard work.

  • http://www.bdirectory.og Andrew Pope

    Its been described Very Nicely But as Arlen said you need to introduce Pantone colours, the editor must also show some ideas of Pantone Colors as CMYK does not have many variations.

    • http://www.webdesignnet.co.uk Helmuts

      :D WOW :D

      no, this is too much :D

      cmyk is a colour model or combination of certain percentage of cyan, magenta, yellow and black

      cmyk has all the colour variations one would dream of…

      for example, you want to get metallic gold. in cmyk colour model – that could be c44 m47 y78 k20 (numbers stand for percentage of use of the colour)

      and now think – there are 4 basic colours, each has 100 variations… the number or probable colour variations is HUGE :)

      and all the logos have to be made in cmyk as sooner or later they will be printed, and you will want to see the precise colour of your logo in those printed materials…

      that’s it…

      Helmuts

      p.s. My experience about logos? I have more than 6 years professional digital printing (I am not talking about desktop printers) experience… and it always involves work with logos

      p.p.s. have to admit – I have created some shitty logos as well – everybody can make a mistake, especially if client likes the stuff :)

  • http://benthinkin.net/ Ben Gremillion

    @Arlen and @Andrew, I didn’t consider Pantone, RGB, RGBa or CSS3 opacity to be important issues for this article. Certainly they’re important for logo design. But my goal was to describe the thought process more than specific techniques. Using color in logo design for print, web or both would be an article unto itself. Maybe several.

    The thoughtful comments here, even the rebukes, illustrate my point: That one should make design decisions based on concept and experience. This article was a success because it prompted people to think.

  • http://www.webdesignnet.co.uk Helmuts

    sorry mate, most of your articles are great, but this one is a joke

    1) the final logo is something one would get out in ms word (i even would prefare to see the 1st logo presented by firm’s secretary without any added graphics)
    2) the essence of logo is hidden in creativity of an artist – there is no mathematics in that – it has to be unique
    3) the font has to be simple and readable in 2 seconds (max) – for example, your own logo is not made using thin and complicated fonts
    4) the design of can’t be started without knowing the style of the company itself

    I will stop here as there are many other aspects (no offence)

    good luck to You and keep posting :)
    Helmuts

    p.s. the power of logo is simplicity

    • http://benthinkin.net/ Ben Gremillion

      No offense taken :) but I didn’t intend for final logo here to be serious. There is no Smalls, Middleton & Bigman and there was only one round of revisions. I made it up to illustrate the article more than to craft a production-ready logo.

      The idea is that decisions about color, typeface, style and identity aren’t arbitrary. Your fourth point sums it up: A logo should reflect the nature or character of what it represents.

  • http://www.webdesignnet.co.uk Helmuts

    Here are some samples of a concept of the perfect logo

    1) simple (readable in 1-2 seconds)
    2) include a graphic element
    3) do not use more than 2 colours

    I would suggest to use CorelDraw for playing around with a font (like in the case of Microsoft).. at least I find it better than Illustrator though it has other strong sides.

    in coreldraw convert the basic text using 3 fonts Helvetica, Arial Bold and Verdana into curves (use Ctrl. + Q) and make it unique…

    This is a nice qute: “Make things as simple as possible, but not simpler” (Albert Einstein)

    good luck ;)

    p.s. some tip, I always try to imagine will this logo look good on a top of some building and / or on a car ;) that helps

  • http://www.webdesignnet.co.uk Helmuts