Mixing Paint! With Computers!
This is a modal window.
The media could not be loaded, either because the server or network failed or because the format is not supported.
Formal Metadata
Title |
| |
Title of Series | ||
Number of Parts | 34 | |
Author | ||
License | CC Attribution - ShareAlike 3.0 Unported: You are free to use, adapt and copy, distribute and transmit the work or content in adapted or unchanged form for any legal and non-commercial purpose as long as the work is attributed to the author in the manner specified by the author or licensor and the work or content is shared also in adapted form only under the conditions of this | |
Identifiers | 10.5446/38556 (DOI) | |
Publisher | ||
Release Date | ||
Language |
Content Metadata
Subject Area | |
Genre |
Bangbangcon (!!CON 2016)19 / 34
3
15
16
17
18
19
24
28
30
32
34
00:00
ComputerComputer animation
00:11
ComputerGraph coloringCombinational logicBitElementary arithmeticGreen's functionSocial classMixed realityJSONXMLComputer animationProgram flowchart
01:01
CodeGreen's functionRepresentation (politics)NeuroinformatikCombinational logicGraph coloringMereologyNumberGreen's functionComputer animation
01:17
CodeGreen's functionGraph coloringPixelQuicksortComputer animation
01:29
Data modelGreen's functionNumberGraph coloringMaxima and minimaComputer animation
01:55
Position operatorNeuroinformatikGraph coloringRepresentation (politics)Line (geometry)Multiplication signMixture modelCASE <Informatik>InterpolationGradientComputer animation
02:52
Graph coloringNatural numberMixed realityComputer animation
03:05
Graph coloringMatter waveObject (grammar)Spectrum (functional analysis)Green's functionBitComputer animation
03:55
Object (grammar)BitDifferent (Kate Ryan album)Graph coloringConnectivity (graph theory)CASE <Informatik>Slide ruleMatter waveNeuroinformatikComputer animationDiagram
05:10
Data modelEndliche ModelltheorieFile formatLetterpress printingGraph coloringComputer animation
05:28
Letterpress printingGraph coloringComputer animation
05:39
Electronic visual displayTouchscreenNumberColor spaceTouchscreenQuicksortBounded variationGraph coloringNeuroinformatikDifferent (Kate Ryan album)ResultantPhysicalismReal numberForm (programming)Video gameNichtlineares GleichungssystemPixelSurfaceSpacetimeTheoryComputer animation
07:05
ScatteringSurfaceTheoryGraph coloringoutputFigurate numberCombinational logicComputer animation
07:53
ImplementationInternet service providerInformationSource codeTheoryPoint (geometry)Graph coloringDemo (music)InformationCASE <Informatik>CodeCartesian coordinate systemSoftware maintenanceNeuroinformatikComputer animation
08:43
InterpolationPoint (geometry)Entire functionQuicksortGreen's functionNeuroinformatikComputer animation
09:42
Mobile appGraph coloringExpected valuePoint (geometry)Cartesian coordinate systemDigitizingComputer animation
10:33
Graph coloringComputer animation
10:50
ComputerGraph coloringNeuroinformatikMereologyOrder (biology)Representation (politics)Computer animation
11:11
Computer animation
11:22
Link (knot theory)MereologySpeciesCoefficientComputerYouTubeVideoconferencingComputer animation
Transcript: English(auto-generated)
00:20
I'm Diana, and I'll be talking a little bit about colors. So when I first learned about colors, this was in elementary school art class. And I learned, and maybe you did too, that there were three primary colors, red, yellow,
00:41
and blue, and that you could make any combination of colors from those three. If you mixed red and yellow, you would get orange. If you mixed yellow and blue, you would get green. And if you mixed blue and red, you would get purple. And then you can continue to mix those primary and secondary colors to create everything along the color wheel.
01:01
But this is not exactly how colors are represented on the computer. On the computer, all the colors are represented by three numbers, as a combination of red, green, and blue lights, usually known as RGB representation. And part of the reason why the computer does this is because that's how monitors work. Each pixel in a monitor has a red, green, and blue light
01:24
that are then turned on at different values to get each color of the pixel. And so the higher the numeric value for each color, the closer you get to white. And pure white is then a color with maximum values in all three
01:41
of red, blue, and green lights. And it's not the most intuitive thing in the world. Red and green mixed together gives you yellow. Red and blue gives you magenta. And green and blue gives you cyan. And so the way you mix colors together on an RGB representation is usually through linear interpolation,
02:02
which you can think of as putting the two colors at the ends of a line. So here we have red and blue. And red here is at position zero and blue is at position one. So if you wanted to get any mixture of them at position X somewhere between zero and one, you multiply X by the RGB values of the first color
02:24
and then one minus X times the RGB values of the second color to get the blend of those two colors at that position. And that is what's used to create gradients in computers. The closer you get to position zero or red in this case, the more red it is. And the closer you get to one, the more blue it is.
02:41
And for a lot of colors, this looks pretty good. I don't know how accurate the color representation is on these slides, but red and blue mixed together does make something that resembles purple. And red and yellow makes a color that looks like orange, but sometimes it doesn't work quite as well.
03:01
Because of the nature of RGB, when you mix yellow and blue, you get gray. So this is not exactly how mixing paints work. So let's talk about how mixing paints does work. So color actually is the reflection of light off of an object. And the way you perceive color
03:23
is that all objects reflect certain wavelengths of light and absorb other wavelengths of light. And the wavelengths that are absorbed, or sorry, the wavelengths that are reflected are then picked up by your eye. And if the wavelength is somewhere between roughly 380 nanometers and 750 nanometers, it falls into the visible light spectrum and you can see it.
03:43
The shorter the wavelength, the closer you get to violet, and the longer the wavelength, the closer you get to red along the spectrum. You go from violet, blue, cyan, green, yellow, orange, red. And so most objects, though, don't reflect a pure wavelength, including paints.
04:01
So if you have a blue paint, it might reflect mostly light in the blue visible spectrum but also some violet light and some green light. And similarly, if you have a yellow paint, it will reflect mostly yellow light, or light in the yellow wavelength, but also some green and some orange. And so then when you mix those two together,
04:21
the resulting color of the paint is usually, hold on, my slide just closed. The resulting color of the paint is usually the color that is reflected by both of the component paints, which in this case would be green, because that's what's in between blue and yellow.
04:42
And usually the green that's formed is actually a bit darker than the initial colors because the more color you mix together, the less light it can reflect overall, and an object that doesn't reflect any visible light appears black. And so if you eventually mix together like all different colors of paint, you end up with something that approaches black.
05:00
And this is known as subtractive color, where as you continuously add color, it gets darker and darker. And there is a way to represent subtractive color on the computer as well, known as the CMYK color model, which uses cyan, magenta, and yellow as its primary colors and it's also not the most intuitive thing in the world. You have yellow and magenta making red,
05:21
yellow and cyan making green, and magenta and cyan making blue. And this is the color format that's often used in printing, because printing is subtractive. You usually start off with a white sheet of paper and then you add inks on it to produce the color. And as much as it's useful for printing, CMYK still doesn't always give you
05:41
the result that you would get when mixing paints. And this also makes sense in the form of CMYK. Blue is cyan and magenta, and yellow is full magenta, so when you mix them all together, you get black. So now what? How can we get color mixing so that it more accurately represents something that might actually show up in paints?
06:04
We can try doing other color spaces. Since all colors on a computer are just a bunch of numbers that are then translated into pixels somehow, we can try to create a color space that can represent blending between colors really easily. But that will take probably another 10 minutes
06:22
for me to explain. And also, because a computer uses RGB, you would have to convert them all to RGB to display on screen anyway. So, since you can blend paints in real life and have them show up as colors, there's bound to be some sort of physics equation to be able to do that, and then we can simulate that on the computer.
06:42
And there sort of is. There's an equation called the Kubelka Monk Theory, which was surprisingly un-Google-able. There's like 50 different variations of it, of which none of them are very well explained, so I tried my best. But in a nutshell, it returns the reflectance of light for a layer of pigment on a solid surface.
07:02
That's not a nutshell. So more visually, again, sorry for the people in the back, you have here a layer of pigment, which you can see as this combination of blue and white ink. And then the inputs of the Kubelka Monk Theory,
07:21
you have white light shining down on this pigment, but we assume that it's on a surface solid enough that the light cannot go through it. And then some other inputs are the physical qualities of this pigment, so like the scattering and the absorption of light, which I don't understand too well, so I'll just leave it at that. And finally, then once you have all these inputs,
07:42
you can calculate the reflectance of light and figure out what color the light is coming from this layer. And so the Kubelka Monk Theory is actually used in actual art applications. Creta at one point had a painterly color mixer
08:02
that implemented a variant of the Kubelka Monk Theory to do their color blending. I would have a live demo, but unfortunately, this code was removed in 2012 because it was no longer being maintained. Which brings me to a big problem with using the Kubelka Monk Theory is that it's very complicated to implement. And partially because it requires a lot of information about your colors that's not provided by RGB.
08:23
You need to know how transparent each of your pigments are, you need to know how much light it scatters, how much it absorbs, and that's not given to you based off of your computer code, so you have to make a lot of assumptions. But if you want something that's really physically accurate to a point, it might fail in some edge cases, then the Kubelka Monk Theory is the way to go.
08:42
But can we do better? We go back to our old arch-nemesis, blue and yellow, which in RGB, as you may recall, gives you gray when you mix them together. But we don't want to make them have gray. We want them to combine and make green. So instead of going straight from blue to yellow, we put green as a midpoint
09:02
and then linearly interpolate from blue to green and then green to yellow. And already this looks a lot better because blue to green, the linear interpolation gives you something that looks like bluish green and then from green to yellow gives you a lighter green. But if we wanted to do even better and have a more accurate teal, we could put even more midpoints
09:23
and sort of manually hint at where we want this blending to go. And this is great because then you have some points which you know are accurate or you know are what you want, but then you can have the computer interpolate the rest for those in-between points
09:40
and then you do that for the entire color spectrum. And this is actually the method that is used in the iPad app Paper. They went on a apparently year-long journey to try to find the best method to make their color mixer and actually at some point implemented kubelka monk before deciding not to use it because it was too realistic.
10:01
The problem with color mixing is that sometimes paints don't behave in ways that you expect colors to. Like we're taught in elementary school that blue and yellow make green, but sometimes paints do that and sometimes they don't. And if you want to have it so that it actually plays to what people's expectations are,
10:21
they realize that the best way to make things that looked good was to do it all manually. And for a digital art app, sometimes you have to trump realistic applications with what looks the best. And on that note, actually I showed you the color wheel at the beginning and claimed this was how colors mix together. These colors are all chosen manually as well.
10:42
So yeah, it's just colors are not really intuitive and some things work well and some things don't. So in summary, mixing colors is complicated. And part of that is because color representation in computers is not optimized for blending colors. They just tell you these are the colors
11:00
that you can show on the computer, not this is the relationship between the colors. But in order to mix colors, you can use physics or do it all manually to get realistic or not realistic color blending. Thank you.