Friendster Delight
How to make userbars (tutorial) Testp


If you want to access fully in FD. Please do log in or register. Thank You. Welcome. FD
Friendster Delight
How to make userbars (tutorial) Testp


If you want to access fully in FD. Please do log in or register. Thank You. Welcome. FD
Friendster Delight
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Friendster Delight


 
Home:: Portal ::Latest imagesSearchRegisterLog in

Share | 
 

 How to make userbars (tutorial)

View previous topic View next topic Go down 
AuthorMessage
oracle
Ultimate Artist
Ultimate Artist
oracle

Posts : 336

Age : 36


How to make userbars (tutorial) Vide http://www.friendster.com/oracle06
PostSubject: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSat May 02, 2009 5:15 pm

Lately the userbars have become very popular with people. They are mostly putting them in their forum signatures, which is very practical. They are small, but can be used for linking.

A lot of userbars can be found at www.userbars.com and www.userbars.org, but sometimes people can't find exactly what they want. This is why I have decided to make a tutorial on how to make you own userbar.

The pictures in this tutorial are made in Photoshop 6.0, so don't be surprised if you're Photoshop is different. I will be making a Thunderbird userbar.

First of all, you have to create a new picture. The dimensions are as shown in the picture below.
How to make userbars (tutorial) Step110


Next, you must choose you background color. It is best to use the gradient tool and the colors that would suit the thing you are making a bar for. In this case, I will be using a light blue color going to white (because of the Thunderbird logo).

It should look like this.
How to make userbars (tutorial) Step210


Now, we must add the diagonal lines seen in all the userbars. To do this, create a new picture, dimensions 6x6 pixels and transparent. Next, use the pencil tool on that picture to create a diagonal line like this.
How to make userbars (tutorial) Step310


When you draw that, go to Edit -> Define Pattern and choose the pattern name. Now go back to the first picture and the Pattern Stamp Tool in order to put lines into you picture. Since the lines are too bold, I would advise you to lower the opacity. I use 15% myself, but it's up to you to decide. After doing that, you get something like this.
How to make userbars (tutorial) Step410



Now it's time to add the logo to the picture. The logo must have transparent background, so when you put it it should look like this.

How to make userbars (tutorial) Step510


Now we've got only two things left. The first one is to add text to the userbar. For this, most people use the Visitor -BRK- font. That's what I'm going to use, too. When you choose the font tool, choose Palettes and do the following. Set the font size to 10pt, turn of anti aliasing, and increase the character spacing to 25. When you write the text, use the stroke option to create a black or white 1 pixel border, depending on the font color. Here's what you should get.
How to make userbars (tutorial) Step610


Then, you should add the elliptic transparent white part. In order to do that, choose the Ellipse Tool, select Create Filled Region and set the opacity to 30% or less to get the best quality. Create a new ellipse with this tool so that it's bottom part is located in the top of the picture.

The final thing to do is to add a 1 pixel border to the whole picture, and do it with around 20% opacity. I hope that there is no need to explain this. And here is the product – Thunderbird userbar.
How to make userbars (tutorial) End10


If you have any further questions or want to comment my tutorial, you are free to do so.

Here are some other samples that I've created:
How to make userbars (tutorial) Photoshop7
How to make userbars (tutorial) Ikariame
How to make userbars (tutorial) Deviantartc
How to make userbars (tutorial) Cs3g
How to make userbars (tutorial) Cs2p
How to make userbars (tutorial) Lhs
How to make userbars (tutorial) Lhsdlc
How to make userbars (tutorial) Pinoy
How to make userbars (tutorial) Googlem
How to make userbars (tutorial) Cokep
ENJOY:)


Last edited by oracle on Sun May 03, 2009 9:26 pm; edited 1 time in total
Back to top Go down
lheendc
Co-Admin
Co-Admin
lheendc

Posts : 973

Age : 28


How to make userbars (tutorial) Vide http://www.plurk.com/lheendc/invite
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSat May 02, 2009 6:16 pm

How to put stripes in the background of userbar? : Question.

1 vote for yahh. Thanks for sharing this.
Back to top Go down
oracle
Ultimate Artist
Ultimate Artist
oracle

Posts : 336

Age : 36


How to make userbars (tutorial) Vide http://www.friendster.com/oracle06
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSat May 02, 2009 8:57 pm

you'll have to create a 6x6 document(transparent) and use 1px pencil tool then create a diagonal line from opposite corners then go to Edit>Define pattern then a pop up window will appear asking for the name of your pattern. after saving it go back to your userbar then you can already find it on your current patterns Cool
Back to top Go down
jhennyz
Full Moderator
Full Moderator
jhennyz

Posts : 373

Age : 27


How to make userbars (tutorial) Vide http://www.jhennyz.multiply.com
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSun May 03, 2009 4:15 pm

ohw..

thanks for sharing this stuff..

too useful..^^
Back to top Go down
provanz
Full Moderator
Full Moderator
provanz

Posts : 2671

Age : 33


How to make userbars (tutorial) Vide https://fddelete.forumotion.net
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSun May 03, 2009 5:11 pm

nice


thnx for the sharing dude
Back to top Go down
oracle
Ultimate Artist
Ultimate Artist
oracle

Posts : 336

Age : 36


How to make userbars (tutorial) Vide http://www.friendster.com/oracle06
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSun May 03, 2009 6:11 pm

No Probz! just sharing what i know! ^_^'
Back to top Go down
dhee0711
Promoter
Promoter
dhee0711

Posts : 873

Age : 29


How to make userbars (tutorial) Vide http://friendster.com/ladychxx24
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSat May 09, 2009 4:22 pm

thanks for sharing 1 vote for you Very Happy
Back to top Go down
--hayca--
Full Moderator
Full Moderator
--hayca--

Posts : 2125

Age : 30


How to make userbars (tutorial) Vide http://www.friendster.com/tinytinytinytinytiny
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSat May 09, 2009 4:24 pm

nice nice kua Very Happy
Back to top Go down
joshjammark
Promoter
Promoter
joshjammark

Posts : 120


How to make userbars (tutorial) Vide http://www.friendster.com/joshjammark
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeSun Jun 07, 2009 2:16 pm

thanks for this..
^^
Spoiler:
Back to top Go down
pinoynosyaj
Guest
Guest
pinoynosyaj

Posts : 6


How to make userbars (tutorial) Vide http://nosyaj.team-talk.net
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitimeThu Aug 06, 2009 2:55 pm

nice..
Back to top Go down
Sponsored content




How to make userbars (tutorial) Vide
PostSubject: Re: How to make userbars (tutorial)   How to make userbars (tutorial) I_icon_minitime

Back to top Go down
 

How to make userbars (tutorial)

View previous topic View next topic Back to top 
Page 1 of 1

Permissions in this forum:You cannot reply to topics in this forum
Friendster Delight :: Fashion & Graphic Designing :: Tutorials-