Computer Graphics and the Visual SystemWhat is Computer Graphics?Which is Real?The point beingChange Blindness DemonstrationChange Blindness DemonstrationThe Perceptual SystemWhat/Where PathwaysArtists Exploit These PathsArtists Exploit These PathsArtists Exploit These PathsThe visual system impacts visualization in two primary waysWhat is Color?What is Color?Color TermsHow many colors can we see?How does the physiology of the eye impact us if we’re trying to create images or communicate information (visualization)?The Lens – combining colorsChromostereopsisThe effects of ageMonet’s CataractsMonet’s Cataracts IIThe RetinaConsequencesThe BrainColor BlindnessColor Blind ImpressionsWeb-Safe PaletteSafe Web ColorsGuidelinesGuidelinesGuidelinesA Little Color can be Better than a LotResolutionHalftoningWhat if we only have 2 intensity levels (white and black)?What is Dithering?What do Artists Do?Artistic Half-ToningPhotomosaicsBrightness (or Contrast)ExampleContrast ranges of common mediaWhat kinds of scenes have high contrast?We compress the light intensitiesExampleWhat do Artists Do?ExampleThe EndComputer Graphics and the Visual SystemBobby BodenheimerElectrical Engineering and Computer [email protected] is Computer Graphics?Models ImagesGraphicsVisionMore formally, Computer Graphics is the study of the processes involved in converting a mathematical description of an object (model) into a visualization, a two-dimensional projection that simulates the appearance of the real object.Which is Real?The point beingthat if you don’t understand the human visual system, you won’t understand how to make good images on a computer.Change Blindness DemonstrationChange Blindness Demonstration• Based on the work of Ronald Rensink at University of British Columbia• http://www.usd.edu/psyc301/Rensink.htmThe Perceptual System• Conflicting goals: high spatial resolution vs. wide aperture• Organized in a “three-level hierarchy”– retina–fovea– receptors within foveaWhat/Where Pathways• Where Pathways– Motion Perception– Depth Perception– Spatial Organization– Figure/Background Separation•Features– Color Blind–Fast– High Contrast Sensitivity• What Pathway– Object Recognition– Face Recognition– Color Perception•Features– Color Selective–Slow– Low Contrast SensitivityArtists Exploit These PathsClaude MonetArtists Exploit These PathsClaude MonetArtists Exploit These PathsAbraham WalkowitzRaoul DrufyThe visual system impacts visualization in two primary ways• Color– Reproducing–Using• Brightness– Simulating the levels of the real worldWhat is Color?What is Color?Color Terms • Hue – dominant wavelength (red, blue, …).• Saturation – Purity (red = fully saturated; pink = not full (add white light)).• Luminance – intensity of light (brightness, but brightness is subjective).Artists start with a "pure color or hue", then add black pigment to produce different shades. The more black pigment the darker the shade. They add white pigment and get different tints. Adding both black and white pigments gives different tones.How many colors can we see?The human eye can distinguish about 128 different hues, 130 different tints (saturation levels), and from 16 (blue part of spectrum) to 23 (yellow part of spectrum) different shades. So we can distinguish about 128 X 130 X 23 = 380,000 colors.Computers can’t do this well.Using ColorHow does the physiology of the eye impact us if we’re trying to create images or communicate information (visualization)?The Lens – combining colors The function of the lens is to focus the incoming light on the retina, which contains the photo receptors. Different wavelengths of light have different focal lengths so, for pure hues, the lens must change its shape so that the light is focused correctly.Chromostereopsis• A related effect in which pure colors at the same distance away from the eye appear to be at different distances, red appears closer, blue further.• Pure blues sometimes focus in front of the retina and thus appear unfocused (at night, a blue sign may appear fuzzy).The effects of age• Lens absorbs more (about twice) as much blue as red. As we age, the lens yellows, absorbing more shorter wavelengths.• People are more sensitive to yellows and oranges, and this increases with age.• The vitreous humor also absorbs light, and this increases as we age – apparent brightness and sensitivity to blue decreases.Monet’s CataractsMonet’s Cataracts IIThe Retina• Cone distribution not symmetrical:–blue (4%)– green (32%)– red (64%)• The fovea is primarily green cones with very few blue.Consequences• Edges seen by different color or brightness.• Different colors alone produce fuzzy, unfocussed edges.• Photoreceptors have a minimum intensity to respond– blues and reds need higher intensities than greens and yellows to be perceived.The BrainCells process color toA = M +LR/G = M – LB/Y = S – ASo, transmitted in 3 axes: achromatic, red/green, blue/yellow.Can’t have blueish yellow or reddish green.Blue plays no part in brightness – things differing only in amount of blue produce fuzzy edges.Color Blindness• 8% of the male population, 0.6% of the female population has a color deficiency•Genetic• Dichromats have one type of cone missing• Anomalous trichromats– shifted sensitivityIshiharaColor Blind ImpressionsWeb-Safe Palette• Can change colors slightly, so that the effect is almost imperceptible, but produces gradations in shading for color-deficient visionSafe Web ColorsOriginal Color Web-safe ColorAs it appears to protanopeAs it appears to deuteranopeGuidelines• Avoid simultaneous display of highly saturated, spectrally extreme colors: desaturate the colors or use colors close together in the spectrum.• Avoid pure blue for text, thin lines, and small shapes. Blue makes an excellent background color (for computer displays it tends to blur the raster lines).Guidelines• Avoid adjacent colors differing only in the amount of blue (fuzzy edges).• Older viewers need higher brightness levels to distinguish colors.• The magnitude of detectable change in color varies across the spectrum.• It’s difficult to focus upon edges created by color alone.Guidelines• Opponent colors go well together.• For color-deficient observers, avoid single color distinctions.– for web pages, use “web-safe” palettesA Little Color can be