Jump to content
Sign in to follow this  
Bea

Step By Step Instruction On Creating Your Signature

Recommended Posts

So this is my second attempt posting my sig tutorial for Bubbles and whoever else is interested! Let's see if i can get it to post this time and even more importantly lets see if i can remember the steps i did to go with the pics. :D The program i use to make signatures is Photoshop CS2 but i think you could apply this to the other photoshop versions too.

 

First this we do is make a new image which will be our workspace where everything goes and what will ultimately be our signature! For this one i made it 400 x 130 pixels which i find to be a good size.

1Custom.jpg

You can also see that the canvas colour is set to white. If you want your signature to be an irregular shape you would set it to transparent.

 

Now the next few steps were very much made up by me on the spot and i assume there are faster ways to get the same result...but where's the fun in that?!

 

To begin to make the background patter i to the paint bucket tool on the left side of the screen and then selected a pattern from the patterns palette up the top.

2Custom.jpg

With that you will just colour in the entire canvas (white bit) and the pattern will show up. But black and white is a bit boring so here's what to do next!

 

In the Image menu go to Adjustments > Hue/Saturation.

3Custom.jpg

 

Making sure the Colorize box is checked play with the slider bars to change the colour and the brightness levels - play around until you have something you're happy with.

4Custom.jpg

 

Now because i thought that pattern was a bit on the crazy side i decided to apply a filter to make it nicer. You do this by going to the Filter menu at the top of the screen. For this signature i used Texture > Patchwork.

5Custom.jpg

 

Adjust the settings in the window that pops up and click okay to see the filter, if you don't like it Ctrl + Z to undo and try again.

6Custom.jpg

 

This is the background after i've applied the filter with the above settings.

7Custom.jpg

 

Now for the "fun" bit - adding parts of other images to your signature! To open an existing image go File > Open and select the image you want to use. It will open in a new window within photoshop. Now comes the tricky bit. To cut it out you use the Pen Tool which can be found in the tools panel to the left of the screen. Check that Path and not Shape layer is selected up the top (circled in red) and then click once on the point you wish to begin cutting from. When using the pen tool a single click will make a straight line and a click, hold and drag will let you make a curved line. Try to keep the points of the path from getting too close together (unless there are sharp edges and turns, etc) as it will ultimately make a neater cut.

8Custom.jpg

 

When you use curved lines you have to reset the point after each one, you do this by holding ALT and right clicking the last point you made.

9Custom.jpg

 

Now that you've (hopefully) got the hang of the pen tool continue to cut around the part of the photo you plan to use. To finish the path you have to click at the point you started at (so making a circuit type thing). The path will become one solid line.

10Custom.jpg

 

To make the path a selection that you can copy and paste onto your signature you go down to your layers panel. Along the top of this panel you will see three tabs: layers, channels, paths. Click Paths. Select the work path and then click the little arrow in the top of the panel, then click Make Selection.

11Custom.jpg

 

In the window that pops up you should leave most of the settings as they are but you can play with Feather Radius. Feathering makes the edges softer and for animals with fur or feathers i usually make it 3-5, if it's a really large image you're working with then make it larger.

12Custom.jpg

For a clean, sharp edge make it 0 but you better hope you were neat with the pen tool cause any rough bits show up! :)

 

Once you've done that click okay and the solid line around whatever you've cut out will become broken. Then you can copy (Ctrl + C) and then click on your signature and paste (Ctrl + V).

13Custom.jpg

 

Obviously you'll want to resize it and you can do this by going Edit (up the top) > Free Transform. To stop the image losing it's shape hold down shift while you do this.

14Custom.jpg

 

Now you repeat the cutting out and pasting steps until you have done all the pets/images you want to add to the signature. Once you're done you may need to reorder the layers, this is simple, like if you were arranging paper on the table. You click and drag the one you want on top to the top of the list and so on till you have everything overlapping the way you want.

15Custom.jpg

 

You might also want to rearrange how the images are arranged on the background. Or flip them - you can do this by going Edit > Transform > Flip Horizontally as i did to Blinkie to make him face the same way as Ozzie.

16Custom.jpg

 

Another useful thing to know is how to change the opacity of a layer. If for example i wanted Mickey to be slightly see through (for whatever reason) i would select his layer (by clicking once on it) and then changing the opacity %.

17Custom.jpg

 

Now to add text, we do this by selecting the type tool from the tools panel and then clicking and dragging to make a text box. You can edit the text font, size and colour much the same as you would in microsoft word by changing the settings along the top of the screen.

18Custom.jpg

 

To make the font stand out more i've added a drop shadow which i did with the style panel.

19Custom.jpg

 

Finally i've made a white box around the whole image. I did this on a new layer so it didn't overlap any of the other layers. To make the box i used the rectangular marquee tool from the tools panel. Then to make the selection white go Edit > Stroke and make the colour white, change the line width to whatever you want (i think i made mine 2 or 3) and click okay.

20Custom.jpg

 

Then all you have to do is save it by going File > Save. You should save two copies: one .psd file (so you can still make changes if you want to) and one .jpg (or .gif if you have a transparent background/irregular shape) for using on forums.

http://i105.photobucket.com/albums/m217/be...al/21Custom.jpg

(i've posted more images than i'm allowed, (Laughing out loud), so the last one's a link!)

Edited by Elly

Share this post


Link to post
Share on other sites

Bea you are a genius really this are awesome instructions and I really am glad that you do my siggies for me :ausb:, honestly and seriously you did a wonderful job. Did you PIN this?

Share this post


Link to post
Share on other sites

I am printing this out and going to try it tonight. Thanks for posting Bea :ausb:

Edited by Bubbles

Share this post


Link to post
Share on other sites

Oh I just pinned (Laughing out loud) because it is good - I had to try out that option :ausb:

Karen I can't wait to see what your new siggy looks like.

 

I have Roxio Photosuite 5 I wonder if it is similar? It came with the computer.

Share this post


Link to post
Share on other sites

this is great , thanks for doing this Bea !!

l took a course on how to do this , but that was a few years back , so l forgot how to do some of that stuff :ausb:

Share this post


Link to post
Share on other sites

Bea did mine and I love it !! Thanks heaps Bea !! :ausb:

 

But I will still play with your tutorial just to teach this ol' dog a new trick. Thanks again !!

Edited by Bubbles

Share this post


Link to post
Share on other sites
Guest Budgie Baby

Can I just say thanks heaps Bea and I think Bubbles new signature and yours are fantastic! My nephew did mine but I seriously want to learn how to do it myself.

Share this post


Link to post
Share on other sites

Wow! That's great Bea. Thanks for making it!

I've been using Photoshop for ages but you've taught me some new things. :D

Share this post


Link to post
Share on other sites

Bea taught me the basics on how to use photoshop then I just played around once I had a grasp of what I was looking at! :huh: It is amazing what people can do with it!

Share this post


Link to post
Share on other sites
Guest Phoebe
:( Good work Bea! Guess I better get Photoshop myself but NOW is not the best time, with Christmas expenditures and all. :huh:

Share this post


Link to post
Share on other sites

Thats cool !!! I just found this post. I have photoshop too, but I was using a different tool to cut things out. This is much easier :wub:

 

Thanks Bea :D

Share this post


Link to post
Share on other sites

Bea, thanks for posting, you're a great help, i'm going to try it now. :D

Share this post


Link to post
Share on other sites

I'm glad this post has been helpful! :P Good luck creating you sig, i look forward to seeing the end result.

Share this post


Link to post
Share on other sites
Guest Phoebe
:P I would just love Bea to do a signature for me but it keeps changing, like as of tomorrow, I will have 6 budgies, next Saturday, 8 budgies and then in a month or so, it will change again! :(Laughing out loud):

Share this post


Link to post
Share on other sites
:P I would just love Bea to do a signature for me but it keeps changing, like as of tomorrow, I will have 6 budgies, next Saturday, 8 budgies and then in a month or so, it will change again! :(Laughing out loud):

You could pick out a few of your favourite bird photos and then instead of naming everybody we could invent a clever tag so it wouldn't matter how your flock changed...

Share this post


Link to post
Share on other sites
Guest Phoebe
:P Thanks Bea, perhaps it should just be my "permanent birds" but not the gerbils as I fear they are permanent. Will think about it, thanks again.

Share this post


Link to post
Share on other sites

Wow thanks sooo much for the help Bea! :) Look at what I made in a few moments...

 

NathansSigcopy.jpg

blue tones

 

MM.jpg

colourful

 

CCAbanner.jpg

this is going to be my aviaries logo so to speak for my website and when advertising :D

 

Kirby :D Thanks again Belinda!

Share this post


Link to post
Share on other sites

Looks like your having fun with photoshop!! :fear If you just play around with it you'll find there's so much you can do!

Share this post


Link to post
Share on other sites

WOW!!! Great info Bea!

 

I have been using paint shop pro 9 to do the sigs - photoshop looks so much easier!!! I never knew you could cut using the pen tool!!!! :fear

 

You are very talented :D

Share this post


Link to post
Share on other sites

thanks for the fantastic info bea just wish I had photoshop now i made mine using paint (Laughing out loud).

Share this post


Link to post
Share on other sites

You can download a 30 day trial of photoshop. :fear You could make yourself a decent stock of siggy's to use in 30 days.

Share this post


Link to post
Share on other sites

(Laughing out loud), I got really frustrated at first, trying to make a siggy, because your (Very informative) steps were in Photoshop, and I use Ubuntu, so I have to use GIMP, and it´s different. But I eventually got the hang of it... sort of... (Laughing out loud), thankyou for the info! :blink:

Share this post


Link to post
Share on other sites

Wow, l have photoshop, but l have no idea how to use it!

 

I'm going to give it a shot now :blink:

 

Great step-by-step bea :D

 

EDIT: Just did it, not too sure about how it looks, l tried to muck around with it a bit, l really like the effect with the text, it looks like its written on a window of a car when there is dew on it.

Edited by Missy

Share this post


Link to post
Share on other sites

I'm glad this is still helping people with siggies! :rip:

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×