Freebie Inspiration News Resources Tutorials About Contribute

Tutorials by Tyler | January 26, 2010 | 23 Comments »

Create realistic type on wood

In this tutorial we are going to take some regular text and add some effects to make it look like it has been

painted or printed on wood. This is a great way to give your text that natural look. This can be applied to any

solid shape, text, images, logos, etc.

What we are going to needAdobe Photoshop

Wood Texture

Step 1Open up the wood texture from Zen Textures in Photoshop.

Go to Image>Image Size and change the width to 1200px and make sure the resolution is at 72 pixels/inch.

This will give us the width that we want for our document.

Advertise Here Advertise Here

Search

Follow Denis DesignsRSS| Email| Twitter| Newsletter| Facebook

Advertise with us!

Powered by

Layer by Layer AssemblySpray Assisted LbL Coating System Affordable, Automated, Versatilewww.agiltron.com

Ads by Google

����� PHP ����

Practical PHP Development �����register ����

www.phplanka.lk

Step 2Using the Type Tool (T), create some white text that will roughly fit the width of the document (leaving some

space on the edges). I am using ITC Franklin Gothic Heavy for my font, but anything bold should work.

Using the Crop Tool (C) crop the top and bottom edges so they have a small margin around the text, about

the same amount as the sides or a little more.

Step 3Click on the eye icon to the left of the text layer to make the text disappear.

Go to File>Save, and save it as a Photoshop file. We are going to be using this file later on in the tutorial.

Web Hosting Break

Webhosting Services

cPanel Hosting

Denis Designs Flickr Group

Join our Flickr Group

Blogroll

Dzinepress

Hongkiat.com

Inspiration Feed

Little Box Of Ideas

PBrushes.com

Splashnology

Stock Images

The Design Work

Tutorial Lounge

TutorialKing.eu

WebDesignFan

Step 4Make sure you have the background layer selected. We are going to duplicate the layer with Ctrl+J.

Now go to Image>Adjustments>Threshold. Make your threshold level around 70.

Step 5Go into Select>Color Range, and make sure your fuzziness is at 200. Now with the eyedropper click on a

black part of the document and hit OK. A marquee around all the black areas should come up.

Step 6We want to get the inverse of our selection, so to do that we are going to do Ctrl+Shift+I Now we can click on

the text layer and click on Add Vector Mask.

Click on the eye icon next to the text layer to bring it back (if it isn’t already), and click on the eye icon next to

the black and white wood layer to make it go away.

Step 7

If we zoom in we will notice that the masked out parts are too sharp to be believable, compared to the

sharpness of the wood. To fix this we are going to go into Filter>Blur>Gaussian Blur. Change the blur to about

0.4px.

Step 8Now we want to make the edges look a little more believable. First we need to make the mask and the layer

just one regular layer, so right-click on the layer and click on Rasterize Layer. Now Right-click on the mask and

click on Apply Layer Mask.

Now go to Filter>Distort>Displace and change the horizontal and vertical scales both to 2, click OK. A file

browser should come up. Open up the file we saved in the beginning of the tutorial.

If you zoom in you’ll notice the edges follow the lines on the wood background.

Step 9Drop the opacity of the text down to 80% to give the white part a subtle groove that the wood has.

Step 10Now we are going to add some lighting effects to our document to make it look a little more interesting.

First off, lets create a new layer (Ctrl+Shift+N) and move it above the text layer. Click on the Elliptical Marquee

Tool (M) and change the feather to 75px. Now click and drag a circle around the text.

Step 11We are going to get the inverse selection (Ctrl+Shift+I) of

the circle and fill it with black. Change the blend mode to Soft Light.

Step 12Create another new layer (Ctrl+Shift+N), above the text

layer and the shadow one we just created. Create a circle around the text like

we did in step 10 and fill it with an orange color (something like #FF9B0B).

Change the blend mode to Soft Light and the opacity to 50%.

Step 13Finally we are going to give our document an overall orange glow. Make sure your foreground is the orange

that we used in the previous step and the background is black. Now go into “Create new or fill adjustment

layer” (this middle icon at the bottom of the layers palette) and click on Gradient Map. The foreground and

background colors should make a black to orange gradient for us. Make sure you click on reverse and click

ok.

Drop the opacity down to 20% and change the blend mode to Overlay.

FinalClick for the full image

Related Articles:Create a Retro Metal Text poster in

Photoshop

Create a Funky Retro Wavy Text Effect in

Photoshop

Add Water Bubbles to any image in

Illustrator

11

4

79tweets

retw eet

Guaranteed 642-524 exam preparation with complete up to date training resources! With 642-373

training, you will be pass 642-446 very easily.

You might also like these articles...

Bigger Eyes With LEDWhite Eyelashes

Amazing Collection of DarkWallpapers

Rainbow Folders Features Every BrowserShould Have

Opera 11 vs. Chrome 10 If You Think You Know All You Don't Need To Wait Top 100 Free Utilit ies

23 Comments

Ol iver27/01/2010

Love it! :-)

PhilGDUK27/01/2010

nice tutorial. thanks.

Deepesh Divakaran27/01/2010

Wow… its wonderful.. I was thinking how to do such images. This is

absolutely well written Tutorial.

tutorial blog29/01/2010

thank for tutorial

mike29/01/2010

awesome tutorial. nice idea too. might work on roofing material

background too?

Cindi29/01/2010

Nice job with this tutorial! Simple, but a nice effect with depth.

Jaime02/02/2010

Thank for the tutorial.

m10/02/2010

teşekkür ederim, büyük!

Duar t e18/02/2010

Great tut :D

ive done cool stuff with your tips :)

West Midlands WeddingPhotography09/03/2010

Very interesting way of making great looking text. You make it look so

easy. Thank you for sharing I will have to experiment and try to follow your

tutorial.

Sam13/03/2010

Cool! Exactly what I was looking for – thank you.

About Skype... For Windows 8Only comments in English will be approved!

Jak14/03/2010

Could anybody help me I can´t find the file

we need in step 8 (the matrix)

But up to now a realy great tutorial

Tyler17/03/2010

Jak: you open up the file we saved in step 3

x_shot14/05/2010

wonderful!! Unbelievable, I can

thx…

Neysha21/06/2010

Interesting tutorial. The text is perfectly incorporated into the wood grain

making it look highly realistic! It served as an inspiration for my logo

design. I got my designer from logodesignstation.com to design it based

on some of the elements I liked and it turned out great. Many people

were quite amazed at how good it looked. Thanks for posting this! :D

Chuba19/08/2010

awesome tutorial!

AbuAlez15/09/2010

thankyou very much for this site about this articals an ideas

Thankyou again

Agrost r i fe15/09/2010

won’t parce when opening??

Gex28/09/2010

Looks cheap, sorry

Need A Gadget30/09/2010

This is a nice post ! continue the good work! can i take this post for my

site ?

F LD29/10/2010

What?

- get wood

- place text in gray

- set text layer to multiply

- done!

P RA sad13/11/2010

Great…

Cur ious1709/01/2011

hi, thanks for the tutorials. please anyone tell me where i can get the

wood texture background like in this tutorials in high resolution?

or tyler will you upload the psd file again, please.

Leave a Reply

Name (required)

Mail (will not be published) (required)

Website

SUBMIT COMMENT

Theme Design by Tyler Denis | Denis Designs | Copyright 2009 | Site Map

Search... Translate Recent Posts Random CommunityShare