Announcement

[ak47lol]

Due to heavy request I've decided to make a tutorial on how to create the custom rain effect.

This tutorial will explain how to easily create a nicer looking and more realistic rain effect in your game, using Woratana's Multiple Fogs Script.
Here is an example of the rain in effect:

See it in game:
Tech Demo High Opacity
Tech Demo Low Opacity
High Opacity

Low Opacity


Footage Taken From
Amulet of Athos: Legend of the Sarian Knights


NOTE:
This effect would not be possible without Woratana's amazing Multiple Fogs Script.
So please make sure you credit him!

STEP 1
First thing is to go and get Woratana's Multiple Fogs script, if you haven't already. It can be found in the Scripts section of this site.
Once you have it, put it in your game Script editor above Main.

STEP 2
Now you will need to create a custom rain grahpic or download my one HERE.
My one is very simple and was done in a few minutes in photoshop, you can probably create much nicer ones.
But feel free to use mine if you can't.

Once you have the graphic I suggest you name it to Rain.png and then put it in the pictures folder of your game.

STEP 3
Now that you have all you need, we can begin.

1. Go to the MAP where you want the rain effect to happen.
2. Make a new Event on the map, call it Rain Effect and set the trigger as parallel process.
3. Open the Event command menu by clicking in the event.
Then go to tab 3 > Advanced > Scripts...
And copy and paste the code below.

$fog.name = 'rain'
$fog.hue = 0
$fog.tone = [0,0,0,0]
$fog.opacity = 190
$fog.blend = 1
$fog.zoom = 100
$fog.sx = 0
$fog.sy = 50

$fog.show(1)

Click Ok. Then Do the same again but this time with this code

$fog.name = 'rain'
$fog.hue = 0
$fog.tone = [0,0,0,0]
$fog.opacity = 100
$fog.blend = 2
$fog.zoom = 130
$fog.sx = 2
$fog.sy = 50

$fog.show(2)

Now you have 2 Rain fogs, why 2 you say?
The first one only scrolls vertically so the rain will apear to be pouring downwards.
The second one will also scroll slightly horizontally thus making the animation seem more realistic.

Notice the blend type on the 2nd fog and the opacity is also different from the first.
This is all done to make the rain look better, you can play around with these figures to suit your map.
You can also adjust the value of $fog.sy = 50 , the lower the number the slower the rain will fall.

4. Below that, in the event have these commands:
Fadein Screen
Erase Event

MAKE SURE before you transfer the player on to or from this map you Fadeout Screen.
This is so you will not see the rain during transistions.

Thats about it, so your event should look like this.



Copy this event on every map you want it to rain.
And finally don't forget to add some good rain sounds as BGS on the map.

-EDIT-

Bright Map Settings If your maps are very bright with no tints, use this setting.

Spoiler:

All my maps are quite dark, the tint is over -60 on most of them. Therefore the fog setting I used were fine for them.
BUT on very bright maps with no tints the rain might look quite bad, so you MUST lower the opacity of the first fog.
Or tint the map a little darker, as little as -17 will make it look alot better.

This setting should be better for very bright maps with no tints.

$fog.name = 'rain'
$fog.hue = 0
$fog.tone = [0,0,0,0]
$fog.opacity = 90
$fog.blend = 2
$fog.zoom = 100
$fog.sx = 0
$fog.sy = 50

$fog.show(1)

$fog.name = 'rain'
$fog.hue = 0
$fog.tone = [0,0,0,0]
$fog.opacity = 100
$fog.blend = 1
$fog.zoom = 130
$fog.sx = 2
$fog.sy = 50

$fog.show(2)

Please DO NOT post this tutorial elsewhere, although you may link back to here.

CREDITS

If you use this technique please credit the following...

AK47(Tutorial + Rain graphic)

Woratana for his Multiple Fogs Script, please make sure you credit him!

Thanks to Celianna for giving me the idea to change from the default rain.

You can support this tutorial or my game, if you want.

Spoiler:

CODE

[url="http://www.rpgmakervx.net/index.php?showtopic=45857"][img]http://img641.imageshack.us/img641/5334/rrdark.png[/img][/url]

Spoiler:

CODE

[url="http://www.rpgmakervx.net/index.php?showtopic=34288"][img]http://img695.imageshack.us/img695/7864/supportbar.png[/img][/url]

This post has been edited by Akod: Feb 13 2013, 07:27 AM

[Artain]

Been waiting for this - thanks and nice job, ak.

And since I (was one of the people who) encouraged you to make this tutorial, I'll have to add the bar to my sig, and support it. ^^

[GuardianSix]

WOW, I love the effect! I will definetly put this in my game once I get everything finished. BTW, you just got yourself a new player.

[ak47lol]

Thanks guys, hope it was easy to understand.

This post has been edited by ak47lol: May 26 2011, 12:44 AM

[Hanzo Kimura]

Yay!! I was waiting for this!! Definitely using it on VS

[zakfoss]

I love you <3 thanks for sharing this! (no homo)

[ak47lol]

I just noticed something important.

Bright Map Settings

All my maps are quite dark, the tint is over -60 on most of them. Therefore the rain setting I used were fine for them.
BUT on very bright maps with no tints the rain might look quite bad, so you MUST lower the opacity of the first fog.
Or tint the map a little darker, as little as -17 will make it look alot better.

This setting should be better for very bright maps with no tints.

$fog.name = 'rain'
$fog.hue = 0
$fog.tone = [0,0,0,0]
$fog.opacity = 90
$fog.blend = 2
$fog.zoom = 100
$fog.sx = 0
$fog.sy = 50

$fog.show(1)

$fog.name = 'rain'
$fog.hue = 0
$fog.tone = [0,0,0,0]
$fog.opacity = 100
$fog.blend = 1
$fog.zoom = 130
$fog.sx = 2
$fog.sy = 50

$fog.show(2)

Hope that helps.

[Issa]

Whoa! Definately using this on S-E. I'll give credit ^u^

[Zakkie]

I'll use this too. You're improving all our games, thanks.

[Niclas]

Great, been waiting for this

[Faalhaasje]

Who's awesome? YOU are awesome! i was already searching on the net for such a tutorial n_n
I love you *hugs*

[rgangsta]

OMG. Ever since I saw that vid in the Game Screenshots section, I've been trying to make a similar rain effect. Now you have the tutorial and I'm just over excited.
Thanks a million.

[Celianna]

I'm glad I got you to make your own custom rain, because it does look so much better than the build-in one. Too bad you didn't explain how to make your own rain in Photoshop, could have been helpful!

[nexy]

I'm glad I got you to make your own custom rain, because it does look so much better than the build-in one. Too bad you didn't explain how to make your own rain in Photoshop, could have been helpful!

Insert noise + motion blur (monochromatic) is the most common method I've seen.

[ak47lol]

Enjoy. I'll probably try and show how to make the graphic when I get a little time.

Tech Demo High opacity
Tech Demo Low opacity

This post has been edited by ak47lol: May 26 2011, 11:23 PM

[Spetnaz]

this is a great tutorial. i'll be looking forward to the inclusion of "how to make your rain graphic in photoshop" section.

[Luneth]

You're is amazing ak
This is quite the awesome idea. Thank ya very much ^^

[konestilo]

What is fadeen screen in spanish??
i dont know how to put that in my rpg maker vx

[dzgword]

Very amazing will definitely use in my game

[Sephigruen]

Thank you. ^^ Exactly what I need for my game.