Tag Archives: tutorial

Introduction to Construct 2 Algorithm

In this post, I will not directly go to the algorithm. First thing I want to do is make the same definition and perception of algorithm. So, algorithm is the way of thought step by step procedure to solve a problem. Using Construct 2, you will solve “the problem” with just single click.

In order to make your project easy to read and understand by the creator (you), I suggest you to create the framework first by creating groups for each layout.
SS023

I have 5 different groups here for “inGame” layout. Player, enemy, power-up, score, and background divide by their role in this layout. Its better to rename the event sheet with the same name of your layout. Try to think about you application elements for each layouts.

Now, to create a group for each layouts. Choose the proper “Event Sheet” of your layout. Right click on empty space and choose “Add Group”, give it a name based on their role. Keep thick “Active on start” option, to make this group always active.

After making some groups for your layout make sure you have event number 58 and 59 from picture above (required for in-game condition and another time-based action). This setting will make your application state “Paused” when you snap the application. If you create the project using template that I have had mentioned before, this setting should have been there.

If not, add a new event, click “Add event”  text on your “Event sheet” window. Choose “Windows8” object type > “Compare view state” > “snapped”.SS024

SS025

After that, create the action by click “Add action” text in line with current event. There are some action need to set on this action.
SS026
1. “System” > “Set layer visible” > (choose which layer will be active when snapped, create a new one if you are not have it) > (set visibility to “Visible”) > Done.
2. “System” > “Set time scale” > (input “0”) > Done.

Settings for snapped view is done, now we will turn it back when user back to the application. Step is same as before when you create snapped view feature.
1. Add an event from system “Else”.
2. Add an action from system, “Set layer visible”, turn paused layer to invisible.
3. Set time scale of your layout to “1”.
SS027
*Picture of event window for “System” configuration

Now, you have known how to add an “Event” and “Action” indirectly when you make snapped view settings for the application. The last thing that you have to know for basic is how to create “Global Variable” and “Comments”.

Do not use Global Variable too often, only use if you need it for global usage. Right click and choose “Add global variable” to use it. Same way with “Comments”, this action will appear with yellow background. It will not affect your application, just for a little note. After you have known the basic, now we can continue to the real thing. Follow links below to go to certain function you might be interested.

1. Player Control (Touch Device)
2. Scoreboard
3. Player Bar Indicator (Health Bar)

After finish with your project, now it’s time to upload it to store. See the REQUIREMENT to upload an application to Windows Store.

Behaviors

Now we will talk about object behaviors. With this properties an object could perform some action such a real stuff. Get on this properties by selecting the object, and then click on “Behaviors” which color is blue and have an underline on it. Same window appearance with Instance Variable will pop up.
SS019

I have a plane here, and now I will give it an “ability” to move by 8 direction. A real aircraft must be a solid stuff, right? So, I will also give it a “solid” stance. In other words, this properties will make your object as real as it is.SS020

Add new behaviors by clicking on (+) button. Usage of Behaviors window is the same with Instance Variable window (click link to go back and see details).

When you click on add button, there are a lot of behaviors type will appear. I will tell you some type of behavior which very common used in a game application.
SS021
*See picture above

1. Solid
This type of behavior will give it an ability to become a solid things, which stand on solid platforms, slide on tilted platforms, affect with collisions, and gravity, etc.

2. Bound to layout
In some game application, creator has restrict players to move outside layout. Use this to limit player movement, so it will still remain inside.

3. Fade and Flash
A simple fade out and fade in animation. For flash type behavior, it will be a bit different. Flash behavior usually used to make collision effect or restart effect of an object. I.e, when a player dies and re-spawn, it will flashing to avoid sudden attack. Use flash behavior to make this kind of effect.

4. 8 Direction
It is a basic movement control for player to control object. Can be change to just 4 Direction setting further. Configuration for this behavior and some of other behavior will appears in “Object Type Properties” > “Behaviors” > “(behavior type)” as additional properties, so it will be more complex and longer after you input some behavior.
SS022

5. Bullet
As its name, bullet. This behavior have additional properties / configuration to make an object move like a bullet. Needed for shooter game like what I have made recently “Aircraft Takedown“.

6. Platform
Like “Mario Bros”, he walks on land that we called here as platform. In this type, you will make an object as a walking side

If you have all of your object ready with their variables and behaviors. Follow this LINK to go to advance setting of your application, algorithm.

 

 

Instance Variable

Each one of object name have their own properties of variable to holds some value. Value of these variable can be a number, text and boolean (true or false). Variable in an object works as “Local Variable”, so it will not interrupt another variable (in different object) which have the same name.
*Note : Even though its “Local”, but please use different keywords with Global Variable (if you already have it) to avoid unexpected error.

1. Make an Instance Variable by open this window. Left click on your object and then choose “Instance Variable” from object type properties. An Instance Variable window will pop up like this. Look at the picture, I already give some unique mark on it. There are red, green, and blue mark which have different action for each. Red mark is for add a new variable, green mark for edit the selected variable, and blue mark is for delete the selected variable. List of variable you have made will be displayed on a table below.
SS016

*In this tutorial I will only use number for the object variable type, because it can represent both boolean or text.
SS017

2. Give your variable a name that represent the usage of variable. Mention initial value for your variable if needed.  Example, I have an aircraft (plane) here which have health point as one of its element so I will named these variable as “health”. Initial “health point” for fresh and mint condition is 100 points, so I will put 100 as it “Initial Value”.
SS018

You can close this window if you have finished editing variable inside. If there any missed variable, you can simply open this window again by following step 1.

Object Type Properties (Sprite and Text)

Each object have their own properties. When you click on the object, properties window will appear on your left side screen.
SS014SS015
*Sprite properties window (left), text properties window (right).

The different between them is only on their “Properties”. Maybe it will make you confused “So which one is the properties?” The answer is simple, there is an “Object Type Properties”, and we have a “Properties” inside it. I will explain some things you need to know about Object Type Properties.

1. General Information
Name : Is the name of your object.
Plugin : Type of your object.
UID : Unique IDentity, every object have their own UID that can not be changed by user. This number will always be different compared with the same sprite if you have 1 or more copy in the project.
Global : This setting will let you make all object by the same sprite name have the same properties. So, turn it “NO”.

2. Common
Layer : Change object location by layer (upper / lower / middle / somewhere else).
Angle : Angle of your object in degree (xxx°).
Opacity : Transparency of your object.
Position : Position of the object at current layer in pixel. For the best result, use this properties to place your object smoothly.
Size : Size of your object.

3. Properties (Sprite)
Animations : Editing your animation can be access by here or just  right clicking on the object and choose “Edit Animations”.
Size : It will make the image size scale by 1:1 to the layer size
Initial Visibility : You can change the visibility of your object at the beginning and later on “Event Sheet”. But, usually turn it to “Visible”.
Initial Animation : Which “type” of your animation appear for the first time in the layout. (Default is “Default”, you can change it but, not really important for now).
Initial Frame : Which “move” of your animation appear for the first time in the layout. It is not really important if the animation run fast, people will not recognize it.
Collisions : Each object have their own collision point, just turn it to “Enable” for now, you will know the usage later.

4. Properties (Text)
Text : Type your text here.
Initial Visibility : (same as sprite type properties)
Font, color and alignment : (I think it’s already familiar with you).
Hotspot, Wrapping and Line Height : (better not to change this one, keep it default).

5. Instance Variables and Behaviors will explained separately. There is no difference of usage and meaning between sprite and text on these properties. Click on link above for details.

Creating Object (Miscellaneous)

Since in this tutorial we are using template. What if we create the project without template (using an Empty Project), and what if we delete some important object by accident without conscious? Well, check this out.

1. Open “Insert New Object” window. If you don’t know how to do it, get back to this PAGE. As you see, there’s much more object types when I create a new empty project than using template.
SS011
SS012

2. For this tutorial, we need some of these object types (Web Storage, Keyboard, Mouse, Touch, Audio, and Windows 8).
SS013

3. Forget about giving each of this object type a name, because you will only need it one (in this tutorial). Just click the object type and insert.