Home » Computers & Electronics

Photoshop Tutorial: Userbars

Ranked #14,673 in Computers & Electronics, #299,833 overall

Userbar Tutorial

I have been thinking about this for some time. I have been wanting to create photoshop tutorials. Everyone wants to learn something new. Some of the ones like this one are common knowledge and for the most part is probably one of the easiest tutorials to do. If you are clueless to what is going on here, I will have a tutorial about photoshop and how to get started, but is not available at the moment. It should be available soon.

Did You Want To Learn How to Create One Of These?

You Need This

In order to do this tutorial, you need photoshop CS4 to be able to follow along.

Adobe Photoshop CS4 - Old Version

Adobe Photoshop CS4 - Old Version

Amazon Price: $1,995.00 (as of 02/16/2012)Buy Now
List Price: $699.99
Used Price:

Release Date: 10/31/2008

Usually ships in 1-2 business days

Step 1: Open A New Document

    Opening up a new document in photoshop is real easy.

  • File

  • New

  • Then choose your settings.
    Name: Whatever you want to call the file if you choose to name it.
    Width: 450 Pixels
    Height: 20 Pixels
    Resolution: 72

Step 2: Choose A Background Color

    There are a total of 2 ways of choosing colors for your background.

  • The paint bucket which is the top arrow, you have to pick by the swatches which is on the right side of the screen. You have to select the eye dropper first though. Pick any Color you want.

  • Then there is the foreground and background images. All you have to do is click the foreground color which is the top box. Pick any color you want.

This Is What You Should Have Now

Remember the colors may be different as you may have picked a different color than I.

Step 3: Open Up Another New Document

    You do the same thing you did before, but some of the settings are slightly different as we are going to be making diagonal lines

  • File

  • New

  • Then choose your settings.
    Name: Whatever you want to call the file if you choose to name it.
    Width: 6 Pixels
    Height: 6 Pixels
    Resolution: 72

Step 4: Set Your Zoom

Don't forget to set your zoom to around 1400%. The option to set your zoom to your specs is available on the bottom left side of your screen that you are working with.

Step 5: Change Your Foreground Color

Click on the foreground box so that you can change your forground to black. You can put the hex code of 000000 in there.

Step 6: Make Sure You Pick The Pencil Tool

Make sure that your brush radius is at a 3px. Brushes should be located on the right side of your screen if not go to window and then brushed to access them.

This is What You Should Have Now

Step 7: Define Your Pattern

Now its time to define the pattern for the diagonal lines. Go to edit and then define pattern. Name it when the dialog box comes up asking for a name.

Step 8: Add Fill

To add fill, go to edit, fill and then okay. Remember you set the option before you click Okay though.

Want something Like This?

All I Did Was This...

I created a new layer and then used the round marquee on the new layer and then used white as the forground for the gradient that I add. I used the white to transparent gradient. I then played around with the filter called gaussian blur and then finally the opacity which can be found on the layers area on the right side of your screen when you create a new layer.

Did You Want Something Like This?

All I Did Was This...

Make sure you have selected the background layer to be able to do this. Then go to layers, style and then finally bevel and emboss where you can play around with the settings.

Step 9: The Final Step

If you decide that you want to add text to your userbars, all you have to do is T button on the left side of your screen and then all you have to do is click your userbar on top of your background. Choose the location on your userbar that you want the text placed and then write what you want. You may want to change the font size, font type on the top before you do so, but that is up to you. The normal userbar tutorials that I have seen have always suggested visitor font. I am not as I feel you can use any type of font you want to use.

Some Other Things That You Can Do

Some other things is that you can also add images into your userbars. I'd suggest do that before you add your fill lines. Diagonal lines are not the only options when creating userbars. I've even seen polka dots before, but the most common form of fills are the diagonals.

Did You Like This Tutorial?


Feel free to leave your comments here.
Do you want to create a lens like this one? Just click here to start writing your lens today.

submit
Show All

by

Trekkiemelissa

Hello my name is Melissa. I also love Star Trek and used to be addicted to star trek simming. With the writing of articles online, that addiction has gone... more »

Feeling creative? Create a Lens!

Related Tags