TEXT FOR TEXTURE

 

Here's how to make a text for texture background for all your interface design projects. See my tutorial on Organic Interface Deconstruction for more information.

   

First, I created an organic background by combining multiple photos which I then distorted using Polar Coordinates, grids, geometric shapes, etc., and using PhotoShop's Layer Modes (See my Organic Interface Deconstruction tutorial for hints on how to do this).

Then, I used Impact for a large bold fat word, in this case, "TEXT".

Move it to the lower right.

Set the layer mode of "TEXT" to Overlay. Notice the nice effect of various intensities of warm colors that come through using this mode.

Next, type some small text (I used 10pt Monaco).

I copied and pasted it over and over to fill up the left side from top to bottom.

And set its Layer Mode to Overlay as well.

Again, notice how the Layer Mode causes the text to blend in with the background with varying intensities.

By the way, there's no rule that says you have to use Overlay, it just seems to work best for me. Try some of the other Modes if you'd like.

Then type another word (the name of your site or product would be good here).

To give it some dynamic qualities, I used an Oblique font.

Use Overlay on this layer as well.

 

I then duplicated this layer, rasterized it (CONTROL-CLICK or RIGHT-CLICK the layer and choose Rasterize), enlarged the duplicate and created a stroke from it (the big "13" you see mid-right).

Here's the final version, ready for some foreground elements like navigation buttons, a photo, a logo, etc.

The grid is a little thicker than I usually like, but that's easily corrected.

[COMMENTS? NEED HELP? JOIN OUR PHOTOSHOP FORUM]

[VIEW] Other Tutorials