Making MV Style Animations
January 17, 2022
January 11, 2022

Making MV Style Animations

Making MV Style Animations



January 17, 2022

MZ’s default animation style uses Effekseer to create incredible animations, but it can be tough to get used to using it. And what if you prefer cell-based animation creation like in previous RPG Makers? Let’s take a look at how to make some MV-style animations in MZ thanks to the 1.4.0 update.

Before we can start making animations though, we need to add an ‘animations’ folder to our project’s ‘img’ folder. This is where we will be placing all of our images (animation sheets) that we want to use to create our own animations.

The animation sheet has a specific setup, with each row being made up of 5 cells that are 192x192 pixels in size. You can make your sheet 20 rows long (giving you 100 cells to work with), but unless you’re making animations that last 5 minutes long most of your animation sheets will be much shorter, likely 2-5 rows (which means 10-25 cells).

For this tutorial, let’s set up an animation sheet using some of the default sprites. In this case, I took some of the water spout frames and one of the rolling rock frames to fill the sheet.

Now, let’s get to the animation making! First up, we need to open up our database and right-click a blank animation entry and choose the ‘create MV-compatible data’ option. We should end up with a screen that looks like this:

There are a few different sections to this screen, but hovering over each section should give you an overview of them to get you started.

Now, staring at a blank frame may make creating animations this way feel overwhelming and your first thought is to just close the database and go back to your favorite part of game-making. But there are a couple of ways to make this a lot easier on you, so let’s take a look at how we can use some of these methods to make different animations.

Basic animation - Bubbles

First up, let’s make a simple animation where we just make some bubbles appear near the center of the enemy. Maybe it’s for an attack that slows the enemy down or gives them a negative status, but the animation itself doesn’t need to be all that complicated.

We’ll start by selecting our water image and choosing the first cell of bubbles and place it a (0,0) in the frame. Where it falls on the enemy depends on the enemy’s size, so you can use the ‘change target’ button to see how it looks on a variety of your enemies. If you want the bubbles to always appear at the feet of your enemies, then change the Position to ‘feet’ and adjust the cell’s location based on that.

By default the animation only has 1 frame, but we’ll definitely want more frames to show off the full animation. We could change the Max Frames option to include more, but an easier option for us is to right-click on frame 1 in our Frame List and copy-paste it as many times as we want. For this example, let’s copy it so that we have 10 frames total.

Now our animation will last longer, but nothing seems to happen because all the frames are the same! To give our animation some movement, we need to change some of the cells to a different image. The easiest way to change the cells while keeping them in the same spot is to right-click the cell and hit ‘edit’. That will pull up the Cell Properties window where we can make specific changes. In this case let’s change the Pattern so that each cell isn’t using the same animation sheet image.

As we move down the Frame List we can just change each cell’s Pattern to follow a 1-2-3-2-1 order so it will cycle through our 3 bubble images.

With our animation now moving, we can add some extra effects in the SE and Flash Timing section. Choosing when to play a SE or flash depends on the animation itself, so playing around with the timing is pretty important. For this example, I added two blue-ish flashes to the enemy and had the ‘Dive’ SE play once.

With the sounds and flashes added, we can test our animation in battle!

Playtesting and seeing our animation in actual battles can help you figure out what needs to be adjusted to make sure the animation is playing out exactly how you want.

Copying & Shifting Cells - Triple Water Spout

Having a way to set up all our cells to be in the same spot easily is nice, but what if we want more than one cell in each frame? An animation with more than one source could work for an attack that hits multiple times at once or as a way to show this attack is stronger than previous ones. So let’s make an animation where 3 water spouts burst out of the ground to hit the enemy at the same time.

For this animation, we’ll start by setting up our full animation for a single water spout. We can use the same method as with our bubbles or place each cell manually, but whichever method we use we want to have our patterns play in order until the tallest spout is reached and then play the pattern in reverse so that the water retreats back into the ground. Since we are planning on all 3 cells to play at the same time, we can go ahead and set up the SEs and any flashes now.

Now we can add in our other 2 water spouts to make this a triple strike. But how should we go about that? We could repeat placing all the cells like we did for the first one… Or we can copy our original water spout and move the second and third spouts all together! To do that we need to copy the cell twice, so that we’ll have 3 cells total in each frame.

Then we can click on the ‘batch’ button, which gives us the ability to change multiple cells in different frames at once. Our Frames range will cover all of our animation’s frames (so for this example, it’s 1~15) while our Cells range will only be for one cell ( like 2~2 or 3~3) so that we can separately change the different cell’s X and Y values to move them around the frame.

If you don’t know the exact location you want to move the water spouts to, then you can use the ‘shift’ button to just bump the cells around until you’re happy with their locations.

With our cells moved our frames should look more like this, where our water spout cells aren’t fully overlapping.

And again, we can playtest to see how the animation looks in battle.

Now, copying and moving cells to create multiple strikes at once is great, but it still takes some time to set up our original water spout. What if we wanted to have the same pattern move around or have our animation sheet play in order without having to set up every frame for it? That’s where the ‘tween’ button comes into play.

Tweening - Rock Throw

Tweening lets us place a starting frame and ending frame, and then tells the engine to fill in the blank frames between it. So if we were to place a cell at the top of the starting frame and a cell at the bottom of the ending frame, tweening will fill the frames between them with a cell moving downwards a bit in each frame. The engine isn’t as smart as a dev though so sometimes it will make a choice that’s not exactly what you want, like changing the pattern a frame or two before you’d like. So it’s always good to double-check how all the frames look and adjust the tweened frames as needed.

For our last example, let’s make a rock throw animation where a few rocks get shot towards the enemy. To make it look like the rocks are coming from our actor and flying towards the enemy, let’s set up our first frame’s rock cell to have a Scale of 500% so that it’s huge.

We don’t need the rock throw to last too long, so let’s make this rock’s last frame be Frame 5, where our rock is now back to a Scale of 100%.

If we flip through our frames we’ll see our large cell in the first frame, nothing for 3 frames, and then our normal cell in the fifth frame.

Now we can hit the ‘tween’ button and have the engine fill in the empty frames. We need to make sure that our Frames and Cells ranges are set properly (if they aren’t, the animation will end up looking weird) and then we can decide if we want anything to remain the same. In this case, it’s fine to leave it all checked by default.

Once we hit ‘ok’, we can check our frames to see that our rock now shrinks and flies towards the enemy as the frames change!

With our first rock ready, why don’t we add in two more that get thrown a few frames after the first? We can set up those other rocks and tween them the same way as above, just making sure to change our Frames and Cells ranges to match each rock’s start and end.

With all 3 rocks tweened, we can playtest and see them in action.

And with that, we can now make cell-based animations! What animations are you planning on making now that you’ve learned a few methods to create them?

Recommended Posts