In this tutorial you will learn how to create 3D text in Photoshop and Illustrator, you will find many new tips and tricks in this 3D text tutorial that will help you creating 3d grunge text. I’ve used version CS5 for both photoshop and illustrator but you can create this tutorial with newer or older versions such as CS3 or CS4.

Final - 3D Text Tutorial With Illustrator and Photoshop
Click here to see the full size

 

Required Files: Weathered TextureDol Guldur texturekilogram font

Lets Start 3D Text Tutorial with Adobe Illustrator

Step01

Create a new document in adobe illustrator, use the font kilogram and type “Graphic Design”, and keep every word in a single line, play with the font size and spaces to make it look like a rectangle, or follow the following settings.

Step01 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 02

Select the text by the Selection Tool Selection Tool - 3D Text Tutorial With Illustrator and Photoshop and press right click on the mouse, from the listed menu select create an outline, keep selecting the text and choose from the menu Filters>>3D>>Extrude & Bevel and set the following settings:

 

Step02 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 03

Select the 3D Objects and choose Object >> Expand Appearance from the menu.

Step03 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 04

Now Ungroup the 3D objects by hit Ctrl+Shift+G many times on the keyboard to ungroup every part, double click on the Magic Wand Tool magic wand tool - 3D Text Tutorial With Illustrator and Photoshop to open the magic wand pallet and set the value of the Tolerance “0” by the magic wand tool select the upper part, and group it Ctrl+G and move it up then select below parts and group them.

Step04 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 05 – Photoshop

Create a new document with size 1024*700.

image01 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 06

load the texture “Weathered Texture” and re-size it to fit the file size and make the Fill opacity 65%, and? rename the layer to BG.

Step05 - 3D Text Tutorial With Illustrator and Photoshop

Step 07

load the texture “Dol Guldur texture ” also re-size to fit all the file size and make the Fill opacity 40% and the blend mode: Color Burn, and rename the layer to BG02

Step061 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 08

Drag the 3d text from Illustrator to Photoshop, and keep in mind drag the upper part by itself and the below part by itself. and place them as Vector Smart Object, now select the two layers and re-size them to any size you like to work on,

Step07 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 09

Close these two shapes to each other and rename the lighter shape layer to Upper Part and the darker shape layer Below Part.

Step08 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 10

Duplicate the BG02 and clear the layer style by setting the Fill Opacity 100% and the blend mode: normal, also decrease the size of about 60%, and move it to above of Upper part? layer then press Ctrl + left click on the Upper part layer to make the selection.

Step09 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 11

Select the BG02 copy and click on the Layer mask?layer Mask - 3D Text Tutorial With Illustrator and Photoshop on the layers pallet, also hide the Upper part layer.

Step10 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 12

Repeat the previous? step on the Below part layer, but here we need to add some layer styles select the layer BG copy3 and select Layer>> Layer style>> Drop shadow.

Step11 - 3D Text Tutorial With Illustrator and Photoshop

Drop Shadow - 3D Text Tutorial With Illustrator and Photoshop

Select the Gradient Overlay set the below settings and click on the gradient gradient - 3D Text Tutorial With Illustrator and Photoshop to open the Gradient Editor.

Gradient Overlay - 3D Text Tutorial With Illustrator and Photoshop

Gradient Editor - 3D Text Tutorial With Illustrator and Photoshop

 

Step 13

Create a new layer and fill it with black color and the opacity 60%, and select the Erase tool Erase tool - 3D Text Tutorial With Illustrator and Photoshop with size 700px and Opacity 30%, then start to erase from the center of the black layer.

Step12 - 3D Text Tutorial With Illustrator and Photoshop

Step 14

Duplicate the Upper part layer and show it, then make the fill opacity 0% and add color overlay from layer>> layer style>> Color overlay, and set the color Black and the opacity 60%, now keep selecting the duplicated layer and hit Ctrl + T to transform the layer.

Color overlay - 3D Text Tutorial With Illustrator and Photoshop

Step13 - 3D Text Tutorial With Illustrator and Photoshop

 

Step 15

Duplicate the Upper part again and follow the previous step and change the opacity on the color overlay to 30%, and apply the Gaussian Blur and set the radios 2px.

Step14 - 3D Text Tutorial With Illustrator and Photoshop

 

Final

I hope you find this 3D text tutorial useful and help you learn new tips and tricks.

Final - 3D Text Tutorial With Illustrator and Photoshop

  • effect is superb

  • Amazing design… Celebrity Top Design is there to support.
    Best wishes!

  • good way sir

  • So nice idea … keep going in that

  • WWoowww very good job
    it’s excelent i will try in my work, I hope stay the same

  • This is an awesome tutorial. Thanks for the info!

  • Thank you all… 🙂

  • Thanks so much :-*

  • thanks you!

Leave a Reply

Your email address will not be published. Required fields are marked *

Hello, my name is Mahmoud Ameara the owner and founder of mameara.com it is a blog that I share web and graphic design, resources tutorials, and freebies.
Links
Partner Links
mameara © 2010 – 2024