Coin Run – Clickteam Fusion 2.5 Tutorial

So, do you want to know how you can make your own game in less than an hour? It’s easy to do if you follow this exclusive Clickteam Fusion 2.5 tutorial.

The game will be called Coin Run and it will feature a character named Ken who has to jump up all the platforms to collect all the coins in the level to win, whilst avoiding the bad guys. So once you have Clickteam Fusion 2.5 installed and open, let’s go ahead and make the game!




First of all, we need to make sure we have the correct library showing for this tutorial. If you don’t have the library window showing in Fusion 2.5, then you will need to click View on the menu followed by Toolbars > Library Window. Like so…

Once you have done this, the library window should be visible at the bottom of the screen. Inside this window, you need to navigate the tree on the left to Local Library > Tutorials and double-click on Coin Run

Once the Coin Run library is open, it should look like this…

Now let’s create a new application (game) in Fusion 2.5. Click File on the menu and select New

Now you will see Frame 1 automatically in the Storyboard Editor. You need to right-click on this and select Frame Editor

Once inside the Frame Editor, we need to do a couple of things before we start to design our level. Select your application in the Workspace Toolbar

Now the application properties will load up in the Properties Window below. Click on the second tab Window Options and untick (uncheck) menu bar from the options…

Once you have done this, scroll to the top and in the Size option, type in 480 x 640, like so…

It will ask you do you want to modify the size of the frames, just click Yes

Now before we go into the Frame Editor to design our level, we need to change the size of the frame. We need a much taller frame, so select Frame 1 from the Workspace Toolbar, then in the properties window change the Size to 480 x 1800

Now we can jump back into the Frame Editor and start designing our level….




First drag the Quick Backdrop object into the frame at the top and resize it to fit the width…

Then resize it at the bottom to stretch all the way to the bottom of the frame. Then right-click on the object and select Lock. This will lock the object so we can no longer move it.

Now drag the Lives object and put that in the top-left corner, drag the Score object in and put that in the top-right corner, like so…

Now in the top part, drag some clouds in, like so…

Now scroll to the bottom of the frame and drop in some platform objects. Scatter them all the way up to the top of the frame, you can also drag some rocks, bushes, the hills and some grass to add to the design, like so…

It doesn’t matter if some of the scenery goes outside the frame, it all adds to the feel of the level. Now when you have done this, drop some enemies on to the platforms, but put them at the right-hand side of the platforms, like so…

Now let’s give the enemy some movement. Select one of the enemies in the frame editor by left-clicking on it with your mouse. Then head over to the properties window and click on the second tab movement. Select the Path Movement and click the Edit button…

Now in the frame editor, you can build a path for the enemy. Click on the ‘New Line’ icon in the Path Movement Toolbar…

Draw a simple line to the other side of the platform, then click on the Loop Movement and Reverse at End icons in the toolbar, like so…

When you are happy with it, click OK. That’s the movement for the enemy complete.

Now drag the Ken object into the playarea and position him just above a platform at the very bottom of the screen, like so…

Now select Ken and in the property window, select the Movement tab, now select Platform Movement

Once you have selected the Platform Movement go to the options below and change the Jump Strength to 110

Now, once you have done this, click on one of the platform objects, Platform 1 and in its properties, select the Runtime Options tab and select Platform for the Obstacle Type. Now in the Frame Editor, select Platform 2 and do the same thing to this. This enables Fusion 2.5 to see the platform objects as platforms in the game.

Finally, grab some coins and put them on the platforms leading up to the top of the frame, like so…

That is our level design complete. Once you are happy with this, we can move on to the next step; Events.


Events in Clickteam Fusion 2.5

If you don’t already know what an Event is in Clickteam Fusion 2.5, let me explain.

An Event is when something happens in the game. So for example:

IF Player collides with Coin: Destroy Coin and Add to Score.

In the above example, the blue part is called a Condition. The orange part is called the Actions. When a Condition is True (ie: Player touches a coin) then it performs the Actions we tell it to. So in the above example, when the Player collides with a coin, it will destroy the coin and add some points to the score. This is called an Event. If the player collides with an enemy, this is another Event. In this next section, we will create the events that control our game.

Open the Event Editor, click on this icon in the toolbar (or press Ctrl+E on keyboard).

When you are in the Event Editor it will look like this…

It’s pretty empty right now as we don’t have any events. So let’s create our first event. Click on ‘New Condition’ and a dialog should popup. This is asking us to choose our first condition. So the first thing we want to do, is tell Fusion 2.5, when Ken (player) collides with a backdrop, to stop the movement. This will stop him falling through platforms. So click on Ken (player) and select Collisions > Backdrop. Like so…

Congratulations! You just inserted your first condition. Now look at what the condition says. It says “Ken collides with the background”, so we need him to stop right? So hover your mouse over to Ken in that Event Line, right-click and select Movement > Stop

Excellent! You just created your first event for this game. Now before we can test our game for the first time, we need to control the camera so it always looks at Ken in the game. So click on New Condition to create a new event. When the dialog pops up, click on the Special Conditions Icon and select Always.

In that event line, hover your mouse underneath the Storyboard Icon column, right-click and select Scrollings > Center window position in frame

After you have selected this, find Ken in the frame area and click on him. Then click OK. It should look like this…

Click OK. Now, try running your game and moving Ken about. You should be able to press the SHIFT key on your keyboard to jump. When Ken collides with a platform, he should stop and not fall through it. Like so…

Excellent. So you know how to create an event, let’s create some more. First of all, those enemies are moving way too fast so let’s slow them down.

Go back into the Event Editor. Do you remember that Always event we just created? Let’s do another action inside that event. Right-click under the Enemy icon and select Movement > Set Speed and when the expression dialog pops up type in 9 and click OK.

Now try testing your game again (F8 on keyboard) and the enemies should move at a much lower speed.

Okay, back into the Event Editor. Now let’s create an event for when the player collects a coin.

Click on New Condition and select Ken (player) then select Collisions > Another Object. When the dialog pops up, select the coin…

Now on this event line, right-click under the Coin object and select Destroy. Now in the SAME event line, right-click under the Joystick icon and select Score > Add to score

When the expression dialog pops up, type in a number you wish to give the player. This will add to the score for each coin collected. In this tutorial, I will type in 5 and click OK.

Now try testing your game again (F8). When you now collect a coin, it should destroy the coin and add 5 to the score…

Now we need to create an event for when Ken (player) collides with the enemy.

Click on New Condition and click on then Ken and select Collisions > Another Object. When the next dialog pops up, select the Enemy.

Now on this event line, right-click under the Joystick Icon and select Lives > Subtract from lives and type in 1 and click OK. In this same event line, right-click under the Ken (player) icon and select Position > Set Position

When the frame editor pops up, drag the square down to just above the bottom platform (do not click on the Ken character), it should look like this…

Click OK. Now after this event, we can test our game again. Press F8 to test. Collide with an enemy and it should subtract 1 from the lives and reposition Ken (player) back at the bottom of the frame.

Now we need to do another event, for if the player drops off the bottom of the screen. In the Event Editor, create a new event (new condition) and this time click on Ken (player) and select Position > Test Position of “Ken”… and select the Arrow that points downwards like this…

Click OK. Your event should now read “Ken leaves the play area on the bottom”

So in this event line, you need to repeat the above steps we did for when he collides with the enemy. Subtract 1 from the lives and then reposition Ken.

Try your game again now. When you fall off the bottom platform and leave the window at the bottom, it should subtract a life and reposition Ken.

Now, in the Event Editor, create a new event, click on Ken and select Position > Test Position of Ken again and this time select the other 3 arrows, top, left and right and click OK. Now in this event line, right-click on Ken and select Movement > Stop. This will stop the player from leaving the window at the top, the left or the right of the screen.




Ending the game

Now we need to create some events to end the game. We want the game to end when the player has collected all the coins.

So create a new event in the event editor (new condition) and click on the Coin and select Pick or Count > Have all Coins been destroyed… Then right-click under the Storyboard Icon and select Next Frame

Now, we need a next frame to go to. Right now, we only have one frame in our game and that is this frame, our level. So go back to the Storyboard Editor

Once there, click on Insert in the menu and select New Frame.

You will notice Fusion 2.5 will insert a new blank frame. Click on the title of the frame to rename it and rename it to High Scores, you may aswell rename Frame 1 to Game whilst you are there…

Now, right-click on the new High Scores frame and select Frame Editor. Once inside, drag the High Scores object from the Library Window into the frame and position it so it is center…

Now, right-click outside of the frame and select Insert Object. Or go to the Menu and click Insert > New Object. Find the Hi-Score Object…

Put it into the frame. Now click to select the object, look at the properties window and change the font color to White and make the font a bit bigger (Click on the font name). Then in the frame editor, use the 4 corners of the box surrounding the Hi-Score object to resize it and make it bigger. Like this…

Now click the Event Editor icon to go into the Event Editor. We only need one event in here and that is when the user clicks on Play Game. So create a new event (new condition) and select The Mouse & Keyboard icon and then select User Clicks within a zone

Now select Left Mouse Button and Single Click then use the boxes surrounding the outline box to make it bigger and resize it to fit the button, like this…

When you are happy with it, click OK. Now once this event is in, right-click under the Storyboard icon and select Previous Frame….

Now go back to the Storyboard Editor and insert another frame. Once the frame is in, rename it to Title Screen. Now, we need it to be the first frame in our game so you can left-click on the frame and drag it to the top, like so…

Now go into the frame editor for the Title Screen. Right-click on it and select Frame Editor. Once in, drag in the Title Screen object from the library and position it accordingly so it is center in the playarea. Now, go into the Event Editor for this frame and create an event (like the high-score screen) for when the user clicks within a zone and put the bounding box over the Play button. When the event is in, right-click under the Storyboard icon and select Next Frame.

Now run your game. Click on Run in the menu and select Application. You should be able to click on Play in the title screen, play the game, collect all the coins and proceed to the high score screen where it asks for your name and then lists you on the high score list! Excellent.


Adding some polish

Okay, so now we pretty much have our game complete we need to do a few things and that is add some polish (or final touches) to the game to make it look really cool. First of all, let’s add some music to the game.

Go to the Title Screen frame and jump into the Event Editor. Insert a new event (new condition), select the Storyboard object and select Start of Frame. Now in this event, right-click under the Speaker (sound) icon and select Play and Loop Sample. When the sound dialog appears, it will be blank because there are no sounds in the game yet. So we need to find one. Click on the Browse button next to “from a file”…

When the browse dialog pops up, click on your C:\ drive… (if it is C:\ drive where Fusion is installed, most are)

Then find your Program Files (x86) folder and enter that (double-click it)

Now find your Clickteam Fusion folder (either Clickteam Fusion Free/Developer/Standard) and enter that

Inside that there will be a ‘Samples’ folder, inside here contains all the music and sound effects you will need…

Inside the Samples folder is a file called Steel Fury.ogg (for the free version – all other versions, it is inside \Music\Future Worlds\). Select that and click OK. When the next dialog appears, type in 0 and click OK. 0 will make sure the music loops forever.

Now before you test your game, click on the Application in the workspace toolbar again and look at its properties…

Click on the Runtime Options tab and tick the option “Play Sounds over Frames”

This will ensure that the music keeps on playing, even when then player changes frames. Run your game now to hear your music in action.

Now, jump into your Game frame and go into the Event Editor. Let’s take a look at an event where we want to play a sound effect. The first one we want to do is when the player collects a coin. So look for the Event we already created…

Right-click under the Speaker (sound) icon in this event and select Play Sample. When the dialog appears click on “From a file: BROWSE” button. Select the BONUS3.wav file (free version) in the other versions it is under the MISC folder in Samples.

Now try running your game. Every time the player collects a coin, it should play the sound effect.

Now you know how to bring sound effects into your game, why not try and add some more?

We have one final thing to do before this tutorial is complete. When the player runs out of lives, we need to exit the game.

So back into the Event Editor for the Game frame. Create a new event (new condition) and click on the Joystick icon and select When number of lives reaches 0

When this event is in, right-click under the Storyboard icon and select Previous frame. This will take the user back to the title screen when all their lives have gone.

There is also one more thing we need to do. Create a new event (new condition) and click on the Storyboard Icon then select Start of Frame. When this event is in right-click under the Joystick icon and select Score > Set Score

When the dialog appears, type in 0 and click OK. This will reset the players score to 0 when the frame first starts. Again, in this same event line, right-click under the Joystick Icon again and select Number of Lives > Set Number of Lives and when the expression dialog appears, type in 3 and click OK.

Congratulations. This tutorial is now complete. You have made a cool game in Clickteam Fusion 2.5 in no time at all. You really should take this tutorial, save the file (File > Save) and improve upon it yourself. Try adding some new enemies, maybe change the speed of the player or the jump strengths, maybe add some new platforms?


Join the Academy Today


Learn Clickteam Fusion 2.5 taught by experts
Access Exclusive Downloads, Examples and Open-Source Projects
Active Supportive Community Forums and post-it boards
Live Weekly (and daily) Video Streams
Click Fusion Logo