Hello
how could i grey a texture ?
i.e: i am creating a 2d texture, which is a png for ex.
I want to change the texture ti make it look "all greyed" like if it was "disabled" (basically those texture are buttons and sometimes they would have to be in the disabled state.
"greying" a texture
If you want to use it for GUI, it's not simply "greying" the image. usually disabled buttons have a separate texture.
For example, what happens, if your button is grayscale itself? Just like almost every buttons in Windows. You can't "grey" it, it will be the same after greying the grey colours. Have separate textures for disabled items (separate means they should be in the same atlas)
For example, what happens, if your button is grayscale itself? Just like almost every buttons in Windows. You can't "grey" it, it will be the same after greying the grey colours. Have separate textures for disabled items (separate means they should be in the same atlas)
Colorblind people aren't going to like it.
Grayscale is OK, but make sure to reduce constrast too. Otherwise, somebody who's colorblind may not be able to notice the difference at all.
Grayscale is OK, but make sure to reduce constrast too. Otherwise, somebody who's colorblind may not be able to notice the difference at all.
Quote:Original post by Sik_the_hedgehog
Colorblind people aren't going to like it.
Grayscale is OK, but make sure to reduce constrast too. Otherwise, somebody who's colorblind may not be able to notice the difference at all.
Most colorblind people (the vast majority) can tell the difference between colored and grayscale images perfectly well.
EDIT: In other words, design like this is worth considering since as many as 10% of all men are colorblind, but it's not the kind of colorblind would hamper discrimination between colored/not-colored, so here I'd say it's a non-issue.
the easiest/best method is to have 2 textures for each image (one color + one greyscale)
u could also do this in a shader
if ( color )
gl_FragColor.xyz = color;
else
gl_FragColor.xyz = vec3( color.x * 0.3 + color.y * 0.59 + color.z * 0.11 );
u could also do this in a shader
if ( color )
gl_FragColor.xyz = color;
else
gl_FragColor.xyz = vec3( color.x * 0.3 + color.y * 0.59 + color.z * 0.11 );
You probably need the texture in rgb format, but you can convert it to hsl, replace the saturation channel with all black, and then revert to rgb. You can probably simplify that algorithm (maybe that's what zedz's algorithm is), and maybe that doesn't yield the gray you want, but that will work.
You might want to test it on a few of your icons in your image editor of choice before you implement it.
You might want to test it on a few of your icons in your image editor of choice before you implement it.
Quote:Original post by Shinkage
Most colorblind people (the vast majority) can tell the difference between colored and grayscale images perfectly well.
Not all of them, and it's easy to work around, really =P And I find reduced contrast better for disabled stuff anyways (despite I'm the exact opposite of colorblind), because then the enabled stuff (with more contrast) tends to take more attention from the eye.
OT, regarding color blindness:
I was curious and found those tools:
* http://live.gnome.org/GAP/ColorBlind
* https://addons.mozilla.org/de/firefox/addon/5614/
edit2:
* https://addons.mozilla.org/en-US/firefox/addon/5001/
* http://www.colblindor.com/2008/12/23/15-tools-color-blindness/
-> http://colororacle.cartography.ch/
edit1: It would be interesting if such stuff and similar would be available through some color profiles in the Operating System.
edit3: Okay, I seriously recommend colororacle, it comes without installation and is for Linux, Mac, Windows :)
I was curious and found those tools:
* http://live.gnome.org/GAP/ColorBlind
* https://addons.mozilla.org/de/firefox/addon/5614/
edit2:
* https://addons.mozilla.org/en-US/firefox/addon/5001/
* http://www.colblindor.com/2008/12/23/15-tools-color-blindness/
-> http://colororacle.cartography.ch/
edit1: It would be interesting if such stuff and similar would be available through some color profiles in the Operating System.
edit3: Okay, I seriously recommend colororacle, it comes without installation and is for Linux, Mac, Windows :)
You don't need a separate texture if all you really want to implement is a greyed version of the texture, maybe with reduced contrast.
You could, like zedz indicated, calculate the luminance for each pixel with the common formula: y = 0.30* r + 0.59 * g + 0.11 * b and modifiy it to reduce the contrast as well.
You could, like zedz indicated, calculate the luminance for each pixel with the common formula: y = 0.30* r + 0.59 * g + 0.11 * b and modifiy it to reduce the contrast as well.
This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement
