Feature: Better support for gray scale workflow

[novhack]

I've been currently thinking that I would love to try to make pixel art first starting with a grey scale image and then colouring it.
This workflow has been used a lot by Brandon James Greer on Youtube and shown in this video.

I think that these two features would be really neat to have in the future:

1. Ability for bucket tool to only affect a single HSV value (maybe 3 check boxes in properties?) - if only hue is enabled it would allow users to easily repaint a grey scale image without affecting the shading.
2. A gradient map dialog where user could select which two colours will replace darkest and lightest colours in the image and it would generate a gradient between them affecting the whole image. The video I linked shows the feature quite well.

[TheGoklayeh]

Oh yes that would be lovely.
The gradient map used in the video after the greyscale art is awesome as well, but I dunno if this would be doable in Godot.

[behreajj]

Hi folks,

Coming from this, #557 (review), I'd be willing to contribute to the development of this feature.

The desaturated image effect could be considered the default gradient map with two colors, black and white and smooth interpolation. So either desaturation could be replaced by a gradient map, or could be the template for a gradient map's development.

Unfortunately, I know next-to-nothing about creating and editing dialogs in Godot's UI system, so I just wrote the shader and hard-coded some inputs to make this example.

https://github.com/behreajj/Pixelorama/blob/gradient-map-382/src/Shaders/Desaturate.shader

The test image comes from Wikipedia: https://en.wikipedia.org/wiki/File:Judith_Beheading_Holofernes_-_Caravaggio.jpg .

Best,
Jeremy

[OverloadedOrama]

I made a gradient map shader that seems to produce the same result as the video. I tested other colors and compared it to Krita's gradient map and the results seem to be the same, although I'm not sure about alpha. The shader is very simple, barely 10 lines of code (without the selection-related mask code), because it uses a GradientTexture as a uniform sampler 2D. The biggest issue would be to make a proper gradient editor UI in Pixelorama that supports multiple colors and offsets.

shader_type canvas_item;

uniform sampler2D map;  // GradientTexture

void fragment() {
	COLOR = texture(TEXTURE, UV);
	float value = (0.2126 * COLOR.r) + (0.7152 * COLOR.g) + (0.0722 * COLOR.b);
	vec4 gradient_color = texture(map, vec2(value, 0.0));
	COLOR = gradient_color;
}

[OverloadedOrama]

I implemented the gradient map dialog in c9f0301, it should work fine but testing and feedback is welcome. Massive thanks to Material Maker for the original gradient edit code, which I modified.

2022-06-10.00-15-25.mp4