Panels
Last updated
Last updated
The Chapters panel features the story tree, where Chapters can be organized, named, and grouped. Chapters can be linked either one-to-one or one-to-many, and each Chapter contains its own unique Map scene. User decisions within a Chapter trigger transitions between Chapters or Books. Creators define these relationships within the Chapter tab, and movement between Chapters is only possible when they are linked in the Chapter view.
To remove a connection between Chapters, simply click on the connection string and drag it to the right to release the link.
Chapters can be easily modified within the Behaviors panel, with the current Chapter name displayed at the top left to indicate which one is being edited.
The behavior tree defines the flow between Chapters and manages Spark Behavior within Maps, responding to user interactions with Sparks both within and across Chapters. Bonfire supports both linear and non-linear branching paths, enabling creators to craft a wide range of interactive and dynamic experiences.
The Behavior Panel can be expanded horizontally to expose more of the screen by placing your cursor on the right edge of the panel to reveal an enhanced arrow resize cursor.
The Toggle Behavior Execution button, also known as the Freeze button, allows enabling or disabling the execution of behavior nodes without entering play mode.
When active, a diagonal blue line appears across the background of the entire application, indicating that Debug Modifiers (in Edit Mode) and connected nodes will not execute. This signifies that the system is in a frozen state.
When inactive, it is possible to trigger Debug Modifiers and execute connected nodes in Edit Mode.
This feature is useful for performing isolated testing without starting the Chapter. However, it is important to note that any changes made during edit mode, such as repositioning in the unfreeze state, will not revert to their original state.
Copy is found on the left side of the Behavior panel. This function creates a duplicate of a behavior node preserving their properties, behaviors, and settings. The copied node can then be modified independently of the original, allowing for rapid iteration and reuse without affecting the original node. This function is commonly used for level design, asset placement, or creating variations of existing elements.
Paste is found on the left side of the Behavior panel. This function is used to place or apply a previously copied node into a specific location or context, retaining the original's properties, settings, and behaviors. The pasted node can be placed at a new position or within a different hierarchy, enabling efficient asset reuse and modification without needing to recreate the object from scratch.
Zoom to Fit is found on the right hand side of the Behavior panel. In advanced experiences, the number and complexity of nodes can quickly grow, making organization and space management critical. Zooming in, out, and grouping nodes becomes essential for keeping the workspace clear and easy to navigate. The Zoom to Fit function simplifies this by automatically adjusting the viewport to display the selected node(s) or the entire graph within the visible area.
This feature is particularly helpful when working with large or intricate node structures, allowing you to instantly refocus on specific nodes or get a clear overview of the entire behavior tree, ensuring you never lose track of your work.
Found at the bottom left of the Behavior panel, grouping enables creators to organize multiple nodes into a single, labeled group, streamlining complex graphs and enhancing readability. While grouping nodes doesn't alter their functionality, it significantly improves the ability to manage and navigate nodes, especially in larger and more intricate projects. This organizational tool helps reduce visual clutter, making the development process more efficient and easier to understand.
Found at the bottom left of the Behavior panel, grouping, ungrouping separates a previously grouped set of behavior nodes, returning them to their individual, ungrouped state. Once ungrouped, each node can be manipulated independently, giving you full control over individual adjustments and modifications. This process restores the nodes to their original layout while preserving their functionality, allowing for more precise editing and flexibility.
Found at the bottom left of the Behavior panel, Comments can be added within the behavior tree as labels, descriptions, tasks, or resource notes to provide context, explanation, or clarification. They help creators and collaborators understand the purpose and functionality of specific behavior nodes, making it easier to navigate, maintain, and modify complex projects. By offering clear insights into how and why certain behaviors are structured, comments improve both the workflow and long-term management of the behavior tree.
Sub Graph is found at the bottom left of the Behavior panel. A subgraph is a feature in the Behavior panel designed to encapsulate a group of nodes. This is particularly useful for managing large numbers of nodes, which can become difficult to track. A subgraph organizes these nodes into a single unit for easier management and navigation.
Customization: Sub graphs can expose parameters (inputs and outputs) that allow customization of how they function when used in different contexts. For example, you might create a sub graph that blends colors in a specific way, but allow the colors and blending factors to be customized each time the sub graph is used.
Improved Readability and Organization: By abstracting complex logic into sub graphs, you can keep your main node graph cleaner and more understandable, reducing clutter.
Optimization: Sub graphs can also contribute to performance improvements by reducing redundancy, as calculations or operations only need to be defined once and reused.
Imagine you are creating a shader for different materials that require a custom lighting effect. Instead of duplicating the same nodes to calculate lighting across multiple shaders, you can create a sub graph for that lighting calculation. Then, each shader can use the sub graph, making updates easier to manage and saving time by not having to recreate the logic.
Click the Subgraph button located below the Behavior panel.
Assign a name to the new subgraph.
Once the subgraph is created, click the Open button to enter the subgraph and start adding new nodes within it.
To automatically add nodes to a subgraph:
Highlight the desired nodes.
Click the Subgraph button. The selected nodes will be automatically included in the newly created subgraph.
This is the primary work area where experiences are visualized. This is a top-down view of the experience where Sparks can be selected, moved, and modified.
Snap Mode constrains the movement of sparks to âsnapâ between positions on the Map that are defined by the parameters defined in the two subsequent fields. The first field impacts movement in meters along the x/y grid. The second field impacts rotation by degrees.
This function allows a creator to place a Spark exactly on top of the next lower plane. This precision eliminates the placement effort that would otherwise be required for objects to be placed on surfaces without them âclippingâ below the lower plane or hovering above the lower plane. The Drop function is generally useful to quickly assemble Sparks in logical relationships with each other as in creating a kitchen environment with food sitting on the table surface.
The X-ray function toggles on/off and scales up and down vertically using the left/right slider. It allows creators to âlook through obscuring layersâ within a Map. It can be turned on to remove the roof of a building to see players inside or in this instance, to slice through Spark characters.
The Zoom to Selected function allows creators to select Sparks and then zoom in or out to fill the Map view with those selected items. It allows creators to move immediately to a scale where precise Spark adjustments can be made.
The Map Explorer is a 3D view of the experience. Sparks can still be selected in this panel but cannot be moved, rotated, or scaled. This view doesnât include the green bounding boxes that indicate a selection.
This feature turns on and off the collision and obstruction characteristics of objects with mass. If turned on, movement of Sparks into the space of other Sparks will create Tur
When creators "turn on physics" in a 3D game engine, they enable the simulation of real-world physical behaviors, allowing objects within their game environment to react in a more natural and realistic manner. This can include simulating gravity, collisions, friction, and forces, affecting how game elements move, interact, and respond to external inputs.
Hereâs what happens when physics is activated:
Gravity Simulation: Objects that are not fixed will fall or move according to gravity, just like they would in the real world. This means if creators place an object in the air, it will drop until it hits another surface.
Collisions: When physics is on, objects will detect when they come into contact with one another. Instead of passing through each other, they will stop, bounce, or slide based on their material properties (e.g., rubber, wood, metal).
Object Movement: Characters or objects influenced by forces such as a playerâs input, wind, or explosions will move realistically, following the laws of inertia, momentum, and acceleration.
Realistic Interactions: Complex interactions between objects become possible. For example, a ball can roll down a slope, push another object, or break when it hits a hard surface if set up correctly.
Activating physics brings life-like dynamics to the Map scene, enhancing immersion for players and improving interactive gameplay. However, keep in mind that turning on physics can also increase the computational load, so optimization may be necessary for larger scenes or games with many dynamic objects.
When in 1st person view, the camera is positioned as if the player is seeing the game world through the eyes of the character. The player's perspective is limited to what the character can see directly, creating an interactive experience that allows for greater focus on fine details, such as aiming, exploration, and interactions. This view is commonly used in games where precision and personal involvement are important, such as navigating, puzzle-solving, or exploration games.
Key characteristics of 1st person view:
Direct, immersive perspective
Restricted field of view to what the character sees
Greater precision for aiming and interacting with objects
Heightened sense of personal involvement
In 3rd person view, the camera is positioned behind and slightly above the character, allowing the player to see the character's entire body as well as a broader area of the surrounding environment. This view is useful in games that emphasize character movement, positioning, and environmental awareness, such as adventure, action, and platforming games. The ability to see more of the environment makes it easier to navigate obstacles, engage in combat, or solve puzzles from a wider perspective.
Key characteristics of 3rd person view:
Wider field of view showing the character and surroundings
Greater situational awareness
Easier to control and observe character movement
Useful for action-oriented or exploration gameplay
Switching between 1st and 3rd person views allows the player to dynamically adjust their experience based on gameplay needs or personal preference. For example, a player might switch to 1st person for precise navigation and then switch to 3rd person for better control during platforming or combat. This flexibility enhances gameplay by giving players the best of both perspectives, depending on the situation.
This function returns the Chapter that it was in before you entered Play Mode. It clears the âstoredâ actions (e.g. grabbing, moving objects, scores, behaviors) that were done during Play Mode.
Restart, Start, Stop and Reset options give creators fine tuned controls in Game Play mode to move through the sequence of actions that might happen within a scene.
The User Interface (UI) Editor Panel allows a creator to add UI elements like signs, menus, status, health, or other helpful information to the experience.
Use the Traits panel to view and edit Spark properties. What creators can see and edit in the Traits panel depends on the Spark that creators have selected. If a Spark is not selected, this panel will be blank.
The Notes panel provides a dedicated space for creators to manage their notes within a Book. It allows them to write new notes, edit existing ones, and delete notes as needed. This panel is useful for organizing thoughts, documenting progress, or adding contextual information related to the Chapterâs content. All notes are saved and accessible within the Book for easy reference and modification.
The Settings panel allows creators to save or load customizations made to a creatorâs layout. Creators can customize the layout by clicking and dragging the tab of any panel and dropping it in the tab area of any existing panel. This will place the tabs side by side. Alternatively, dropping a tab in any dock zone will create a new panel. If creators want to return the layout to Bonfireâs default layout, they can select the 'Reset Layout To Default' option.
To change the size of the Bonfire UI, adjust the UI Scale to make the UI larger or smaller. All changes made in the Settings panel will be saved and applied when creators restart Bonfire.
The Spark Browser displays all the Sparks available to creators. This is the primary way that creators can find and use Sparks. Sparks are added to the Spark Browser panel by importing Spark Libraries from the Bonfire Assets screen or by importing or creating Sparks in a special directory called 'My Sparks.'
The search input box allows for searching Sparks by name. Note that the search range is limited to the current folder level. If a Spark cannot be found, try navigating up one folder level or return to the root folder.
Folder names are clickable, enabling navigation and movement back up through folder levels by selecting the folder names.
The Downloads Folder in Bonfireâs Spark Browser stores Sparks downloaded from external sources, such as shared libraries or user-generated content. When creators download a Sparkâwhether it's an interactive component, a 3D model, or a logic elementâfrom Bonfireâs library or via a shared code, it is saved to this folder for future use in their projects.
The main purpose of the Downloads Folder is to help organize and provide quick access to Sparks imported into Bonfire Builder. This allows creators to easily reuse Sparks across multiple projects without needing to re-download them, streamlining the workflow by keeping all externally sourced assets in one place.
This tutorial will walk creators through importing individual spark files into Bonfire.
In the Spark Browser, navigate to the 'My Sparks' directory.
Navigate to the desired Spark (.dimxs file extension). After selecting the file, Bonfire will load the Spark into the 'My Sparks'' folder.
Creators can link to an external folder containing various types of Sparks. This allows for access to Sparks without having to import them directly into the Book. It helps manage large files, makes it easier to share Sparks across different Books, and reduces the overall Book size.
In the Spark Browser, navigate to the âMy Sparksâ directory.
After selecting the new folder, the External Directory folder will appear in the Spark Browser under âMy Sparksâ.
The Map Browser displays all the Maps available to creators. It is the primary way creators can see virtual maps. Maps are added to the Map Browser panel by importing Spark Libraries from the Bonfire Assets screen or by importing or creating Maps in a special directory called 'My Maps.'
The Console panel displays errors, warnings, and messages that Bonfire generates. It also allows creators to search for messages. The search looks for an exact match of the text entered in the search textbox. Creators can filter messages by type (e.g., Errors, Warnings, Messages), clear all messages, and collapse messages to remove duplicates.
The Configs panel includes a special type of Spark that enables experience changes. This Spark doesnât occupy 2D/3D virtual space, but it impacts the overall experience. These Sparks include a Countdown timer, an Inventory counter of items collected, a Modifier, and more. The Respawn Spark is a Configuration Spark that events can trigger.
The Entities panel displays all the Sparks currently in use within the Chapter, providing an alternative way for creators to locate Sparks by their names.
The Symbols panel shows all the Symbols or UI widgets currently used within the Chapter, offering an alternative method for creators to locate UI elements by name.
Toggling this function switches between 1st and 3rd person views.
The refresh icon is used to rebuild the index if a Spark is not loading correctly. Avoid switching tabs while the index is rebuilding. Use this function with caution.
Once in the 'My Sparks' directory, click on the icon.
After clicking the icon, choose whether to create or import a Spark. From this panel, click on the 'Import' button to begin importing a custom Spark.
Once in the âMy Sparksâ directory, click on the icon.
After clicking on the icon, creators will have the option to create a new folder or select an existing folder to link to the Spark Browser.
