Hello Ask Gamers!
Do you want to see your video game ideas come to life today?
In today’s video we are going to show you how you can take your ideas from your notebook,
and turn them into a fully-playable game.
We’ll walk you through the entire process, step by step, going through planning, art,
and finally getting your game into an engine - specifically Construct3 for this tutorial.
We are Ask Gamedev aka The Depeche Mode of Clean Code, aka the Sultans of Syntax, aka
A Tribe Called Everquest and this is How To Make a Game in Construct3: Super Teal Robot.
Part 1 Welcome back!
If you’re new to Ask Gamedev, we make videos to help you learn about the games industry
so that you can elevate your games and Inspire others.
If you’re on a gamedev journey, consider subscribing as our community works together
through videos and comments to share insights and best practices that will help your game
development.
Today we’re starting a series where we’re going to build a game starring everyone’s
favourite Ask Gamedev mascot, Super Teal Robot, in Construct3.
First we’ll start small, and build upon this project with each new tutorial.
Construct3 is a drag and drop game engine, and this tutorial will not require any coding.
If you’d like to know more about drag and drop engines, and how they work, you can check
out our recent video “Make Games Without Coding Using These Engines” here.
So… where do we even begin?
Well when it comes to starting projects, never forget the A.S.K. rule!
Always Start Knowing.
Before you lay down any freshly authored game code, Know exactly what you’re going to
make.
Know what assets you have to draw.
Know what rules you have to have in place.
Know how your characters will interact.
If you don’t know what you’re going to make, and just hope it comes to you while
you’re in engine, you might end up wasting a lot of time scratching your head.
This isn’t to say that you’re setting your plan in stone - think of it more as a
road map.
There are a lot of ways to get from point A to point B. You just need to know where
B is.
So how exactly do you plan?
A plan can only come into place when you have a goal - so the first step is to set your
objective.
Let’s use what we’re making in this demo as an example.
For today’s tutorial, we will keep it simple.
We’re going to try to accomplish 3 things: Get Super Teal Robot into the game, on a platform.
Give Super Teal Robot the ability to walk Give Super Teal Robot the ability to shoot
his arm cannon
Now that we have our objectives, we start the next phase of planning: creating an asset
list.
Let’s do that now.
Our first objective is to get Super Teal Robot into the game, on a platform.
For that we’ll only need two assets: Super Teal Robot, and a platform.
Next, we want him to walk.
What assets will we need for that?
We’ll we need his walk animation.
This means we’ll need to draw what Super Teal Robot will look like walking, frame by
frame.
Finally, we want Super Teal Robot to be able to fire him arm cannon.
For this we’ll need his shoot animation, and we’ll also need to draw a bullet.
So in total we’ll need: Super Teal Robot (standing)
Super Teal Robot (walking) Super Teal Robot (shooting)
And a bullet.
So now we have our objectives - we know where we want to end up.
And we have our asset list - we know what we need to draw or source.
The third and final step of planning is event and rule planning.
Once we start plugging in our assets into the game, we need the asset to be able to
do things, interact, and come alive.
Just like how we made our asset list, let’s go through our objectives one at a time, and
start building our events and rules list.
Objective #1: Get Super Teal Robot into the game, on a platform.
This one is simple.
No events, just rules.
The platform has to act like a platform, and Super Teal Robot has to act like physical
object.
Give Super Teal Robot the ability to walk.
For this we need two events: 1.
When the user presses the walk button, we need Super Teal Robot to move.
And 2.
When Super Teal Robot walks, we need to play his walk animation.
Our third objective, Give Super Teal Robot the ability to shoot his arm cannon, will
also have two events.
1.
When the user presses the shoot button, Super Teal Robot will have to play his shoot animation.
And 2.
A bullet will have to spawn from Super Teal Robot and move in the direction that Super
Teal Robot is facing.
And with that, we have the three elements that we need to jump into the engine: our
objectives, our asset list, and our events and rules list.
So as you can see, a lot of work and planning is put into a game before a single line of
game code is written - so never let the lack of coding ability hinder you from planning
and creating games.
Let’s fire up Construct3!
Head over to editor.construct.net.
If you don’t already have an account, go ahead and create one.
Construct3 has a free version that we can use for this demo.
The best part of Construct3 is that there’s nothing to install!
All of this happens in your browser!
When you’re ready, click New Project.
Name it whatever you want - we’ll call ours Super Teal Robot tutorial 1.
SD Landscape 16:9, landscape is fine.
Click create.
Welcome to Construct3 workspace.
If it all looks overwhelming right now, don’t worry, we’ll explain portions of the interface
as we use them.
Let’s start with Objective 1 Get Super Teal Robot into the game, on a platform.
For this we’ll need our Super Teal Robot asset and our platform.
As you can see, I have a windows folder open that contains all of the assets from the asset
list that we created.
Drag each asset one at time from the folder, into the workspace within the dotted line.
The area within the dotted line is the section that the player will see when the game is
running.
Try pressing the play button.
This will give you a simulation of the game as it stands.
As you can see, nothing happens.
It’s like looking at a picture.
We need to give them rules.
Click on Super Teal Robot,]then click Behaviours.
Super Teal Robot’s Behaviours window will pop up.
Click Add New Behaviour.
These are all of the behaviours that are built in to construct3.
Scroll down to the bottom, and click “Platform”.
This will make Super Teal Robot behave like a platforming game character.
Now press play again.
Super Teal Robot fall right through.
We need to give the platform a behaviour.
Click the platform then click Behaviours, then Add New Behaviour.
Check out the description for “Solid” - “Make the object impassable, so other
objects cannot move or fall through it”.
That sounds like exactly what we need.
Click that, and then click Add.
Now run the game again.
We have completed Objective 1.
Now onto the next one.
Objective 2: Give Super Teal Robot the ability to walk.
Just like we planned, for this we’ll need: the walking animation,
and 2 events: 1.
When the user presses the walk button, we need Super Teal Robot to move.
And 2.
When Super Teal Robot walks, we need to play his walk animation.
Try running the game again.
Press left.
He walks!
But how?
Well when we gave him the Platform behaviour, the walk feature was built into that!
So we can scratch that one off the list!
Next, let’s set up his walk animation.
For this we’ll go into the sprite editor!
Double-click on Super Teal Robot.
On the right, you’ll see the Animation section - this is an important area, so get familiar
with it.
Right-click in the Animation area, and click Add Animation.
Let’s name it “Walk”.
At the bottom you’ll see the frames section.
Let’s import the walk frames.
Right-click, click import frames, from files, and add your frames.
In Animation Properties section click “Loop”.
And close the sprite editor.
Next we need to tie this walk animation, into Super Teal Robot’s walk.
We are basically telling the engine, that when Super Teal Robot walks, play his animation
called “Walk”.
For this we’ll need the Event sheet.
The event sheet is where all of the logic and variables are kept.
Click on the Event sheet tab at the top.
Click Add Event.
Click Super Teal Robot.
[8:20] Scroll down to the Platform conditions, and click “On moved”.
So now the engine knows to keep track for when Super Teal Robot is walking, and do something.
But do what?
We have to add that.
Click “Add Action” to the right.
Click Super Teal Robot.
And click Set Animation.
Set the animation to “Walk” and click Done.
Press Preview.
He now plays his walk animation!
But he doesn’t stop!
To fix this, add another event.
Click Add Event, then click on Super Teal Robot.
For the condition, go with “On Stopped”.
Now let’s add an action.
This time, let’s set Super Teal Robot’s animation back to the default.
Test it out!
We have completed Objective 2!
Now onto the final objective!
Give Super Teal Robot the ability to shoot his arm cannon.
Let’s recap.
For assets we need Super Teal Robot’s Shoot animation, and a bullet.
For events we need 2: 1.
When the user presses the shoot button, Super Teal Robot will have to play his shoot animation.
And 2.
A bullet needs to spawn from Super Teal Robot and move in the direction that Super Teal
Robot is facing.
Let’s start with importing the bullet.
This time, drag the bullet into the workspace, but outside of the dotted line.
Doing this will create the bullet as an object into your game, without having to show it
on screen.
Click on the bullet and add a behaviour.
Luckily for us, the type of behaviour we want is built right into the engine!
Click on “bullet” and add.
Now let’s give the Super Teal Robot his shoot animation.
It’s the same process that we went through for the walk animation.
Let’s call this one “Shoot”.
So we want the player to be able to press the shoot button, then have Super Teal Robot
shoot a bullet, while playing his shoot animation.
Simple enough right?
But how do we add controls?
The walk was already built in, but this is new!
For this we’ll have to introduce a new concept.
Input objects.
Right click in the workspace, and click Insert new object.
Scroll down to the Input section, and click Keyboard.
You now have a keyboard as an object.
This means you can use it in events.
Let’s go to the events tab.
Add an event.
Click “Keyboard”, then click “On Key Pressed” for the condition.
Now just enter the key you’d like.
We’ll use “G”.
Now when the player presses G on their keyboard, we can have whatever we want happen!
We are going to add 2 events.
The first event you’ll be familiar with.
We want to set Super Teal Robot’s animation to “Shoot”.
You already know how to do that.
And for the 2nd event, we want a bullet to appear from Super Teal Robot.
Click “Add Action”.
Click Super Teal Robot.
Then for an action, click “Spawn Another Object”.
Choose the bullet, and click Done.
Test it out.
He now shoots a bullet when you press G!
Now let’s do 2 things to polish.
We need him to go back to the his default state after shooting, and we also need him
to spawn the bullet from the correct place.
Add an event for Super Teal Robot.
Click on “On Finished”, then type in “Shoot” for the animation.
For the action, set his animation back to the default.
To move the spawn point of the bullet, go back to the sprite editor of Super Teal Robot,
and right-click on the “image points” area to add an image point.
C all it “Cannon”, then click where you want the bullet to spawn from.
Close the sprite editor.
Now go back to the events, open the Spawn event, and type in “Cannon” in the image
point field.
Voila!
Congrats!
You’ve made the start to a fun action platformer!
In the next video in this series we’ll take a look at polishing and tweaking these movements
and at giving Super Teal Robot some new weapons!
It’ll involve creating more art, and we’ll also talk about variables.
If you have any ideas for powers for Super Teal Robot, let us know!
Should he have a bubble gun?
A flamethrower?
We’ll pick a few and put them into the game for the next tutorial!
Thanks for watching we are Ask Gamedev and we make videos on game development, the game
industry, and more!
If you like our channel, the best thing you can do to help is to upvote the video or leave
a comment.
We publish new content every week on how to elevate your games so consider subscribing
and hit the bell below to be notified as soon as a new video is available.