Friday Facts #172 - Blending and Rendering

Posted by Posila & V453000 on 2017-01-06, all posts

Alpha blending and pre-multiplied alpha

From time to time there is some confusion inside the team about how sprites are blended with the background when rendering, and what kind of effects we are able to achieve by tinting the sprites. So I (Posila) have decided to write up a few paragraphs about how alpha blending works (not only in Factorio), and what it means when someone talks about pre-multiplied alpha.

When the GPU is figuring out what color it should draw on a particular pixel position, it runs a blending operation on just the computed pixel color and original color in the render target. There are several common blending operation modes (additive, multiplicative, overwrite, etc.), but the most common one used in Factorio is alpha blending. It calculates the resulting color using following equation (usually the new color is called 'source' and the background color that is being overwritten is called 'destination'):

You can easily see that a source with alpha 0 will be fully transparent and the one with alpha 1 will be fully opaque.

In games it is common to use a pre-multiplied alpha, which means the color channels of textures are stored in memory being already pre-multiplied by the alpha channel. Alpha blending with pre-multiplied alpha uses a simplified equation:

Besides a slight performance gain from the GPU not having to do bunch of multiplication all the time, this equation allow us to do some extra effects we couldn't do without pre-multiplied alpha.

Factorio renders sprites as colored polygons with texture. We usually refer to the color of a polygon as the 'tint', and every pixel of a sprite is multiplied with its tint. This is useful mainly for color masks, for example the diesel locomotive has a grayscale color mask which is tinted by the color it has set. Tints should have a pre-multiplied alpha too, but they don't have to, so we can use it to lie about the colors and alpha to the GPU. For example if we use tint {r=1,g=1,b=1,a=0} we can simplify previous equation even further and we get additive blending:

This is great because that means we can switch between alpha and additive blending without having to change the blending state in graphics API, which would break sprite batching and result in an increase in the CPU cost of rendering.

For some effects we use a tint with alpha between 0 and 1 heavily. This makes the result appear to be a combination of additive and alpha blending. For example, fire would eventually blend into a single solid color with pure additive blending, or would not look like it is emitting light with pure alpha blending. By using tint (1, 1, 1, 0.35) on the flame sprites, the brightness of overlapping flames adds up partially, but the flames don't completely lose their details. The same trick is used for smoke.

Textures with pre-multiplied alpha also produce better results in texture filtering, which is probably the main reason why they are so widely used in the videogame industry.

Rail related things

Hello! Since I (V453000) last wrote the FFF about rails, I have spent a lot more time to actually work on them further. Just finishing the rails to the current state was a lot of work, and since the new angle of ties broke train signals pretty badly, it was a good time to make these in high resolution as well.

Per usual, as I started digging into it deeper and deeper, I discovered more and more problems like the inconsistent order of sprites, newly appearing issues with sprite drawing (the normal resolution sprites simply didn't show it, but in high resolution old issues become visible), or ridiculous problems like straight rail having different amount of ties in vertical and horizontal, so the chain signal metal plate wouldn't fit them.

Slowly but surely I went over all of the problems, the next mountain to climb was the train stop - since rail sizes changed, the train stop wouldn't fit the new rails anymore. Apart from that, the train stop is from a time when we made high resolution sprites differently, more and more reasons to do it as soon as possible.

There weren't as many unexpected problems as with the signals, just a legion of super specific layering cases, which were probably solved wrongly in the previous version.

There are probably going to be some small changes, but here you can see a little preview:

As always, let us know what you think on our forums.