Who in the world doesn’t know this award winning Tv series? Well, just to make it a little more spread out, i will teach you how to make that fabulous yet quite simple blured logotype.

Lets start with the font. There are some free fonts with that numbers around the internet, so i’ll grab one that looks like it. Here you have one, free, with 8 variations! Awesome! Grab the font at this link: http://desktoppub.about.com/library/fonts/dd/uc_digitalreadout.htm.

The font’s name is Digital Readout. You will have to install the font before using it, so go on to your Control Panel (Start -> Control panel on your Windows XP) and double click the icon “Fonts”. You should by now have a window showing all the fonts that you have installed on your system. To install the new font just drag and drop the TTF files to this window. Once you drop them there you’ll notice a progress bar and in a second or 2 the new fonts are installed and ready to use. Notice that, if you allready have Photoshop open you will need to close it and open again, so the new fonts are loaded to the interface.

There you go, plain new fonts to make our logo. So let’s get down to business.

Go on and create a new file, let’s say 400px width and 400 px height, with a white background.

Now select a black tint from your color picker and fill the background layer with black. You can do this by going into the EDIT menu and choosing FILL. When the dialog box comes up, select the Foreground Color and press OK. You can even go there and select the color directly from the dialog box of the Fill menu, you don’t even have to choose the color before filling. But, as allways, there’s a much easier and quicker way to do it: just press ALT+BACKSPACE on your keyboard after selecting the black as your foreground color.

Now Lets put the text right in the middle of the layer. Choose the Type Tool from the toolbox and take a look at the options right below the top menu. Black should be selected as the color you are going to use to type. This is no good as you wont see the text (same color as the background layer). We need to change the text color to white before typing. You can do this in the Character palette. If you don’t have the Character palette allready open go to the WINDOW menu and choose Character (or Paragraph, as they are docked together). You can tweak your character settings a little bit, so they look like mine. I added a 50 value for the Letter Spacing, I select the White color for the text, the Digital readout font, of course, and also a Faux Bold, because the original font doesn’t have a bold option originally. And there’s the final result:

Ok, now lets fill the text with a yellow color. I prefer to choose white as the first color and then do a color overlay with the layer styles, because this way there’s a lot more control over the coloring and i dont need to get back to the Character palette again.

So, select the Type Layer (that by now should be named “24″ as all type layers get the name of the text you put in them) and click the Layer Styles icon at the bottom of the layers palette. It’s that little stylish “f”. When you click it a drop-down menu shows all the options you have to style this layer, and one of them it’s the color overlay. Select that option.

Ok, now choose a burned yellow to overlay the white:

Now lets enhance that yellow. I need a glow on the letters. Actually it’s an inner glow, filling the text white a diffused white right in the center. So go on to the Layer Styles again and now choose Inner Glow. Just play around with those sliders, knobs and blending modes and at the end choose something like:

Notice the white gradient at the center of the letters. Thats exactily want we want. Now, there’s only one little thing left to do, the red background. For the backgrond we’re going to use the same text layer, but we’re tweaking it a little bit. First lets duplicate the text layer. Go on, click and drag it to the “new layer” icon at the bottom of the layers palette, as pictured below:

You should get an exact copy of the text layer sitting on the top of the other 2 layers, with the name “24 copy” right?

Ok, lets leave this new layer alone and do some changes on the “24″ below it (the source for the copy). Click the layer to select it. First lets change the text color to red, a dark red. With the layer selected open your Character palette (if you haven’t close it allready it should be sitting around somewhere in your workarea). From the Character palette chose a dark red color, like this one:

When you press “OK” you wont, or you shouldnt see any changes. Why? Because the layer on top of this one is exactily the same and its filled with another color. You can change the visibility of the top layer if you wish, just to make sure that the bottom layer has the correct filling. Go on and click the little “eye” next to the layer thumbnail to toggle visibility and verify the choosen color. While your at it, turn of the layer style visibility too. See that little black arrow to the right of the layer? Thats the layer styles, you can click the arrow to reveal all the applied layer styles, and you can toggle visibility to each style applied or to the whole bunch.

Now that we have the type as we want (no styles and filled in red) we need to convert this layer before proceding to the next step. Right-click the layer. You should see an option that says “Rasterize type”. What we’re going to do is transform this type layer into a plain simple pixel layer. A type layer is limitted and we can’t do filters on it.

Ok, there you have it. Now i can turn back the visibility of the top layer. Again you wont see the layer below, but that’s not important right now. Ok, lets diffuse those reds. First, make sure that you have the rasterized layer selected, the layer with the red text. The thumbnail should be different from the top layer, as the top layer is still a type layer, and the other is a pixel layer. Select the pixel layer and go on to FILTER menu, choose BLUR and then MOTION BLUR.

Make sure you have the “preview” option checked and choose a 90º angle with 75px distance. That should be good. Now, to create more of a blury effect go on and duplicate this layer 3 or 4 times. Each time you duplicate it move it a little bit to the side (left or right). I’ll demonstrate with one layer, but you will need to do this 3 or 4 times (or more, as you wish):

After duplicating the layer a few times this is what you should come up with:

Finally lets add a finishing style to the text contour on the top layer (named “24 copy” in my example ). You can also merge all the other layers together if you like (except the background, leave the background alone!). You can use CTRL+CLICK to select multiple layers. After you have all the layers you want to merge selected simply go to the LAYERS menu and choose MERGE LAYERS, or press CTRL+E on your keyboard.

Ok, for the final style, here we go: make sure you have the top layer selected and click once again on the layer styles icon and now choose STROKE. Apply a stroke to the text like this:

Its a very soft stroke. The color I picked up is from the real image. When you click the color picker in the stroke dialog box you can really move the eyedropper to your image and choose a color that allready belongs to the image. I’ve choose 2px for the size, and blend mode to multiply so it darkens a little bit. Also lower the opacity a bit. The final result:

Hope you liked this one. Have fun!