Jump to content
xisto Community
Johnny

Johnny's Sig Tutorials Pt. 2 -- Coloring Finally Multicolor your sigs

Recommended Posts

Okay guys, after forever and a day of putting these tutorials off, I finally got around to making part one of my tutorial series, to show you how to effectively color your sigs, and multicolor as well.

 

One result will look like the very last image in the tutorial.

 

So, without further ado, let's get down to business.

 

 

STEP 1:

Open a new sig (I used 400x150 pixels) and fill the background with black. Then brush up your sig (this will be in a future tutorial) with white and add a brightness/contrast layer (from the layer-->new adjustment layer menu, or the black/white circle icon in the layers box.) and bring the contrast up to about 30. It's always wise to add a brightness/contrast layer to give a background more depth, and a cleaner look.

 

Posted Image

 

 

STEP 2:

Now add whatever render you may want to use (also in a future tutorial.) In this case, I used a nice Half-Life 2 one. Add a bit more brushing to blend him in (ALSO in a future tutorial) and you're looking good so far.

 

Posted Image

 

 

STEP 3:

Then, add whatever effects you may like, and some text.

 

Posted Image

 

 

STEP 4:

Now comes the fun part. Make a new color balance layer (found right by where you found the brightnesscontrast) and check out the new box. There's some sliders, and radial buttons for the different tones of light. Make sure the preserve luminosity box is checked, otherwise the "clean-cut" feel you made earlier with the brightness/contrast layer will dissipate. Now, play with the sliders a bit to create a base color. You'll want something not too vivid, and a similar color to your render's main color.

 

Posted Image

 

 

STEP 5:

Now, for the multicoloring part. There's quite a few ways to multicolor. I'll show you a few different ones, as each one is useful in different situations. First is the cloud coloring technique. This is a really quick and easy way to multicolor, but also has less control over colors than other methods. Create a new color balance layer, and play with the sliders until you get a more vivid color, which is similar to your render's secondary color, if any. It should be along the same lines as your first one, but a lot more vibrant. Once you have that, you can go to Filter-->Render-->Clouds, and this will add a cloudy look to your color balance's mask, and you'll see that you now have a multicolored sig.

 

Posted Image

 

 

STEP 6:

You can also take it a step further by right clicking the color balance's layer mask in the layers box, and clicking "Add Layer Mask to selection", then clicking the first color balance layer, and pressing delete (make sure your background color is still black.) This will make it so instead of the primary color on all of the sig, and the secondary on certain parts on top of it, the primary color will be in some parts, and the secondary will be inverted, and everywhere else.

 

Posted Image

 

 

STEP 7:

Next up is the lasso coloring technique. This gives you a bit more control on what parts you would like to multicolor, which is useful in situations like explosions, where you'd want to have a centralized section of color, or for example, you'd like to color a render's pieces differently or something. Anyway, create your primary color just like before, and then take out your lasso tool. At the top there will be a box called feather, change the 0px to about 15px. This will give the color soft edges, instead of abruptly changing from one color to the next, although that may be wanted in some situations. Now, hold shift (to make more than one selection at a time), and make some selections wherever you want the secondary color to be. Then, let go of shift, but with the areas still selected, create a new color balance layer, and play with the settings again to get your secondary color. You'll notice that the areas you had selected, are being filled with the new color. There's your lasso coloring.

 

Posted Image

 

 

STEP 8:

A slightly less used method of coloring, but sometimes useful (mainly in tech style sigs) is the rectangle coloring technique. Starting with your base color as before, grab your rectangular selection tool, and make some selections (while holding shift) wherever you like. Then create a new color balance layer and create your secondary color again. This won't look nearly as good on this one, because this isn't a tech sig, but you get the general idea. I've also found that this works well with different layer effects and patterns.

 

Posted Image

 

 

STEP 9:

Another way to color is done by brushing over the layer masks of your color balance layers. To do this, just create your primary and secondary color balance layers, and grab whatever brush (soft grunge or sparkle works best) you like, and brush over your color balance's layer mask. This produces similar results to the lasso coloring technique, but gives you a bit more control in the way the color is shaped. This is probably the most useful coloring method, as it gives you the most control, and it's slightly easier to do than some other ones.

 

Posted Image

 

 

So, here's my final result for that sig, with a few additions.

 

Posted Image

 

 

And SURPRISE! Yes, that's right, for the first time ever, I'm giving you guys the PSD for this sig so you can check it out, and maybe learn a few more things from the different layers in there. The link will be at the bottom of the post. Try hiding/unhiding (click the eye icon) the different layers, to see what effect they have on the sig. Now, remember, this is not for you to use as your sig. You may not use this or any part of it as your own. If any layer or part of it is found in a sig of yours, that is called a rip, which is basically image plagiarism, and I will not only make you remove it, but I'll also publicly declare you as an art theft, and the download will be taken away from everyone, to prevent further problems. Remember, this is just for you to LOOK and LEARN, I'm not giving it to you to use as your own. I've never had any of my art ripped, and I'd appreciate it if I could continue with that. If you REALLY want one of my sigs, send me a request through PM or instant message, and I'll most likely make you one anyway.

 

Okay guys, have fun, and look forward to future tutorials by me. If you have any questions or concerns, feel free to ask, and I'll do my best to help you out. And remember, this is just a general guideline. You don't have to follow it directly, and you can add/remove/replace steps as you wish. Experimenting is the key to becoming a good designer.

 

Also, this was done in Photoshop CS, so things may vary in different versions, but you shouldn't have any problems.

 

Link to PSD:

http://static.hugedomains.com/images/logo_huge_domains.gif

Edited by Johnny (see edit history)

Share this post


Link to post
Share on other sites

Half-life 2 sig <3Very pretty ;) 9/10

Notice from Johnny:
Took out the quotes to reduce scrolling.
Edited by Johnny (see edit history)

Share this post


Link to post
Share on other sites

you seem to have missed something out of the muticoloring, some people use like 4-5 differnt colors in thier sigs, mind you they might use the same process, multicolor is more then one color in dictionary terms. hmm pt 3 should be that, the use of different colors properly.

Share this post


Link to post
Share on other sites

Half-life 2 sig <3

 

Very pretty :D 9/10

 

Notice from Johnny:
Took out the quotes to reduce scrolling.

164690[/snapback]


X.x it's more about the tutorial than the sig, but thanks.

 

Woohoo! I can't believe all the pestering I gave you in the Photoshop forum worked after all!

 

I'll try this tutorial later and tell you how it goes. Thanks man.

164697[/snapback]


Nah, I pretty much ignored you. Just felt like doing them. ;)

 

But np. Show me some results sometime.

 

you seem to have missed something out of the muticoloring, some people use like 4-5 differnt colors in thier sigs, mind you they might use the same process, multicolor is more then one color in dictionary terms. hmm pt 3 should be that, the use of different colors properly.

164778[/snapback]


Well this is just a general outline of the techniques. If people want to add more, they can use the same methods. O.o

Share this post


Link to post
Share on other sites

X.x it's more about the tutorial than the sig, but thanks.

164790[/snapback]

I have no idea why people are rating tutorials now either. :-/

 

You should post them in the normal tutorials forum, and then move it here leaving the link.

 

Hmm, after doing this tutorial, I've learned a few things, but I've been using color balance in my sigs anyway. I think you should do effects and stuff....I don't know. Anyway, here're what I got:

 

Posted Image

 

Posted Image

 

How did you get your scanlines like that? I tried making them just 2 pixels far each, and it turned out really crappy.

 

Edit: Inserted img tags.

Edited by snlildude87 (see edit history)

Share this post


Link to post
Share on other sites

I have no idea why people are rating tutorials now either. :-/

 

You should post them in the normal tutorials forum, and then move it here leaving the link.

 

Hmm, after doing this tutorial, I've learned a few things, but I've been using color balance in my sigs anyway. I think you should do effects and stuff....I don't know. Anyway, here're what I got:

 

Posted Image

 

Posted Image

 

How did you get your scanlines like that? I tried making them just 2 pixels far each, and it turned out really crappy.

 

Edit: Inserted img tags.

164850[/snapback]


Hm...good point. I'll move them and whatnot in the future.

 

Not a bad sig, and the scanlines, I believe, were set on soft light for mine, and set in a 3x3 pattern.

Share this post


Link to post
Share on other sites

Thanks for this tutorial!! I'll definitely test it out later in Photoshop... *can't wait* ^___^I like how you introduced different multicoloring techniques. I used to only apply the cloud rendering effect before, but now I've got more to experiment with! XD

Share this post


Link to post
Share on other sites

Thanks for this tutorial!! I'll definitely test it out later in Photoshop... *can't wait* ^___^

 

I like how you introduced different multicoloring techniques. I used to only apply the cloud rendering effect before, but now I've got more to experiment with! XD

164880[/snapback]

Sweet. Remember to post it so that we can make fun look at it. :D

 

I used the cloud effects on my tekken sig, by the way. If you care. ;)

Share this post


Link to post
Share on other sites

Thanks for this tutorial!! I'll definitely test it out later in Photoshop... *can't wait* ^___^

 

I like how you introduced different multicoloring techniques. I used to only apply the cloud rendering effect before, but now I've got more to experiment with! XD

164880[/snapback]


WHEE! Sounds good. Be sure to lemme know (even though I stalk the photoshop forums like 24/7)

 

Sweet. Remember to post it so that we can make fun look at it. :)

 

I used the cloud effects on my tekken sig, by the way. If you care. ;)

164897[/snapback]

Make fun? Want me to make fun of your sigs Nguyen? I can give you some cruel truth if you want me to. :D

Share this post


Link to post
Share on other sites

that should be interesting to read johnny do i triple dog dare you.but since snil used your tutorial you would think it would have come out better, render sucks, looks like you did the trasform thing wrong again, brushing is plain, which means you look at the pictures and not read the words thats why its a tutorial snlil you "Read" them . the text meh i give it a so-so since it matches the colors, border ok, the scanlines make it even worse, and to finish it off need more contrast in your brushing to much white and a little black make it like someone is brand new to designing sigs5.5/10do i have to stand over your shoulders and use a ruler when you use the wrong brushing techniques????

Share this post


Link to post
Share on other sites

Great tutorial Johnny. Easy enough to follow, with a nice end result ;) (well the example looks awesome anyway :))

I like how you introduced different multicoloring techniques. I used to only apply the cloud rendering effect before, but now I've got more to experiment with! XD

Same here - I'll have to refer back to this sometime in the future!

Share this post


Link to post
Share on other sites

Great tutorial Johnny. Easy enough to follow, with a nice end result ;) (well the example looks awesome anyway :))

Same here - I'll have to refer back to this sometime in the future!

165017[/snapback]

Wow, I would've thought you'd already know this stuff Freaker. ^-^

 

Thanks though. Now go make more sigs.

Share this post


Link to post
Share on other sites

that should be interesting to read johnny do i triple dog dare you.

 

but since snil used your tutorial you would think it would have come out better, render sucks, looks like you did the trasform thing wrong again, brushing is plain, which means you look at the pictures and not read the words thats why its a tutorial snlil you "Read" them . the text meh i give it a so-so since it matches the colors, border ok, the scanlines make it even worse, and to finish it off need more contrast in your brushing to much white and a little black make it like someone is brand new to designing sigs

 

5.5/10

 

do i have to stand over your shoulders and use a ruler when you use the wrong brushing techniques????

164955[/snapback]

Have you ever heard of the wonderful punctuation mark called the period? I could think of 1000 places in your post above where you could have inserted a period.

 

Michael, Mike, Mikey, if you have read Brook's tutorial like me, then you would know that the majority of the "steps" are actually different techniques of coloring. In other words, Brook's tutorial was not like the ones on good-tutorials where they show you step-by-step. He did not give specific settings to use. Brook's tutorial was more like a "choose your own ending" type of tutorial. If you'd read it, you'll know. :)

 

There is a spot on the sig where I played with lasso brushing. See if you can find it.

 

And yes, I know what came out was plain. New brush packs will probably make it not plain. We'll see.

 

And how is a ruler going to improve my brushing??

 

And Brooks, I was kinda making fun of strawberrie when I crossed out "made fun"... If you want to give me the cruel truth on my sigs, do so, but just include how I can improve.

Share this post


Link to post
Share on other sites

Have you ever heard of the wonderful punctuation mark called the period? I could think of 1000 places in your post above where you could have inserted a period.

 

[1] Michael, Mike, Mikey, if you have read Brook's tutorial like me, then you would know that the majority of the "steps" are actually different techniques of coloring. In other words, Brook's tutorial was not like the ones on good-tutorials where they show you step-by-step. He did not give specific settings to use. Brook's tutorial was more like a "choose your own ending" type of tutorial. If you'd read it, you'll know. :)

 

[2] There is a spot on the sig where I played with lasso brushing. See if you can find it.

 

[3] And yes, I know what came out was plain. New brush packs will probably make it not plain. We'll see.

 

[4]And how is a ruler going to improve my brushing??

 

[5]And Brooks, I was kinda making fun of strawberrie when I crossed out "made fun"... If you want to give me the cruel truth on my sigs, do so, but just include how I can improve.

165200[/snapback]


[1] Yes, I like to leave my tutorials open-ended, for the most part. And it's "Brooks", but that's not my name.

 

[2] It's pretty obvious...it's just under your name there.

 

[3] Yeah, I'm guessing you used a set of Lighting brushes, which unfortunately I don't think I went over in my choosing tutorial. They're too plain to be used as a background, but great for special effects.

 

[4] I think he meant to hit you with the ruler. O.O

 

[5]I know you were. And it's a little easier for me to be brutal, cause I can say exactly what's on my mind, and I think it might help more, but I know I personally don't like bad (well, not bad...but mean.) criticism that much, so I avoid giving it to other people.

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

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.