First, here is what I'm talking about (I changed the contrast to make it more visable, since it's not really visible in still images):

enter image description here

Ingore the chat box, I was spamming buttons to see which one took a screenshot :P

Hopefully you can see clearly what I'm talking about. Basically, those lines in the sky (they're only visible in the top part of the image). This seems to occur for me any time I use a still object and move lighting across it (the faster the light, the more the lines are visible to the player). What causes this? It seems to happen in lots of games though (especially in the sky, since it's pretty much still). Is there any way to remove them (I'm not looking for API specific because it seems to occur in all APIs)?

  • \$\begingroup\$ It looks like artifacts from compression or small color depth to me. When using gradients in webdesign, you see the same discontinuities. But I don't know the reason though. \$\endgroup\$ – danijar Dec 1 '13 at 15:08

As danijar says, it might be due to a compression, but let me remind you what is Colour in computer.

You may already know that a color is made by RGB components, which can represent 16 777 216 different colors (256 red * 256 green * 256 blue). But it's quite small compared to the real world :)

You can see the limitations in soft gradients with few color changes like in your picture, because there's big chunks of colors varying of certainly the smallest unity.

Over that, compression makes calculations faster and reduces memory usage, but with a loss of color information.

You can color objects in several ways, but the next two are the most commonly used:

  • If you color your models with vertices, a color interpolation is done between two vertices. (If you don't know, a vertex can handle several data other that it's own position, like depth, normal or color).

  • If you color your models with textures, then you have more control of how an object looks by flattening textures on faces, but textures really consumes a lot of memory.

Now you know how to color your objects, but how to avoid this bad color banding side effect ? Some people have already thought to this problem.

If you don't use textures, the only solution is to use vertex shaders. Unfortunately, I couldn't tell you how to make one.

Else, just dither your texture with wavelet dithering. It's a well fitted algorithm.

You can see how it looks without and with dithering: Gradients without and with dithering


Not the answer you're looking for? Browse other questions tagged or ask your own question.