Rock Texture

by Skaarjj

1. Open a new image in Photoshop (CTRL+N [PC and Mac], or File>>New). The dimensions can be anything you want, but remember...this texture is not seamless, so make it big enough for your purposes. Make sure it is set to RGB Mode under the Colour Mode. Set the background colour to transparent...this is just to my personal taste, I prefer to have no background colour there, as we will be changing it later.

2. Ok! That was fun, wasn't it? Now it's time to set the colour of your rock. As this is a rock texture, a colour is required that is a rock type of colour. For the images I have here to demonstrate, the RGB (colours, Red, Green, and Blue) values are : R:105 G:61 B:28. Feel free to use them. To use the RGB values, look at that collection of little windows down the bottom. Find the one that has a tab saying 'COLOUR' on it. Click on it and you will see a strip with all the colours on it, and three places where you can type, which are called 'Fields'. Put the RGB values in these areas. Click on the 'Fill' tool on the toolbar, it looks like a little bucket. Click anywhere on your image to fill it with the foreground colour, which is the rock colour we just made.

3. Next up, we have to give ourselves a kind of textured rocky look. To do this we need to add some Noise to the image. Go up to the Filter menu and go to Noise>>Add Noise. Set the amount of noise either by dragging the slider around, or by typing in a value in the text field. The other options are Noise type, which can either be Gaussian or Uniform. You can also have coloured noise, or you can set the noise to be Monochromatic. Setting it to Monochromatic just tells the noise filter to only use one colour for the noise, which will be a darker version of the background colour, unless the background colour is white, and then the noise will be black. Add Noise with amount 40, Gaussian Mode and set to Monochromatic.

4. Now that we have our noise, it's time to make two Alpha Channels (for an explanation of channels, see DocOzone's Tutorial 'The Basics of Photoshop'). So look at the little windows down the bottom again, and you should see a set of tabs that say, from left to right, 'LAYERS', 'CHANNELS' and 'PATHS'. Channels is where we want to go, so click on it. There are a set of buttons down the bottom of the window, one of which looks like a white rectangle with a gray triangle in the corner. This icon, when clicked on, creates a new channel, so click it twice, because we want two new channels. They should come up under the Red, Green and Blue channels. Click on the channel labelled 'Alpha 1'.In here, use the exact same technique as above to Add Noise to this channel. Use the same settings as well.
That's all for this channel, so click on the channel labelled 'Alpha 2'. In here we need to make sure that out Foreground Colour is white. We do this by looking at the tall thin toolbar on the right of the screen. Look about two thirds of the way down, and you will see two squares of colour, one white, one black. In between them, at the top is a line with two arrowheads on it. Click on this if the square on the top is not white. Inversely, you can press the 'x' key on your keyboard to swap the colours. Now...go to the filter menu, and go to Filter>>Other>>Difference Clouds. Keep doing this until you have a cloud pattern that has alot of veins of white, small patches of black, and lots of stuff in between.

5. Now, click on the layers tab and your image of brown with noise should reappear. Now we are going to make it 3D! WOOHOO!! To do this we must use the Lighting Effects filter. For a full explanation of it's functions, see DocOzone's Tutorial 'The Basics of Photoshop'. Please read it first, because I don't have enough room here to explain its functions. Move the Light direction ellipse from the cross joined to a line running to the centre. Rotate it so it is exactly opposite from where it is when you load up the filter. Use one of the crosses on the side to widen it until it covers the whole image. Now for the settings. Set the Intensity to 35 and the focus to 69. Set the Gloss to 0, the Material to 69, Exposure to 0 and Ambience to 8. In the texture channel area, set the channel to 'Alpha 1'. Click OK, and wait for the computer to stop processing it. Go back to the Lighting Effects filter, and repeat the process, but make the texture channel 'Alpha 2', take in intensity down just a little bit, but to taste, and set the newly revealed Mountanance option to 100. Et Viola. You now have yourself an instant rock texture perfect for use on web interfaces. You can adjust the brightness and contrast (Edit>>Adjust>>Brightness/Contrast) a bit to may the bright bits not so bright.

6. Finally, go back to the channels screen, and delete those two channels we created. Now we can save this image as a JPEG file. Go to File>>Save As...and when the box comes up, select where you want to save it, and make the file type (I'm assuming you know how to do that) a JPEG file. Click save, and then select the compression that you want. I suggest a level of about 7 or 8, otherwise any lower and the image distorts, and any higher and the file size is to big (click the image on the right to see the larger finished version).

There may be some things wrong in this tutorial, but please remember, this is my first. Any questions or comments then contact me at the Email address shown above (check out the author bit). Cya All L8r.