ColorToolDoc.tioga
Last edited by Stone, August 16, 1985 10:57:29 am PDT
Avi Naiman, September 8, 1985 8:31:09 pm PDT
Crow, September 27, 1985 5:10:56 pm PDT
Rick Beach, October 27, 1985 10:31:02 am PST
COLOR TOOL
CEDAR 6.0 — FOR INTERNAL XEROX USE ONLY
ColorTool
Darlene Plebon, Maureen Stone, Avi Naiman
© Copyright 1985 Xerox Corporation. All rights reserved.
Abstract: The ColorTool allows one to manipulate the color of a patch using any of a variety of color systems. The ColorTool is valuable for experimenting and learning about the various color schemes and how they interrelate to one another. A client interface is provided so that illustrators might use the ColorTool for color specification by a user.
Created by: Darlene Plebon
Maintained by: Maureen Stone <Stone.pa>, Rick Beach <Beach.pa>
Keywords: color, color spaces, color specification, illustrators
XEROX  Xerox Corporation
   Palo Alto Research Center
   3333 Coyote Hill Road
   Palo Alto, California 94304

For Internal Xerox Use Only
1. Overview
The ColorTool permits one to interactively manipulate the color of a test patch using a variety of color systems. The color systems provided are RGB (red, green, blue), HSV (hue, saturation, value), HSL (hue, saturation, lightness), CNS (color naming scheme), YIQ (NTSC encoding), and ARgYb (achromatic, red-green, yellow-blue). There is a second viewer with a set of tools for manipulating color in the CIE coordinate system. By SHIFT-clicking a color system button, for example HSV, those three color values are inserted at the current selection for specifying the current color.
Sliders for each parameter of the color schemes make the ColorTool highly interactive. Since each scheme is interactively updated whenever one of the parameters change, intuitive understanding of the color schemes is possible through experimentation.
You can control the appearance of the color patch in several ways. If you are using the ColorTool on a display with a colormap, by setting the Dither button to TRUE, the color patch will be split such that the right half of the patch shows the true color (by setting one of the colormap entries to the current color) and the left half shows a "dither" pattern that approximates this color using only the values in the standard colormap.
The second way in which you can control the appearance of the color patch is to have contrasting colors (to the patch color) automatically computed. By setting the Contrast button to ALL, inside the color patch will appear five smaller patches corresponding to the automatically computed contrasting colors in each of the five color systems. By setting the Contrast button to NONE, the contrast patches will disappear. You can also select a single contrast patch by setting the Contrast button to the corresponding color system you wish to see. For a description on how the contrasting colors are computed, see: Naiman, Avi C., ``Colour Spaces and Colour Contrast,'' Graphics Interface 1985,
A third feature of the color patch is an interpolation bar which can be made visible in the lower portion of the patch. By setting the Interpolation button to LEFT, an interpolation bar will appear, and the color of the left side will track the color of the color patch, while the right side of the interpolation bar will remain its previous color. As the color patch is modified (and, hence, the left side of the interpolation bar), intermediate interpolated color values (that is, between the left and right colors) are displayed along the interpolation bar. Analogous results occur when the RIGHT option is selected. In order to stop tracking the color patch, yet keep the interpolation bar visible, select the STOP option; to cause the interpolation bar to disappear, select the OFF option. Note that interpolation is carried out in the RGB color space (straight-line interpolation in color spaces which are non-linear transformations of RGB (e.g., HSV) would yield different results).
Since not all user-selectable color system values map into valid RGB monitor-realizeable colors, the user is given the choice of whether or not the representation in the color system being used should be checked for consistency with the approximated realizeable RGB color. By setting Consistency Check to ON, after an RGB value has been computed from the user's input, that value gets represented in all of the color systems, including in the one which was used for modification. Notice that this may cause all of the dimensions in that color system to be changed. With Consistency Check OFF, the color system being used is not made consistent with the computed RGB color. In such a situation, the representation in the color system being used may not match the color in the color patch!
2. Things to Try
The first system to try is the additive Red, Green, Blue primaries. Show what colors are produced by combining pairs of primaries. Note that adding the third primary only lightens (adds white) to the predominant hue. Try to find brown (hint: red and low levels of green combined).
The next system to try is the HSV (Hue, Saturation, Value). Keep S and V full on and cycle through the hues. Note that this uses at most two primaries at a time in the RGB system. Drop the Saturation level to `add white' to the color. Drop the Value to `add black.'
The third system to try is the color names. Note its `intuitive' nature. Watch out for Brown; it's really just orange so if the saturation is `Vivid' it will not look brown.
HSL maps directly to the colornames. To compare it to HSV: The hue is the same. Saturation is `add gray' not `add white'. Lightness is quite different and controls `colorfulness' not `add black'.
YIQ is the system used for broadcasting color television signals in North America and Japan. The Y dimension controls the `intensity' of the color. Don't bother trying to understand the other two dimensions.
ARgYb corresponds to the opponent-colors theory of human color vision. The A dimension is exactly the same as Y from YIQ -- namely, it controls intensity. Rg controls the red vs. green component of the color. When the Rg slider is `empty' (i.e., = 0.00), the color has a green component, but not a red one. Similarly, when the Rg slider is `full' (i.e., = 1.00), the color has a red component, but no green. In between, both red and green components exist, but in a ratio specified by the closeness to one of the ends of the slider. When the slider is midway between the ends (i.e., = 0.50), there is an equal amount of red and green in the color. Note that, in such a case, the Yb dimension (which controls the yellow vs. blue component in an analogous fashion) will determine if there is in fact any red or green component in the color.
Note how the automatically computed contrasting color may be different in the various color systems. For example, in HSL the contrast color is always white or black! Try to find where the contrast color for HSV is not white or black.
3. The CIE Viewer
Now open the CIE viewer. The CIE space has three axis, X, Y and Z. Y is the luminance or `intensity' of the color, as in YIQ above. The other two axis are not very intuitive. CIE is a calibrated system, that is, there are standard definitions for the values of colors. Any particular color monitor can display a subset of the colors in the CIE system. This subset is called the monitor's gamut and is defined by the CIE coordinates of the red, green and blue phosphors.
A typical way to view the CIE system is to normalize the values and project them onto the XY plane. The color gamut of a monitor is then represented as a triangle in this plane with the normalized values of the red, green and blue phosphors at the vertices. These normalized values are called the chromaticity values. To completely describe a color you need the chromaticity plus one unnormalized value, typically Y.
The CIE viewer shows a triangular slider for controlling chromaticity and a regular slider for controlling Y. The sliders are constrained so that it is impossible to request a color outside of the monitor's gamut. There are two modes. In the first mode, called `Track Y', changing the chromaticity automatically adjusts the the luminance value to the maximum brightness for that color. The second mode, called `Clip Y' adjusts the Y value only if changing the chromaticity would produce a color outside of the monitor's gamut.
To play with the CIE viewer, first put it in `Track Y' mode and move the cursor into the corners of the triangle. You will find red, green and blue (watch the RGB sliders). If you move along the line between Red and Green you will find yellow. White is in the center of the triangle. Decreasing the value of Y will make a color darker. Now put the viewer in `Clip Y' and set the value of Y to approximately a half. In this mode the value of Y will never automatically increase, it will only decrease if you exceed the gamut (problem area will be in the blue corner). If you move around on the chromaticity plane without changing Y you will be selecting colors of constant brightness. Watch the color patch to see that this is so. Note that this is not the same as constant L on the HSL slider; full Yellow and Red have the same L value but very different Y values.
Note that each different monitor describes a different triangle so the CIE viewer needs to be initialized with the chromaticity values for the specific monitor used. Two typical sets of values for long and short persistence phosphors are provided as buttons on the CIE viewer.
4. About the Tool
The viewer is a container with buttons, sliders, text viewers and a colorpatch in it. You can edit the text viewers to preset a color value, then click the button (RGB, HSV, HSL, YIQ or ARgYb) to set the value. Note that this is all of Tioga running in the text Viewer. The sliders are viewers that sample the mouse and periodically update the box as feedback. Note that for smooth interaction this needs two processes and a queue—you don't want to waste time painting values you are no longer interested in. Pressing two mouse buttons together will cancel a slide operation. Sliding off the end will `pin' the value to 0 or 1.
The colorpatch may be dithered to give full color (normally 24 bits/pixel) on an 8 bit display (see above). Point out that this scheme gives a uniform color definition (from the programmers viewpoint) for different displays.
5. Named Colors
Also supplied with the color tool is an interface and implementation for handling named colors. Named colors are ropes which are converted back and forth from HSL (hue, saturation, lightness) colors. Thus, two procedures are provided:
- RopeToHSL: PROCEDURE[rope: ROPE] RETURNS[clr: ImagerColor.HSL];
- HSLToRope: PUBLIC PROCEDURE [clr: ImagerColor.HSL, level: NAT ← 3]
     RETURNS
[rope: Rope.ROPE];
The ropes must consist of a basic hue {Black, White, Gray, Grey, Red, Orange, Brown, Yellow, Green, Cyan, Blue, Purple, Magenta} preceded by an arbitrary number of modifiers. The modifiers may consists of one other hue (ie. `Yellow Green'), a number of saturation modifiers {Achromatic, Weak, Moderate, Strong, Vivid, Bright}, and a number of lightness modifiers {Dark, Medium, Light}. The suffix `ish' may be appended to any modifier and `very' is a legitimate modifier.
Examples:
`Green Yellow'  ( halfway between green and yellow, strong saturation )
`Vivid Greenish Yellow' ( 1/3 towards green from yellow, fully saturated )
`very very light brown' ( case shouldn't matter )
`darkish very light strongish weak moderate purplish red'
Error messages:
UndefinedName  (usually signifies a misspelling)
BadGrammar (incorrect modifier order, or nonsensical combinations)
The `level' argument to HSLToRope provides a indication of how precise to be in the name of the color. `Level' specifies the number of modifier levels to be provided.
The whole idea of trying to capture peoples way of describing colors in this manner is pretty ridiculous. Be prepared for the model seen here to be considerably different from your personal model. A little interactive exploration of the color space is highly recommended. The syntax is something like the following.
<named color> :== <lightness modifier> <saturation modifier> <hue modifier> <hue>
<lightness modifier> :== very <lightness modifier> | <lightness modifier> <lightness modifier>
   | dark | medium | light | darkish | lightish
<saturation modifier> :== very <saturation modifier>
   | <saturation modifier> <saturation modifier>
   | achromatic | weak | moderate | strong | vivid | bright
   | weakish | strongish
<hue modifier> :== very <hue modifier> | <hue modifier> <hue modifier> | <hue>
   | Grayish | Greyish | Reddish | Orangish | Brownish | Yellowish
   | Greenish | Cyanish | Bluish | Purplish | Magentaish
<hue> :== Black | White | Gray | Grey | Red | Orange | Brown | Yellow | Green | Cyan
  | Blue | Purple | Magenta