Sunday, October 19, 2008

Adobe Photoshop Tutorials - 3D Typographic

It's very easy to create 3D text effect with Photoshop (even if you don't have Photoshop CS extended to do it).



Check out my easy 5 easy steps!

Step 1

Open a new document with the size of : 800px wdith x 400px height. Color the background to black. Next, make a another layer, right on top of it and use the brush tool (with light pinkish color) above the background color.

Step 2

Create the alphabet "a" by selecting the "Horizontal Type Tool". Next select the "Layer Style". On the window popup, select the "Gradient Overlay" and create gradient just like above. Once done, click OK.

Step 3


It's time to create the 3D effect (thickness). Select the "a" layer, hold down the alt key on the keyboard and press the down arrow key then the left arrow key (keeping alt key pressed down) do this about 10-15 times, this will determine the thickness of the alphabet. Now select all the thickness layer(except the "a" layer") then press "ctrl-e" to merge it all.

Step 4

Move the layer below the alphabet "a" and click on the layer style.

Step 5

Choose the "Gradient Layer" and color it to darker shades just like above image. After that, select "drop shadow" and set it according to your preference.



You're done! :)

Note : For other alphabets, use the exact same process, but for the step 3, try use the other arrows to create the depth. ie. right arrow and top arrow etc.

You can also create effects for the background. I've used the brushes from "Sparkling Effects" to create the effects for this. You might want to try it as well.

Here's the PSD file ("http://www.ramesstudio.com/adobetuts/3D_typo.zip)" for this tutorial, together with the fonts.

Hope you find this tutorial useful.

14 comments:

Anonymous said...

yeah first again ;)

this looks really cool to me. great work again!

JeevaN said...

Thanks bro...
This is really cool for beginners like me...
Thanks again...
:)

Rames said...

Anonymous>> thanks :)

jeevan>> np :)

Wen Jing ^^ said...

OMG rames! seems like i long time no come, damn many thing to learn?!
how lar..haha..

Suresh said...

thx rames bro..i try this with follow ur steps... really good... im do this one...

http://www.ex-imagehost.com/images/oz1vsuar1w7tiqyghx.jpg

its this ok?

teddY said...

Hey Rames! Sorry for not leaving comments for your tutorial although they're all so awesome and useful! I particularly love this tutorial because of the easy way you've taught people to duplicate the nudge layers at the same time. If it weren't for that tip, I would have spent ages painstakingly duplicating each layer and nudging them individually!

Anyway I've made a little poster by following the steps of the tutorial. Maybe I should let you have a look someday :)

Thanks for sharing!

MeL said...

Awesome tutorial! I can get it done fast with just 5 simple steps! very detail explanation! Thanks for sharing! *winks*

NSMF said...

thank you nice tut!

but..how u make the dual colour? the 1 like u did? :)

web design India said...

i'll be sure to bookmark your blog

adobe basics said...

this is great help of 3d text is this possible to import 3d text any 3d program.

viagra online said...

Adobe photoshop is a great tool to people lke me who study desing or similar carrer, so I think that this blog can hel to many people to do their job

Micky said...

3D text effects are really cool and I did not know that they could be done just with a few clicks of the mouse - but I guess it will take a bit of practice though. I'm going to give this a try, thanks.

Anonymous said...

Nike Free Run Sale online australia
Nike Free Run Womens shoes store
Nike Free 3.0 Sale shoes store
Nike Free Run 2 Cheap store free shipping
Nike Free 3.0 womens shoes collection
Nike Free run womens sale shoes to australia

Web Creation | Web Creation Chennai | Web Creation India said...

thanks friend! nice effect

- faizel