Seamless textures refers to textures with patterns that repeated vertically and horizontally when they are tiled.

When it comes to web 3D, it is important to create product with minimal data possible. This is why the Sayduck Platform emphises the use of seamless tileable texture. They allow you to retain the quality of a 4096 px texture with the data requirements of a 512 px texture.

It can reduce the data requirements of your 3D viewer multiple MB. Here you can see examples of 2048x2048px (6.18MB) and 512x512px (183KB) texture.



Tiling

Tiling allows you to repeat the texture vertically and horizontally numerous times, which can be used to simulate the same result than a 4096x4096px resolution texture by using only 512x512px of it.



Creating Seamless Textures

The steps to creating a seamless texture depends on the reference material available. Lets go through some steps you will have to do to convert a image to a seamless texture.

Image to texture

On textures such as fabrics with obvious repeatable pattern, the creation of a seamless texture is pretty simple. You can get great results by simply light correcting the texture.

Light correction

Take a photo and upload it to PhotoShop.



Create two copies of the layer 1 and group the layers (select Layer 2 and 3 > shift+g).

Copy layer Select Layer > ctrl+c > ctrl+v

Group layer Select Layers > shift+g



Select Layer 2 and Average it

Average Filter > Blur > Average



Select Layer 3, assign Linear Light and adjust opacity to 50%



White Layer 3 is active use High Pass with 0.75 Radius

High Pass Filter > Other > High Pass



Test out your texture in the Sayduck Platform

On the left you can see the first cut image and on the right you can see the light corrected version.

Updated on: 28 / 08 / 2020