Shader to create transparency? (I need to use JPG)

[alberto_lara]

I was able to create a shader that returns magenta as transparent, with a small tolerance margin:

Code: Select all

uniform vec2 imageSize;

bool isMagenta(vec4 pixel) {
  float errorMargin = 0.05;
  if (
    (pixel.r >= (1 - errorMargin) && pixel.r <= 1) &&
    (pixel.g >= 0 && pixel.g <= errorMargin) &&
    (pixel.b >= (1 - errorMargin) && pixel.b <= 1)
  ) {
    return true;
  } else {
    return false;
  }
}

vec4 effect(vec4 loveColor, Image tex, vec2 uv, vec2 screenPos) {
  vec2 uvPx = uv * imageSize; // I don't really know what this or the other next 2 lines do
  vec2 f = fract(uvPx); //
  vec4 pixel = Texel(tex, uv);
  vec4 transparent = vec4(0, 0, 0, 0);

  if (isMagenta(pixel)) {
    return transparent;
  } else {
    return pixel;
  }
}

What I want to achieve now is is something similar but using anti aliasing, so I need this:



To be this:



I'm guessing GLSL has something out of the box for this but I'm a total noob on it, any help would be appreciated. Thanks!

[pgimeno]

If your image is black and white, then yes it can be done. But in general it's not possible to tell apart the magenta used for transparency and partially blended with other colours, from the colour of parts of the image.

Not sure why you're limited to JPEG, but maybe you can have a separate greyscale image with the alpha?

[alberto_lara]

This is for a game I'm creating and I'll need quite a few hi res images, so that's why I need JPG, PNG would make it way too "heavy" (we're talking about digital art). I think I'll stick to no AA then. Thanks!

[darkfrei]

You can use png optimization tool mo make it smaller.