DevelopmentDevember 2015RPG Maker

Devember 22nd: Playing with Parallax images in RPG Maker MV

Update:

In reality, I should have just set the parallax image in the first place and then defined the player regions in the first step. That would have made it much, much easier. Live and learn.

I also added the download.

So, today I took the concept art by Kusanagi Studio for Cloud's house in Final Fantasy VII, sized it so that it fit within the 48x48 default tile size for RPG Maker MV and created a rough map of the main collision areas.

ff-desktop workflow

Yes, I know that the map doesn't really look that great yet.

So, using the tutorials by Fallen Lorelei and the TDDP_BindPicturesToMap and YEP_RegionRestrictions plugins with a little Photoshop "magic," I could have a much more interesting area than the usual RPG Maker game worlds.

So, first I loaded the image into Photoshop and set my grid size to 48x48 pixels by going to Edit > Preferences > Guides, Grids and Slices.Settings Menu under Edit

Then I set the gridline every 48 pixels with 1 subdivision.

grid settings

Then I created a rough map in the editor and began to fill in the collision areas.

rough map for collision in editor

I then took a shot of that map and loaded it into Photoshop as a layer to see if I had missed anything. I also loaded the Actor 1 sprite sheet and used the first frame as a size reference for the player.

Overlay-Map-Character

That way I could see the different collision areas and where the character would be able to walk. So far so good.

Next, I needed to find the places that the character would be able to walk behind. The globe, for example.

behind_the_globe

I copied the background image (the full concept piece) and pasted it into a new layer. Then I used the polygon tool to slice out everything around the globe. Then I placed the character layer below the overlay to may sure I could see the player as needed. The vast majority of the tiles will be cut out. You can start taking out large swaths of them as long as the player will not be going behind anything in the scene.

Here's the final image that I had. Note that there is very little still in it because there is not a lot of places that the character can go behind things.

cloud's overlay

I saved in the project directory under img/pictures as CloudsHouse-overlay.png. Then I hid this layer and just had the background visible and saved it as CloudsHouse-bottom.png. I also saved a copy of the bottom under parallaxes as !CloudsHouse-bottom.png. In the map settings, I set the parallax image to !CloudsHouse-bottom.

map properties

I added the event in a corner where the player cannot touch it and added the following to the event contents:

  • Show picture CloudsHouse-bottom.png and set it to 1 (should be this by default).
  • Show picture CloudsHouse-overlay.png and set it to 2.
  • Then add the following plugin commands (page 3):
    • BindPictureToMap 1 below_characters
    • BindPictureToMap 2 above_characters
  • Erase Event at the end.

Switch the trigger to Parallel so that it runs when the map is loaded. It should look similar to this:

event settings

Then I set the collision in the YEP_RegionRestrictions plugin so that 1 was allow all movement (in case there are NPC's wandering around in here).

region-restrictions

Then I painted 1's on the map where the player could move using the R tab.

painting regions

And then, when I played it, I could walk all over the house!

final_product

Sure, it may not be the best use of RPG Maker MV, but it gives teams that have strong artists a new way to work and create assets for their games to give a strong look and feel. One thing to note is that there can be a visual pop from the map level to the parallax images. To avoid that, have the level fade in.

You can download the ZIP for Windows here.

Leave a Reply