Post on 08-Jan-2016
description
ALL ABOUT COLO R
CGS3066
Is color
Inherent in objects– do objects HAVE color?
or
Something created by the mind of the beholder when he/she perceives light?
Here’s where light fits in
Basics of Color and Color Vision Paul Avery 2
Vision and the “Electromagnetic Spectrum”
Lesson: We directly perceive a tiny fraction of the world
And yet the human eye can distinguish as many as
a. 100, 000
b. 1,000,000
c. 10,000,000
???? colors
How We See
Three distinct eye layersSclera: Outer layer, includes corneaChoroid: Middle layer, has blood supply, irisRetina: Image surface, contains photoreceptors
Picture of Retina
Rods and Cones Cover Retina
Retina schematic
Rods
Cones
Rods versus Cones
• Many more Rods- all same kind -- 120 million (night vision)
– 7 million cones (day vision)
• 3 kinds of cones, each sensitive at different range of wavelength– Humans have “Trichromatic” vision– why colors requires 3 numbers to specify
Sensitivity of Cones re Wavelength
“Short” “Medium” “Long”
Few of these Many of these
We have 3 kinds of cones but many Animals have only two- ie are dichromats
Here is how the world looks to them
What would a tetrachromat see?
Rods and cones in humans summed up
If we had only _______, we’d see only in black and white.
It’s the ________ that give us color vision.
What you need to remember about human color perception
Where vision fits into the spectrum
Roughly how many colors humans can perceive
How the retina works: cones and rods
Difference between human and animal vision (Trichromatic vs dichromatic)
2 Basic Approaches to Color
Subtractive systems RYB and CMYK (pigment)
all colors make black
Additive system RGB (light)
all colors make white
Subtractive Color: for pigment
Paint: RYB red yellow blue Primary colors: red yellow blue Secondary colors: 2 primaries Tertiary colors: 1 secondary 1 primary
Printing: CMYK cyan magenta yellow black
But
Red, yellow, and blue aren’t technically primary colors at all, because
- they can’t reproduce as many ___________
and
- they can’t get as close to true _______
as cyan magenta and yellow can.
Additive Color: For Light
RED GREEN BLUE
light-generated color
for graphics/backgrounds
intended for screen display
Red + blue = magenta blue + green=cyan
green + red = yellow
mix everything you get white
RGB in HTML
3 numbers 1-255 designates
the amount of
RED, GREEN, or BLUE
Black- 100% of all three
White- 0% of all three
Hexadecimal Color
Here is an example:
255 RED 255 GREEN 0 BLUE
translated into hexadecimal
FFFF00
Huh?
Hex means to the base 16 instead of 10
The 16 positions :0123456789ABCDEF
Each RGB component is a 2 position hex #
The smallest would be 00, the biggest FF
Furthermore…
The absence of color is black – (000000) so the closer to 00 a designation for RGB is,
the darker it is and the closer to FF the brighter it is
The saturation of all colors is white-- All Fs ( FFFFFF)
RGB CMYK
To reproduce a RGB image in ink on paper, it must be converted to "CMYK"
CMYK and RGB not perfectly compatible - deep blues and rich reds on screens won’t print
using "SWOP CMYK" inks (SWOP: standard web offset press))
- pure cyan in CMYK can’t be duplicated on a computer screen
So….CMYK is anticipating print
(cyan magenta yellow black)
for computer graphics intended for paper
subtracts
Cyan S red yellow S blue magenta S green.
mix everything you get black
Web-Safe Color
- any color can be specified in hex but different browsers don’t define them identically
- colors using only 00,33,66,99,CC,FF are common across browsers
- SO, there are only 216 web-safe colors (6 cubed) versus 16,777,216 theoretical possibilities (256 cubed)
A color poster for the web
Here are web colors derived from a color wheel:
http://www.visibone.com/colorlab
Don’t use too many
Good to choose colors from the middle- outside ones are too bright
Some Approaches to Coordinating Colors
Monochromatic
One color plus hues, tints, shades
To increase intensity, add white
http://www.carbonplaces.com/
Some Approaches to Coordinating Colors
Complementary:- Across from each other on the color wheel
- These can clash
- Used side by side can cause problems for the eye because are very different wavelengths
Some Approaches to Coordinating Colors
Triadic
Colors chosen by drawing an
equilateral triangle inside a color
wheel
Sources of Eye Strain
Too little contrast between text and background–
contrast should be 80%
Complementary colors side by side
cause shadows and vibrations
The Effects of Color
Certain colors trigger a physical reaction
red raises blood pressure blue lowers it
Some More Effects
Colors evoke styles:
Can date: eg Avocado- 60s and 70s Can pigeonhole: blue and green-
preppy
Implications of Color Choice
Cultural: Flag colors, for example
Different symbolic messages in west white = purity in east can = death
Test yourself on western color symbolism
http://desktoppub.about.com/library/
quizzes/blcolormatching.htm
2 General Color-Group Effects
Cool Colors calm (Blue, Green & White)
Warm Colors excite (Red, Yellow, Orange & Black)
Color Blindness
about 8 of every 100 men 1 of every 200 women doesn’t mean can’t see color just can’t tell red from green
Are you color blind?
http://colorvisiontesting.com
how color blind people see
http://www.vischeck.com/examples/
This site will let you check your site for colorblindness problems
What Colors are Safe for All?
http://more.btexact.com/people/rigdence/colours/
Does Color Matter?
• Research reveals all human beings make a subconscious judgment about an item within 90 seconds of initial viewing and that between 62% and 90% of that assessment is based on color alone.
Does color matter?
• Close to 40% of American consumers report they would change car makes if they couldn’t get the color of their choice
• Source: Institute for Color Research
Some design advice
• Limit your color palette to no more than three colors to reduce visual clutter.
• Use colors appropriate to the theme of your web site.
• Use colors found in key photos or graphics on your web page for added harmony.
• Avoid harsh colors. Desaturate colors to approximate colors found in nature and textiles.
A Terrific Site for Color Info
• http://www.colormatters.com/entercolormatters.html
One more Source for Color Choice
http://www.2createawebsite.com/build/hex-colors.html
Vision is not simple: Some Illusions
Is the Green Dot in Front or Back of Cube?
Which Avocado Has the Pit?
Is the Green Dot in Front or Back of Cube?
Hidden Bird Illusion
http://zeus.rutgers.edu/~feher/bird/example1.html