Platform-Style Video Games with Construct

Key and Lock Mechanics

Your browser needs to be JavaScript capable to view this video

Try reloading this page, or reviewing your browser settings

This video shows how to create keys and locks that control the player’s progression through the level.


  • Construct 2
  • Sprites
  • Level Design

About this video

Lee Stemkoski
First online
15 February 2019
Online ISBN
Copyright information
© Lee Stemkoski 2019

Video Transcript

Lee Stemkoski: In this video, we’ll learn how to create a key which is a collectible object which can be used to remove locks, which are solid obstacles that will disappear on contact if you’ve previously collected a key. Key and lock mechanics are optional. Not all games have them, but they can be very useful for controlling the players progression through the level.

To begin, let’s open up our project from last time and we’ll start to by creating a new object. We’ll right click to insert a new object. This object will be a sprite named KeyBlue. There’s lots of colors of keys available. This one will be a blue colored key. Click on Insert. Click on the folder icon, and there’s a folder called key. I’d like to select key blue.png, close that window. And that’s a pretty large key, so I’ll shrink it to be the same size as our items will be 32 by 32.

And let’s also add a lock, so we’ll right click inserting a new object. Again, a sprite, we’ll name this one to LockBlue. Click to place it on the Main layer. Again, using the folder icon, choosing lock-blue. Open this up, and also click on the collision polygon icon on the left. Then I’ll right click to set the collusion polygon to be a perfectly square box to avoid the character’s nagging on the edges. When that’s finished, close that, make the box a little bit smaller and I like everything to be a consistent size, 32 by 32 pixels.

And I’ll also add a couple of behaviors to the lock. So with the behaviors, clicking on properties, see the underlined blue word Behaviors? We’ll add two behaviors actually. First, solid because the player can’t just pass through them initially. We’ll add a second behavior as well. This will be the Fade behavior, so when we unlock the blocks, we’ll have them gradually fade out over time, so we will also add Fade. Then close that. Now, one important property to change before we make any copies of the lock. Under Behaviors under Fade, we don’t want the locks to fade out right away. We don’t want the fade to start immediately, so we need to change the property Active at start from Yes to No.

Now, let’s go over here, back to our Main layout area. I’m actually going to surround the flag which indicates the end of the level, I’m going to surround that with some locks. So here’s my lock, I’m going to hold down the control key, click and drag to create some more of these. All right. So at this point, the player cannot get to the flag until the player has collected a key, and this is what we mean by controlling the player progression throughout the level. They might run straight to that flag and then realized that they actually need to backtrack to collect another item.

At this point, we’ve simply added the sprites. Now we need to go to the Event sheet to add some events to make the mechanic work. So in the Event sheet, the first thing I’ll do is actually add a variable which will indicate whether or not we’ve collected the blue key. So let’s right click and add a Global variable. Let’s name this variable HasBlueKey. Initially, it’ll be zero indicating we have no blue keys, but after we collect it, we’ll change the value of this variable to one. We’ll click on OK, and now let’s add an event.

The first event will be if the Koala collides with a blue key, so our condition is Koala. Under Collisions, choose On collision with another object and click to choose KeyBlue and Done. We need two actions. First, we’ll change the value of that variable we just created to the number 1 to indicate we’ve collected the blue key, so a System action. Under Global and local variables, let’s choose Set value and let’s pick from the list of variables HasBlueKey and set the value to 1. Next, once we’ve collected it, we should remove the blue key from the screen, so we’ll add a second action to this event, a KeyBlue action. And under Miscellaneous, let’s choose Destroy.

Finally, we need to add an event which allows us to unlock the locks once the key is collected. So let’s add an event. This will be a Koala event. Underneath Collisions, On collision with another object, we’ll click to choose the blue lock. Now we need a second condition here. Because only if blue key is equal to 1 should these locks fade away and disappear. So let’s right click and Add another condition. This condition where it check the value of a variable. So it’s a System condition. Compare variable. We’ll check to see if HasBlueKey is equal to the number 1. In that case, the lock will no longer be solid and will cause it to fade out. So we’re adding two actions to this event. First, LockBlue action. Underneath the Solid category, choose Set enabled. We can change the state to Disabled, so the Koala can walkthrough and also, as a special effect, we’ll add that second action, the Fade behavior. LockBlue action, underneath the category Fade, we’ll choose Start fade. So once we’ve collected the key, these will fade away, enabling us to progress through the level.

Now it’s time to save and test. All right, you start running through our level. Notice there’s a flag we want to get to. Try as we might, the Koala cannot progress through. Then we notice a key. Let’s collect that key. And now, every time we collide with one of these locks, they fade away, allowing us to complete the level. You might notice we named everything KeyBlue and LockBlue. But in the provided assets for this game, there are actually many different colored keys and locks. So if you wish, you could also follow this logic to introduce lots of colorful keys to have even more control of how the player progresses through the level.