DEV Community

Cover image for An introduction to Godot's Visual Script
Archer Allstars
Archer Allstars

Posted on • Updated on

An introduction to Godot's Visual Script

Update: Godot's Visual Script will discontinue in Godot 4.0. Therefore, it's useless to continue using Visual Script in Godot now.

What is Godot?

Godot is yet another game engine other than Unreal and Unity. But it is completely free and open-source. This means no strings attached, no royalties, nothing. Your game is yours and yours alone.

Why would you use Godot?

The engine doesn't have the ultimate 3D capabilities like Unreal. And you also can't export your game to console devices. Then, why use it?

  • You have a slow laptop and don't want to buy a new one (yet). You would want to use Godot rather than Unreal.
  • You're new to game development. You might want to use Godot because Godot is much less complicated than Unreal. However, you might need to spend more time fixing bugs since Godot is a less-proven engine out of the two.
  • You want to make 2D game.

I can tell you from my personal experience with Godot that my game development is very smooth so far with it. The official showcase video will show you what kind of game you can expect to make out of the engine.

Which Godot version should you use?

If you start developing your game today, you can use Godot 4 alpha for that, as your game will grow with it. As of alpha 6, it's very stable already. You can expect feature changes though, hence the alpha tag in the name. But by the time you published your game, the engine would be at least at the beta or even stable state, and the bugs related to the Vulkan rendering are likely to be fixed by then. There's no need to use relic technologies found in Godot 3.

Therefore I will continue my Visual Script tutorial based on Godot 4.

What is Visual Script?

Visual Script is another way to code your game but doesn't require you to do a single line of code. Instead, you do code by connecting various logic nodes. The most popular form of Visual Script is Blueprints from Unreal Engine.

The purpose of Visual Script is to make it easier for everyone to code. Visual Script is easier to learn and understand than C++, that's for sure. And that's the reason why Epic introduced Blueprints in Unreal Engine.

However, many Godot fans would say that GDScript is very easy and Visual Script isn't needed. Of cause, GDScript is much less complicated when compared to C++. Nevertheless, you still have to remember its syntax. With Visual Script, you don't have to remember a language's specific syntax, which is a huge plus. All you have to do is learn the engine APIs and call them with Visual Script nodes.

In Godot, Visual Script is called Visual Script. You can learn some basic usage from the official docs (it's a little bit outdated and lacking though).

What is the Visual Script's flow?

Visual Script's flow

First, we need to know the order of how the Visual Script works. Visual Script works in a flow. As shown in the screenshot above, I get the first child of the TouchDPad node, then I get its the first child and set it as an object variable. This whole node sequence above is called a flow.

Visual Script nodes that you will use a lot!

In this article, I will show you guys some very important nodes that most of you will use all the time as Visual Script users.

Type Cast

Type Cast

This node filters out the object at the input port, then if it matches the criteria you set in its Base Type, the action along with the filtered object at the output port will be triggered.

For instance, if you want to filter input events, which will include all the events from the user input, and you want to trigger some action based on the screen drag event only, not the screen touch event or other input events, then you can use this node as shown in the screenshot above.

Switch VS Condition

Switch Node

If you need to use many condition nodes (if, else) in the same flow, you would rather use a switch node instead of a condition node. A switch node will reduce your nodes on the canvas by a lot, hence makes it easier for you to read the code. Use it whenever you can!



Use iterator node with an array or dictionary variable. For instance, you put a lot of objects in your dictionary, then want to pick an object in the dictionary based on some criteria. Therefore you have to scan all the objects in the dictionary at once (in a single flow), then you can use an iterator for this.

In the above screenshot, I run the iterator in the _ready function. It prints all the keys in the dictionary in a single flow.


Expression Node

This node can save you a tons of operator nodes (add, subtract, multiply, divide, and etc.). If you do a very complicated calculation in a flow, you would rather use this node instead.

Constructor and Deconstructor

Constructor and Deconstructor

The constructor and deconstructor are another basic yet very essential node in Visual Scripting. For instance, if you want to construct a vector3 from many floats, then you need a vector3 constructor.

Get and Set Index

Get and Set Index

The get and set index nodes are very useful to use with array and dictionary, especially, when you want to add a key and its value to a dictionary variable, you would use the set index node like this:

How to add a key to a dictionary variable

You can get the value of a dictionary variable by using its key from either the get index node or the specific get node from the dictionary type node:

Get Index

General Get Node with Set Mode set to Basic Type

General Get Node

I use this node a lot to get an index from a value of any specific type. For instance, if I want to get an x value from a vector3, I can use this node as shown in the screenshot above.

Call Mode

Call Mode

There're 4 important call modes, Self, Node Path, Instance, and Singleton.

  • Self: This is the default mode. It means that you will call a function in the current scene node that the script is attached to.
  • Node Path: You can call a function to do something with another scene node which the script isn't attached to. For instance, you can change the position of scene node B even though the current script is attached to scene node A.
  • Instance: This mode is probably one of the most used of all. For instance, you can save a scene node or an input event to a variable of the object type, then you can call a function to do something with that object. It's more flexible than the Node Path mode which can only support a function call based on scene node.
  • Singleton: You can use some specific engine features with this call mode. For instance, you can set your mouse mode by calling an input singleton.

Let's put some nodes above into practice 💪

Practice Visual Script

I create a very simple Visual Script practice. The app above will let you type A-Z from your keyboard input and it will return a word corresponding to the letter you typed in. In order to do that, you can follow these steps below:

  • Create a variable of type dictionary and type in the keys from A-Z with the values corresponding to the key.

Dictionary's keys and values

  • Detect user's input event with the _input function, then filter out unrelated input events with Type Cast InputEvenKey node.

Type Cast

  • Convert the InputEvent that we filtered out into text using the as_text function (of cause, you need to learn the engine API to access the engine features).

As Text function

  • You need to check whether the user type in the letter from within A-Z. Otherwise, the code will generate error if the user type in a symbol or a number as it's not belong to our dictionary's keys. You can use the has function from the dictionary nodes for this purpose.

check whether the user type in the letter from within A-Z

  • If the user type in the letter from within A-Z, set text based on the keys and values in our dictionary.

set text

It's done!

Below you can see all the Visual Script nodes needed to create this little app:

Complete Code

You can download a completed project here. Remember that you need Godot 4 to open this project. I recommend Godot 4 alpha 5 as of this time.

Cover Photo by Photo by Immo Wegmann on Unsplash

Top comments (0)