Tutorial: Introduction to Flow Graph This tutorial introduces you to Flow Graph, including its core concepts, the Flow Graph editor and how to use it to create game logic. At the end of this tutorial, you will have solid understanding of how the Flow Graph system works. You will learn the following: Flow Graph concepts The Flow Graph editor user interface including its panes and their usage How to navigate in the Flow Graph editor viewport Creating and using graph Modules and Tokens Step 1: Flow Graph core concepts Flow Graph is a visual scripting system which provides game developers access to create and edit game events and logic through the creation of a visually created graph of nodes. Graphs can be simple or complex, from driving gameplay logic to handling game menu navigation. Flow Graph allows designers and artists to change a game s performance without needing an engineer to write code. For example, using Flow Graph and Lumberyard s Game Mode, a small team of designers and artists can start prototyping game levels quickly, without writing any code or needing to compile their game project. Engineers can create new Flow Graph nodes, extending the functionality of the Flow Graph editor to give game designers access to game-specific events and functions. This empowers game teams to create whatever they dream of and then quickly iterate on those dreams. Step 2: User Interface walkthrough The Flow Graph editor is a node-based visual editor that can be accessed from the Lumberyard editor s main toolbar.
Flow Graph walkthrough 1. With Lumberyard opened, click on the Flow Graph button in the editor toolbar. 2. The Flow Graph editor will open with its own menu, toolbar and panels. 1) Canvas View pane: This is the main viewport, where most of the editing takes place. When a Flow Graph is selected, nodes can be added, deleted, moved, and linked here. 2) Component List pane: This is a library of all available nodes you can add to your Flow Graphs. 3) Flow Graph File Tree pane: A hierarchy of all the Flow Graphs in your project and current level.
4) Node Properties pane: A context sensitive pane displaying node properties based on the current selection in the viewport. 5) Search Results pane: Allows you to search for specific nodes in canvas view Navigating the viewport: 1. To navigate, click and hold anywhere in the viewport with the right mouse button and move the mouse. 2. You can also use the viewport s scrollbars to pan around the view. 3. Use the mouse wheel to zoom in and out. Selecting Nodes in the Viewport: 1. Nodes can be selected by clicking on them with the left mouse button and deselected by clicking on empty space in the viewport. Multiple nodes can be selected by clicking and holding with the left mouse button and dragging a marquee box around the nodes that you want to select. 2. If a node has an assigned entity, which can be an entity in your game level, then double-clicking on the node will select that assigned entity in the level.
Using Right-Click Menus in the Viewport 1. When you right-click in empty graph space in the viewport, a context menu will be displayed offering options like creating a new node, copy, paste, grouping and others. 2. Right-clicking on top of a node in the graph displays a context menu that offers options specific to that node, such as rename and others related to the node s input and output channels. Using the Components pane 1. Flow Graph s Components pane contains a list of nodes. Each node contains information about objects in the level or functions to call when activated through the script. Flow Graph nodes can be pulled from two places: from an entity object currently in the Perspective Viewport, or from the list of components in the Flow Graph s Components pane. In this tutorial, you will be pulling nodes from the Components pane list.
2. At the top of the Components pane is a search bar allowing you to search for nodes by name. 3. To create a new node, simply drag it from the Component pane into the viewport and a new instance of that node will be added to your graph. The Flow Graph File Tree pane This pane is where you will access and open Flow Graph files. 1. Level Flow Graphs: A list of Flow Graph files created in the currently opened level. 2. Global Flow Graphs: A list of Flow Graph files specific to your project which are shared and accessible across multiple level files.
The Input pane This pane allows you to edit properties on the currently selected node and includes a description field, which explains what the node is used for. The Search & Search Results panes 1. Type a string into the Find what field in the Search pane, then press the Find All button. Search results will be displayed in the Search Results pane. 2. Double-click on a search result item to select that node in the graph. Step 3: Get to know the Flow Graph Module system A Flow Graph module is like a mini Flow Graph that can be used in other normal Flow Graphs. This is useful for instances where you need to use the same logic multiple times. For example, if your game logic calls for performing a math operation that is always the same, but would normally take 10 nodes to construct, you can write that logic once into a single module, allowing changes to be made more efficiently. There are two supported module types: Global modules, which once created are accessible to any Flow Graph file created in your game project, and Level modules, which are only accessible to the Flow Graph files within the currently opened level.
To Create a Flow Graph module 1. In Flow Graph Editor, click on File, New FG Module, Level to create a level Flow Graph module 2. A Save As dialog will appear asking you to create a filename for the new graph module. Give it a name and click on the Save button. 3. Locate a created module. The module has start and end nodes by default. To see an example of a module, take a look at the Character_Controller_Robot global module which is included with the Sample Project. To create input / output for the modules 1. Select the module for which you would like to add input / output.
2. Go to Tools > Edit Module. 3. Click New Input, type in a name, and select Input Type to create a new Input.
Use the same method to create outputs. 4. Check My_First_Module from the Graph pane. You can see input and output are created and applied. 5. To edit created inputs / outputs, you can also select Tools > Edit Module and Click Edit Input/Output.
6. Take Global Flow Graph Modules > Character_Controller_Robot as an example: You can see the inputs it uses in the Start_Character_Controller_Robot module node. The module logic uses nodes to convert player input into physics impulses that control the robot character.
To call a Module You can call a level or a global module from Flow Graph components. 1. Right click on the main pane to access the context menu: Add Node > Module. You can see Call_<Global module> and Call<Level_module> on the list. 2. You can also locate modules from the Components Pane > NodeClass > Module > and then select the module you want to call and drag it on the main pane. Step 4: Creating and using a Graph Token A Graph Token is a single variable which can be created and used in a level s Flow Graph. A Graph Token is only visible and accessible to the graph it was created in. The token s variable type can be either a boolean, integer, float, entity ID, Vector 3 or a string. For example, using a Graph Token you can create a single global mission variable that can be accessed and modified by almost any node in any Flow Graph. To create a Graph Token 1. In Flow Graph Editor, click on Tools, Edit Graph Token
2. In the dialog that appears, click on the New Token button. 3. Type in a name for your token, set the desired variable type, and then click on the OK button. To use a Graph Token Graph tokens are most commonly used by the Mission Game Token nodes which offer operations like getting, setting, or verifying game token values. 1. Create a Game:Start node 2. Create a Mission:GameTokenSet node 3. Connect the output of the Game:Start node into the Activate of the Mission:GameTokenSet node. 4. Double-click on the Token input of the Mission:GameTokenSet node and type in the name of the Graph Token you wish to set. 5. Double-click on the TokenValue input of the Mission:GameTokenSet node and type in a new value for the token. Using the Mission:GameTokenSet node as described above allows the graph to set the value of the Graph Token to any value at any point within the graph.
Congratulations! You now know the features Flow Graph offers and how to build game logic with the Flow Graph editor. Related tasks and tutorials Now that you have a basic understanding of Flow Graph and its user interface, continue on with the rest of this tutorial series which include the following: Adding triggers and volumes Using movers Camera basics Input controls and debug We d love to hear from you! Head to our Tutorial Discussion forum to share any feedback you have, including what you do or don t like about our tutorials or new content you d like to see in the near future.