Why add a transparent border to a texture?

Question

I've seen game developers give advice to add a transparent border around sprites, for example around 3:00 minutes into this tutorial.

Why should we leave a transparent border around a texture before using it in these cases?

And how broad should this border be?

Also I found one of my friends saying to me that when he rendered multiple copies of same texture by u v coordinates, he got some white lines at texture to texture intersections.

Adding borders fixed that as per the answer he got from his question at this site.

Answer 1

Why do we leave a transparent border in any texture before using it in opengl or any other texture loading place in games.

We don't always.

Sometimes we do, however. It all depends on the requirements of the texture we are loading. Some examples:

• If it is a standard texture for a wall, floor or similar, and if the texture is to be tiled, we don't use a border at all. A border will break up the tiling and look horrible.

• If it is in a texture atlas and is not to be mipmapped, we might consider a 1 texel border to prevent adjacent textures in the atlas from bleeding into each other with linear filtering. Mipmapped textures in an atlas will need a larger border.

• If it is a sprite texture we might consider adding a border so that linear filtering at the edges looks correct.

• If it is a cubemap for a skybox, environment map, or similar, we don't don't use a border at all. A border will prevent seamless blending between adjacent faces.

• If it is a spritesheet for an animated character or effect, we might add borders so that all frames in the animation are the same size, which simplifies texture addressing.

Answer 2

A border helps to to avoid some artifacts of upscaling with linear interpolation.

Note that bottom and right corners remain smooth, while top and left ones do not.

Since the author of the video doesn't use linear filtering, the border seems to be completely pointless.

Answer 3

The "border" around the texture you linked is simply empty space, because the character has multiple animation states and at some point her width is bigger than on other points (like when her arms are right next to her body versus when her arms are in front of her). It's easier to make every state have the same width than to make the engine guess how wide they are.