Use of Colors and Visual Elements

Blog Introduction

Certain designs seize people’s sights and attention more easily, while others don’t. Sometime people leave their opinion about like or dislike of the design, it is very easy to state whether they like it or they don’t like it, but if they were to answer the question why exactly they like and don’t like the design, then it is quite difficult to find out the reason.
I have made some research on this and found out the reason behind people opinion about their likes or dislikes, although there are many reasons involved for a person to actually like or dislike the design, I focused on two factors which is the use of colors and visual elements.
I have analyzed thoroughly these two factors and made some unexpected findings. I will describe in details about these 2 factors in two parts, first the use of colors and followed by use of visual elements.

Use of Colors

Introduction

Unarguably one of the most important aspects of any kind of design is the colors. There are infinite numbers of color exist in this world, they are never ending choices of color for you to choose from to use in your designs. Color is a very powerful tool to send an intended message to the public who sees the design. By using different color, a designer can express different kind of emotions, express the purpose of the design, even to the extent of expressing movements (Noack, 2010).

Color Terminologies

We have learned about basics colors in primary school, let’s quickly review them for a better understanding on colors. We have to go back to the basic to really grasp the concept of color.

From the above color wheel we can see that colors are separated into 3 main groups, which are the primary, secondary and tertiary.

Primary colors              : The 3 main colors red, blue and yellow make up the primary color group. These 3 colors are the base colors that make up all the other color on the color wheel (Noack, 2010).

Secondary colors          : Mix red, blue and yellow, the primary colors together (2 at a time) and you will get secondary colors, which are orange, green and purple (Noack, 2010).

Tertiary colors               : Mix a primary color and a secondary color and you will end up with tertiary colors such as yellow-green and blue-green, etc (Noack, 2010).

Relationships of Colors

There are plenty of combinations of color that go well with each other. Most common known combinations are complimentary colors and analogous colors. By using these combinations of colors, a design will appear to be more likable when viewed.

Complimentary colors : They are located opposite of each other on the color wheel and complement each other very well. Colors such as orange and blue, green and red, and yellow and purple are considered complimentary colors (Noack, 2010).

Analogous colors        : They are located right next to each other on the color wheel and therefore produce an overall pleasing look but they provide little contrast when they are used together. Example of an analogous color would be blue, blue-green and green (Noack, 2010).

Color Groups Based on Emotion

With all the basic knowledge that are listed above, we can get a better grasp on usage of colors in designs. As stated above, colors can be used to associate with emotions. Colors that can express emotion are categorized into 3 groups which are warm, cool and neutral.

Warm colors      : Evoke the feeling of warmth, like the color orange, red and yellow (Noack, 2010).

Cool colors        : Give the feeling of cool and chilly like the color green, purple and blue                             (Noack, 2010).

Neutral colors    : Just as the word ‘neutral’ suggests, colors in this group don’t really evoke any       emotions like the color brown and grey (Noack, 2010).

What Colors Means

Usually people don’t really care the meaning of colors, and even if they know they only know the positive meaning of the color, they don’t realize that each and every color can be used in a positive or in a negative way. Which manner the color is conveyed depends on how the colors are used and the colors surrounding it.
Here are some of the popular colors and its positive and negative meanings.

RED

Positive connotations    : Red symbolizes fire and power, commonly associated with passion, aggression, courage and importance. Red also can be used to stimulate excitement and energy (Noack, 2010).

Negative connotations  : Red symbolizes rage, anger and emergency, which derives from the aggressive and passionate quality of red (Noack, 2010).

ORANGE

Positive connotations    : Orange symbolizes sunshine, joy and also happiness. Orange is a very cheerful color, evoking childlike exuberance (Noack, 2010).

Negative connotations  : Orange symbolizes deceit and ignorance. Orange is not aggressive as red but have similar qualities as red, stimulate mental activity (Noack, 2010).

YELLOW

Positive connotations    : Yellow is a happy color, it symbolizes qualities such as optimism, joy, energy, brightness, intelligence and happiness (Noack, 2010).

Negative connotations  : Yellow symbolizes feelings such as laziness, jealousy, criticism and caution (Noack, 2010).

GREEN

Positive connotations    : Green symbolizes nature and has a soothing feeling. Green also used symbolizes harmony and growth, green gives out feeling of safe
(Noack, 2010).

Negative connotations  : Green symbolizes money, represent jealousy and greed. Green also symbolizes a beginner (in need of growth) (Noack, 2010).

BLUE

Positive connotations    : Blue symbolizes peace and calm, and also used to symbolize dependability and trust (Noack, 2010).

Negative connotations  : Blue symbolizes passiveness, coldness and depression (Noack, 2010).

PURPLE

Positive annotations       : Purple symbolizes sophistication and royalty, giving out the feeling of wealth and luxury. Purple also symbolizes creativity and spirituality
(Noack, 2010).

Negative annotations    : Purple symbolize gloominess and sadness (Noack, 2010).

BLACK

Positive annotations       : Black symbolizes elegance, depth, sophistication and power. Even though black is not part of color wheel but it still can be used to express emotions and meanings (Noack, 2010).

Negative annotations    : Black symbolizes mystery, death and the unknown. Black commonly used to symbolize grief, sorrow and mourning (Noack, 2010).

WHITE

Positive connotations    : White symbolizes innocence and purity.  White also symbolizes safety and cleanliness. White is the same as black, they are both not part of the color wheel but still can be used to express emotions and meanings (Noack, 2010).

Negative connotations  : White symbolizes cold and distant (Noack, 2010).

Conclusion and Lesson Learnt

Colors is a very powerful tool, it can be used to convey messages without the use of descriptive words. Colors create impacts whether it was intended or not. Colors able to evoke the viewer’s emotions, different colors evoke different emotions. With the the knowledge of color and what I have learned, I can now analyse a design of websites of popular companies.
Big companies use this to their advantage, for example this Nike website.

The website is black in color, symbolizing power in the products their trying to sell, creating an impression that they sell quality elegant products.

Another example is this Best Buy website.

The blue color shows that they are stable in the market, its also gives the secure feeling to the buyers. The yellow obviously symbolize happiness, shows that people are joyful and excited to make purchase.

Use of Visual Elements

Introduction

Now that we have in depth knowledge on the use of color, its now time to turn our attention to another factor which is the use of visual elements. Visual elements have no less importance than colors.There are few elements comes under visual elements, in fact color is one of the elements and all of the elements have huge impacts on the designs. These elements exists in every design no matter it was intended or not, we recognize and utilize these elements unconsciously without even knowing its significance.

Visual elements

There are a total of 6 elements that I have identified through series of research. The 6 elements are

1.   Line
2. Shape
3. Form
4. Texture
5.  Pattern
6.  Color

LINE

The most influential and most important out of all the elements is the line. A line is what starts it all, the reason behind a design can be done in the first place. If there is no line, there is no shape; if there is no shape, there is no form; if there is no form, there is no texture; if there is no texture, there is no pattern. Line can be used smartly to direct the viewer to whichever point we want the viewer to pay more attention to, line also able to alter the mood of a design. 

There many elements of lines.

1. Lines can be either horizontal, vertical or diagonal (Eftaiha, 2010).
2. Lines can be either jagged or curved (Eftaiha, 2010).
3. Lines can be either thick or thin (Eftaiha, 2010).

Each elements of line have their own purpose and meanings.

Thin lines           : Perceived as unstable, sometimes vulnerable (Eftaiha, 2010).
Thick lines         : Perceived as dependable and rigid, sometimes as stern and dominating
                            (Eftaiha, 2010).

Curved lines      : Perceived as relaxing, soft, soothing and settling (Eftaiha, 2010).
Jagged lines       : Perceived as chaotic, forceful, threatening and sharp (Eftaiha, 2010).

Vertical lines      : Perceived as growth, strength and power (Eftaiha, 2010).
Horizontal lines  : Perceived as restfulness, stability and permanency (Eftaiha, 2010).
Diagonal lines    : Perceived as action and render design as dynamic (Eftaiha, 2010).

For example of usage of line in design, there are some picture that shows the influence of the line.

Here we can see that the tree is vertical, it can be considered as a vertical line. When we see the tree we can feel the feeling of growth which was intended. The pole as well is considered as vertical lines, this time it gives off the feeling of power and strength.
Horizontal lines also can be seen, the asphalt road is considered as horizontal lines, it gives off the feeling of permanency, it gives off a feeling that the road is permanent, never ending.

Another example of influence of line in a picture.

In this picture, rather than a horizontal and vertical lines, the diagonal lines have a bigger influence. As we can see the picture is diagonal, the usage of diagonal lines made the picture dynamic and interesting. It also conveys a sense of action, it directs the attention of the viewer to the main subject of the picture.

SHAPE

As stated before a shape can only be formed with the existence of lines, a shape is formed when the head of a line meets the end of the line, shapes are usually 2 dimensional with recognizable boundary. As the elements before it, each shape have their own meaning.

Circle                    : Implies eternity and completeness (Eftaiha, 2010).
Square                  : Implies peacefulness, solidity, security and conformity (Eftaiha, 2010).
Triangle                 : Implies progression, purpose and direction (Eftaiha, 2010).
Rectangle              : Implies solidity, security and peacefulness (same as square) (Eftaiha, 2010).

Example of influence of shape in a design.

Shapes in designs can be seen as silhouettes. Silhouettes are the purest and strongest of all shapes that are most commonly used in designing. This is a shot several minutes before the sunset as well as several minutes before the sunrise. These two creates a silhouette that we can see clearly here, the human sitting in front of the lake. The shape gives us the feeling that the world is wonderful and are so beautiful.

FORM

Form is a 3 dimensional shape, and best highlighted by lighting from the side since it will create a soft and elegant shadow. The difference between the light and shadows will give the impression of 3 dimension (Eftaiha, 2010).

Example of influence of form in a design.

As we can see the form is being the car, the lighting from the side creates a soft shadow. The different between the shadow and lighting creates a great illustration as seen above.

TEXTURE

 Texture is the perceive surface quality of a design.  It is an element of two-dimensional and three-dimensional design and is distinguished by its perceived visual and physical properties. This elements can make the viewer feel as if they touched the design and feel the roughness or softness of the design. Texture is capable of moving deep emotion of the viewer (Eftaiha, 2010).

Example of influence of texture in a design.

There is no explanations needed for this image, the texture of the door is so clearly shown here that the viewer can almost feel the roughness of the door. The overhead lighting adds more interest, reality and depth to the picture. With the correct use of texture, picture may seem as if its alive and create an emotion filing design.

PATTERN

Pattern is the design or way that shapes and objects are put together to form a composition. Pattern basically exist everywhere. There are 2 techniques involve in using pattern in designs, emphasizing and breaking.
Emphasizing a pattern can highlight a sense of size and expansion (Eftaiha, 2010).
Breaking a pattern is disrupting the continuous flow of a pattern (Eftaiha, 2010).

Example of influence of pattern in design

This an example of the emphasizing pattern method. The frame is filled with the zoomed in pattern of the plants. The pattern is repetitive and flowing uninterruptedly.

This is an example of the breaking pattern method. The frame is filled with the zoomed in pattern of the fence but the pattern’s flow is broken by the string and the stump.

COLORS

This element have been discussed and explained in details in the previous part. Colors can be used to express emotion and each of the colors have their own meanings.

This is a color wheel, as explained in previous part, the color wheel can be categorized into 3 groups, which are the primary color, secondary color and the tertiary color (Eftaiha, 2010).

Example of influence of color in design

The color used in this picture goes together very well, they compliment each other very well. The beer is known for the best beverage drank throughout the world for the purpose of to unwind and relax. By using green color in this picture gives off a soothing feeling which was intended.

Conclusion and Lesson Learnt

These 6 visual elements is the most basic element of any design, and it have a very huge impact on the design. With clever usage of these elements can create a impressive design which reaches out to touch people’s heart.With the understanding of how they complement each other , how they affect each other creating an impressive design is very doable.

This is an amazing design done with the full understanding of the visual elements. With the understanding of the visual elements and from what I have learned, I am now able to analyse the picture below.

The color used here complement each other so well, the white color gives of the feeling purity and also the feeling of cold and distant. The diagonal line used here the give the sense of action and create a more dynamic feeling. The emphasizing pattern method is used here, the frame is full with the tree and the flow of the pattern is uninterrupted. The other elements are used as well but they are subtle, but they still have an impact on the design, for instance texture, the roughness of the branches can be felt by looking at the picture.

Blog Conclusion

Before this, when I was looking at a design, I couldn't explain the feelings it makes me feel, I couldn't understand why did I like or dislike a design, it never crossed my minds that the colors and the visual elements used in the designs is the one making me feel all those feelings.I never even stopped and wonder what these colors, lines , patterns, forms, shape and the texture in the design meant, but now I learned a lot. I am even able to analyze a design and why that particular elements were used and also what is the meaning intended to be conveyed. It is important for a full understanding of these elements to design a impressive designs, they are the building blocks for a design, by using these elements smartly will make a design far more impressive and purposeful.

References
1. Eftaiha, D., 2010. 6 Elements of Design for Striking Photographs ,[online] Available at: <http://photo.tutsplus.com/tutorials/photography-fundamentals/6-elements-of-design-for-striking-photographs/>[Accessed 23rd September 2013]

2. Noack, S., 2010. A Look into Color Theory in Web Design ,[online] Available at: <http://sixrevisions.com/web_design/a-look-into-color-theory-in-web-design/>[Accessed 23rd September 2013]