vsd colour en

7/31/2019 VSD Colour En

1/36

Visual Screen Design

Colour

"I found I could say things with color and shape that Icouldnt say any other way things I had no words for.

Georgia OKeeffe

[email protected]

@mastermiel


2/36

Colour - Subtractive colourmixing

The subtractive term comes from the Latin Subtraheremeans "subtract", which in this form of color mixingoccurs. We start with white and pulling it from primarycolors.

Subtractive color mixing resulting from selective absorptionof the white light through one or more different dyes. Thesedyes can be mixed in as small particles (such as for paint or

ink), or they may be, in successive transparent layers (as infilters for example for stage lamps). The blend color isalways darker than the darkest color source.


3/36

Colour - Additive colourmixing

The term additive comes from adding, which is done in thisform of color mixing. We start with no light (black), and

apply light with certain colors to it.

Additive color mixing is used, in display devices, whereineach of the three light sources is formed by a single light

point, a pixel. The eye combines these sources.


4/36


5/36

Subtractive Additive

Colour - Subtractief vs additief


6/36

Colour - colourmodel RGB

Primairy Colour Red Green - Blue


7/36

Colour - colourmodel CMYK

Primairy Colour Cyan Magenta - Yellow


8/36

Colour - Notation

RGB: Red Green and Blue have a value from 0 to 255. This

is when 0 is no color added to the value 255, the color isfully present. (additive)

Use this format when designing for displays.


9/36

Colour - Notation

CMYK: Cyan, Magenta, Yellow and Kali have a value from

0% to 100%. This is the value at 0% no color added, at avalue of 100% is the color fully present. (subtractive)

Use this format when designing for print.


10/36

Colour - Notation

Hexadecimaal: RGB values are each converted intohexadecimal (16 digits) numbers. Hexadecimal codes are

composed of the digits 0 through 9 and the letters Athrough F.

Use this format when designing for HTML / CSS.

# rrggbb


11/36

Colour - Notation

HSB: Hue, Saturation, Brighness. The HSB value indicateswhere a color in the Colour Spectrum is.

The Hue is displayed in 0 to 360 degrees (circle).

The Saturation we give in percentage 100% = fullysaturated.

The Brightness we also in percentages.


12/36

Colour - Notations


13/36

Colour Notation in Photoshop


14/36

Colour - colourwheel


15/36

Colour the colourwheel

The Colour Wheel is the tool to determine the Colourmatch.


16/36

Colour what are the colours

The wheel has 12 basic colours. The first primary colour blue, yellowand red. Primary colours combine secondary, which in turncombine to tertiary colour.

Primair Secondair Tertair


17/36

Colour Corresponding colour

Each colour is part of the secondary colour, which in turn is part ofthe colour lying next to it, etc. In addition, colour matches form the

basis of colour relationships.

Blauw is overeenkomstig Geel is overeenkomstig Rood is overeenkomstig


18/36

Colour - Value

Colour also has light and dark variations, values. For these values todisplay the Colour Wheel has several rings, two large rings for thedark shadows and two small for light shades.


19/36

Colour - relations

The following slides show the six basic color relationships. Everyrelationship can form an endless number Colour Palettes.

Monochromatisch Analoog


20/36

Colour - relations

Each palette can contain shadows and shades in combination withhue. This can result in completely dark, light or combined wholepallets.

Complementair Split-Complementair


21/36

Colour - relations

The amount of color is important. Palettes can be hotter / colder,darker / lighter, more prominent / quieter etc. made by more or lessof a particular color.

Primary Secondary


22/36

Colour - Quiz

Each cover uses one of the basic relationships. Name them.


23/36

Colour - Practice


24/36

Colour - Practice


25/36

Colour - Practice


26/36

Colour - Practice


27/36

Colour - Practice


28/36

Colour - Practice

l


29/36

Colour - Practice

l i


30/36

Colour - Practice

C l i


31/36

Colour - Practice

C l P i


32/36

Colour - Practice

C l P i


33/36

Colour - Practice

C l P ti


34/36

Colour - Practice

C l P ti


35/36

Colour - Practice

Kl t l


36/36

Kleur - tools

kuler.adobe.com

www.colorschemedesigner.com/

www.colourlovers.com

www.pantone.com

Please note that these are tools. You may not use them to

generate your colourscheme without explaining/motivatingthe scheme.
http://kuler.adobe.com/http://www.colorschemedesigner.com/http://www.colourlovers.com/http://www.pantone.com/http://www.pantone.com/http://www.colourlovers.com/http://www.colorschemedesigner.com/http://kuler.adobe.com/

vsd colour en

Documents