[Outdated] BTrees Visual Editor v2.0

This is outdated. The upgraded and maintained version is here

BTreesLogo

UI assets by @bizbot19

Intro

For my projects, I’ve gotten comfortable using Behavior Trees for game AI agents, and even some behavior for things like UI.

However, I disliked having to scroll through large amounts of behavior tree code/objects because I’m more of a visual person and it got hard to manage and remember how things worked - especially with larger trees.

I needed something to speed up my workflow and make trees easier with less headache - and so I made BTrees!

I released it for free because I’m sure I won’t be the only one to find use from it.

BTrees is a visual node based editor that allows you to create Behavior Trees just as you would normally, but in a node based environment.

Here’s an example of a Tree I made for my wild west project.

and this is a (tiny) snippet of what it looked like before, just written out in code :woozy_face:

The actual functionality is the same. I use @oniich_n’s BehaviorTree2 module that I helped write.

See here. BehaviorTree2 - Create complex behaviors with ease!

All my plugin is designed to do is act as a visual layer so you don’t have to write quite as much.

What are Behavior Trees?

Behavior trees are a popular plan execution model used in a lot of modern games.
This is a great article that explains how to use them.

And this is a great excerpt from that blog which helps explain why they’re so useful

The trees can be extremely deep, with nodes calling sub-trees which perform particular functions, allowing for the developer to create libraries of behaviours that can be chained together to provide very convincing AI behaviour. Development is highly iterable, where you can start by forming a basic behaviour, then create new branches to deal with alternate methods of achieving goals, with branches ordered by their desirability, allowing for the AI to have fallback tactics should a particular behaviour fail. This is where they really shine.

How do I use it?

To create a new tree, simply click the create button on your plugin toolbar.
image

This will create the BehaviorTrees folder under ReplicatedStorage if none exists, as well as open a new blank tree.

Deselect a tree folder to stop editing the tree, or select one to start editing it.

https://gyazo.com/3c35f0fa2699c10c0e3230d12e0f878b.gif

Hold LMB down on the editor’s background to pan the editor, and mouse wheel to zoom

https://gyazo.com/4e6f0e831040927137004623760a9359.gif

You can read the ReadMe for the full rundown of the plugin

Here are some basics on how to use a tree you’ve made

Here’s an example tree made in the editor.

Tasks can be edited by clicking on the task node’s edit icon. This is a modified template example for “WalkToDoor”

Finally, when you’re done with your tree, you can simply create it with the specified object you want to use(obj parameter in tasks), and then run it as you normally would!

Bugs

I’m going to be honest - I’m not much of a plugin developer. I made this out of necessity and to help, not because I enjoy making plugins. As a result there may be issues you run into - if you do let me know here on the forums or on discord(tyridge77#5390) and I’ll resolve them as quickly as I can

Feel free to share your creations! I’m excited to see what people make with this!

204 Likes

This looks really nicely designed and I’ve been looking for a simple and more importantly visual solution to implement into my hostile/NPC system for a while. Cheers for the plugin, will definitely be using this and will give an honest review after use!

10 Likes

Can confirm that this plugin is absolutely insane. Been using it the past couple days to reorganize and further expand upon my already created nodes and trees.

10 Likes

Dang! That’s an awesome looking plugin - I applaud your UI work.

While I don’t use these kinds of trees all the time, I think I’ll have to bookmark this for when I do. Nice work!

12 Likes

This is one of the awesome resources where I don’t care if I have a use case for it or not - I’m going to make a new game just so I can play around with this tree editor.

12 Likes

This is awesome!

Regarding the UI, here’s some things that would be cool to have:

  • Ability to snap to the grid (both for positioning and sizing; maybe while holding Shift?)
  • Ability to move all children nodes when a parent node is moved too
  • The label indicating the zoom level hides behind nodes (probably need to up the zindex)
  • Some other UI elements on the nodes and arrows overlap the main buttons in the top-left
  • The Help menu is too small

It would also be cool if the Random node would apply certain weights for each connected nodes. That way, you could control how likely one node might be chosen over another.

18 Likes

I think this is probably the most important of your suggestions. Being able to make one option rarer than the other is a pretty important mechanic in behaviour trees!

4 Likes

I haven’t made any custom nodes yet, just visual representations of what already exist in BehaviorTree2, but this shouldn’t be much work to implement

6 Likes

I may have missed it, but is there a way to delete outputs?

3 Likes

Hit the delete keybind(defaults to F), while hovering over a line.

4 Likes

Ah, thanks. I was trying that earlier to no avail, but after a studio reboot it functions. I’ll just assume something with my setup was being weird.

2 Likes

Did someone say Unreal Engine? :joy:, But congrats dude.

5 Likes

This is probably all out of place but since you made this you may could go for making the first visual programming solution for Roblox too.

I would love to look in the source code of the plugin to see of I can make it possible myself.

I think that this and such a solution could be a big help for all the youngsters on the platform that really are wanting to get into programming but for which its simply to daunting.

4 Likes

I’ve thought about it, but the work load is quite a bit larger

4 Likes

Gimme a sec, I’ll add that to the module right now.

4 Likes

Ok, so I’ve updated the module itself to include a weight attribute to task nodes. You should be able to manually add this into the code generated by this editor in the meanwhile since the editor doesn’t support it quite yet.

Thanks for the suggestion @Crazyman32

5 Likes

:smiley: This is really cool! I’ll use it when i’ll start being a builder on Roblox

2 Likes

Agreed, I honestly think Unreal Engine is easier to code than roblox due to it’s block code default (with C++ support).

3 Likes

This looks super good!
Would be nice if this could be used to create NPC dialogs though.

3 Likes

Okay so a few minor nitpicky things.

First of all, you’re really killing me with camelcase. Its CamelCase, not camelcase. T_T


And its not even consistent.
image

Second, you’re confusing me with task:bleh, these functions run at runtime yeah? You should be passing a delta time argument with each callback so you can use math that requires delta based time thingies on them. Currently you can’t do this unless you do something ugly like
DeltaTime = currenttick-lasttick
which is storing an unneeded variable that you have to manually update every time the tree updates.

Lastly, there needs to be a delete and enter code edit mode hotkey(s) for nodes. :v

5 Likes