Hex Skill Tree Designer

Create and edit scalable hex-based skill trees directly inside Roblox Studio.

1 / 3

Hex Skill Tree Designer enlarged screenshot 1 of 3
1 / 3

About

Hex Skill Tree Designer is a Roblox Studio plugin for building structured skill-tree layouts with an interactive node editor. Place, connect and manage nodes on a scalable hex grid, then use built-in navigation and layout controls to keep complex trees organised.

Hex Skill Tree Designer provides a visual workspace for planning and maintaining hex-based progression trees without manually positioning every interface component. It is designed for developers who want a repeatable layout process inside Roblox Studio.

Editor controls

The top toolbar keeps the main editing actions close together. You can create or delete a tree, center the complete layout, center the currently selected node, fit the tree to the available view and toggle node names or connection lines.

The editor supports smooth panning and zooming, which makes it easier to work with trees that extend beyond the initial viewport. The plugin remembers component positions and includes a recovery tool that restores missing or displaced components to their intended locations.

Layout settings

Node size and spacing can be adjusted independently. Horizontal and vertical values give you control over how compact or open the finished tree appears. Visual toggles let you show or hide node names, connection lines and the grid while editing.

For faster starting layouts, the plugin includes 3 by 3 and 5 by 5 honeycomb presets. These provide a structured base that can be adjusted for the needs of your game.

Suggested workflow

  1. Install the plugin from the official Roblox Creator Store listing.
  2. Open the plugin in Roblox Studio and create a new tree.
  3. Choose a preset or begin arranging nodes manually.
  4. Adjust node size and spacing for the intended interface scale.
  5. Connect nodes to represent progression requirements.
  6. Toggle labels, links and the grid while reviewing the layout.
  7. Use the centering or zoom-to-fit controls to inspect the complete tree.

Purchase and delivery are handled through the official Roblox Creator Store listing linked on this page.

Included

  • Interactive hex-grid skill-tree editor
  • Create, delete and arrange skill-tree nodes
  • Connect and disconnect nodes to define progression paths
  • Smooth panning, scrolling and zoom controls
  • Center the complete tree or the selected node
  • Zoom-to-fit for quickly framing the full layout
  • Toggle node names, connection lines and the editor grid
  • Independent node-size and horizontal or vertical spacing controls
  • Built-in 3 by 3 and 5 by 5 honeycomb layout presets
  • Position memory with a tool for restoring missing or displaced components

Requirements

  • Roblox Studio
  • The Hex Skill Tree Designer plugin installed from the Creator Store
  • A project that uses or plans to use a node-based progression system

Versions

ReleasedJun 20, 20264 changes
  • Initial release of Hex Skill Tree Designer.
  • Included the interactive hex-grid node editor and connection tools.
  • Included pan, zoom, centering and zoom-to-fit navigation.
  • Added layout controls, honeycomb presets and component recovery tools.

Use is subject to the Astro Product Licence. Redistribution or resale of the source files is not allowed.