TUTORIALS SUBMENU ---->

PHOTOSHOP    FLASH    ILLUSTRATOR    BLENDER    CINEMA 4D    WEB-CODING

In the glory days of Windows v3.1, seamlessly tiling textures were definitely the way forward in desktop wallpapers. They consumed very little memory, were visually appealing, and caused negligible system slowdown. Of course, much has changed since then, with high-resolution wallpapers now the standard for nearly everyone. That does not mean, of course, that seamless textures have been consigned to the junk pile. They are now more useful than ever, valuable for webpage backgrounds, 3D texture mapping, and many other professional applications. Luckily for designers, they are also easy to make, providing you have the required patience and know the techniques necessary to make them.

Note: This is an advanced method for making seamlessly tiling textures.  If you are a newbie in Photoshop and can get away with it, the more traditional method may be for you.  If, however, you need more precise control or your texture is troublesomely complex, then read on!

Step 1: Find/Create a image of a decent size that you want to make into a texture. This image can, within reason, feature almost any content, although removing the seams from more detailed images will require substantially more effort. Look at this image and ensure that the elements are the same size on all four sides. Bricks, for example must be the same size. If they aren't, use Edit > Transform > Distort to adjust the image elements manually. When you have completed this step, drag your guides to the desired points. Look at my example below - These are very small rocks and the chosen area could be quite small, but I have decided to choose a larger area to to move because the image is somewhat washed out on the left side. Choose a spot for your guide that cuts a line of rocks in half, or closest to it.

Step 2: Be sure that View > Snap to Guides is on. Then, using the the Rectangular Marquee Tool, select the bottom area (blue section 2) & copy and paste it into a new layer. Move this layer to the top - it will snap into place. Do the same with the section to the left (green section 1). Move it to the right. The lower left corner will not be used. See Image 2 below if you need help visualizing this concept.  NOTE: The drop shadows will not exist in your version - I've just added them so you can see the section that has been moved.

Step 3:  Now onto the manual fiddly bits.  Hide section 2 and make section 1 the active layer.  Whip out the Eraser Tool with a hard-edged brush and erase around individual rocks so they look natural with the original layer below. Don't use a fuzzy brush. The red lines indicate where the images erase boundaries in the corners. Each side must match so overlapped images (in the corners) will not be seamless. Do the same with Section 2 (keep section 1 visible so you can match with it as well). I've hidden the original image to show what the erased layers will look like.

Step 4: Once you've blended the two sections, select Layer > Flatten Image to merge all the layers together. Select your new tile, copy and paste it into a new layer, and hide everything else. Now to test your texture!  Looking at the image below as an example, drag the layer into empty section 1 (it should snap into place). Copy and paste two more layers and fill in section 2 and the lower left corner. Hide your guides (via View > Extras) and you will see your new seamless tile in action. If it looks perfect (and I hope it does) select File > New and paste your CURRENT selection into your new window (it should fit perfectly). Save your work. If it's not matching up the way you want, use your History, back track and fix. And that's all there is to it!

Advanced Practice: For images with large elements like leaves, select your areas so that you're cutting the leaves in half. This way you only have to erase around the leaves you cut and they will overlap the original image. If you can help it, don't use a fuzzy eraser.  Here's one seamless texture I made earlier:

- Tutorial written by MoodsR4Cattle

Automatic Translations: