• 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!

[SOLVED] Shader Q: looking for some direction

Bentley

Member
Long story short, I read about a room transition using a sprite that had alpha values from 0 to 255 swirled from top left to bottom right.

A shader captured the alpha values and then I believe they were drawn over the application surface for a room transition.

I am new to shaders but I think I could find the alpha values in the fragment shader. But how would I save them onto an image and draw that image over the screen in the exact pattern of the swirl?

Sorry if my question is poorly worded. Let me know if I can clear anything up (or just point you to the "work in progress" page I'm talking about).
 

NightFrost

Member
In shader vec4 color information, alpha is the A in the RGBA value. So if you have for example "basecolor" vec4 variable, basecolor.a would be the alpha. Shaders can be used to create transition wipes across the screen, but I'm unsure what you mean with a swirl.
 

Bentley

Member
He called it an alpha look up table and used it like so below (thx for response btw):
This is KIND OF cool, but nothing to write home about. So I made a weird texture like this that blends from alpha to solid:


Then I used a shader to use that texture as an "Alpha-look-up-table" of sorts. The result looked like this:
 

RujiK

Member
Hey Bentley,

"Alpha look up table" was a poor choice of words on my part. It's more like I just take the alpha value of the transition texture (The black and white thing) and use that for the alpha of the screen texture.

So I take a screenshot of BEFORE THE TRANSITION and apply the alpha of the gradient texture. (gpu_set_colorwriteenable(0,0,0,1) ) I save that as a surface (transition_surface) and the results would look like this with a left to right alpha gradient:

(White would be alpha. Note that the WHITE area still has all of the colors of the original image. It's just at 0.0 alpha.)

The transition_surface does not change at all after I have the above image!

Now that I have a transition surface, I draw the application surface normally and then draw the transition_surface on top of it using a shader like this:

Code:
varying vec2 v_vTexcoord;

uniform float alpha_threshold; //this changes from 0 to 1
void main()
{
    vec4 col = texture2D( gm_BaseTexture, v_vTexcoord );
    if (col.a < alpha_threshold) {discard;}
                            else {gl_FragColor = vec4(col.r, col.g, col.b, 1.0);}
}
The idea came from this video:

(It's a unity tutorial, but the process is very similar.) Hope that helps.
 

Bentley

Member
Hey Bentley,

"Alpha look up table" was a poor choice of words on my part. It's more like I just take the alpha value of the transition texture (The black and white thing) and use that for the alpha of the screen texture.

So I take a screenshot of BEFORE THE TRANSITION and apply the alpha of the gradient texture. (gpu_set_colorwriteenable(0,0,0,1) ) I save that as a surface (transition_surface) and the results would look like this with a left to right alpha gradient:

(White would be alpha. Note that the WHITE area still has all of the colors of the original image. It's just at 0.0 alpha.)

The transition_surface does not change at all after I have the above image!

Now that I have a transition surface, I draw the application surface normally and then draw the transition_surface on top of it using a shader like this:

Code:
varying vec2 v_vTexcoord;

uniform float alpha_threshold; //this changes from 0 to 1
void main()
{
    vec4 col = texture2D( gm_BaseTexture, v_vTexcoord );
    if (col.a < alpha_threshold) {discard;}
                            else {gl_FragColor = vec4(col.r, col.g, col.b, 1.0);}
}
The idea came from this video:

(It's a unity tutorial, but the process is very similar.) Hope that helps.
Hey, I really appreciate the reply and you sharing with me. Thx again my friend.
 
Top