User Bar

This tutorial will teach you how to make user bars that have become increasingly popular on a lot of forums and sites.

1. Open up a new document 315x20 pixels and select the Gradient Tool.

2. Set your foreground and background colours to the gradient colours that your user bar will include

3. Now selecting the gradient tool again you should have something like this. Obviously with different colours though. Also make sure that the gradient type linear gradient is selected (Just right of where the colours are shown).

4. Now on your empty canvas drag the gradient tool from the top to the bottom of it. You should now get a smooth looking gradient.

5. Now were going to create a sort of random effect of colours on it. Choose any render (does not matter if you like it or not as it will not go into the final design) Open it in photoshop and click filter - blur - gaussian blur and use these settings.

6. Now drag the render from its original canvas to your userbar canvas and just position i so it covers your whole gradient. Now on the gradient layer set the type to overlay. You should now have something like this

Ok now  for the next part we are going to need to add scanlines and to make these we are going to have to make a new document 3x3 pixels.

Once you have your new document zoom in all the way (1600%) and grab the Pencil Tool and draw a pattern like this:

Ok,  once you have your pattern go to edit>define pattern and name it what ever you want to name it.

Now we are done making are scanlines we are going to apply it to are user bar.

7. Go back to your user bar document and make a new layer. Select the paint bucket tool and at the top it will say fill:foreground. Change that so it says pattern and select the pattern u made and fill your user bar with it. It will now look like this:

8. Ok now lower the opacity on that layer to 30 and the mode to overlay and it will look like this:

9. Now open a render of your liking. I will be using a car one. Using the free transform tool edit - free transform lower the size of the render to a size that will fit your bar.

10. Now simply drag it onto your bar and you should have something like this

11. Now its time for text. I am gonna use the font called visitor. Once you write your text, on the layer palette right click the text layer and select blending options. Now select outer glow and keep the default settings and choose a color that will look good on the user bar. These are my settings:

12.  Now for the border. Make a new layer and press control+a then go to edit>stroke and make the color black and size 1 pixel and set it to outside.

End result: