signal-bg Design with colors. The primary knowledge at glance. Part One

Tuesday    |    27.09.16    |    Art & Design

Design with colors. The primary knowledge at glance. Part One

In the first chapter of the color blogs we will point out the main aspects you need to know in order to make an informed design decision about colors and achieve the desired look.

COLOR PROPERTIES
You need to distinguish terms like hue, saturation, contrast, tone, shade, tint etc. The properties that help us to define the colour are Hue, Saturation and Brightness. The Hue refers to the primary colour and is to be found on the colour wheel in certain degrees. The Saturation represents the intensity of the colour and is measured in percentage from 0 to 100% - from grey to color. The Brightness is defined form 0 to 100% as 100% is the full colour and 0% is black colour.




COLOR WHEEL
The color wheel is an important instrument for designers. It helps them choose the colours in pleasing relationship using the following systems
Complimentary Colors - opposite to each other
Analogous Colors - adjacent to each other
Triadic Colors - three colours positioned at 120 degrees on the wheel from each other

Compound Colors - color scheme is a variation of the complementary color scheme. In addition to the base color, it uses the two "Analogous" colors adjacent to its complement.

Adobe has a free online tool you can use to choose your colors in harmony - Adobe Kuler

COLOR MIXING
There are two primary color systems methods used to reproduce other colors.
Additive colors are reproduced through anything that emits light from the primary colours Red, Green, Blue - RGB. The mixture of different wavelengths of light creates different colours, and the more light you add, the brighter and lighter the colour becomes. White is the combination of colour, while black is the absence of colour. This is the system used for Screen Graphics

Subtractive (Reflective) colors are produced on the basis of reflective light. The particular hue produced from this system depends on the way the pigment reflects the wavelengths. The primary colors used here are Cyan, Magenta,Yellow (CMY). In subtractive color white is the absence of colour, while black is the combination of color. Because the reflection of the light beams is not always possible there is a compensating black pigment added to the system called ‘Key’ becoming CMYK. This is the system used for Print Graphics.

You can learn more practical skills HERE



COLOR MATCHING, COLOR LIBRARIES
The appearance of the colors on different platforms changes depending on the material of the surface and the ambient light . For example the blue color will vary on different screens, on different paper for print, on textile or plastic. It will change hues if you have artificial light or sun light.
In order to match the color for different surfaces you need to set a colour code for the appropriate systems naming:
RGB - for screen. When you choose your RGB color you need to consider the Color Space Profile & use calibrated monitor!
CMYK - for printing full colour. When you convert your graphic to CMYK color you might see difference in the look on the screen but don't worry this is normal! When printed the color will look just fine!
Pantone Coated Spot colour - for printing vector graphics on coated paper. When choosing the correct Pantone color you need to take for reference printed color libraries. Find more information HERE
Panton Textile - for printing vector graphics on fabrics. You can choose the correct color only using printed library. Find more information HERE
RAL - for plastic or powder coating. You can choose the correct color only using printed library. Find more information HERE

IMPORTANT!
If you choose a color for print you need to make a reference on printed colour libraries! If you choose a colour for screen you need to use calibrated screen.

Here we have given an example with the corporate blue of Signal Labels. We have adjusted our blue to appear with maximum similarity used for different purposes.

COLOR PERCEPTION
Same palette of colors used in different combination can change the perception of the color and the size of the shape.
It is worth exploring the combination of the hues in different situation as did Josef Albers. He created a series of color studies that showed how colors change each other’s effects just by proximity. HERE you can find more form Albers' book.
It is amazing how our brain perceives differently same colors just placed on different backgrounds.

The size of all boxes is completely the same. But do they look the same size?





USEFUL LINKS

http://www.design-seeds.com/
https://color.adobe.com/create/color-wheel
https://itunes.apple.com/us/app/interaction-color-by-josef/id664296461?mt=8
http://www.mypantone.info/
http://www.pantone.com/pages/pantone/index.aspx
http://www.pantone.com/graphics?from=topNav
http://www.ralcolor.com/
http://trycolors.com/

back