First of all, Please Register to see more great tutorials, and help Furious Gfx out! Thanks...
Rainstorm Tutorial
I’m writing this tutorial in regard to my recent Sig of the Week #3 entry. This tutorial will teach you how to create the lightning and rainstorm effect featured in that sig. I will assume that you know just some basics about photoshop before I begin, in order to shorten the length of this tutorial.

NOTE: You will need Adobe Imageready to follow this tutorial.

To begin, create a New Document, whatever size you like, but I prefer 400x125 for most sigs. Fill the document with black.

Next, create a New Layer. You can also do this quickly by hitting Ctrl-N. For this part, you may use any pictures of lightning, brushes, or other effects. To learn how to create a lightning bolt, click here. Place the lightning in an area to the left or right of the document. Apply these settings. Create another layer and put it behind that layer. Reset your colors to default by pressing D. Go to Filter-Render-Clouds. You may go to Filter-Render-Difference Clouds if you prefer.

Next, create a layer mask by clicking this button at the bottom of the layers palette. Take the Gradient Tool and drag across until the clouds are only behind the lightning.

Merge the layers into one. Repeat the process until you have several layers with a lightning strike. Next, add a new text layer in the center of the document. Make sure the text is black. Give it these settings.

Then, create another layer on top, and fill it with white. Make a series of three layers, each with the following effect, or download my new Brush Pack. If you're using the brushes, just click once on a transparent layer. Otherwise, fill each layer with black. Filter-Noise-Add Noise at 43% for each. Then, Filter-Blur-Motion Blur. Angle-57, Amout-34 pixels. Use a large, soft eraser brush to get rid of the top and bottom edge where it's too white. Go to Image-Adjustments-Brightness/Contrast. Brightness-22, Contrast+71. Got to Layer-New Adjustment Layer- Color Balance. Change the boxes at the top to the following, from left to right, for shadows, midtones, and highlights. -49, 0, 44. Set the blending mode of each of these layers to Screen.

Jump to Adobe Imageready. In your animation frame, make sure all layers are disabled. Make a new frame. Enable the white layer. Make one more frame, and enable one of the lightning layers and the text layer. Make one last frame and disable the lightning and text layer. Tween the two frames with these settings. After that, go back to the frames in which the lightning layer is visible, and enable one of the three rain frames in no particular order. Repeat the process to each of the different lightning frames. You should end up with an effect similar to the one in my sig.
Use one of the following links due to bandwidth usage.
Link 1
Link 2
Link 3
Link 4
I hope you enjoyed this tutorial. If you have any questions, post them either here or under the help section of the FGfx Forums. Thank you and happy photoshoppin'!

yay! great job on making it to good-tutorials!

this whole section is really confusing to me...

is this series of 3 layers including the white layer?
are they on top of the white layer?

for some reason, I cant get passed this last part... could you clarify the instructions a lil more?....


I'm a newb :blink: :unsure:


thanks

What you do is you create 3 separate layers, not including the white layer. It doesn't matter whether or not they're over the white layer or not, because if you follow the instructions, the white layer will never be enabled at the same time as the rain layers. You use the effects mentioned on each of the three layers that you create. I like to create them one at a time.

aight thanks a lot,

Ok, so I've created my new sig using PS then imageready, now what do I need to do in order to put it in my signature on a forum?

do I need to convert the image? with what program?
where can I host it?


thanks

host it using a site such as photobucket.com or imagshack.com. then, you put it in your sing using the control panel.

Very neat tutorial. As you can tell by my name I would love that sig!!

But I can't get it to work :(

I get to this part:

Make a series of three layers, each with the following effect. Filter-Noise-Add Noise at 43%. Then, Filter-Blur-Motion Blur. Angle-57, Amout-34 pixels. Use a large, soft eraser brush to get rid of the top and bottom edge where it's too white.

I don't get it? It won't let me add noise to the empty layer. I get a message saying: Could not complete the add noise command because the selected area is empty


What am I doing wrong?

I'm sorry I forgot to tell you. You're supposed to fill in the document with black. Then add noise.

nice job..almost 6000 views you brought to Fgfx.

Hi I did everything you said in the tutorial up to imageready but when I tween 2 frames from the last frame those 2 tween frames are transparent but with some lightning coming throught.

I can't seem to fix that,I did try lowering the opacity of one lightning frame and then making the opacity higher on another frame,to see if i could achieve the flash effect but it doesnt look as good.

Btw awesome tutorial.

thanks


edit*** sorry but I had discovered I had a transparent layer which was causing the problem..I added a render on transparent instead of black background.but I got the animation working fine now.
thanks.

Yeah . . . I don't understand the animation part at all. Can you explain what I did wrong? I don't understand how you make new frames . . . All I see is the 'duplicates current frame' option in the animation window. Also, do you have to go back and deactivate the layers selected for the last frame? Or is that even how you do it?

Yeah, I tried again. But again, I don't know how you make the animation frames. The only way I can make new frames is with the 'Duplicates current frame' button, and then I have to go back and deselect all the layers I used for the duplicated frame. This is obviously not how it's done. The tutorial says:

It sounds like there should be a new frame button somewhere. It also sounds like after you enable a layer in the layer pallete, the animation frame copies the layer. Are you talking about enabling the layers in the layers pallete or enabling the frames in the animation window? I am really confused.

This is what I got the second time. As I said, I couldn't follow the animation part of the tutorial:

I'm sorry for the misunderstanding. There's actually a new frame button that you can use. All of the layers in the selected frame will be copied in the new frame that you create. Therefore, when you make the first frame, you will have to disable the white layer and enable the text and lightning layer. After that, just make a new frame and disable both lightning and text layer. Hit tween and make sure opacity is checked, with 2 frames and you'll be good to go!

Here is the new frame button:

Hey Nice tutorial but i have a question... i have used imageready for about a year now, and it may seem newbish but how many black frames did you put between to make it advance slower. I added maybe 5 extra black frames to slow down the animation. and also, how did you get your text and lightning to sorta "hang" there longer, this is the best i could get, without it looking weird. i added a .1 sec delay on the point when my text and lightning were fully tweened in.

Please let me know

Thanks

--IoNiZeD

Just so you know, i didn't add any extra black frames. I changed the length of the frames to anywhere between 2 and 5 seconds. Also, in your animation Ionized, It looks like the white is fading in; you should have it 'flash' on and fade off. Don't tween between the black and white frame. Also, to have your text hang there for a little longer, tween with more than just 2 frames. 2 is how many frames i used in my sig, but you should probably use more on a smaller piece of work.

Very nice Job! B)

I had to register to say this, but thanks for the tut man, it's awsome. It's actually the second tut I've used that I needed to use imageready in, so really it's my second animation. I still don't understand imageready fully, but this was the result of a good, well explained tutorial.

http://img209.imageshack.us/img209/883/ani...ghtining2ft.gif

Thanks again man.!

It's a great tut!!!!

But i'm stuck here: "Then, create another layer on top, and fill it with white. Make a series of three layers, each with the following effect. Fill the document with black. Filter-Noise-Add Noise at 43%. Then, Filter-Blur-Motion Blur. Angle-57, Amout-34 pixels. Use a large, soft eraser brush to get rid of the top and bottom edge where it's too white. "

I've created another layer and filled first with white, then with black. I've done step by step the things sayed to do but this is what i get when i do; "create another layer on top, and fill it with white. Make a series of three layers, each with the following effect. Fill the document with black. Filter-Noise-Add Noise at 43%. Then, Filter-Blur-Motion Blur. Angle-57, Amout-34 pixels."



Can u help me to finish the tut???

(My english is not best, i'm from holland, so i hope i'm clear with my question)..

I don't get the part with the Apply these settings...FROM WHERE?

Ok. Thank you for the compliment on the tutorial, brettyfx and gakkuzo. For the Apply settings problem, just right click on the layer and go to blending options. Click on outer glow and you should see the same page as the one on the link.
For your problem, gakkuzo, basically just follow what it says to do. I'm not quite sure what your question is. I know your graphic will look strange during the steps of creation, but it will look right in the end. If anyone has more questions/problems, please post them.

THANX MAN FOR UR GREAT TUT!!!!

How do u create those lines or branches that connect to the lightning that dissolve?

Get a small soft brush and add on jagged branches to the lightning. I recommend something like maybe 3 or 5 pixels in size.

Merge the layers into one. Repeat the process until you have several layers with a lightning strike.

OK about the merging the layers into one wat layers do i merge together. The clouds, the lightning and do i merge the background to them too? or the background always stay separate and one?

How do you put the new layer behind the lightning layer?? do you merge them together??

1. no, keep just the clouds and lightning, not the background.

2. just click and drag the layer below the layer that i specified, so it is beneath the first layer of lightning. that makes the lightning in front of the cloudy sky.

yes! done it! thank you! first ever tutorial that i can do!

Hey trigger, can you give the name of the sci-fi font used in your signiture please? (if thats ok)

the font that says technology advanced

thanks !

Yay! Now you should stay and be active and learn more! lol. Well welcome to fgfx.

The font that says 'Technologically Advanced' is called Xenotron. I found it by searching on google for 'fonts'. I clicked on the link that said 1001 free fonts or something like that. I hope that helps!

BY THE WAY - For everyone having trouble making rain, i have a new brush pack in the miscellaneous section for people who are lazy like me :D

hi..i can't see all the buttons like the gradient tool and more stuff and how do you apply the settings ::

Place the lightning in an area to the left or right of the document. Apply these settings. Create another layer and put it behind that layer. Reset your colors to default by pressing D. Go to Filter-Render-Clouds. You may go to Filter-Render-Difference Clouds if you prefer.

this is my first tut that i follow and already having problems <_<

>.> im doing this Tut a lot of confusion going out with me but im getting by, i am in the thing were u do highlight and shadows and midtones i dont get it

1. do i go from left to all the way to right on all?

2. do i do like shadows on 1 layer midontes on another?

3. am i doin gthis on the rain layers?


respond ASAP please

bah screw it this tuts to hard

B) B) nice thankyou

Merge the layers into one. Repeat the process until you have several layers with a lightning strike. Next, add a new text layer in the center of the document. Make sure the text is black. Give it these settings.

Ok that was ta confuzzing! :o :huh: and how do i move the the thunder to the black document? :huh: and when i do that silly thing were you click layer mask and use the gradient tool this happens:



Whats going on 0 brany 1!? :huh:

I apologize, but i'm not exactly sure of what you did incorrectly. As this is my second tutorial, i don't know what all of the possible problems are. One little misunderstanding can make a huge difference. Also, this tutorial should be preformed by people who are very knowledgeable of photoshop and the way animation works. Again, I apologize. If anyone has any ideas about this problem, feel free to try to explain. Thank you.

hi im new to photoshop. i know most of the main stuff but u loose me wen u merge the two layers together and repeat were do u repeat from and how do u merge??? thx

Ctrl+E ?

Uh.. Hehe.. Hi :D.. I just joined.. but i've been looking at this tutorial for a week or so and I understood it right away..

I'm an avid photoshop user - over a 1 1/2 of usage.. And I'm STILL learning new things.. Expecially this..!

It's a great tut and I use it very frequently..

I'd like to show you one that I just made.. Today I learned that (since I watch WWE religiously with my boyfriend) Eddie Guerrero died Saturday..

I made this in tribute to him, since I've watched him wrestle since he started.

I hope you all like it!

Dont like to be rude...but who the f#ck is Eddie Guarry?

I love the effect you've made and I've done it so far as the animation...and then it just loses me completely... :( I don't know how to disable the layers or just choose the white or rain layers...I don't understand those parts... :unsure:

hmm... hello peoples i am into photoshop and found this tutorial on good tutorials so i came here and i have decided to register for the forum... nice totorial man sweet.. B)