Create a Userbar in Photoshop

Userbars are small icons (350x19), usually created with programs like Adobe Photoshop or Gimp, that many forum users attach to their signature or website to express their personality and interests, much like a cell phone ringtone does in the real world. There is a userbar for every conceivable subject from video games to music to TV shows and movies. In this article you will learn to create your own custom userbar in a few simple steps.

Steps

  1. Open photoshop and make a new document (File > New), size 350 pixels wide by 19 pixels high, with background contents set as transparent.
  2. Choose your userbar subject. For this example a manga drawing is been used. You could choose anything you like. You can choose to copy the image entirely over the layer or you could make it smaller with the Transform tool. If you do this take the eyedropper tool (I) and click on a colored part of the logo. Change your background color to your foreground, and pick another color that matches your logo.
    • If everything is alright you should have something like this example.
  3. Click File>New and choose for as size 3 pixels wide by 3 pixel high, with the background contents set as transparent. Enlarge the layer with the Zoomtool and use your Pencil to make 3 squares just like the picture on the right side.
    • Click on Edit and choose Define Pattern, name your pattern and click OK.
  4. Make a new layer and choose the Paintbucket tool. Make sure you choose the pattern you just made. Fill the layer. As result you should have a grid pattern on the layer similar like the picture on the right side.
  5. Add a text if desired to your userbar. Choose the type tool, choose a font and size and type the text.
  6. Save your userbar and you are finished!

Tips

  • Userbars are either 350x19 px in size or less commonly 350x20.
  • Practice makes perfect! Keep trying until you get it perfect, and just how you want it to look.
  • This tutorial is just a starting point, you can make many variations on the classic userbar, as long as it looks good.
  • Keep it simple, make sure you don't go overboard!
  • Preview your userbar before you save it, to avoid multiple drafts and versions.

Things You'll Need

  • Adobe Photoshop 7.0 or higher

Related Articles