This tutorial works with most RPG Maker. Hello All! RPG Maker already have a powerful command series Show Pictures to call. Some people are just too lazy to make use of its full potential. What I want to show you here is more than just a video tutorial. What is this about? Ever thinking of making choices using show pictures? This tutorial is taking it far to the next level! As the topic title said, it's about making an Animated Character Selection. The kind that's like what you see in fighting game. Requirement Intermediate knowledge of how event works. Understanding of Basic Picture Selection Basic math knowledge. Much dedication to handle long event. Speed-up eventing Spoiler: FULL SHOT OF THE ENTIRE EVENT Spoiler: FULL EXPLANATION OF THE ENTIRE EVENT Basic Event Structure Page 1 : Divided into 3 part : - Initial (starting animation) - Process (navigation input) - End (mark the end of the process and animation both for cancelling and picking) Page 2 : Cursor idle animation. It needs to be a parallel process on diferrent page to run independently. Page 3 : Refresh Coordinate (navigation output). Don't need to be different page. But it's recommended to make your event structure looks neater and easier to understand for this tutorial purpose. Operators Variable 1 (Index) : Necessary for navigating through characters. Variable 2 (Var X) : Store the X coordinate of the Index. Variable 3 (Var Y) : Store the Y coordinate of the Index. Variable 4 (Direction) : Store the input directional button. Necessary to animate the cursor movement in page 3. Self Switch A : Triggered ON after Directional button in Process. Immediately turned OFF for awaiting further input. Self Switch B : Triggered ON after Initial to activate Page 2 (cursor idle animation). Immediately turned OFF after Self Switch A then turned back ON so to not ruin the animated navigating on Page 3. Immediately turned OFF after input B button (cancel) and C button (ok) where the cursor idle animation are not needed. Self Switch C : Triggered ON after Self Switch A only to activate Page 3 (refresh coordinate). Switch 1 (Exit) : Triggered ON after input B button (cancel). I could have just used Self Switch D, but that would be more confusing to other people I think. Input Directional button : Up, Left, Right, Down is accessible in Process to activate Self Switch A which are necessary for navigating. Only Left and Right is accessible when in the middle of Exit prompt. A button (shift) : It's only there for me to trigger the credits message in Process. Not necessary for this tutorial purpose. B button (cancel) : Activate another loop with only Left, Right, and C button (ok) input. Asking the player wheter they actually want to quit or just kidding. C button (ok) : Immediately end the Process. If in middle of exit prompt, break the loop and return to Process if choose "no" OR return to title if choose "yes". PAGE 1 : INITIAL This will be your canvas for your creativity. Aside from the whole starting animation, this also initiate all the operators. Since I have done the whole math in my chalkboard, I will just put the constant numbers there. WARNING : only do that if your calculation are final. If you are planning to edit or custom it later, either you need to prepare the numbers outside, OR do your own math inside the event (which require more variable operation). But that wouldn't be the topic here. PAGE 1 : PROCESS We trap the player inside a loop here and wait for their inputs. The variable operation for each input here are specifically for 3x4 character selection. There's also another loop inside for the exit prompt. The whole Page 3 can be put here to replace Self Switch C, but that will make your event longer and leave a pain on your finger to scroll... What happens here in the process is, if the player input Directional button it will turned ON Self Switch A, which swap the active parallel process between Page 2 and Page 3 for a moment of 10 frames. That's enough time for Page 3 to take over the cursor animation for movement animation. If the player input B button (cancel), they will be trapped inside another loop which prompt them to exit or not. Input C button (ok) will immediately end the Process. PAGE 1 : END After escaping from the above loop, there are only 1 condition here to check if the player have done choosing, OR exiting. You can fill the end animation for both. PAGE 2 : CURSOR IDLE ANIMATION Since the page runs in parallel, when it's activated it runs independently. While the original event is also need to be finished before changing page, this causes both event page to run at same time! Although only one parallel process may active per one event, that's enough to make an independent looping cursor idle animation. PAGE 3 : REFRESH COORDINATE The purpose of this page is to get the index number and its coordinate. I could have use modulo for the index, but MV is unable to operate modulo for negative number, so I use condition instead. After checking which index are the player currently, next is checking which direction the player input. This is all to make the cursor to bend to the player's will and looks actually moving into that direction. That will make the player a bit happy, they thought they're actually in control... *smirk* The rest that is to show and move the picture into that designated index coordinate. Spoiler: SIMPLER EXPLANATION OF THE ENTIRE EVENT The entire event is divided into 3 phase : Initial (starting animation), Process (navigating animation), and End (ending animation). Aside from Initial and End which are purely decoration purpose, the Process phase trapped the player inside a loop, awaiting for their input. While doing so, it activated cursor idle animation in page 2, and swapped to page 3 after input for a moment to activate cursor movement animation. To escape the Process loop, player only need to prompt the exit using B button (cancel) then choose "yes" OR just pick the character using C button (ok). Points to be noted Two event pages on single event can run at same time by using parallel process. If you want the event to wait for the player input, it's necessary to trapped them inside a loop first. Always leave breathing space (at least wait 1 frame) when using loop. It's better to plan ahead all the necessary math and numbers before. (coordinates, ID to be used, etc) The more dedication you put on it, the more beautiful you can make it! Don't make it hard for you to edit later. Leave useful notes / comments / line-break when dealing with long event such as this to navigate easier. RMMV VS Older RM Certainly MV has better advantage on this matter. MV using float coordination instead of integer, therefore a smoother movement. MV support up to 100 pictures ID. When trying to erase / move non-exist picture, MV will just ignore the command instead of throwing an error. MV by default allow you to put negative zoom value that allow you to flip pictures. Note for the making of the video The video was made on July 2016 on my old PC (that explain the lagging and why I use VXA instead), supposed to be used for certain campaign. But stuff happened and now it's rotten in my archive together with my other experiments. There are more compatible method to custom later OR easier method using script call. But this way is all necessary for Non-Maker specific tutorial. Video Credits Art and Soundtrack in the video belong to project Kitten Mita by Eggion, as shown in the said video. Video by @Kuro DCupu Art by @rondchild Music by Chandra Oyuget For the last, let me know if there's something you don't understand or what would you like to suggest to improve this tutorial I made.