Category: Principles and Elements


Click on image to see other great movie posters

Good design means as little design as possible. If you can remove an element within a design and that design still works, then you’ve practiced economy in design. There are no rules for using economy, if an element works in the composition with respect to the whole design, it should be kept. If it distracts from the desired effect, it should be re-evaluated for its purpose.

Graphic design is for identification, information, presentation and promotion. Economy of design furthers the concept of telling a short story with images. Everything needs to justify its continued existence. If you wish to retain something for the sake of tradition let that be a conscious decision.

This is a key goal in the case of user interfaces as economy breeds simplicity. Taking away from an interface means that there is less for a user to understand. Simplicity does not mean simplistic solutions, lack of functionality or limited information

“Simplicity is the ultimate sophistication.” – Leonardo Da Vinci.

Below are some logos that I have gathered which show economy in design.

For some more opinions on Economy and Simplicity, visit the following sites;

‘In Om we have no word for slave,’ said Vorbis.
‘So I understand,’ said the Tyrant. ‘I imagine that fish have no word for water.’
— Terry Pratchett – ‘Small Gods’.

You can’t name a thing that could not be contrasted to some other thing based on any of its aspects: color, size, shape, font, texture, etc. A word does not need to be created for a state of being that has no opposite. Up – Down. Light – Dark. Alive – Dead.

This artist goes by the name Nebezial

Contrast occurs when two elements are different. The greater the difference the greater the contrast. The key to working with contrast is to make sure the differences are obvious. Four common methods of creating contrast are by using differences in size, value, color, and type.

Contrast in design is an accentuation of the differences between elements in a design. Most people think of contrast only as it applies to colors, but contrast can work with any design element. For example, if you have a group of lines that are all the same size, there is no contrast. But if one is a lot longer than the others, it contrasts with them.

If all the art elements are the same, the result is monotonous and unexciting. Contrast aids in readability by making headlines and subheadings stand out. Contrast shows what is important by making smaller or lighter elements recede on the page to allow other elements to take center stage.

Contrast is most effective when it is strong; the focal point of a design is usually a result of contrast where the eyes will naturally be drawn. It is important to remember that an ineffective use of contrast may result in confusion.

Below I have posted logos that I have found that have strong contrast.

For more information and opinions on the use f contrast in design check out the following sites;

Variety provides contrast to harmony and unity and consists of the differences in objects that add interest to a visual image. Variety can be achieved by using opposites or strong contrasts, changing the size, point of view, and angle of a single object can or breaking a repeating pattern can enliven a visual image.

In the Valley - Jasper F. Cropsey

By varying the components of a visual design, the artist creates interest and avoids monotony. A way of accomplishing this is to establish an approach which involves theme and variations-repeating the same image, but in different sizes, colors, values and shapes. Variety is the complement to unity and is needed to create visual interest. Without unity, an image is chaotic and “unreadable;” without variety it is dull and uninteresting. In Cropsey’s painting on the left, ‘In the Valley’, the large tree creates a variety in contrast to the architecture in the distance, creating a visually pleasing image.

Good design is achieved through the balance of unity and variety; the elements need to be alike enough so we perceive them as belonging together and different enough to be interesting. An effective way to integrate unity and variety is by creating variations on a theme. Just as a composer can repeat and vary a musical theme throughout a composition, a designer can repeat and vary an element throughout a design.

Below is some work from other designers that shows the use of variety –

Some more information on variety can be found at the following sites;

Unity discusses the need to tie the various elements of a work of art together. A unified work of art represents first a whole, then the sum of its parts. When all the elements in a work look as though they belong together, the artist has achieved unity.

You know unity has been achieved when all aspects of the design complement one another rather than compete for attention. All of the design principles (balance, movement, emphasis, visual economy, contrast, proportion and space) have been correctly applied. Everything selected for use in a composition must complement the key theme and must also serve some functional purpose within the design.

American Gothic

Unity can be achieved through the use of;

  • Similarity of shape, colour, line, ect
  • Proximity
  • Repetition
  • Alignment
  • Continuation
  • Consistent use of graphic elements

When unity is achieved:

  • The individual elements with in a composition will not be competing for attention.
  • The key theme will be communicated more clearly.
  • The design will evoke a sense of completeness and organization.
  • When nothing can distract from the whole you have unity.

The well-known painting “American Gothic” shows unity in its repeditive use of elongated curves and similar colours.

Unity in composition is hard to achieve, but below are a couple of logo whose designers at least came close.

More info on unity in art can be found as these sites;

A visual representation of human needs.

Maslow’s hierarchy of needs refers to what people need to survive and be happy. They are listed in order of importance and having any of them is irrelevant unless you have all the predeceasing needs. Maslow’s hierarchy of needs is most often displayed as a pyramid,  (like the one on the left). The lowest levels of the pyramid are made up of the most basic needs, while the more complex needs are located at the top of the pyramid. Needs at the bottom of the pyramid are basic physical requirements including the need for food, water, sleep and warmth. Once these lower-level needs have been met, people can move on to the next level of needs, which are for safety and security. As people progress up the pyramid, needs become increasingly psychological and social. Soon, the need for love, friendship and intimacy become important. Further up the pyramid, the need for personal esteem and feelings of accomplishment take priority.

When it comes to design, the hierarchy of needs is quite different but, just like Maslow’s, they still need to be met in order. That order is;

Functionality – The most basic of needs. If a design does not achieve its intended function, then it doesn’t matter if it meets every other need in this list, it’s still a failure.

Reliability – Once a design meets its function, it needs to be able to continue to do this consistently through its lifespan. It should function the same way every time it is used.

Usability – We now move into the less important needs of a design. Usability refers to how easy a product is to use and how forgiving the design is towards the user. This is an important need of design, but if you have to sacrifice usability to achieve the previous two needs, then the users can get past this.

Proficiency – If your design allows people to do things better than they could before then you have achieved proficiency. Proficiency is a great selling point for a product and people will favour any product that can delivery this.

Creativity – The last and hardest need to achieve. Creativity can only be brought in if all other needs are met. The design has reached a level where user can interact, bringing their own skills and ideas into the use of a product.

The flats of London

In London, England in an attempt to solve the housing problem local councils built up buildings that came to be known as council flats. Citizens suffering financial hardships were delegated a flat and lived with the council as the landlord.

The problem with this solution was that only architecture, money and space were taken into consideration when designing the flats. Politicians believed that people would acclimatize themselves with life in these flats. But, as the hierarchy of needs was not considered, life inside these flats is hard and depressing.

The flats achieve their function and provide the basic physical requirements. Only the bottom layer of both ‘needs pyramids’ have been met. They do not feel safe or secure, nor give the residences a feeling of belonging, as they don’t actually own the place where they live. The reliability and usability are terrible as the flats are poorly made and maintained. None of the other needs can even be discussed in relation to these buildings.

Further information on these topics can be found at these sites;

Below are my attempts at creating a logo using the different laws of gestalt. Except for the last image which was something made during a class exercise.

The different laws of gestalt

Gestalt is the phenomena of seeing objects as a whole rather than individual elements. Gestalt is a German word that roughly translates as “whole” or “form.” It refers to theories of visual perception developed by German psychologists in the 1920s. These theories attempt to describe how people tend to organize visual elements into groups or unified wholes when certain principles are applied. The human mind is quite adept at finding patterns and forms with very little stimuli.

The visual world is so complex that the mind has developed strategies for coping with the confusion. The mind tries to find the simplest solution to a problem. One of the ways it does this is to form groups of items that have certain characteristics in common.

The aspects of gestalt theory that interests designers are related to gestalt’s investigations of visual perception, principally the relationship between the parts and the whole of visual experience. Gestalt can be broken down into five basic principles.

Two groups of buttons

The gap makes us see two objects

Proximity – When elements are placed close together. They tend to be perceived as a group. There is a limit to the amount of information that the mind can keep track of. When the amount of visual information becomes too great the mind tries to simplify by grouping. The general concept for proximity states that the closer items are to one another, the more likely they are to be seen as a group. When items get close enough they touch. They still are two different items but they seem to be attached together.

Four lines seen as one object

The car stands out because of the similarity of the other objects

The car is an anomaly

Similarity – When objects look similar to one another. People often perceive them as a group or pattern. When similarity occurs, an object can be emphasised if it is dissimilar to the others. This is called anomaly.

Similarity is a powerful grouping concept and as such can contribute significantly towards achieving unity. The more alike the items are, the more likely they are to form groups. The three main ways to create similarity are size, colour and shape. These and other similarity types are used extensively in design to create order and to organize information into specific groups in order to make the material presented more understandable.

They have not drawn a figure.

The figure is 'One'

Figure-Ground – This is the most abundantly used law of gestalt. Edgar Rubin, a Danish psychologist, was the first to systematically investigate the figure-ground phenomenon. The eye differentiates an object form its surrounding area. a form, silhouette, or shape is naturally perceived as figure (object), while the surrounding area is perceived as ground (background). Balancing figure and ground can make the perceived image more clear.

A simple composition may have only one figure. In a complex composition there will be several things to notice. As we look from one to another they each become figure in turn. As our attention shifts, the ground also shifts so that an object can go from figure to ground and then back. Ground is sometimes thought of as background or negative space.

We put in the last few lines.

There is neither a 'r' or a 'b'.

Closure – The law of closure posits that we perceptually close up, or complete, objects that are not, in fact, complete. This can involve the brain’s provision of missing details thought to be a part of a potential pattern, or, once closure is achieved, the elimination of details unnecessary to establish a pattern match.

Closure occurs when elements in a composition are aligned in such a way that the viewer perceives that the information could be connected. Imaginary lines called vectors, or shapes called counter forms, are generated by these relationships, which the eye understands as part of the composition even though there is “nothing there. Counter forms, (or negative spaces), determine to a great extent whether or not the composition will be perceived as a harmonious whole. Counter forms echo the positive visual elements with similarity, or create powerful substructures that support and connect visible elements.

3 lines, 3 letter, 5 shapes

Attempting movement

Continuity – When the eye is compelled to move through one object and continue to another object. The edge of one shape will continue into the space and meet up with other shapes or the edge of the picture plane. Continuity in the form of a line, an edge, or a direction from one form to another creates a fluid connection among compositional parts.

Seeing things as whole lines (sequential) is clearly important. But ‘being in wholes means’ that few interruptions change the reading of the whole. One of the best examples of continuity is the cross, which we see as one object rather than four connecting lines.

You can read more on the laws of gestalt at the following sites;

Rhythm is created when one or more elements of design are used repeatedly to create a feeling of organized movement. Variety is essential to keep rhythm exciting and active, and moving the viewer around the artwork. Rhythm creates a mood like music or dancing. It can be created by the use of repetition – the regular or harmonious recurrence of elements, progression – a sequence or transition produced by increasing or decreasing one or more qualities, and contrast – deliberate placement of elements to create opposition by abrupt transition rather than gradual.

Rhythm of Black Lines by Piet Mondrian

Rhythm allows your designs to develop an internal consistency that makes it easier for your customers to understand. Once the brain recognizes the pattern in the rhythm it can relax and understand the whole design. Repetition rarely occurs on its own and so it embues a sense of order onto the design. And because of this, repetition attracts attention and prompts customers to investigate further.

Rhythm depends largely upon the elements of pattern and movement to achieve its effects. The parallels between rhythm in sound/ music are very exact to the idea of rhythm in a visual composition. The difference is that the timed “beat” is sensed by the eyes rather than the ears. Visual rhythm may be best understood by relating it to rhythm in sound. This link will take you to a video clip and explanation of how the sound of a Nigerian “talking drum” follows the intonation and rhythm of speech.

To be effective, rhythm also requires some variability – rhythm that is too similar or perfect may be boring. Therefore when composing your images look for repetition with variation.

For other views on rhythm follows these links;

Most people would be put off

The definition of visceral is the instant response people have to stimuli. The thoughts they have before they have any thoughts.

Bernini's 'Apollo and Daphne'

Take this image to the left. Most people would see this and start to choke on imaginary hairs. I personally think it works better on people who drink tea/coffee. Since I don’t, this image brings up the thoughts of being warm and comfy. But is this my visceral or reflective response?

Visceral responses are meant to be universal. In other words, for the above image to be truly effective  it should elicit the same response from people who have never seen a teacup before, and that might not be the case.

Something that is universally known is the human form, which is why ‘Apollo and Daphne’ by Bernini might better fit into the visceral definition. The two figures appear playful and free. These thoughts would come to even those who might find the imagery offensive. Without going into it to deeply, any offence elicited by this sculpture would be based on learnt cultural ideals, and would only come to mind upon reflection.

Damien Hirst's 'Virgin Mother'

Of course some artist have set out to shock and offend. Take Damien Hirst’s sculpture ‘Virgin Mother’. Here we see one of the most globally revered images, a pregnant women, mixed with the horrific image of a person being stripped of their skin and then their flesh. The medical imagery wouldn’t be as disturbing if not attached to the idea of a pregnant women.

Sidewalk art in Chalk

Not all visceral art needs to be shocking. The sidewalk art on the right would make anyone disoriented and slighty confused, even if they were visiting the city from the middle of a rainforest. Visceral responses are based on the whole gambit of human emotions. Artwork can be inviting, confronting, relaxing, arousing or have any one of a thousand other reactions.

A table from Ikea

Clean and Sharp

The idea of visceral is not only used in art. Product design of all types use make use of visceral responses. The table on the left comes from Ikea and is designed to appeal to young children. The bright colours and rounded edges make it look fun and a little silly, coming off as almost a cartoon of a table. This is opposed to the desk lamp on the right. It looks clean and upmarket to appeal to a more stylist minded consumer.

Many designs not only use the visceral concepts, but they rely on it. Check out the game covers below.

Dangerous

Confronting

Arousing

Taste with your eyes

Comfort Food

And of course food works on our visceral…

Even television and movies use visceral responses. Anyone who can read english would feel the same confusion as the character in the image below.

A scene from Robot Chicken

Repeating visual elements such as line, color, shape, texture, value or image tends to unify the total effect of a work of art as well as create rhythm. Repetition can take the form of an exact duplication, a near duplication, or duplication with variety.

A Pop Art portrait of Marylin Monroe

Repetitive elements throughout a design piece can be used to enhance and clarify information. Repetition adds visual interest to your design, and helps to identify elements that belong together. It can be considered a way of adding consistency to your design. The consistent repetition of graphic elements works to create visual unity. Sometimes repetitive elements are not identical in appearance but are in fact so similar that their connection is clear.

Repetition is an inevitable design principle. If no elements in a design are repeated it typically lacks a unified and cohesive feel. What if Stop signs came in pink squares, yellow circles, or green triangles, depending on the changing whims of a town and a few of its residents? Imagine the ensuing traffic jams and accidents. Repeating design elements and consistent use of type and graphics styles within a document shows a reader where to go and helps them navigate your designs and layouts safely. This principle is fundamental to the design and implementation of effective interfaces.

The use of repetition to create movement occurs when elements which have something in common are repeated regularly or irregularly sometimes creating a visual rhythm. By arranging the composition elements in a certain way, an artist controls and forces the movement of the viewer’s eyes in and around the composition.

Excessive repetition (monotony) may lead to boredom and uninteresting compositions. If one cannot avoid excessive repetitions for any reason, do not forget to add some visual breaks and white spaces where eyes can rest for a while.

Note how the designers have used repetition in these logos;

The following site have some interesting things to say about repetition;