Announcement

[Aindra]

Aindra's Basic Photoshop Tutorial

All tools here can be used for tiles, characters, windowskins, objects, pretty much everything else.
I'll cover only basics.

I'm using Photoshop CS3 but I'm pretty sure most of the features listed here are in earlier versions of Photoshop.


How to set the grid on the picture:

» Click to show Spoiler - click again to hide... «

It can be very painful to correctly position the images so they show up right in the Rpg Maker VX. That is why you have to use the grid... They make everything much easier!

Click: Edit -> Preferences -> Guides, Grids, Slices & Count...

Find this:

For the charactersets and tilesets, you can set the number like above:

Press Ctrl + ', or Click: View -> Show -> Grid

The gridlines will appear on your image, like this:

How to select the picture:

» Click to show Spoiler - click again to hide... «

The selection tool is very useful.

• You can select the picture, hold down CTRL, move the picture to another area.
• You can select the picture, copy it, and paste the picture in another area.
• You can select the picture, and use any tools (paintbrush, hue, whatever). It will not allow you to draw or change anything outside the selected area. That is very useful.
• Probably more but that escapes my mind at this moment.

Click on the icon, top-left one. That is the simple "box" selection. You'll use it often, since most of the RPG resources are in squares.

Click on the icon, bottom-right one. You will see the drop-list like this:

Click on the magic wand tool. You can click on one color (like the person's eyes), it will select all areas that uses exactly same color. So in other words, it may select all characters' eyes, so you don't have to manually select them. You can also use SHIFT key. Hold it down, and keep selecting any colors you want. It'll add them up. I use it often.

SNAP-TO FEATURE
This is very handy feature. Click: View -> Snap, or press SHIFT+CTRL+;
With the snap on, you can easily select any parts in the gridlines. It'll forcefully pull your selection tool to nearest gridline, so you do not have to precisely position the selection in the area. It saves the time a lot.

How to change the picture's color:

» Click to show Spoiler - click again to hide... «

Remember, use the selection along with this tool. If you only want to change the hair color, nothing else. Be sure to select the hair part, and then use any tools under here. Without selection, it will change ALL areas in the picture.
Click: Image -> Adjustments

You will see the list like this:

Most of those tools can be used to change the colors of your picture. You can fish around and experiment with various tools here. But for this tutorial, I'll use the simple tools only.

Hue/Saturation
Click on "Hue/Saturation"

You will see the menu like this:

HUE: It changes the color. Long as the preview is checked, you can move this around and see the picture changing its colors!
SATURATION: It changes the intensity of the colors. If it is at zero, it'll be black/white. If it's at max, it'll be blindlingly neon colors.
LIGHTNESS: It changes the light. Set it to low, the image will look dark. If it is high, it'll look brighter.

I used the settings: (+80 Hue, -50 Saturation, 0 Lightness) and got this result.


There is another way to make your image look darker or brighter. You can use this next tool to improve your picture.

Brightness/Contrast
Click on "Brightness/Contrast"

You will see the menu like this:


Brightness: It is simliar to Lightness but works differently. It makes your picture more brighter or darker.
Contrast: Basically, it makes light more lighter, while dark more darker, if you increase the contrast.

I set the settings: (Brightness -20, Contrast +100) and got this result:

Grids' Reference

» Click to show Spoiler - click again to hide... «

Charactersets, Tilesets, and Balloon:
Gridline every: 32
Subdivisions: 1

IconSet:
Gridline every: 24
Subdivisions: 1

Windowskin:
Gridline every: 64
Subdivisions: 8

or
my personal favourite:

Gridline every: 32
Subdivisions: 4

Faces:
Gridline every: 96
Subdivisions: 1

Battle Animations:
Gridline every: 192
Subdivisions: 1

Please do let me know if there are some that are confusing you. I'll try to change it again to make it more clearer.

[Super Stick Lyon...]

could you possibly tell how to alter grid lines in GIMP ver2.4.6??

[Aindra]

I actually never used GIMP, hence "Photoshop" in the title. I can't really help you there.

I could get GIMP and check it out though... But that may take a while, so maybe other users that are good with GIMP can answer those questions?

EDIT: GIMP is simliar to Photoshop in the grid.

You click: Edit -> Preferences -> Default Grid

Change the number under Spacing. 32 for Height, and 32 for Width. Or any grid number you want.

DOUBLE EDIT: I added GIMP tutorial now.

This post has been edited by Aindra: Aug 15 2008, 04:56 AM

[mudducky]

Excellent tour. Though it's very basic, it still saves a lot of time =) Wish I knew about it a little while ago xP

In GIMP over a new file select view and tick "Snap to Grids" select image "Configure image grids" make the foreground colour black and the background colour white. Select Solid from the Line style option. Width and height will need to be, what enterbrain said. I forgot the exact figures. Final note. Make sure you use pixie and not cms. =)

[Leventhan]

People who have Photoshop should have known this already, but good job on simplifying it up for certain purposes.

[scherzo]

I like how this is specially made for working with VX. Nice job, Aindra.

[kyon9854]

This is very helpful. But I'm having trouble putting it in RPG Maker. It appears in the selection but it doesn't select it right. How do I do it?