How to Make a Game in Defold

Don’t let your dream games stay as just ideas – learn Defold instead!

Defold is a free and open-source game engine that is cross-platform, features a lightweight editor, and works with both 2D & 3D games. This has made it a rising star among indie developers and is quickly becoming a big player among other available game engines.

In this tutorial, we will be going over the very basics of the Defold engine, from installation to creating our very first game! If you are looking for a new engine to create your games, or have never touched game development in your life, then don’t worry, as we will guide you through and provide you with a complete introduction to the Defold game engine.

Let’s dive in and get started with this game development journey with Defold!

Project Files

Before you start, if you’d like to follow along this tutorial with the same assets we used, you can download them via the link here: Download Defold Tutorial Assets

If you want to a more comprehensive look into Defold, check out Zenva’s Defold Game Development Academy. This learning pathway will guide you through multiple, hands-on Defold projects and take you from beginner to expert in no time flat!

CTA Small Image
FREE COURSES AT ZENVA
LEARN GAME DEVELOPMENT, PYTHON AND MORE
ACCESS FOR FREE
AVAILABLE FOR A LIMITED TIME ONLY

Installation

To begin our journey, let’s download Defold from the official website: https://defold.com/

At the top right corner, click Download.

defold website

We can then choose our preferred download format. You can even download it on Steam!

download defold

Once the download has finished, you want to extract the Defold folder to somewhere on your computer. I would recommend Documents or Program Files.

defold zip file

Once that is done, open the folder and double-click the Defold.exe to launch the engine!

defold exe

Creating a New Project

When you open Defold, it’s not the engine that will appear, but the launcher. This is where we can create, view, and manage all of our projects. You can see how I already have three project created in the past. For us though, we’ll want to create a new one. Click on the New Project button.

defold project browser

In this window, do the following:

  1. Make sure that the Empty project is selected.
  2. Change the Title to be whatever you want your project to be called.
  3. You can click the three little dots on the lower right to change the directory.
  4. Then finally click Create New Project.

create new project

Editor Overview

Here were are in the Defold editor. It may look complex with the different windows and buttons, but let’s now go through and learn what each aspect does.

defold editor

There are 6 editor panes by default. Each of these serve a different purpose in making our games.

  1. The Assets pane is basically a file explorer which shows us all the different files and assets we have access to for our project. These include: scripts, tilemaps, textures, sound effects, music, data, collections, etc.
  2. The Changed files pane is where we can see a list of changed files if we are using git with our project.
  3. The Editor pane displays whatever file or asset we are currently working on. This is where we write code, build our levels, construct our game objects, etc. We will be spending most of our time here.
  4. The Tools pane displays a number of different tools such as the console (for displaying messages and errors).
  5. The Outline pane shows the contents of the file currently being edited. For example, if we have a collection open in our Editor pane, then the Outline will display all of the game objects inside.
  6. The Properties pane shows the properties associated with the currently selected item.

editor overview

You can also adjust these panes slightly, by clicking and dragging along their borders to resize them.

How Does Defold Work?

Before we get into actually making a game and learning the engine, we first need to understand the building blocks of Defold. And that is the concepts of: Collection, Game object, and Component.

collection game object component defold

Collections

A collection is a tree structure, which will hold game objects and other collections. The simplest way to think of it, is like a level. Inside of a level, you have the player, enemies, pickups, obstacles, etc. For each level of your game, that will be represented as a collection. If you are used to the Unity or Godot engines, a collection is essentially a scene.

But collections are far more powerful than just containers for levels. Since you can have collections nested within each other, that means you could have a player collection, which contains all of the player game objects and components. That could then be duplicated across all levels.

Here is an example of a collection. You can see how it (the icon with the three boxes), contains a number of game objects (cube icon).

defold collections

Game Objects

Game objects are the entities of your game. These would be the player, the enemy, pickups, etc. Each game object has a position, rotation and scale, so you can move them about in your world as you see fit. Game objects are typically a part of a collection, as you can see in the example above.

Components

Components are what we use to give our game objects life, because without them, then the game objects would just be empty entities without any purpose.

You can see here, how my coin game object has three components. A script, a collision component and a sprite component. These three things make the coin a coin.

defold components

There are many different types of components: scripts, sprites, tilemaps, colliders, particles, sound, etc. We will be exploring a number of them throughout the tutorial.

Creating Our First Game Object

Inside of our default project, we have a collection already created for us. This will act as our level or scene. To open it, go to the Assets pane, open the Main folder, and double-click on main.collection.

This will change a few things.

  1. The Editor pane will now display our collection. It’s empty right now.
  2. The Outline pane will display the contents of the collection. It’s empty right now.

Main collection circled in the Defold engine

To create a new game object, right click on the collection in Outline and select Add Game Object

Add Game Object option from Collection menu

With this new game object created (called go by default), you will see a number of things happen.

  1. The game object will be added to the list inside of the Outline.
  2. With the game object selected, we can see its properties in the Properties pane.
  3. With the game object selected, we can see the movement tool visible in the Editor pane.

image 31

Sprite Component

Now to make this easier to see in-game, let’s add a sprite to our game object. You can use your own, or download the cow one we’ve provided with the assets.

Then, we can simply drag and drop it into our main folder to add the asset.

cow image imported

With our game object selected, let’s first rename it. Down in the Properties pane, change the id from go to Cow.

change cow name id

Right click on the cow game object, then go Add Component > Sprite.

create sprite component

This will add a new sprite component to our game object. But we cannot yet add our cow image. There is one more step we need to take.

sprite component settings

In order for our cow image to work as a sprite, we first need to add it to a sprite atlas. This is basically a file which contains a number of different sprites that we can refer to.

Right-click on the main folder in the Assets pane, then go New… > Atlas. Give it a name of player_sprites and click Create Atlas.

sprite atlas

We can then double-click our new player_sprites.atlas file, and you will see how it changes the editor.

sprite atlas setup

In the Outline pane, right click on Atlas and select Add Images…

Select the cow.png, then click Ok.

Selecting the cow image for the sprite atlas in Defold

This will add our cow to the atlas! If you cannot see it, select the cow in the Outline and press F on your keyboard to focus.

Cow image as seen in the Defold editor

Press CTRL + S to save, then at the top of the Editor pane, click on the main.collection tab to return to our collection.

Main.collection tab highlighted in the Defold engine

Select the sprite component, then down in the Properties pane, do the following.

  1. Click on the three dots next to the Image property and select our player_sprites.atlas.
  2. Set the Default Animation to cow.

We should now see our cow in the Editor pane! If you don’t, then select the sprite and press F on your keyboard to focus.

cow animation

Playing our Game

To see what our game looks like if we were to play it, we can go to Project >  Build a the top of the screen, or use the CTRL + B keyboard shortcut.

previewing our game

It does look a bit strange, but that is because our cow object is at the center of the collection (0, 0, 0). Which is the bottom left corner of our window when rendered. To fix this, let’s look at how we can move, rotate, and scale our game objects.

Move, Rotate, and Scale

With our cow game object selected, we should see two arrows appear in the Editor. This is the movement tool – keyboard shortcut of W. We can click and drag on the green and red arrow to move our object around.

  • Green represents the Y axis.
  • Red represents the X axis.

We can also click and drag on the blue square to pan it across the screen.

movement tool

You can see that when I move the object, its Position property also updates. If you want, you could enter in numbers here to move the object as well.

position property

To rotate, we can select the Rotate Tool at the top left corner of the Editor, or use the keyboard shortcut of E. We can then click and drag on the blue ring to change the object’s angle. This is also represented in the Properties pane, with the Rotation property.

rotate tool

And then finally, we have scale. Keyboard shortcut of R. Click and drag on the X and Y squares to change the size of the object. Or click and drag on the center blue square to scale uniformly. The scale is represented by the Scale property down in the Properties pane.

scale tool

Editor Pane Navigation

We can move our view around in the Editor pane in a number of different ways.

  • Hold middle mouse and drag to pan around.
  • Use the scroll wheel to zoom in and out.
  • With an object selected, press F to focus your view onto it.

editor pane

Let’s now move our cow object up and to the left a bit.

move cow over

So that when we build our game, it is closer to the center of the screen.

game preview window

What Game Are we Going to Create?

For this tutorial, we’re going to keep it simple. Let’s develop a game where we can click on the cow’s face to increase it in size, then once it reaches a certain size, it will pop like a balloon!

Collider Component

To detect clicks on our cow game object, we need to add a collider. This will allow the engine to determine if when we click on the screen, if the cow is the one that is selected or not.

Right-click on the cow game object, then go Add Component > Collision Object. This will add the collisionobject component.

collision component

But nothing is happening just yet, since we first need to define a shape for this collider.

  1. Right click on collisionobject and go Add Shape > Sphere.
  2. Set the Sphere’s Diameter property 130.

You should see in the Editor pane, the cow now has a blue circle around it. This is a preview of the collider.

collision shape

Now if you build the game, you will notice that the cow is slowly moving down. This is due to the type of collider we’re using, which by default is Dynamic. Select the collisionobject component and set the Type property to Trigger.

collision type trigger

Cow Script

Now lets start being able to detect clicks on the cow. In the Assets pane, right click on the main folder and go New… > Script. Call this script: cow

script create

The script should then open up in the Editor pane. You will notice quite the amount of code, but what I want you to do, is select it all and delete! Clear the file so we are left with no text.

defold script window

Functions

Functions are basically blocks of code which can be executed whenever we want and as many times as we want. Defold has a number of built-in functions that we can create that the engine will call at specific times.

The first one we’re going to look at is the Init function. Write it out like this:

init function

Now here is how a function is made in Lua, the Defold scripting language.

  • You begin a function with the function keyword, followed by a name, then in parenthesis: the parameters, which is basically data sent over to the function.
    • function [name] ([parameters])
  • We then leave some space, because this is where the meat of the function will go.
  • And at the end, we seal the function with the end keyword.

If we want to add code inside of the function, it must be one tab’s width in. Add in the following line of code to the function:

function init (self)
    print("hello!")
end

Now to test this, we can press CTRL + B to build, but nothing will happen. That is because the script is not attached to our cow game object.

Back in the main.collection tab, right-click on cow, and select Add Component File. Select the cow script and click add.

add cow script to game object

Now if we build our game, we should see in the console, our message!

console output

Back to our script, let’s remove the print line of code and replace it with this:

function init (self)
    msg.post(".", "acquire_input_focus")
end

After the end keyword, go to a new line and create the on_input function.

function on_input (self, action_id, action)

end

This function gets called when we press a key on out keyboard, trigger mouse events, etc. You can see that this function has 3 parameters that will carry over the data correlating to the specific input event.

If Statements

Now inside of the on_input function, let’s add some more code:

function on_input (self, action_id, action)
    if action_id == hash("touch") then
        print("hit")
    end
end

This is known as an if statement. These basically allow us to run code only if a certain condition has been met. This is the format: if [condition] then

For us, we are checking to see if the action_id (one of the function’s parameters) is equal to the hash of touch, which means a mouse or touch input. Then we are printing the word “hit” to the console if that is true.

Press play now and click.

console output

You’ll notice that the word hit gets printed a lot. This is because the function is being called each frame our mouse button is down. But we don’t want that. We only want to trigger a touch on the first frame, so let’s adjust our code.

function on_input (self, action_id, action)
    if action_id == hash("touch") then
        if action.pressed then
            print("hit")
        end
    end
end

We can nest if statements like this. Here, we are checking to see if the action (another parameter) is pressed, which is true or false. True for if this is the frame the touch was first triggered, and false for every other frame.

Now when we build our game and click on it, it will only print once when our mouse goes down. Here’s what your code should look like with everything we’ve done so far.

function init (self)
 msg.post(".", "acquire_input_focus")
end

function on_input (self, action_id, action)
 if action_id == hash("touch) then
  if action.pressed then
   print("hit")
  end
 end
end

Creating Our Own Function

Now we need to set it up so that our cow will increase in scale each time we click on it. To do this, we are going to create our own custom function called increase_size. The parenthesis are empty due to the fact we have no parameters.

function increase_size ()

end

Let’s also make it so that when we click the cow, instead of calling that print command, we will call our new function instead.

function on_input (self, action_id, action)
  if action_id == hash("touch") then
    if action.pressed then
      increase_size()
    end
  end
end

Back in the increase_size function, let’s start by increasing the cow’s game object scale. There are four new lines of code we are writing here:

  1. We first create a local variable (basically a piece of memory that can store data) and call it scale. This is then set at the game object’s current scale.
  2. We then increase the scale X axis by 0.1.
  3. As well as the scale Y axis by 0.1.
  4. We then set the game object’s scale to be that modified variable.
function increase_size ()
  local scale = go.get_scale()
  scale.x = scale.x + 0.1
  scale.y = scale.y + 0.1
  go.set_scale(scale)
end

Now if you press play, click the mouse and watch as the cow increases in size!

Popping the Cow

Now how do we pop the balloon/cow when it reaches a certain size? Well to do this, we just need to add in an if statement like so.

Here, we are checking to see if the X-axis scale is greater than or equals to 2 (double our original size). If so, then we call the game object’s delete function which will delete its instance from the game.

function increase_size ()
  local scale = go.get_scale()
  scale.x = scale.x + 0.1
  scale.y = scale.y + 0.1
  go.set_scale(scale)

  if scale.x >= 2 then
    go.delete()
  end
end

Here is what your code should be looking like in full:

function init (self)
  msg.post(".", "acquire_input_focus")
end

function on_input (self, action_id, action)
  if action_id == hash("touch") then
    if action.pressed then
      increase_size()
    end
  end
end

function increase_size ()
  local scale = go.get_scale()
  scale.x = scale.x + 0.1
  scale.y = scale.y + 0.1
  go.set_scale(scale)

  if scale.x >= 2 then
    go.delete()
  end
end

When it comes to best practice, our increase_size function name should feature the keyword local. You can read more about this here in Defold’s documentation.

function init (self)
  msg.post(".", "acquire_input_focus")
end

function on_input (self, action_id, action)
  if action_id == hash("touch") then
    if action.pressed then
      increase_size()
    end
  end
end

local function increase_size ()
  local scale = go.get_scale()
  scale.x = scale.x + 0.1
  scale.y = scale.y + 0.1
  go.set_scale(scale)

  if scale.x >= 2 then
    go.delete()
  end
end

Pre-Hashing Strings

In Defold, we need to hash our strings in order to detect input actions for example. It is generally best practice to pre-hash them, meaning that when we are checking them in if statements, the hash is already calculated. This can help with performance. So to do this, let’s start by creating a new variable at the top of our script, outside of any function.

local touch_action = hash("touch")

And then in our on_input function, replace:

if action_id == hash("touch") then

With:

if action_id == touch_action then

Defold Tutorial Wrap-Up

And there we go! We now have a very basic game in the Defold engine and covered some of the fundamental building blocks you’ll need for future Defold games.

From here, I’d recommend learning more about the Lua language, other core components of Defold, and the many other systems it has, such as tile mapping. There is a lot to learn with Defold – but there’s also a lot of opportunities.

After learning the basics, you can then start diving into your next games, whether those be platformers, RPGs, or something else. If you’re keen to learn more, we highly recommend Zenva’s Defold Game Development Academy. This curated learning pathway is designed to take you from beginner to expert game developer with Defold. You’ll learn core game development techniques while exploring how to build multiple, portfolio-ready projects. Plus, you’ll get supplemental learning materials like the full source code to help you along the way.

Thank you very much for following along with this tutorial, and good luck with your Defold games!

Did you come across any errors in this tutorial? Please let us know by completing this form and we’ll look into it!

FREE COURSES
Python Blog Image

FINAL DAYS: Unlock coding courses in Unity, Godot, Unreal, Python and more.