iPhone App Directory
RPG Maker VX
 
Gallery Members Search Calendar Help


Welcome Guest ( Log In | Register )

Collapse

>Announcement

Keep an eye out for the upcoming 3rd Quarter Contest!

> Note for Tutorial Threads

New threads (tutorials) here will go into a moderation queue. You will not see your thread appear when you create it. A moderator will decide if it will be approved or denied.

3 Pages V   1 2 3 >  
Reply to this topicStart new topic
> [-Graphics -] Realistic Rain, How to create a realistic rain effect in your game.
Rating 5 V
ak47lol
post May 25 2011, 05:58 PM
Post #1



Group Icon


Type: Designer
Alignment: Chaotic Evil






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. smile.gif


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


--------------------





Go to the top of the page
 
+Quote Post
   
Artain
post May 25 2011, 11:33 PM
Post #2


Marine
Group Icon


Type: Writer
Alignment: Neutral Good




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

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. ^^


--------------------

I have alot of experience with RPG Maker, and it is my pleasure to help those who want to learn. Feel free to ask me if you're having any trouble.
I'm rarely here anymore though, so it might take some time before I notice your message.

I Support:


My Project:
WIP Story Cutscene
Battle Scene Test

"Nothing in this world that's worth having comes easy."
Go to the top of the page
 
+Quote Post
   
GuardianSix
post May 25 2011, 11:48 PM
Post #3



Group Icon


Type: Writer
Alignment: Lawful Good




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.


--------------------
- GuardianSix

Flickr:
http://www.flickr.com/photos/dduron/

Work In Progress:
Clouds of Fear

Very helpful tutorials:
First Projects
Go to the top of the page
 
+Quote Post
   
ak47lol
post May 26 2011, 12:43 AM
Post #4



Group Icon


Type: Designer
Alignment: Chaotic Evil




Thanks guys, hope it was easy to understand. smile.gif

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


--------------------





Go to the top of the page
 
+Quote Post
   
Hanzo Kimura
post May 26 2011, 01:09 AM
Post #5



Group Icon


Type: Artist
Alignment: Lawful Good




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


--------------------
Go to the top of the page
 
+Quote Post
   
zakfoss
post May 26 2011, 01:15 AM
Post #6


"We are all human beings"
Group Icon


Type: Designer
Alignment: True Neutral




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


--------------------
If you are a believer of Jesus Christ, and are 100% proud of it, put this in your sig!!
Visit my Youtube >>HERE<<

My projects:


I support:



Spoiler:







Go to the top of the page
 
+Quote Post
   
ak47lol
post May 26 2011, 02:44 AM
Post #7



Group Icon


Type: Designer
Alignment: Chaotic Evil




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.


--------------------





Go to the top of the page
 
+Quote Post
   
Issa
post May 26 2011, 06:10 AM
Post #8


Xeolus Founder and Leader
Group Icon


Type: Writer
Alignment: Lawful Neutral




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


--------------------

Current Projects:
Spoiler:





I support:
Spoiler:


Go to the top of the page
 
+Quote Post
   
Zakkie
post May 26 2011, 07:25 AM
Post #9



Group Icon


Type: Writer
Alignment: Unaligned




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


--------------------
Go to the top of the page
 
+Quote Post
   
Niclas
post May 26 2011, 11:13 AM
Post #10


Whats this?
Group Icon


Type: Designer
Alignment: Lawful Good




Great, been waiting for this smile.gif


--------------------
Go to the top of the page
 
+Quote Post
   
Faalhaasje
post May 26 2011, 11:42 AM
Post #11


Dutchman
Group Icon


Type: Coder
Alignment: Chaotic Good




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


--------------------
Y can't we event our own lives ლ(ಠ益ಠლ
Go to the top of the page
 
+Quote Post
   
rgangsta
post May 26 2011, 12:41 PM
Post #12


The Handyman
Group Icon


Type: Designer
Alignment: Neutral Evil




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. tongue.gif


--------------------
Go to the top of the page
 
+Quote Post
   
Celianna
post May 26 2011, 02:30 PM
Post #13



Group Icon


Type: Artist
Alignment: Chaotic Evil




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!
Go to the top of the page
 
+Quote Post
   
nexy
post May 26 2011, 06:39 PM
Post #14



Group Icon


Type: Designer




QUOTE (Celianna @ May 26 2011, 03:30 PM) *
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.


--------------------
Go to the top of the page
 
+Quote Post
   
ak47lol
post May 26 2011, 07:45 PM
Post #15



Group Icon


Type: Designer
Alignment: Chaotic Evil




Enjoy. smile.gif 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


--------------------





Go to the top of the page
 
+Quote Post
   
Spetnaz
post May 27 2011, 01:57 AM
Post #16



Group Icon


Type: Undisclosed




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


--------------------


Projects I support -
Spoiler:
You should definitely check these out!
Spoiler:









Go to the top of the page
 
+Quote Post
   
Luneth
post May 27 2011, 03:46 AM
Post #17


Hero of Light
Group Icon


Type: Artist
Alignment: Chaotic Good




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


--------------------
V CLICK THIS FOR AWSOME PICTURE V
Spoiler:
You know Lightning is awsome ;)

Spoiler:


That's right ~desu

I support:
Spoiler:
Games:








Tutorials:


Other:






My thing(s):
Spoiler:




My Project:


My Project Development Blog:
http://heroesofyoreproductions.wordpress.com

If you are a believer of Jesus Christ, and are 100% proud of it, put this in your sig!
Go to the top of the page
 
+Quote Post
   
konestilo
post May 27 2011, 02:01 PM
Post #18



Group Icon


Type: Writer
Alignment: Chaotic Good




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


--------------------
I suport:
Go to the top of the page
 
+Quote Post
   
dzgword
post May 28 2011, 01:29 AM
Post #19



Group Icon


Type: Writer
Alignment: Chaotic Good




Very amazing will definitely use in my game


--------------------
[/url]



If you are a believer of Jesus Christ, and are 100% proud of it, put this in your sig!
Go to the top of the page
 
+Quote Post
   
Sephigruen
post May 28 2011, 02:01 PM
Post #20


Rhuddblaidd
Group Icon


Type: Writer
Alignment: Chaotic Neutral




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


--------------------
Canta pro me..
Go to the top of the page
 
+Quote Post
   

3 Pages V   1 2 3 >
Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Lo-Fi Version Time is now: 2nd September 2014 - 10:41 AM

RPGMakerVX.net is an Privacy Policy, Legal.