The Art of Logo

Since pre-Web times, a logo has been a piece of graphics and/or text used as a company's symbol---a corporate identity.  On the Web, logos play an even more vital role: They often serve as the main graphic heading---or a part thereof---on the page and, consequently, the visual center of the entire page design.

Big companies can afford placing attractive, frequently changing, eye-catching visuals on their pages.  These visuals play the role of cover photos in magazines: A magazine's logo or title is still there, set in traditional font and providing for easy identification, but what really stops your eye is that big juicy photo and other graphics arranged on the page. Throughout the magazine is the presence of the corporation.

On the Web, however, it is decidedly different from a magazine or other print media. For the majority of middle-sized businesses, temporary projects, personalities, and other beings deserving a web site of their own, a well crafted logo is the first and foremost place to show off the site creator's artistic skills.  Indeed, it's the quality of your graphics that many first-time visitors rely on to decide whether your page's worth delving a bit under the surface---and often the logo is literally the first piece of graphics they see.

The media, or the materials you work on in Part I include: Forms, Colours, Fonts, and Finishes. The abstract "tools," that is, concepts you apply to your media are: Proportions, Contrast, Repetition, and Nuances (variance).  These terms all emphasize and enhance the creation and development of a successful Logo Design which conveys an important message to the customer.

Forms 

The world we live in is primarily the world of forms.  Even if colour, lines, shades and surface textures were totally missing, the majority of objects around us would still be recognizable by their forms or shape.  So it is quite natural to appreciate the dominance demonstrated by shape in the recognition of a logo.

Often when you start a logo project you already have some clues about what real world objects it must allude to.  Say, an agricultural company may want to have a plant in its logo, a publishing house may want a book, and Apple Computers obviously wants an apple.  But it's not often as straightforward as this.  In fine arts, people are pleased by naturalness or natural-looking fantasies; in logos, they favor abstraction and simplicity.  Thus, in professional logos it usually requires some guesswork to realize how the shape relates to the main idea of the composition.

The term, "Abstract" means "purified, cleared of all non-essential components."  But it doesn't always mean "simple" and never means "boring."  Just a square or a circle won't do.  When working with shapes, you should strive to find an unusual view, a peculiar combination, or a strange rendering of basic forms.  It is perfect if, looking at your form, a viewer can see that it's built on a simple principle and at the same time realizes that it would be difficult to reproduce it, either by hand or on the computer.  For instance, the rule governing the density of the lines on FIG. 1 is fairly obvious, but it is not so obvious how to achieve similar results unless you know this particular trick.  This "know-how" is the hidden added value that arrests viewers' eyes even if they're not actually interested in the techniques used.

Logos begin by the designers’ playing with forms and making associations to the text or font.  For example, if a company named “Audio-Visual” required a logo design, then the letters “A” and “V” would figure prominantly in the overall design. Most computer drawing programs offer tools for making rectangles, polygons, and ellipses that are easy to manipulate and tweak and retain the accuracy of the form.  And in a surprising number of cases, these simplest forms are sufficient.  You may not even happen to employ straight lines or Bezier curves tools.

If you have a predefined idea to present in your logo (such as a plant or a book), start from trying to reproduce it with these geometric forms.  If you have none, just go wild and play with the forms as a child would play with paper and crayons.  A couple squares is a good starting point and then explore various relationships by moving, rotating, and resizing them.(FIG.2)  Soon a type of configuration presents itself for consideration.  The two squares, flattened to different levels show some kind of a spatial, 3D scene; they seem to point with their rightmost angles to a location that is somewhere in front of the plane of drawing.

In the example above (FIG.3) the aspect of 3 dimensionality comes through and provides a spark of inspiration upon which to build. By combining the two squares as shown on Fig. 3 brings the point of perspective to the surface of the drawing and greatly intensifies the impression of a 3D construction.  The next logical step miight be to add another square and to squeeze it even more (Fig. 4). This makes the appearance of a fan-like posy quite obvious and persuasive.

Once the abstract composition has acquired a third dimension and other real-world traits, it starts to matter where the top and the bottom are and how the gravity interacts with the thing.  Usually viewers tend to not trust artwork compositions that seem to ignore gravity too carelessly.  In our case gravity implies a lot since the bunch of squares we've created may be easily regarded as consequent "movie frames" of a flat square falling away from the eye.  By rotating the composition 90 degrees, it seems to sit upon itself and the issue of gravity and weight are apparently solved in terms of viewer perception. (FIG.5)

But there's something more to it.  In the world of forms, right-to-left occurs to be no less important than top-to-bottom.  Trained by years of reading, we tend to scan any graphic, especially if it contains text, from left to right and from top to bottom.  Our logo, too, has some preferred angular direction due to its asymmetry---but this direction is in conflict with our perception.  Looks like the thing is unstable, about to fall.  It creates a sense of direction that perhaps instills in the viewer the concept of forward motion---audio/visual (technological connotation, innovative thought, etc)

The letters themselves now almost appear in the imagery and lend themselves to the identity which is to be communicated. Is it only coincidence that the triangular forms mirror the triangular letter initials that are to be used in the name? The idea of a forward thinking company on the leading edge of technological advancement seems to come through quite clear in this example by noting the location of the “A and the “V”. Not quite. There are other considerations which need to be addressed as well; colour is one important example.

Colors 

Now that the form has been developed its time to give it some colour--and to discuss the role of color as a media in logo making.  Colour can play a decisive role towards completing the effectiveness of your Logo Design. It may present a psychological, emotional or symbolic meaning to the logo depending on the colours used. This is strong persuasion. A little understanding of colour associations might help in determining which of the millions of colour choices are available or necessary to the design. If your logo is intended for displaying on the Web, it is preferable to use the so-called browser safe palette to avoid dithering on 256 color monitors.

Apart from that, there are lots of other restrictions on the use of colors.  First of all, colors must not be many.  (There may be hundreds of in-between hues to demonstrate gradation-but primary colours are the most desired)  As with form, color solution of a logo favors reservedness and simplicity with due consideration for design principles.  Of course the overall impression is your ultimate criterion, but this simple approach will at least prevent you from doing many common mistakes  

Colour itself is decomposed along three axis: HSV, where H stands for Hue ( the colour itself-purity of colour), S stands for Saturation (the proportion of the pure colour) and V stands for value (greys plus colours-also called luminosity) or the overall brilliance of a colour. Most professionals deal with colours in terms of HSV; for example, most designers will divide colours into either warm (red, yellow, etc) or cool (blue, green, etc)hues. (FIG 7)

One more---and probably the most important---consideration is that colors should help express the logic of the form, not conflict with it.  For instance, if your logo represents a book, you can paint it all in one color (say, red), but you can't make the cover light yellow and the pages brown (i.e. darker), because this contradicts to our real-world experience saying that book pages are always at least as light---or lighter---than the cover.  In other words, you're welcome to transform the usual colors associated with objects, but you cannot totally disregard them.

 So, then, what about our sample logo?  What is the logic of its visual shape?  The three squares shown at different angles obviously represent three stages of a process, or three members of one sequence; it would be natural to paint them in three colors that, too, form an outspoken sequence.  In nature, of the three HSV parameters (hue, saturation, value) only the value, i.e. brightness, can serve as a base for forming such a sequence.  Indeed, one color may appear darker or lighter (e.g. depending on light conditions), but as soon as it changes its hue or saturation we most probably won't consider it the same color any more---the logic of transition will be broken. (FIG.8)

Fonts 

The only significant part that's now missing in our logo is the company's name.  To say the truth, it is rather unusual because typically textual part of the logo is given high priority and is designed at early stages when the main form is being chosen.  Often the form of letters in the company name, set in the chosen font, serves as the main graphic idea and defines the shape. Further modifications can only hope to strengthen the idea--and---the inclusion of text below the logo will cement the literal/visual message more concisely.

Fonts can be done using either upper case or lower case letters, depending on the type of message to be conveyed. In this instance the use of lower case letters, even in the first initials create a uniform rectangle which will not impede the simplicity of form and message. (FIG.9)

Why lowercase?  Simple: A mix of uppercase and lowercase would create an uneven "bounding box" for the text string, with the capitals breaking out of the top of the frame.  That's why the requirement of simplicity in logos definitely favors either all-lowercase or all-uppercase styles, and not a mix of the two.

Now let's choose a font for the title. In the world of fonts, one may give plenty of advice---and still give none at all.  The common knowledge about serif fonts being "old-fashioned" and "easy to read" and sans serif fonts being "modern" is correct but it says nothing.  You almost never know which font will look best in your case until you try and see for yourself.  The other way of putting this is that much more than one font is able to create a harmonic collocation with other components of the logo, provided you choose the right size and proportions of letters.

 Try to not to be too original and decorative.  Unusual script-like fonts may be way cool, but they require enormous amount of artistic skills and experience to inscribe them into a logo the right way.  I'd recommend that you choose one of the good old, time-proven typefaces such as Baskerville or Schoolbook.  Times is another common font type--it would be advisable to try a font type that is effective and yet not so widely used by others.

Finishes 

The term "finish" is an umbrella term for all that you do with your logo after you've finally decided that both the visual and the text are ready, sit in their proper places and have their proper colors.  Finishes include various decorations such as surface textures, drop shadows, highlights, gradients, transparency, etc. This category is, all in all, a sign of modern computerized technologies-and based on the almost limitless possibilities of effects which can be utilized in a design.

People generally believe that cool finishes is what makes their graphics professional.  Far from that.  Finishes may give, as the word implies, a finished appearance, but no amount of drop shadows will improve a logo which is designed poorly with regard to its shape or color.  Strictly speaking, finishes do not represent a separate media, so in applying them refer to all the principles outlined above.  One mustn’t spoil an effective design with a lot of superficial finishes which may tend to undermine the overall effect.

Note how the dot above the "i" comes close to the point where the squares' corners converge---but does not coincide with it.  One general form-related principle is that lines and points that come close enough tend to "snap" at each other in the urge to reduce the overall number of elements in the picture.  So let's move the text a bit so that the dot above "i" covers exactly the point of convergence.  Notice the A and the V separated by the lightning bolt or electronics symbol. (does the company idea become more apparent?) (FIG. 10)

Basically our logo is ready.  Other finishes that can be applied are something which can either improve or diminish the entire effect--try them but dont commit to a finish unless it absolutely improves the logo design overall.

The last word on finishes is that many of them look cool when you zoom into your logo full-screen, but turn into mud and scratches when the logo is reduced to the real-world size. This could minimize its effectiveness if used perhaps on a letterhead or envelope. A logo design must stand on its coherency of design and be able to withstand any changes in scale and still produce the desired effect.

Once a computer is employed in the modifications and final development of a logo, then the design becomes one that can be changed in terms of size, colour, finish, value or intensity with a minimal amount of effort. The logo communicates proudly the type of business, the style of the business and the perceptions involving the business in a clear concise manner. The message is simple; so simple in fact that once the idea of the actual name gets lost, the logo itself will continue to sell the company ideals.

Study Questions

KO-10

1. What can be determined about the company shown in the previous article? Discuss what the company is trying to sell, what its business is all about, and the type of company they want to project to the public from the logo design. Provide reasons for your answers.

2. How can colour affect the message that a logo design might want to convey. Provide three examples of particular colours and the message they portray.

3. Discuss each of the four Media used for the development of a logo design.

4. Discuss the abstract "tools," or concepts you apply to your media.

5. What are some ways in which modifications could be made for a logo design? Explain the various changes one could employ.

6. What are some examples of a ‘finish’ effect?

TO-10

7. What are the definite advantages to creating and developing a logo on a computer? What are some of the advantages to creating and developing a logo using pen and paper? Which provides the best possible solution to proces, and which provides the best solution to the aspect of product? Explain your answer.

CO-10 AO-10

8. Create a logo based for your pinhole camera. All consideration discussed in the previous article should be fully utilized in the develoipment of your logo design. Finally, provide a brief explanation of how your logo works and your choices of form, colour, etc.