color and blending 03/22/06. rgb why? monitor human vision system scale: 0-1, 0-n

20
Color and Blending Color and Blending 03/22/06 03/22/06

Upload: amberlynn-wilkinson

Post on 13-Dec-2015

219 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Color and BlendingColor and Blending03/22/0603/22/06

Page 2: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

RGBRGB

Why?Why? MonitorMonitor Human vision systemHuman vision system

Scale: 0-1, 0-nScale: 0-1, 0-n

Page 3: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Color in OpenGLColor in OpenGL

State - all the geometry that is specified State - all the geometry that is specified after that point will be drawn in the after that point will be drawn in the specified color until that color is changedspecified color until that color is changed

Page 4: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

LuminanceLuminance

Luminance - a color’s intensity, without Luminance - a color’s intensity, without regard for its actual color. regard for its actual color.

Important - 10% of people have color Important - 10% of people have color perception deficienciesperception deficiencies

Interpretation of an imageInterpretation of an imageluminance = 0.30*red + 0.59 * green + luminance = 0.30*red + 0.59 * green +

0.11*blue0.11*blue

Page 5: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

HSVHSV

Hue - angles: 0 = red, 120 = green, 240 = blue Saturation - 0 at the center (no saturation, which

makes no real coloring) to 1 at the edge (fully saturated colors)

Value - from 0 at the bottom (no color, or black) to 1 at the top.

Page 6: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

HLSHLS

Hue and saturation have the same meaning as HSV.Hue and saturation have the same meaning as HSV. Lightness replaces value - the brightest colors at a value of 0.5. Lightness replaces value - the brightest colors at a value of 0.5. As colors get lighter, they lose their distinctions of hue and As colors get lighter, they lose their distinctions of hue and

saturation.saturation.

Page 7: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

CMYKCMYK

emissive color models, additive color models -- RGB, HSV, HLV light is emitted to the eyelight is emitted to the eye

transmissive color models, subtractive color models light is reflected to the eye

Page 8: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Mach BandingMach Banding

Page 9: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

GamutGamut

Page 10: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Color Blending With the Alpha ChannelColor Blending With the Alpha Channel

RGBA - where RGBA - where aa Is called the Is called the alpha valuealpha value Has a value is a number between 0.0 and 1.0Has a value is a number between 0.0 and 1.0 Is a measure of opacityIs a measure of opacity

Alpha channel was invented to permit image Alpha channel was invented to permit image compositing in which an image could be laid compositing in which an image could be laid over another image and have part of the over another image and have part of the underlying image show through. underlying image show through. ““transparent” should be blended.transparent” should be blended.

transparent colors =~ colored glass: transmissivetransparent colors =~ colored glass: transmissive Blended colors =~ averaging emissive RGB colorsBlended colors =~ averaging emissive RGB colors

Page 11: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Idea : Draw opaque objects first. Given 3 objects above on white background with alpha

of .5. 1st object: the frame buffer will have color C1 2nd object: the frame buffer will have color

0.5*C1+0.5*C2 3rd object is drawn on top of the others, the color will be

0.5*C3+0.5*(0.5*C1+0.5*C2), or 0.5*C3+0.25*C2+0.25*C1.

The color of the most recent object drawn is emphasized much more than the color of the other objects.

Page 12: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Review alpha.c and alpha3d.cReview alpha.c and alpha3d.c

Sample blending programsSample blending programs Texture programTexture program

Page 13: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Stay User CenteredStay User Centered

Use appropriate representation for your audience. Color Geometry or shapes Symbolic or synthetic images or pseudo-real images Relationships between things or the things

themselves Two-dimensional representations, three-dimensional

images but with the third dimension used only for impact, and true three-dimensional

Ask your user, your intended audience

Page 14: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Image Context

Choosing an appropriate view - staging Labels - help communicate your problem Legends - help communicate your

encodings

Page 15: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Leaving Traces of Motion

Leave something in the frame to show where the parts were in previous frames.

Page 16: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Interactions

Keep your images focused Keep your images focused Use appropriate presentation levels for your Use appropriate presentation levels for your

information.information. Use appropriate forms for your information. Be very careful to be accurate with your display. Make your interactions reflect familiar and

comfortable relationships between action and effect.

Page 17: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Cultural Context of the Audience

Associations of Colors by Professional GroupColor Process Control

EngineersFinancial Managers

Health Care Professionals

Blue Cold Water Corporate Reliable

Death

Turquoise (Cyan)

Steam Cool Subdued Oxygen deficient

Green Nominal Safe Profitable Infected

Yellow Caution Important Jaundiced

Red Danger Unprofitable Healthy

Purple Hot Wealthy Cause for concern

Page 18: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Context-sensitive Color

Page 19: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Accuracy Visualizations should help the user understand

information clearly and accurately. present the data or theory you have as accurately as

possible. making attractive images is useful when you can, even if

your goal is accuracy Garbage in, garbage out Example:

If you do not know a priori that there is a smooth variation to the population from which you get your data, then you need to present the data as discrete values and not use smooth interpolations or smooth shading to make your data look smoother.

Page 20: Color and Blending 03/22/06. RGB  Why?  Monitor  Human vision system  Scale: 0-1, 0-n

Homework

Tonight: What is your project? What information Tonight: What is your project? What information do you need to progress?do you need to progress?

Homework for next weekHomework for next week Work on your project.Work on your project. Turn in another revision next week. This will not be Turn in another revision next week. This will not be

graded except to make sure there is a change from graded except to make sure there is a change from this week’s code.this week’s code.

Read chapter 7Read chapter 7 Quiz - should next week’s quiz be rescheduled?Quiz - should next week’s quiz be rescheduled?