Sig Tutorial

W

Waffle

Alpha Geek
Ever wanted a personalised sig for a forum but never had the know-how? Well read on!

Create a new document sized 500x150 in photoshop (or whatever).

Now, decide what you want in your signature. I'm going to take you through step by step with links to the various stages.

I love grunge and slightly darker sigs, and so I nabbed meself some grunge brushes of various sites - credit to those guys. (Check the link post in Graphic Design)

If you decided to go for grunge, which is always good as images blend very well, then get a good brush, and a good colour. I use a nice orangey brown colour. Paint randomly over the layer. Overlap, use different opacity levels, be grungy!

Depending on your brush and colour, you should have something like this now.

http://img57.exs.cx/img57/4051/Grungeimg1.jpg

Then, create a new layer, choose a different brush, and do exactly the same. Paint randomly all over the layer, leaving some parts clear so the other layer shows through. Here is a link to what your image might look like, with the background hidden.

http://img57.exs.cx/img57/8582/Grungeimg2.jpg

Do this as many times as you want. I did it three times. Then take the top layer and change the blending to Multiply. Merge down with CTRL+E (or COMMAND). Then set this layer to lighten, reduce the opacity to 70% or so and merge down if you are happy with how it looks.

http://img57.exs.cx/img57/2628/Grungeimg3.jpg

Now, you have a decent background to work with. (If you use filters, tech brushes, whatever, you will still have a good background to work with, but it will just look different, obviously :p)

Then, create a new layer. Find the image that you would like to use in your sig. I chose Gordon Freeman from HL2, seeing as I am now losing sleep through CS and HL... :swt:

The first thing to do is edit the image and remove all of the parts you don't want. Remove the background with the magic pen tool, and use the rubber with varying opacity levels to make it blend well - rub away all of the edges to get rid of the sharp change in colour, and then slowly change the % and the angle of the strokes to blend the image in nicely.

In this case I removed the white, and then used opacity levels on the rubber and took away the edges.

My image started like this, and with blending changed to this.

http://img57.exs.cx/img57/374/Grungeimg4.jpg
Before

http://img57.exs.cx/img57/8538/Grungeimg5.jpg
After

Then, add some text, and various other logos and images.

Make sure to do each new thing on a new layer.

Add a quote, use a cool font...

The sig will be looking pretty good by now, but to give it a finished look, it needs a border.

To do this, firstly, double click on the BACKGROUND layer, to change it in to an editable layer. Then hold down control, or COMMAND, and click the thumbnail of layer 1 in the layers pallete. This will select the whole of the background.

Then hit EDIT>>STROKE. There are various ways of doing this, but I prefer to use black as the first colour, and do a 5 pixel OUTSIDE stroke. Then I change colours to the orange used in the sig and do a 3 pixel CENTRE stroke. Then do another 5 pixel INSIDE black stroke.

Hit ok, and look at what you have created. Save it as a PSD doc first, so you can go and improve it later if necessary.

Then save it as a jpeg, and if you kept the image to 500x150 pixels, it should be under 100kb at maximum quality. Then save it as jepg, upload it and use it as your sig.

To do this, go to www.imageshack.us or similar, hit browse, load the jpeg image, and then on the page of codes copy the FIRST ONE - one with the
Tags.

Then go to hardwareforums, hit Edit Sig at the top of the page and paste that code. Preview and save it!

All done.

I came up with this.
 
Hi Waffle! I have my background. I have a black and white image that I scanned. When I open it up in PS, it's in its own little window with the Red, Orange, and Green buttons up in the left, top corner. I had to resize it way down so that it would fit in background frame. It won't drag afte being resized. I tried to save everything together, but the background is saved by its self, and so is the image, saved by its self. How can I get the image out of the "computer window" picture frame, and onto the signature background?
 
Open both images in photoshop, and make the windows smaller til you can see both. Then Double Click on the scanned in image - I expect it is locked.

Then you will be able to drag it on to the surface of your background.
 
Hi Waffle! My Internet has been out, and I'm still on the sick list w/ a head cold. I just now tried to send you an example of what I came up with for the sig. tutorial. I can copy the URL at IMAGESHACK, but when I go to paste it here in the Forum thread, an Internet Explorer Help message appears. How do I overcome that, so I can send you my stuff?
 
Never heard of that problem.

Try using the direct link to the image, instead of the IMG tags one.

Select it all, right click and copy (if this is on the MAC, then you have to use Alt I think, or otherwise hit COMMAND + C)

Then start typing your message here, and the press COMMAND + V or Right click and Paste.

Otherwise, type the link into the message here,
 
Waffle, I just tried the Edit Sig thing, and the same thing happens. Internet Explorer Help appears, and I can't paste the code! What's wrong? The Mac? :chk:
 
No idea I'm afraid. Maybe there is a glitch with Edit Sig?

Reply to this message with the link, and I can see it anyway!
 
OK. As you can see the border stops. I scanned the image from a postcard. I found out that a real photo would be OK. I used Bill Gates to find out! :mad:
I'm using PScs academic version. Doing the border, "outside" won't work! Only the "inside", and "center" :confused: I tried to get your warm tone grungy colors, but all I could find in the Swatch Palette were pastel, flat, grayed out colors. Nothing vibrant, or warm tones like your's appear. I gave up on the grungy effect. I get the idea, but that's going to take some practice with the "brushes", and gettting the right colors. I did this quicky landscape to show you what I'm talking about.
I haven't any experience with colors at all. That Color tab mystifies me. Any suggestions will be appreciated!
 
What inspired it? They say that "Art, is all in the eye of the beholder!" It's a spoof! It's a play, on things, and words! :)

Question: I could paste the URL to the Edit Signature on my PC, and clicked Save Signature, but I couldn't find any way to Submit, or Send it! So, I had to come back to the Mac and type it in. Where was I missing it?
 
When you hit Save on the sig, it's automatically added to the bottom of your posts.

That's all you needed to do to show the sig!
 
Thanks Waffle, for the answer on the Sig question.

Question: Why didn't I get a notice that you had sent the answer? I just now found your answer, by checking in at the Hardwareforums. Is that the new SOP?
 
SOP? Sorry I'm bad with Acronyms.

You may not have subscribed to the thread, or the settings changed.
 
SOP = Standard Operating Procedure

I was clicking around in the" Normal" drop down list, down near the bottom of the Color Palette, and found some very interesting effects. Is this where you went to get your "grungy" effect?
 
Thanks for the info on the brushes. TTYL (Talk To You Later!) :good:

P.S. How do I get rid of the "I'll do a follow up" that's written underneath the signature picture?
 
Hi Waffle! I got curious about an address that you gave to somebody. I started to open it up, but got "chicken", so I thought I'd ask you what it is. What is "aida32ee_393". What's it for?
 
It tells detailed information about your computer, right down to what memory you have, it's speed, clock speeds on chips...everything.
 
You must log in or register to reply here.
Back
Top