• Hey Guest! Ever feel like entering a Game Jam, but the time limit is always too much pressure? We get it... You lead a hectic life and dedicating 3 whole days to make a game just doesn't work for you! So, why not enter the GMC SLOW JAM? Take your time! Kick back and make your game over 4 months! Interested? Then just click here!

Help with understanding colours

Karlstens

Member
I'm working to gain an understanding of how colours work within GMS2.3+ through draw_*shape*_colour() commands to figure colours out. I think my below sample code shows what I'm doing, and perhaps why I'm finding the results confusing - in that, I would expect both the the final shape in the for-loop (which looks correct) to also be the result of a simple rectangle, but instead I just get one colour of red...

Here I'm exploring Hue, Saturation and Value (HSV) - which is super cool!!! But my current point of confusion is with how a coloured shape renders.

1618092655128.png

Code:
// Draws a colour spectrum, cool! That's what I expected...
for ( var _i=0; _i < 255; _i++;) {
draw_rectangle_colour(_i,0,_i,80,make_colour_hsv(_i,255,255),make_colour_hsv(_i,255,255),make_colour_hsv(_i,255,255),make_colour_hsv(_i,255,255),false);
    };
 
//Doesn't draw a colour spectrum... but I would thing that it should, because the hue is spanning from 0 to 255, from left to right?
draw_rectangle_colour(0,80,255,160,make_colour_hsv(0,255,255),make_colour_hsv(255,255,255),make_colour_hsv(255,255,255),make_colour_hsv(0,255,255),false);
GameMaker manual reads for colour shapes;

If it is filled you can define the individual colours for each corner point and if these colours are not the same, you will get a gradient effect from one to the other (the colour settings will over-ride the base colour set with the function draw_set_colour).

But as per my example above, this isn't working for hsv, and I'd like to know why.

Further to this, I plan to continue updating this thread as I progress through colour theory and practice, such as tricks for dealing with the various RGB, RGBA, BGR, ABGR and other rainbow coloured landmines that I expect to step onto through this venture.

Also, if anyone knows any cool and handy tips and tricks for colours, feel free to post them here too. :)
 
Last edited:

Simon Gust

Member
I think it always takes the minimal interpolation distance, which is 0 at "from red to red".

To get a feeling, you can test with this
Code:
n = (n + 1) mod 255;
draw_rectangle_colour(0,180,255,240,make_colour_hsv(0,255,255),make_colour_hsv(n,255,255),make_colour_hsv(n,255,255),make_colour_hsv(0,255,255),false);
If you interpolate from red to cyan (opposites), it will destroy the saturation because it cannot blend these 2 colors while being fully saturated.
1618096001028.png
1618096013172.png
you can see what is happening with the color ball, the color goes in a straight line and if the interpolation distance is greater than 1, it touches desaturation zone.
In other words, draw_rectangle_color isn't the proper function.

Maybe a shader would do the trick. I just use a handmade rainbow sprite.
 

Roldy

Member
The colors in hardware and standard shaders are processed red blue green. The hsv functions you are using are simply helper utilities that convert to hsv to rgb.

hsv (0,1,1) = rgb (1, 0, 0)
hsv (1,1,1) = rgb (1, 0, 0)

Interpolating between rgb(1, 0, 0) and rgb (1, 0, 0) is going to produce solid rgb (1, 0, 0) across the range.


As @Simon Gust suggested, a custom shader could produce the results you are looking for if you want to work with hsv.
 

Karlstens

Member
I think it always takes the minimal interpolation distance, which is 0 at "from red to red".

To get a feeling, you can test with this
Code:
n = (n + 1) mod 255;
draw_rectangle_colour(0,180,255,240,make_colour_hsv(0,255,255),make_colour_hsv(n,255,255),make_colour_hsv(n,255,255),make_colour_hsv(0,255,255),false);
If you interpolate from red to cyan (opposites), it will destroy the saturation because it cannot blend these 2 colors while being fully saturated.
View attachment 39438
View attachment 39439
you can see what is happening with the color ball, the color goes in a straight line and if the interpolation distance is greater than 1, it touches desaturation zone.
In other words, draw_rectangle_color isn't the proper function.

Maybe a shader would do the trick. I just use a handmade rainbow sprite.
Oh cool! I see that now with this alteration;

Code:
_val[0] = (((current_time/50) mod 255))
_val[1] = ((((current_time/50)+127) mod 255))

draw_rectangle_colour(0,80,255,160,make_colour_hsv(_val[0],255,255),make_colour_hsv(_val[1],255,255),make_colour_hsv(_val[1],255,255),make_colour_hsv(_val[0],255,255),false);
draw_text(0,0,_val[0]);
draw_text(0,15,_val[1]);


This is so very interesting. I've never pulled apart colour theory to this degree before and it has myself thinking in new and different ways.

With regards to shaders, what would some sample shader code look like that achieves the same effect?
 
Top