Best size for textures

It’s interesting to see that there doesn’t exists concrete descriptions on how to choose the best size for textures. I’ve found only some rule of thumb like “The texture should be double in size as your final rendering”. But is this correct? After looking behind the scene and do some tests to prove the theory I come along to write this text.

The real kind of a texture

When you work with textures, especialy in combination with RS3D, where you can map and use a texture for many different kinds of things. You can not only use a texture to paint the surface of an object, but also to describe where the surface should be visible by using the scope channel, or you can describe with a texture where the surface should reflect the environment, or you can describe where specular lights should be visible on the surface, or you can describe more complex and special effects should occur, like, where on the surface shadows from other objects should occur, or where the colour of the surface should be depended of the viewing angel, or where the reflections of the environment should be blurred and where not. So, within a texture you are able to define positions. Where something should happen. When you want an effect should not affect the whole surface, with a texture you can easely describe where the effect should affect the surface.

But textures consists of an additional dimension of information. The first is the position, the second is the value. The value is used in two ways. Sometimes it’s simply copied to a RS3D channel. For example when you use a texture to color a surface, you describe with the texture where the color channel of RS3D should have which value. Other times you describe with a texture where and how strong should an effect affect the calculation of the surface. You could for example use a texture to describe where the reflection of the environment should be how strong blurred.

So, a texture is at first not a picture or an image, it’s at first a dataset! It’s an ordered collection of values. A texture file on disk is at first a container which holds data. Inside RS3D you define how this data is beeing used. The texture file itself doesn’t hold this information!

The texture file often holds many datasets. Each dataset in a normal texture file consists of integer values in the range from 0 to 255. When you use a texture to paint a surface with a color picture, your texture file will at least hold 3 datasets. One of the values for the red color channel, one for the green color channel and one for the blue color channel.

Theoreticaly a texture file can hold any number of datasets. In the practical way many file formats allow only 3 or 4 datasets. An exception is the PSD file format. Here you can put in an unlimited number of datasets. RS3D is able to read and use this datasets.

To view textures simply as datasets helps you to find a solution to a problem. It makes your daily using of effects easier. For example, if you want to restrict the effect to depend the color of the surface to the viewing angle to an irregular area on the surface, it’s natural for you to use a texture as a solution to this problem if you see a texture as a dataset which simply holds positions and values.

The amount of detail

At a first look, the size of a texture depends on the amount of information the texture should hold. For example: If the texture should hold the image of a monocoloured square, we need only a texture of the size of 1x1 pixel. Simply because a square has an aspect ratio of 1:1 and in the practical way normaly a pixel is drawn as a square. If we want a rectangle with the aspect ratio of 1.5:3 we need a texture of the size of 1x2 pixel. Simply because we don’t have half pixels. We only have full sized pixels. If we want a full screen rectangle on a modern 16:9 TV, we only need a texture size of 16x9 pixel. Regardless of the resolution of the output medium, inside our 16x9 sized texture there is all information available to resize the texture to any resolution. There even doesn’t exists more information to describe a rectangle with the aspect ratio of 16:9 in the world!

But mostly it’s not that easy. Think of a rectangle which fills a DIN A4 sheet of paper. The DIN paper formats are really beutyfull and well designed. Every DIN Ax sheet of paper has an aspect ratio of 1:(2 sqrt). But here we have a problem: Which size must have a texture with a ratio of 1:(2 sqrt)? A solution with a acuracy of 100% simply doesn’t exists in this case! (2 sqrt) is a number which can’t precisely written down as a regular number. It’s an irregular number. It’s something like 1.4142 or 1.4142135623731, it simply depends on the resolution you use. So, in this case you must simply choose the resolution you need.

Another extreme example is the Apfelmännchen. The Apfelmännchen has an infinite resolution. But even more simple figures have an infinite resolution. Circles or slopy lines have an infinite resolution. This means in a practical way, each image is made of objects of infinite resolution

So, here you must think about how much detail should be visible. The amount of detail is determined by the size of the texture in your final rendering. Higher texture sizes mean more detail. But the size is given by the size of the texture in your final rendering. So, more than the detail which is possible to include in the texture given by the size of the texture in the final rendering is not possible.

How the renderer works with textures

When the renderer renders a scene which consists of a texture, the renderer scans the texture like a flatbed scanner. The only difference is, that the renderer does this with a variable resolution, because often the position of the texture in the scene isn’t perpendicular to the camera, but often distorted due to the perspective. Or the surface isn’t flat like a sphere or something other non flat, organic surface.

This means, that the texture is dynamicaly resized while rendered. Mostly every point of the texture will be scanned with another resolution.

Aliasing, or, why Anti-Aliasing is so important

Anti-Aliasing has in the field of computer graphics two meanings.

The first meaning and often used in 2D graphics is to use beside simple black and white pixels another dimension to put in details. This dimension is the dimension of colour. It can be seen as a counterpart to dithering. Colour printers use dithering. Most colour printers only have 4 colour. But they have a resolution. So they use simply more points to simulate more colours. This is also used by graphic artists on the C64. This machine had only 16 fixed colours. To create shadings and such alike, the artist mixes this colours by placing pixels with different colours nearby to create the illusion of a higher colour depth. But due to the low resolution of the C64, this results in this special, sometimes noisy style of the graphics on the C64. But, as you pluged back in time your C64 to your not so good TV at this time, the TV blurs the colours and the illusion works.

On todays graphics displays, we have a higher resolution, something around 80 Pixels per inch, and an amount of around 16.8 Millions of colours. This technique can be used to draw lines which are thinner than 1 Pixel! This trick was also used in the good old days of the Amiga. Look at the following picture. All lines have a thickness of 1 Pixel. But by using greyscales it’s possible to create the illusion of lines which are thinner than 1 Pixel. The beginning and the ending of the lines which uses greyscales don’t look only to fade out, but they look like to getting thinner to the beginning and to the ending. The middle of the line looks slightly thicker.

A line thinner as a pixel

It is also used to add more details, to create a sharper look. The left circle is drawn without Anti-Aliasing, the second with Anti-Aliasing.

A circle without AntiAliasing.A circle with AntiAliasing.

It must be emphasized that Anti-Aliasing is not the same as blurring! Look at the edges of straight lines. There are no greyscaled pixels used! Anti-Aliasing is a technique where details from the source are not only displayed by the position of black and white pixels, but also by adding shades of colour to encode more detail into a single pixel. The first circle only need 2 colours, the second circle need 30 colours.

The second meaning of Anti-Aliasing is to compensate the aliasing effect. The core keyword here is the so called Nyquist frequency. The double of this frequency must be used when a signal should be sampled. The Nyquist frequency is the half of the sampling rate. The Nyquist frequency is the highest frequency in the source to be scanned. The theory says, that the sampling frequency has to be double than the highest frequency in the signal to be scanned. When the frequency in the source is higher then the half of the scanning frequency, aliasing effect will be the result. When you put a picture on your flatbed scanner and scan it with a too low frequency, you’ll get moire effects. This moire effect is a kind of aliasing effect. Or think of films, where you see the wheel of a car. When the car begins to drive, the wheels rotates forward. But as the speed of the car increases, the wheel begins to rotate backwards! This is the result of the relative low number of images per second compared to the high rotation speed of the wheel. This is also a kind of an aliasing effect. Or take a look at the Audio CD. The sampling rate of the content of an Audio CD is 44.1 kHz. But the highest frequency of the analog signal is only 22.05 kHz. At the recording, there is putted a low pass filter between the source signal and the A/D converter. This filter cuts all frequencies higher than 22.05 kHz. If higher frequencies would reach the A/D converter, this would result in aliasing effects. This means, in the digitised signal there would be low frequencies, which are impossible to filter out afterwards.

If we look closer, we see that the audio guys are sampling the source with a much higher frequency than the source includes. Their advantages is, that in the final they recreate the source out of their digitised signals. Compared to us graphicans, we are using the digitised data directly as a final result. This means, we have to scan the source signal with a higher resolution than we would display the result! If we transform this frequency to pixels, we have to scan an image at a minimum with the number of samples the number of pixels the source has to don’t get aliasing effects! If we are using more samples, we waste time, simply because the source doesn’t has more pixels. But if we use less samples we get aliasing effects and if we use a lower sample number than the size of the texture in the final rendering we get blocky pictures.

The following two images demonstrates the anti aliasing effect of Realsoft3D. The first line is the original texture with a size of 16x1 pixel. The next lines are the output of Realsoft3D by different rendering sizes. The left side shows the output without anti aliasing, the right side with full scene anti aliasing at level 6.

Before going further, try to think what would be the correct image when an image of the size 16x1 pixels which consists only alternating black and white pixels is scaled down?

The left picture without anti aliasing shows big errors. The most extreme is the output with 8x1 pixels. All pixels are simply white!

The right side shows another type of error. Many greyscales. But when you think about what you see in the real world, the right side shows more the real world. Think of a fence. When you look close to it, you’ll see all the details. When you go far away, you’ll see the fence only as a monocoloured area with subtile details shown by colour differences. And that’s what the anti aliasing effect trys to do: To simulate the look of an image far away when it gets smaller.

A texture which is smaller then the final output

Gimp works

Source image 50x50Destination image 100x100
Scaled without interpolationScaled with linear interpolationScaled with qubic interpolation
Source without anti aliasing
Source with anti aliasing

Realsoft3D works

Source image - 120x120 without Anti Aliasing Rendered image - 300x300 without any filtering
Source image - 120x120 with Anti Aliasing Rendered image - 300x300 without any filtering but from Anti Aliasised Source image

With the table we see that an upscaling is a bad thing. The destination image will be more blocky or more blurred than the source image. This results simply from the fact, that there is not more information inside the source image. In the examples above the computer is only capable of upscale each pixel for example 4 times. Which makes simply each pixel 4 times bigger. Anti Aliasing the source texture help to minimize the blocky looking a bit. But here we can see, that a texture size smaller than the output size of the texture is a no no. Even the filtering, which RS3D provides, are only blur effects in this case. So they are able to soften a image, but they don’t improve the really the quality.

Here we can say, that the minimum size for a texture is the maximum size of the texture in the final rendering. If the texture on disk is smaller, we would get blocky renderings.

A texture which is bigger than the final output

Source image - 520x520 without Anti Aliasing Rendered image - 300x300 without any filtering
Source image - 520x520 with Anti Aliasing Rendered image - 300x300 without any filtering but from Anti Aliasised Source image

Even when we are using a texture with a higher resolution, the output doesn’t look perfect. It looks a little bit better with an anti aliasised source texture, but isn’t really good. This errors in the rendering are aliasising errors. This erros occur when we are scanning the source image with a frequency lower than the double frequency of the source image. I will go into this later. Let us now look how we can make it better.

Rendering with Anti Aliasing

Rendered image - 300x300 with full Anti Aliasing and non Anti Aliasised source Rendered image - 300x300 with full Anti Aliasing and Anti Aliasised source

Here we are. Nice looking circles. The rendering from the anti aliased source looks the best. It’s sharp without noise.

Conclusion

As we have seen here, to get the best result, the size of the texture has to be at a minimum as big as the texture in the final rendering. If the texture is bigger than the final texture size in your rendering, you have to use as much samples as the size of the texture. This means, if your texture in your rendering has a size of 500x500 Pixels and the texture on disk has a size of 5000x5000 Pixels you have to setup a sample size of at least 10x10 to get all information. Otherwise you’ll get aliasing effects! Anti aliasing on the source texture improves also the quality.