Tutorial - textured text with depth

[BBThemes]

ok, so i figured id show people how to make a nice text effect which, done on the right background can really stand out, this process can also be applied to shapes as well as text.

as well as typing this out iv also added a youtube video to show it being done.

for this demo iv used adobe fireworks, however im sure the same effect can be used in other graphics programs

step 1) import/open your background

step 2) add your text (or shape) and position as needed

step 3) click on the change colour tab and select `fill options` then choose `pattern`, scroll down to the bottom of the pattern list (you may need to click the down arrow) and select `other`

step 4) now select your text/object patern, for this we are going to use the same image as the background

step 5) now that the image is part of the text, move the pattern lines until they are lined up with the image your using for your background so as to get the images aligned on each other. its highly reccomended to zoom in to check all is perfect.

step 6) go to add effects and add a glow, i use white as it brings out the curves on the lettering but any colour can be used, change the glow width to 0, then adjust the glow opacity and softness as required

step 7) go to add effects and add an inner shadow, adjust the distance softness and opacity as you see fit, this adds the perspective of depth making the text/image seem sunk into the wallpaper.

and thats you done, if you wanted to you could ditch the background just for the textured part, or if you move the text/image around the canvas then all you need to do is re-align the pattern as per step 5.

hope you all find this helpfull, as i say its not just text this can be applied to and can give graphics a very cool effect.

[hastings]

Can you adjust the amount of fill in Fireworks?

I only use Photoshop, but there is a much easier way.

1) Create your text, font colour doesn't matter. Just choose your favourite font and size.
2) In the 'Layers' palette, select your text layer, reduce the "Fill" to 0%. The text will now be completely invisible.
3) Double click your text layer to bring up the 'Layer Style' area, and activate 'Inner Shadow'. This automatically applies an inner shadow to the text, leaving the background visible.
4) Add a glow.

I don't use Fireworks, but if you can find a way to reduce the 'Fill' to 0% for your text layer, you can skip half of the steps you mentioned. I'm sure it's possible.

[BBThemes]

Originally Posted by hastings

Can you adjust the amount of fill in Fireworks?

I only use Photoshop, but there is a much easier way.

1) Create your text, font colour doesn't matter. Just choose your favourite font and size.
2) In the 'Layers' palette, select your text layer, reduce the "Fill" to 0%. The text will now be completely invisible.
3) Double click your text layer to bring up the 'Layer Style' area, and activate 'Inner Shadow'. This automatically applies an inner shadow to the text, leaving the background visible.
4) Add a glow.

I don't use Fireworks, but if you can find a way to reduce the 'Fill' to 0% for your text layer, you can skip half of the steps you mentioned. I'm sure it's possible.

yea i see what your saying, but if you move the background? or the text/object?

you can do what your saying but your saying add a shadow to text, im saying add a texture to text, so i can move that texture around and say have a half opacity background with a full opacity text, by leaving the text blank as ya say you can only use the background it has. 2 different effects but both cool.