[PS] Tileable Background Image (10th Apr 10 at 10:03pm UTC)
This is a skill that a lot of designers would really benefit from having, because it makes your designs actually codable. Side benefit: it helps if you ever want to produce a texture for whatever reason.
1. Start with a 300x300 pixel document. Use Filter > Render > Clouds to create a random cloud pattern. It's fast, and it's a generic place to learn from.
2. Create horizontal and vertical guidelines at 10%, 40%, 60%, and 90%. Yes this is a lot of guidelines. At least it makes a pretty pattern.
3. Go to Image > Canvas Size and make the height of the canvas 600px.
4. Duplicate the layer twice. Move the first duplicate up 150px and the second duplicate down 150px.
5. Create layer masks for each of these new layers.
6. On the first copy (top), draw a black to white gradient from the 40% guide to the 10% guide on the layer mask. Do the same for the other layer but from 60% to 90%.
7. Control-click on the icon of the original layer to select its outline and then crop the image. You have now made an image that can seamlessly tile vertically.
8. Use Layers > Merge Visible to collapse everything back down to the original layer.
9. Repeat steps 3-8 in the horizontal direction.
You have now produced a tileable image. This procedure works fine for images that do not need precise detail, like random cloud effects. However, if you are working on an image that is complex, you will have to erase bits and pieces of the duplicate layers by hand until everything lines up. The important thing is that the 10% on each side of the image should not be modified at all. As long as that stays the same, your image will tile seamlessly.
![[Avatar]](http://www.gravatar.com/avatar/05fe72209cbe1ce2cb8ca573491d8698.gif)
![[Avatar]](http://av.wservices.co.uk/av.png)
