[Mapping]Parallaxing For Dummies, Part 2: Carpets and Layers Options

[Jonnie19]

Parallaxing for Dummies:
Carpets & Layers

Contents
Welcome back, to the second part of the Parallaxing tutorial of Dummies.
A step by step guide to Parallaxing, in the previous tutorial we learnt:

• What are Parallaxes?
• How to change the passability settings.
• How to change your tileset
• Making a "base" map, that is used to create your Parallax
• How to use the script Editor
• Inputting Scripts
• Using the Script Command
• Creating a new Event Page
• Exporting your map as a PNG

In this tutorial we will learn:

• What are Layers?
• Layer Toolbar
• What are Parallaxing Tilesets?
• Photoshop Tools and Shortcuts
• How to select your Tiles
• Placing Tiles and Basic Manipulation
• Common Errors

Using Layers >>> What are Layers?
First of all let's open up the image from the previous tutorial, I am currently using Photoshop CS5 so open it up and it should look like this:

[Show/Hide] Reopening our map

[Show/Hide] Top Tip: New way of using Photoshop CS5:

If like me you are using CS5 you have gained the ability to use scripting to change the way that Photoshop works, you can change it to look more like an animation setup, this helps in many different ways, however this also helps people who want to parallax map, as you can have your main map at the top and your multitude of Parallax Tilesets (more on that later) open below to save you having messy screens...the script is located here and it works a charm, please remember that this is NOT an RGSS2 Script, it is a Photoshop CS3+ Script.

Now if you take a look in the right hand corner you will see the Layers Tab:

[Show/Hide] Layer Tab

Each additional layer that is added is either added on top, or underneath the previous layers, most of the time you want to make sure that your Map Layer is at the bottom. To make sure you do not get confused, rename this layer to Base (you can call it whatever you want, just as long as you can remember what it is, because there will be A LOT of layers by the end of your map!)

Before be continue let's take a look at the Layer Tab again, and explain some of the features that will become awfully helpful during your usage of Parallax Mapping...

Using Layers >>> Layer Tools

[Show/Hide] Layer Toolbar

These three tools will become your best friend when it comes to Parallaxing; there are many more tools that I will teach you how to use when we go onto advanced Parallaxing but for now we are going to work with the following tools:

1. Layer Linking: This tool allows you to link 2 or more layers together, this is useful for when you have created a table which has a number of different objects on top, and if you want to move the table, instead of Merging the layers (squashing the layers into one) you can move one of the layers and all the other layers move with it which is a really helpful tool

2. Create a Group: This tool creates a special tool, it means that on top of the linking layers you can group these layers together, this is especially useful when used with the Layer Linking tool, it also helps to just keep your Layers organised, especially when you are creating bigger maps for outside areas.

3. New Layer: This is very self explanatory, this creates a new layer, and Layers are the most important tool in a Parallax Mappers arsenal. Each time you place an object whether it be a carpet/flooring or even using your eraser, it happens on a layer. Layers ensure that if you make a mistake you do not have to start all over again.

Starting to Parallax >>> Tilesets

Now there are two different Tilesets that you can use to parallax, you can either use standard Tilesets; these are ones that are used in standard mapping, these are specially organised so that these can be used in RPG Maker VX editor as well.

There is also a "Parallax Tileset" these are different, they aren't set up in any order in particular and 95% of the time cannot be used in standard mapping as they are not organised within the 32px squares or in the correct sizes, however they are perfect from Parallaxing....
As we are concentrating on Parallax Maps, we are just going to use Parallax Tilesets...
In this tutorial I am going to be using Tilesets from Celianna and Lunerea found here on RRR, they are probably the most advanced Parallax Tilesets that you can currently find for RPG Maker VX.
So let's go into your graphics Editing Program now, where we should still have our Map open and ready to create the interior.

Starting to Parallax >>> Photoshop CS5 Tools Exposed!

We are almost into the interior design but first we need to know how to use Photoshop, this isn't going to go into large amounts of detail, it will just be a quick speed through the simple tools that are used for immediate Parallaxing...

[Show/Hide] Simple Parallaxing Tools

The select tool basically enables you to move the current layer that you are on (if it isn't locked) if used with the Marquee tool, it enables you to move just the area selected by the Marquee, (more information on that later)
There are many other tools that you can use for Parallaxing including the Clone Brush, Colour Picker, Blender, Pen, and Pencil but we will go into more detail about them later on in more advanced tutorials.....

Starting to Parallax >>> Floor Layers

So, after we have opened up some parallax tilesets, we can now begin:

[Show/Hide] Without CS5 Script

[Show/Hide] With CS5 Script

The best place to start is from the bottom, for this tutorial I am going to use Celianna's Clutter tileset” located here. All tiles I am using for this part of the tutorial are from this set (unless otherwise stated).

So for this we will be using the Rectangular Marquee Tool, the quickest way of doing this is simply by pressing (M) as this is the shortcut for this tool. So press M and the cursor changes to a Cross. So ensuring that your cursor is now a cross, we now need to select the Carpet of your choice, so click in the left hand corner of your Carpet of Choice, and drag to select the entire carpet of your choice, if you have done this right it should look like this:

[Show/Hide] Selecting a Carpet

Starting to Parallax >>> Floor Layers >>> CTRL C and V (the Magical Shortcuts of Parallaxing)

So, you have selected your carpet now anything you have selected you can now copy it, the quickest way to do this is to hold down CTRL and then press C. Simple as that .
Now, ensure you are on your map and then holding down CTRL press V this is the quicker way of Pasting. So after doing that you should be here:

[Show/Hide] After the Paste

Now obviously that ISN'T in the right position so let's move it around abit

Starting to Parallax >>> Floor Layers >>> Arranging Objects

So, unless you have an exceptionally magical carpet, it needs to be moved! So let us learn how to move a layer.
Press (V) on the keyboard; the cursor will then change to the Move tool cursor, and the top Tool should be selected on the Tool Toolbar (Yeah I liked that too)

[Show/Hide] Selected Move Tool

Now, ensuring you are on the correct layer click on the carpet you want to move and drag it to a floor area of your choice:

[Show/Hide] Positioned Carpet

Excellent, now currently the floor still looks slightly bare, and there are still not enough carpets...so following the above steps place down a few more carpets, however be aware, that there will be other items that will go on the floor.
Once complete you should have something similar to this:

[Show/Hide] More Carpets

Starting to Parallax >>> Floor Layers >>> Adapting Objects

So we now know how to do the simple thing of copying and pasting of carpet layers....Pretty simple, However, our map doesn't look very realistic....Remembering currently we are looking down from a top down view, there are going to be carpets that are going underneath our ceilings...So let's start looking at carpets that are going underneath and how we go about editing our objects to suit:

So firstly using the steps above copy and paste a new carpet...Position the carpet in an area where it would normally be overlapped by a ceiling:

[Show/Hide] Overlapping Carpet

Now this obviously isn't going to work...We need to erase a small section of the Carpet layer image, to make it look like it is underneath the carpet... so first of all zoom in on the Carpet, using either your mouse wheel or CTRL +; now press M to switch to the Marquee/Select tool...

Now, you need to select the section of the Carpet that overlaps the Ceiling, the more you have zoomed in, the clearer it will be:

[Show/Hide] Selected Carpet

Delete this section either by pressing the delete button or pressing E and scribbling over that area, either way if done correctly it should now look like this:

[Show/Hide] No more Overlapping

Starting to Parallax >>> Floor Layers >>> Adapting Objects >>> Overlapping >>> Common Errors

[Show/Hide] To much deleted

In this image you can see that there is some flooring showing; which isn't the effect we are looking for.

[Show/Hide] Looks Normal Enough!

This, at first glance, is fine; however zooming in shows there is still a problem:

[Show/Hide] Overlapping ever-so slightly

Not many people will notice these errors, but eagle eyed mappers and gamers will and most likely bring you up on it


End Of Part 2
So that is it for this tutorial Leave comments and feedback below, it is really appreciated, the more feedback I receive the more tutorials I can create. Something missing, either PM me or post here

Credits and Disclaimers

Parallaxing Tilesets: Celianna

Photoshop Animation Script: GB Production/Gagay.

This Tutorial is currently for RRR/R3 only, DO NOT DISTRIBUTE ON ANY OTHER SITES...FULL STOP! If you wanna show on other sites, a link to this thread is allowed

This post has been edited by Jonnie19: Aug 21 2011, 07:10 PM

[Jonnie19]

Part One: Preparing to Parallax
Part Two: Carpets & Layers

[amerk]

Awesome way to close out the weekend, glad to see this is still going strong! I'll have to look at it a bit more when I have a moment.

[Jonnie19]

I wasn't ever gonna stop making it I am gonna try and get the others out asap, as I am starting college in September, but I think this is the most content heavy tutorial that will be done, as this is how all parallaxing is done.

The last content heavy tutorial will actually be the next one it will be explaining dimensions abit more, and also finishing off our maps and importing them back into RPG Maker VX....

Is there anything else you want covered?? Let me know if so

This post has been edited by Jonnie19: Aug 14 2011, 03:53 PM

[amerk]

Wow, very informative. I've never been able to get passed Part 1 due to my lack of knowlege pertaining to Photoshop, so definite kudos to you. I'm not at my home computer, so I will have to try this out later on for myself, but in the interim, I figured I'd ask a few questions that I, and maybe others, might have:

1. I'm assuming that (with the exception to auto tiles which is a whole other ball game), normal B-E tilesets work the same as the Parallax Tilesets, just grab the file and go... correct?

2. This is the part I got stumped on last time working with PS. How do you get the tilesets to actually appear in the image? When i tried to open them, they opened as separate images, but not in the map I was working on.

3.

If like me you are using CS5 you have gained the ability to use scripting to change the way that Photoshop works, you can change it to look more like an animation setup, this helps in many different ways, however this also helps people who want to parallax map, as you can have your main map at the top and your multitude of Parallax Tilesets (more on that later) open below to save you having messy screens...the script is located here and it works a charm, please remember that this is NOT an RGSS2 Script, it is a Photoshop CS3+ Script.

Were you supposed to have included this CS5 script? I do like this way much better.

4. Finally, while it appears that the marquee tool worked great for things like carpets (which is rectangular in shape), some may wonder about things like statues and trees, where the background colors may be picked up that you don't want (example, a white background, etc). I'm guessing this is where transparency would need to be checked.

Anyways, very informative. I'm definitely going to try this when I get home.

[Jonnie19]

Wow, very informative. I've never been able to get passed Part 1 due to my lack of knowlege pertaining to Photoshop, so definite kudos to you. I'm not at my home computer, so I will have to try this out later on for myself, but in the interim, I figured I'd ask a few questions that I, and maybe others, might have:

1. I'm assuming that (with the exception to auto tiles which is a whole other ball game), normal B-E tilesets work the same as the Parallax Tilesets, just grab the file and go... correct?

Yes that is correct, however the Auto-tiles wouldn't actually be need in this case, with beginners mapping because this can be done in the editor, during the first tutorial, (animated auto-tiles however....I will address in the Advanced Tutorials)

2. This is the part I got stumped on last time working with PS. How do you get the tilesets to actually appear in the image? When i tried to open them, they opened as separate images, but not in the map I was working on.

Not sure what you mean by this could you elaborate please

3.

If like me you are using CS5 you have gained the ability to use scripting to change the way that Photoshop works, you can change it to look more like an animation setup, this helps in many different ways, however this also helps people who want to parallax map, as you can have your main map at the top and your multitude of Parallax Tilesets (more on that later) open below to save you having messy screens...the script is located here and it works a charm, please remember that this is NOT an RGSS2 Script, it is a Photoshop CS3+ Script.

Were you supposed to have included this CS5 script? I do like this way much better.

My bad, all my tutorials are written in Word first, must have forgotten to add it in, I have now added it in, sorry about that

4. Finally, while it appears that the marquee tool worked great for things like carpets (which is rectangular in shape), some may wonder about things like statues and trees, where the background colors may be picked up that you don't want (example, a white background, etc). I'm guessing this is where transparency would need to be checked.

All Parallaxing Tilesets should be placed on Transparent Backgrounds, Celianna's which are included in a link to this tut for example although looking like it is on a white background is actually placed on a transparent background. If this wasn't the case you would have to use the Lasso tool, but 90-95% of the time you wouldn't have this problem and as long as you are careful not to get the next tile in the selection you can just use the Marquee Tool

I am really glad that this tutorial has helped, for those who are following this tutorial, The next tutorial will be done soon, It will not need to be so content heavy, as it will be more addressing mistakes that are made when adding in cabinets and such and such....Then explaining exporting outta PSD to PNG format and then Inporting into RPG Maker VX, and setting passability settings...which is the most BORING part

[amerk]

Yeah, the setting the passability will be interesting, as well as the overlays (going behind something, images above, walking under a beam, etc).

Sorry about #2. Let me clarify:

I open my map screen in Photoshop. I then go to open the image for the tilesheets that I want to use, but it opens up as a separate window within Photoshop, rather than opening them up right in the window with the map. I'll go home and play with it some more, but that was where I got stuck way back when i first started using PS.

This post has been edited by amerk: Aug 15 2011, 01:33 PM

[Jonnie19]

Passabiility...is the tougest part of Parallaxing, especially if you want more realistic maps, However, I will not address the overlays and ceilings until the advance tutorials because they will take a while to explain

I still ain't positive what you mean :\ perhaps post a screenshot when you get back, also try using that GB script, it may help

This post has been edited by Jonnie19: Aug 15 2011, 01:49 PM

[amerk]

Nevermind, I actually spent about 3 hours working and trying to understand Photoshop tonight, and I've developed a basic concept that I think will help me in the long run.

Basically, I was opening the map file in PS, and then I'd open the tileset. On the images I've seen people had the tileset open with the map, whereas mine had a tab for the map and a tab for the tileset. I figured if I dragged the tileset tab it opened into the map, which like you pointed out, gets in the way of mapping.

I tried getting the atn script file to work, but to no avail, but I at least realized I can work off the tilesets in the one tab and copy it over to the map in the other. The reason I couldn't before was because I was not sure which tools to use, but your explanation (about how to select, copy, and drag) was excellent.

Still, I feel like such a noob with this right now. Part of thinks... what a freaking hassle... whereas another part says once I get the hang of it and am organized enough to throw parallax maps together, this will work wonders.

I'm pretty eager for the rest, now, like lumping tilesets together (ie., crates and barrels in front and behind one another) and passability. I'm pretty curious how you'd set up the map for something you can walk behind, but I'm guessing that will all now be through events, which I'm sure you will get into.

Edit: Just jumping ahead to see if I have the concept down, but will lumped tileset images all be handled via different layers as well? Like the crates behind the barrels would be one layer and the barrels placed in front another?

This post has been edited by amerk: Aug 15 2011, 06:27 PM

[Jonnie19]

Yes, the most simple thing to realise is that each time you paste...you add a new layer so yes exactly like that
I am going to explain that one in the next tutorial anyway

[amerk]

In that last part of your tutorial, where the parallax with the carpet is fine except for one very tiny problem in that it overlaps ever so slightly, is there advice on what we can do to fix that, for those that need a perfect map, or is it such a tedious task to worry about that it's best to ignore it?

[Jonnie19]

It all depends on your visual basis, if it looks weird to you then turns out it will look wierd to someone else Your best bet is always to make sure it doesn't overlap because you also need to remember that when it is in the editor you will zoom in slightly, my personal opinion I am very OCD about my maps so yes I would make sure that there is no overlapping even if it is one pixel line
Feel free to post your Parallaxing Maps here, I would love to see what you guys have done thanks to this tutorial

[roxanne410]

Fantastic work as usual Jonnie, it helps a lot. Honestly one of the best Parallax tutorials out there. It's very clear and easy to follow

[Reisen]

Great tutorial, Jonnie. Now I just gained a bunch of ideas for room parallax mapping. Harhar. But, the spoiler with the title "Positioned Carpet", I see only the link. Whenever I try to paste it on my URL bar, a blank page appears. D:

[Jonnie19]

There we go, sorry about that All sorted really glad you liked it

[Orrion Carn]

This is an amazing tutorial. I will definately have to switch from engine created stuff to parallaxes >_>

[Reisen]

Ah, great. I'm glad it's fixed. I'll probably map out a room later. I never thought of mapping the base (walls, floors etc) on RMVX and copy+paste it on Photoshop. ; -;

[Jonnie19]

This is an amazing tutorial. I will definately have to switch from engine created stuff to parallaxes >_>

Thankyou very much Although you can create lovely maps with the engine, parallaxing opens up so many possibilities, with the auto shadow gone you can create beautiful maps, Celianna (the creator of the tilesets I am using) actually creates ISO- Maps, which is lke 2.5D maps, of course that is for her movie not for her game.

Ah, great. I'm glad it's fixed. I'll probably map out a room later. I never thought of mapping the base (walls, floors etc) on RMVX and copy+paste it on Photoshop. ; -;

It is probably the most simple way to parallax Although your walls aren't going to be as realistic as the more advanced maps(I will explain the difference in the advanced tutorials) It still can look amazing, it gives your maps that extra..pizazz that maps that are done in the standard way, cannot give the same effect

The work load is bigger however the results of which are amazing

[Sparrowsmith]

Damnit all. I barely touch VX anymore but I feel more tempted to than ever now. I'm a bit of an amateur with photoshop, but I reckon I could actually whip up a half decent map, which is nice because I'm a truly terrible mapper normally this never even occurred to me.

I assume there's more yet to come? I'll whip up a map as soon as I have time then.

[Steysel]

Thanks for this tutorial. It really helps.