The RPG Maker Resource Kit

RMRK RPG Maker Creation => XP => Topic started by: DarkGamer on August 06, 2009, 07:32:05 PM

Title: How to make Light Effects on photoshop compatible with RM XP
Post by: DarkGamer on August 06, 2009, 07:32:05 PM
I'm not good on photoshop, and i would be glad if someone could teach me how to do them.
I am not able to do my own Lantern pictures, as light effects, etc, etc, and if someone could help me on this, i would be really glad.

Example:

http://img12.imageshack.us/i/lanterna0uw2.png/

http://img7.imageshack.us/i/lanterna0uw2copy.png/
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: RyuFirestorm on August 06, 2009, 08:30:23 PM
What is it exactly that you're wanting? To make it so the character can only be seen through a set amount of space?

More detail plz!
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: DarkGamer on August 07, 2009, 01:25:58 AM
Yes that's it. As you have seen on the pictures i linked there...The char can't be seen on the black colour.The char can only be seen on the white colour, and from the middle, he keeps disappearing when he walks to the black colour...
It's like a lantern, or a light bulb. Picture used to do a lamp ilumination.It's used to make the map darker, and you can only see where the picture gets whity. Generally used in Survival horror genre games...


There you have some examples of the luminosity that i'm talking about...And the screen darker, etc....

http://rmrk.net/index.php/topic,33922.msg410375/boardseen.html#new

Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: Grafikal on August 07, 2009, 05:29:46 AM
damn dude, never use 300 ppi for computer use. 72 is all you need. Anything higher will bog down your game file size.
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: DarkGamer on August 07, 2009, 11:42:16 AM
Thanks Kipe, and also thx grafikal for the 72 thing =)
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: DarkGamer on August 18, 2009, 05:56:38 PM
Quote from: Kipe on August 07, 2009, 05:07:41 AM
This is all in CS3, stuff may be slightly different in other versions, but not by much.

In Photoshop create a new document(1280x960, at 300 resolution). Create two layers. The top layer will be for the Black Gradient, and the bottom layer will be for the color fill inside the gradient.

Press Control+R to view the rulers. Double click the rulers that popped up on the top and left sides of your document. Click "Units & Rulers" and make sure where it says "Rulers:" that "Pixels" is selected. After that click the rulers again and drag two ruler lines to the center of the document(640, 480).

Click on "View" and make sure "Snap" is checked.

Press G and it should select your Paint Bucket tool. Hold Shift and Press G again to get the Gradient tool (or just go over to the paint bucket tool, hold down left click on it, and the gradient tool should be underneath it)


Press D on your keyboard to set your foreground colors to the Default black and white colors.

On the Gradient options at the top, make sure the circular gradient is selected, and also make sure the "Reverse" option is selected. Also make sure you're using the "Black to Transparent" gradient option in the scroll down window.

On Layer 2 Draw your gradient starting from the center, creating whatever size you want. (this is where the ruler lines and snap comes in handy.. now you don't have to click directly in the center, rather you can just click near it, and it will snap to the center)

Double click the foreground color and change it to whatever color you want

Click on Layer 1 and select your Paint bucket tool (Shift+G), and fill in layer 1 with the color you want.

Now you can change the opacity of this color from the layers box.

The final thing to do is save your image as a .PNG file. I like to locate my project and navigate to the Graphics > Pictures portion of my game and save it directly in there.. so that I don't have to import it later.

It takes about 5 seconds to make, so if you need one I can make it for you.




Edit: now that I think about it.. It's probably better to make a 1280 x 960 image, and make that gradient on that(The center of that would be 640, 480) This is so that when you set the Picture position to X and Y coords of the player, it won't mess up when the player goes into a corner on the map. [*updated it above*]


Not working with me.(i have CS3) When i do the picture, it won't let me see the char in the game. It will show as i see on photoshop. If i open the picture with the RPG XP, and shoose a color to become transparent, there i can see. Something is wrong when i make it. Could you send me an image like that with photoshop format, so i could open and edit it as i want to ?

Thx
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: Grafikal on August 18, 2009, 07:05:53 PM
well you have to save it as a png, make sure the center is transparent and/or make sure you blend the picture as 'ADD'.
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: DarkGamer on August 23, 2009, 06:01:55 PM
I do the circle black to transparent on the upper layer, then i use yellow as background colour on the lower layer. When i do the circle on the top layer, the middle appears small squares gray and white, and it changes to yellow because of the lower layer. then i save the picture as PNG, and it doen't work.Black, and yellow stays above my hero when just black should be. I tried many other ways, and i could never do it :(
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: Grafikal on August 23, 2009, 08:42:51 PM
You are NOT supposed to have a background color. Save it with the transparency only. If you want some random tinted screen color in-game, then in the event that you show the picture, tint the screen too. That is it.
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: DarkGamer on August 25, 2009, 11:57:54 AM
yes, i know it would worj only witht the circle layer, but i would like to make it with the 2 layers, so i could do some ilumination effects afret, with yellow as background etc etc.

The thing is that i do the black to transparent circle, and it appears black to transparent, it is all ok, and even if i don't make another layer, in game, the picture will appear with white colour where appeared the tranparent squares...
The same happens when i change the colour (if i make a second layer).

The only thing i could do was that changing the transparent to the colour of the 2nd layer. That's why i don't get what i am doing wrong. :/

;(
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: Grafikal on August 30, 2009, 02:25:18 AM
You only need ONE layer.

Spoiler for a tut:
1.open photoshop
2.make the ONE and ONLY layer transparent like so:
(https://rmrk.net/proxy.php?request=http%3A%2F%2Fi25.tinypic.com%2F2vbnc07.png&hash=dba6310f9d32fbe347a556e9938c54d6c06f177b)

3. fill that layer and make it black or what ever color you want it to fade into. like so:
(https://rmrk.net/proxy.php?request=http%3A%2F%2Fi25.tinypic.com%2Fo06lut.png&hash=6f568defdb7ee444044ca3b1b00ff0d492dedcf6)

4.place a mask on the layer:
in this image, select the layer you want to have a mask, then click on the icon that i put a red box around, you'll see a white square appear next to the layer image, the arrow is pointing at it. More specifically, make sure you have the mask selected and the the material in the layer, you'll know if you see the white box outlined with those black corner pieces that the arrow is more closely pointing at.
(https://rmrk.net/proxy.php?request=http%3A%2F%2Fi27.tinypic.com%2F2zrff37.png&hash=7a251309764f33ac2fd9a83005bce64833af497f)

5. select the gradient tool
(https://rmrk.net/proxy.php?request=http%3A%2F%2Fi32.tinypic.com%2F20qxbm8.png&hash=cbcb56d07915225bc04d41085d8aab18c69fae9e)

6. if the mask is selected the fill and stroke colors should automatically be black and white, if not, make sure you pick black and white. Also in the upper left corner where you see the gradient, make sure you have the black to white selected and radial gradient selected:
(https://rmrk.net/proxy.php?request=http%3A%2F%2Fi25.tinypic.com%2F2jb00b6.png&hash=14a7ecf6fa76d94649fa85adf9fdc75f5ae58a28)

7. click and drag from the middle of your black layer and let go and you'll have a transparent circle
(https://rmrk.net/proxy.php?request=http%3A%2F%2Fi31.tinypic.com%2F5z1bgm.png&hash=e0c6b1886c090cfbc8381e9e74a62f2e16d2d538)

8. notice the checkered background there, that means that it's transparent there. you WANT THAT.

9. take the image you made here and import it as a picture to your game. now, if you want the screen (THE TRANSPARENT PART) to be a different color, then in your event commands tint the screen. If you want the picture to fade into something else other than BLACK then refer back to step 3 and instead of filling the background black, fill it whatever other color you want.

10. make sure you save it as a PNG.

this was so easy i don't know why you needed a tutorial.
Title: Re: How to make Light Effects on photoshop compatible with RM XP
Post by: DarkGamer on August 30, 2009, 07:38:09 PM
Spoiler for:
(https://rmrk.net/proxy.php?request=http%3A%2F%2Fimg11.imageshack.us%2Fimg11%2F6935%2Ffinallyh.jpg&hash=d52e12804a757457b53b482c92e6d0e7971a8e75) (http://img11.imageshack.us/i/finallyh.jpg/)





Aweasome!! Thankyou so much, now i got what i was doing wrong ;)

Cheers ;D

*Now i just need some skills :p*