The Parthenon and Crappy Colors

Stas Lisetsky  —  3 months, 3 weeks ago [Edited 3 hours, 34 minutes later]
I just spent a week debugging (and understanding) color in Cascade. Premultiplied alpha, sRGB, gamma-correction - all that stuff. Citizen scientific calculator, lots of paper and my favorite Papermate Sharpwiter pencils.

Today we had a discussion with our designer about color correctness. Since our tool is for web - we have to be compatible with modern browsers, meaning I have to use non-gamma-corrected gradients.

I'm generally pro- incorrect stuff, if it looks correct. Take this example (familiar to many).



The individual colors on the second gradient may be mathematically right (hopefully! omg), but the overall gradient looks a bit uneven. The black falloff is a bit too sharp. And too much white on the right. Right?

This reminds me of a trick from architecture - where they make long vertical or horizontal things a bit curved- so that they look perfectly straight. The 'front steps' (insert actual architecrute term here) of the Parthenon do that - I saw it in person and it's unbelievably cool.



So I'm fine with wrong colors in black-white gradient. The (sorta) even color distribution version just feels better.

But there's a thing. We can get away with incorrect stuff only when it looks correct. But If we look at the green-red example - the browser version of the gradient looks like diarrhea in the middle.



And the correct gradient looks juicy and brightness looks evenly distributed.

So I'm an insane person who considers taking stuff like that into account. And maybe I'll try to use 'bad' colors for black-white gradients and 'right' colors for stuff like red-green.
I also considered mitigating the 'fringe' effect on my hue gradient, by tweaking colors.
See how the subpixels make it look like blue bleeds out.



But unfortunately, we have a million other things to do, and this color thing is, I think, can be left for a pre-release polish pass.

But we still had to make a decision. And it was simple. We will be browser-compatible. But we'll let people know, that it's not because we don't care. It's because we do.



Boom.

(Disclaimer: I'm not a graphics professional, I have no idea what I'm doing most of the time. I'm learning and trying to make things look and work right. This post might contain wrong claims and incorrect stuff. So this is more like me thinking aloud.)
Log in to comment