Post: Retro typography tutorial.
03-30-2009, 11:37 PM #1
Under Alts Bed
x x x x x x x x x x x x x
(adsbygoogle = window.adsbygoogle || []).push({}); Seeing as my shop was popular i decided to make a tutorial for the retro text 1:

Ok so here's my first tutorial. Ive decided to do it straight onto a post here so, 1: it doesnt get ripped and 2: Its easier for me. Remember to +rep and thank my post if you liked this! Id be really greatful! Enjoy!


This is the retro Style typography and you will learn how to make this:
You must login or register to view this content.

The main thing you will need here is some common sense Smile

Its relatively simple so pay attention!

Ok start by getting a cool retro font of your choice, i advice dafont for them and i would advise the font: sega. (this is available from dafont).

Now, background size is up to you really but for this i will use 600x600.
(This is different to the end result size i showed but dont worry! it still works :p).

You must login or register to view this content.
It is important that when positioning the text you try and line them up as best as possible. Only two words is advised but try more if you want! The top text i used was size 100 and the bottom 69. This give a cool looking text.

Now we'll do some more to the text because to be honest its nowhere near the end result! :p

You must login or register to view this content.
Ok now this is to do with the Kerning, this basically is the distance between each letter, so to change this, start by going to window>character, then with this panel up click on your text with the text tool and then click in between the two letters you want to put closer together then change the kerning, i would advice trying figures from -100 to 100. But its really up to you, just play around. This does however leave our texts uneven so just resize the bottom one to make it fit again, i had to downsize to 67.

Ok now we can add some colour and resize our text, start by making the text this colour #e59710 Then make your text quite a lot bigger, i changed mine to 125 on top and 84 on the bottom.

That should have hopefully been relatively simple. Now to add some styles to our text, add the exact same styles as below (or change them if you really want but i dont advise it).

You must login or register to view this content.
You must login or register to view this content.
You must login or register to view this content.
You must login or register to view this content.
Here’s how to make the gradient shown 
You must login or register to view this content.

Now you should have some sexy looking retro text like this:
You must login or register to view this content.

Now lets add some perspective. First rasterize the layer and then you need to merge both text layers and then press ctrl+t and then right click and select perspective. Now just play around until you get a good look like below (a good way to do the perspective is to click and drag the top right corner up and the top left down, but like I said play around until you get something like below):

You must login or register to view this content.

I also resized the whole layer after doing the perspective to remove some of the blur.

Now make two duplicates of the text layer and group the three together as shown below:
You must login or register to view this content.
THE TEXT ON THIS IMAGE SAYS Select all 3 layers and drag and drop them on the folder to put into a group.

Ok now you need to space them apart like I have below:
You must login or register to view this content.

It helps to name the layers front, middle and back like I did, just so we don’t get confused, I will be calling them by those names from now onwards so be prepared Smile.

Ok now we need to select the middle layer and set the fill to 0%

Now do as shown below by adding a colour to transparent gradient, make the colour on the left #008aff.

You must login or register to view this content.

Now to add some more effects, make a new layer above front ctrl + click the front layer . Now get the gradient tool and find the chrome gradient as shown below then simply apply the gradient like I did below, change the layers blending options to soft light.

You must login or register to view this content.
THIS PICTURE SAYS: Ctrl+click on the front layer while your new layer is selected, then select the gradient tool and select the chrome option in the gradient options. Now drag in the direction shown now set this layer to soft light.

Now time to get a little more technical. Make a new group and call it flares. Create a new layer within this group and call it highlight flare. Fill the layer with black and go to filter>render>lens flare and add a 105mm prime flare with a brightness of 100.
Now set the layer to soft light and position it somewhere on your text that looks cool , then duplicate this and position the duplicate somewhere else that looks cool, like I did below.

You must login or register to view this content.

Now although I didn’t do this above, this is quite important, you want to select the duplicated layer and create a mask, then get a black paintbrush and brush away areas which overlap the original lens flare because otherwise your text will look strange. (I did this after the picture so if your unsure look at my next picture).

VERY IMPORTANT!!!!: Now you must do this or it will effect the later results. You have to select both lens flare layers separately and brush in black where it is clear on either side, otherwise later background effects will look lame. Ive shown it below. So make sure you take a look!

You must login or register to view this content.
THIS PICTURE SAYS: ignore this part because i went wrong which is the layer above the one we're working on. It also explains the same as above the picutre and shows the areas i painted.

Now let’s add a reflection. Start by putting the text and flares groups into another group together, then duplicate the text group and go to Edit > Transform > Flip Vertical and position the reflection under the original text. Go to Edit > Transform > Skew to fix the reflection as it wont be lined up correctly. When skewing click the left middle tab and hold shift, drag upwards this should make it look correct. Smile

Add a mask to the reflection and then get the black and white gradient and stroke upwards on the reflection until you get a nice fade.

Ok now it should look like this:
You must login or register to view this content.

Ok now make a new layer in between your reflection and your first group. Name it flare front. Fill it with black and go Filter > Render > Lens Flare, and pick the movie prime at 100% brightness. Put it on a nice area and set its blending mode to linear dodge. Then duplicate it and set the duplicate to screen drag the layer below the Text layers and Position this behind like I have below:

You must login or register to view this content.

Now we’ll add the last touch. Create a new document size 40px by 2px select half of the area with the box marquee and fill it with black. Then click edit>define pattern and name it whatever you desire.

You must login or register to view this content.

Ok now go back to your text piece; above your background layer create a new layer. Then go edit>fill and select the pattern we made before Now reduce the fill to about 34% (roughly) then put a colour overlay of this on #dd04ad set the overlay opacity to 64%. Now you should have this:

You must login or register to view this content.

Now all you need to do is rotate the lines to 90 degrees and then add a perspective like I did below, then just play around with the eraser and opacity levels until you end up with something like this!

You must login or register to view this content.

I hope you enjoyed this tutorial!!!!

Sorry it was so long, but I had to explain!

Please post your finished versions here and if you have any Questions ask me Smile

Remember to +rep and thank my post if you liked this! Id be really greatful!
(adsbygoogle = window.adsbygoogle || []).push({});

The following 6 users say thank you to Under Alts Bed for this useful post:

+tA. Ó'Dónaill, drako4ever, mjkuser, Niiosa, Rage, Surikizu
03-31-2009, 12:48 PM #2
.Taco
Counter Strike: Nerd Offensive
nice bra, but next time try to make it a 1 pic. to bad i never do typography cuz this is easy to follow.
03-31-2009, 03:24 PM #3
Rage
NGU Original
Yeah try and make a 1 pic tutSmile But nice tut i repped and nominatedSmile
03-31-2009, 03:47 PM #4
Under Alts Bed
x x x x x x x x x x x x x
yea i was gonna do one pic, but then id have to post the link as it would resize here, and i didnt really wanna host, but yea next time i will, bare in mind it was my first XD. Thx for comments Smile
04-03-2009, 12:39 AM #5
drako4ever
Do a barrel roll!
Omfg haard
04-03-2009, 10:55 PM #6
Nice one I'm gonna try this tomorrow too late just now.:p
04-03-2009, 11:37 PM #7
Under Alts Bed
x x x x x x x x x x x x x
Thx 4 the nominations etc. I'll rep u guys when I get on my comp cos I CBA on my iPod. I hope u enjoy the tut and like I said if your finding it hard just send me a pm and ill try to help. Can't w8 2 see some results Smile
04-04-2009, 01:06 AM #8
Surikizu
GUMI fanboy
Preety nice man

Copyright © 2026, NextGenUpdate.
All Rights Reserved.

Gray NextGenUpdate Logo