Want to check out a PDF of this tutorial? Right click save as HERE.
Last time we went over the basics of creating a game that works for each export option that IG Maker offers which included creating a character, creating an enemy, and creating a map that all function as basic as possible. This time we’re going to work on refining the game by adding in functions that will cosmetically change, or functionally improve our game including using moving wallpapers (note: this will not work in flash exports but you can use stationary wallpapers), refining our character’s ability to jump and fall properly, and creating a moving platform.
Let’s start by adding snow to our game. You can use the following instructions to create fog, clouds, stars, a day/night cycle, etc. The possibilities are pretty unlimited once you grasp how it works and how easy it can be. The downside is that wallpapers appear behind everything else, which I’ll go into more in a moment. For now just download our snow resource and lets get started.
Once you have the file downloaded you’ll need to head into IG Maker, load up your game, and switch to the “Materials” tab and “Graphics” sub-tab. Here you’ll “Create” a new graphic using the snow image and you’ll need to make sure the “Wallpapers” box is checked. Once that’s done, head to the “Jumping action” tab or whatever style of game you’re creating and switch to the “Canvases” sub-tab and ultimately the “Per Canvas Settings” sub-sub-tab. Here we have a drop down box for “Wallpaper” that we can set as Snow. In order for it to appear as if the snow is falling, we’ll need to set the “Placement Method” to “Tiles”. Just to the right of that under “Moving a Wallpaper” we’ll change the speed from 0 to 3, and the angle from 0 to 225. Once that’s done, go ahead and hit play.
When you test this out you’ll notice that the snow falls behind everything on the map. This is because wallpapers are displayed on a fifth layer which falls behind the four that you can use to build a canvas. This can be augmented by having tiles and gadgets appear on more forward layers that the character can pass behind like a bit of cloud or fog. We’ll go over that more in a future tutorial.
Now, if you tested out the game we made in the last tutorial you may notice that immediately after jumping on the penguin if you hit the jump button again you’d end up jumping again, which really shouldn’t happen. So we’re going to be removing the ability to jump after squishing the enemy. We’re also going to make it so that the character can fall. Head over to the “Gadgets” sub-tab and the “Registering Actions” sub-sub-tab and let’s get to work!
You should automatically be on the “Player” gadget. Select the Jumping “Action Program” and to the left you’ll see that you have the options to Copy, Paste, and Delete. Hit Copy and then hit Paste. This will created a new action program called Jumping(2). We don’t want Jumping(2) to actually jump, so uncheck that box from the “Selected Motion Program’s Settings” window.
Now, select Jumping and under “The Next Action Program” select Jumping(2). Scroll down the “Conditions & Key Commands For Switching Actions” window and find the check box for “The Gadget Played All Animations” and check it. This will allow for the change to happen pretty much instantly after you jump, but it still allows for all the mechanics of the initial jump to play out (which can become a problem if you use the option to “Forcibly Branch Without Any Time Lapse”).
Select the action programs for Standby and Running and have them switch to Jumping(2) when “There Is No Wall Underfoot”. This means that when you fall off something or bounce back up you will see the jumping animation but you won’t actually jump. To make sure it’s impossible for the player gadget to jump again in the very short window that it takes for Standby or Running to switch to the falling animation after jumping on the enemy’s head (for instance) you should set it up so that both Standby and Running can only switch to Jumping if “There Is A Wall Underfoot”.
Now, test out your character and you’ll notice that when you drop off ledges without jumping you’ll see the jump animation but you’ll only fall and after you bounce on the penguin’s head you’ll see the jump animation but you won’t be able to jump again until you hit the ground.
Remember on this one to split your graphic horizontally by two, and check the “Animations” box. Now head over to your game’s tab (“Jumping Action” for instance) and select the “Animations” sub-tab. Create a new animation and call it Platform. Set the graphic under the “Per Action Settings” sub-sub-tab but for this one don’t check the box for “Set The Origin At The Character’s Feet”. Leaving this off will make it easier to place the platform on the canvas. Because the platform won’t be changing directions graphically speaking, you can delete “Left” from “The Action’s Display” and feel free to rename the action or action’s display to whatever you like. I just named them all “Platform” for the purpose of this tutorial. Drag the Graphic window up and select the platform’s tile. Then scroll down to the collision detection and use these settings.
Collision Detection with Other Gadgets
Horizontal Positioning % (top left box) = 0
Horizontal Size % (top right box) = 100
Vertical Positioning % (bottom left box) = 0
Vertical Size % (bottom right box) = 50
Collision Detection with Walls (Tiles)
Horizontal Position % = 0
Horizontal Size % = 100
Vertical Positioning % = 0
Vertical Size % = 50
You don’t need “Collision Detection For Attacks” as the platform isn’t planning on hurting anyone.
We need to turn the platform into a gadget. So head to the “Gadgets” sub-tab and “Create” a new one called Platform and remember to use the animation we just made for the “Animation Assignments” when the window pops up. First, this gadget won’t need to designate a direction for movement so check that box, and set the “Movement Speed” to 0. Head to the “Emergence Settings” sub-sub-tab and set “The First Action Program”, make it “Constantly Active”, and put it on “Layer 3” for display (or whatever layer you’re using). Now, let’s get it working!
Head back to your “Canvases” sub-tab. Make sure to select whatever layer you’re using right away. I can’t count the number of times I’ve forgotten and started placing things on Layer 1 that were supposed to be on Layer 3. It is always a good rule to check your Layers before working with them. Now, head to the “Gadgets” sub-sub-tab and instead of placing the Platform gadget we’ve made we’re going to place a “Course” instead.
So select the Course gadget and put it somewhere on the map where you’d like your platform to start out. This will pop up a window with a lot of very neat options in it. For this example we’re going to stick with the “Linear” option. Go ahead and check the box for “U-Turn From Ending Point” then hit “Okay”. This creates a red dumbbell-like line on your screen that will probably be a bit diagonal.
Go ahead and move it around any way you like. I just went with a straight line across the canvas. If you want to refine this then you’re in luck. It’s incredibly easy. In the lower right of the program, you’ll see a blue/white arrow pointing up. If you click that it’ll bring up the “Parts Placed On The Layout” window which has a few tabs of its own.
Under the “Courses” tab, you’ll be able to change the offset of each point from wherever the first Point originated. You can add more points or do all kinds of things which we’ll try to get into in the future. For now though it would probably be helpful to go ahead and change the time it takes for the platform to get from Points001 to Points002 and from Points002 to Points001. Remember because we have the course doing a U-Turn at the end (Points002) the next point would be Points001 so what you’re really changing is how long it takes for the gadget to get from each point to the next point. I changed both of mine from 1 to 3 seconds to slow it down some.
Now, you need to grab your Platform gadget and place it on the canvas anywhere you like. It’ll automatically move to its proper place in a moment.
Now pull up the window for “Parts Placed On The Layout” and select the “Gadgets/Items” tab. Select the Platform, and scroll all the way down. At the bottom you’ll see “Designating A Course”. In the first drop down select the Course you created, and in the second select the first point in the course. That’s honestly all there is to it. Now you have a platform that moves across the stage that your character can jump and land on.
You can download the finished gpd file and the executable HERE.