Image programming in actionscript3 games (serialization 21)

1.4.3 use grayscale/brightness to guide Color Matching

Try to adjust the channel that is not equal to 0 to make the colors in the last row consistent on the gray scale, and substitute the three colors into the psychology formula respectively. Get

Gray(red) = r * 0.299Gray(green) = g * 0.587Gray(blue) = b * 0.114

To make them grayscale equal, then

r * 0.299 = g * 0.587 = b * 0.114

It can be seen that the value of B must be the maximum. Let's take the maximum value of 255 for B and obtain r = 97, G = 50. Apply the two values to the red and green color blocks respectively.

Green is no longer eye-catching, and the overall perception becomes softer than before due to gray consistency (Figure 1.32 ).

The limitations of the above algorithms are also obvious. The gray scale can never break through the 0.114 mark, because at this time, the dark blue has reached the upper limit of 255, resulting in the highest color can only go to the brightness of 11.4%, the clear colors cannot be used together. To break through this bottleneck, it is inevitable to assign values to multiple colors.

Figure 1.32 adapt to the color matching of the blue Tunnel

Assume that the gray level should be adjusted to be the same as that of green (#00ff00), and gray = 0.576*255 = 147 is calculated using the psychology formula. Both R and B have

R * 0.299 + G * 0.587 + B * 0.114 = 147

Because the red and blue colors are darker than the green ones, make the red R and blue B equal to the maximum value of 255.

So for the red, there are 255*0.299 + G * 0.587 + B * 0.114 = 147, simplified

G * 0.587 + B * 0.114 = 71

One equation, two unknowns, cannot find the unique solution. In the HSB model, H is what we need to open, and B has been replaced by gray scale, so we can only try to add another equation from S.

Both HSV and HSL have a common feature. The greater the difference between Max and min, the higher the saturation. Since the saturation of #00ff00 reaches the full value, and Max has made the r channel data available, G and B can only occupy the min position.

If Min is set to 0, the color saturation reaches the maximum value.

First try to let G = 0, then there is B * 0.114 = 71, and B = 623 is obtained, the value is completely cracked. In desperation, you can only set B to 0. At this time, G * 0.587 = 71 and G = 121.

Use the same method to process the blue color. The blue RGB value is (0,201,255)

Apply the color value to the color block. Haha and Ming colors are matched, and they are pretty nice (Figure 1.33) (of course, this is only evaluated according to the author's own aesthetic standards ).

 
Figure 1.33 adapt to the color matching of the Green Channel

Similarly, if we try to match a set of moderately bright colors without changing the red color, we will find that when the saturation is required to reach the full value, there is always a value greater than 255 in order to make the gray calculation result consistent with the red color, the color combination fails. This explains to some extent why a colorful and rich interface rarely shows a large area of pure red (except for GCD websites ).

In addition, if you want to make the color more even based on the composition of the color, when you choose the three colors, it is best to perform an equal score on the Aesthetic color ring, for example, take the three colors such as 0,120,240, the combination is red, yellow, and blue to achieve a harmonious and unified comparison (Figure 1.34 ).

Another task of grayscale is to color a grayscale image or change the color map (in essence, it is to re-color the grayscale image), but considering that it should be implemented with complicated code, let's just put it aside.

 
Figure 1.34 color scheme of same-Color Segmentation

With the basic knowledge of color, we can interpret art programming from a visual perspective, so that the art discussion will no longer stay at the level of code discussion.