Connectors are a special type of Helper node, designed to be used only for the purpose of defining connection points between Models.

If the configuration requires users to be able to connect Models together, in designated spots, then Connectors can be used to define these specific connection spots.


One example of this is the case of modular sofa configurators, where arms and seat components can be attached together to form different shapes.



This is an example of a dental kit, where different dental burs can be chosen to populate a specific kit box. The user could drag them around to choose their specific location in the kit.











Lastly, the following image is an example of a shelving system, where users can choose how to configure the contents of the different shelf columns:



The Connector node is composed primarily of a transform (a way to specify its location, rotation, and scale) and a special set of properties that allows connectors to communicate with each other. The only method of defining how a connector is compatible with other connectors is through the use of Node Tags. It is important, therefore, to add at least one Node Tag to each of your connectors.

Currently, the Connectors are primarily useful in conjunction with a Layout Container setup. This is because the Layout Container is the only method currently available that allows the end user to select and move objects around. Snapping of objects together at connection points can only occur if the user can select and move an object.


Creating and Importing

Connectors are created through the UI, with the option found on the 3D Editor Toolbar under Create Helper->Connector.




To import Connectors from a 3D file, the ThreeKit platform looks for nodes that have the TK_CONNECTOR_ prefix as part of the node name. For example, TK_CONNECTOR_MyConnector will import in ThreeKit as a Connector node named MyConnector. Users can create these nodes in their favorite 3D software as either NULLs/Empty Groups, Dummies, or Locators. Meshes with the TK_CONNECTOR_ prefix will not be converted to Connectors on import. The asset can then be exported using a format like FBX, as it supports these types of NULL/Group nodes.


The following two screenshots show the setup inside Autodesk Maya and what the imported FBX file looks like inside ThreeKit, once the FBX was imported as a Model asset.




Exporting the Model Asset back to FBX will also generate Nulls/Empty Groups for the Connectors inside the exported FBX file, with the TK_CONNECTOR_ prefix added to the name.

IMPORTANT: Connectors are designed to be used primarily as part of Model Assets. When created inside the Model Asset, the Connector will affect the entire contents of that Asset. This means that when the user ends up selecting and moving the referenced Model inside another a scene or another Model through the use of Layout Containers, the Connectors included inside the Model will snap to other connectors by moving the entire referenced Model - See the Usage example below.




Connect to

This is where we can specify what other types of connectors this particular Connector node is compatible with.

The entry box allows us to specify Node Tags. This can be done either by typing in a Node Tag preceded by the # symbol - eg #MyNodeTag, or by selecting existing Node Tags from the dropdown list.

Note: Currently, this dropdown box will only display NodeTags from the current asset. You can still make use of Node Tags from other assets by typing in their name instead.

Match all axes

This checkbox option allows the connector to match to other connectors along either all three axes - X, Y, Z, or only along the X and Y axes. In other words, the two connectors would need to either match only along the Black Cone in the gizmo icon, or both the black cone and the black arrow.

With the option checked OFF (default): The connection rotation is restricted to just the X and Y axis. The Connector viewport icon will also change to only show the connector circle without the arrow. This is going to be the most useful setting for the majority of situations. This configurator could also provide an additional UI for rotating the movable components in different orientations after the connection has been made. An example of this would be arranging furniture in a room. The user would be able to move a coffee table to different preset locations designated with connectors, and then allow the user to rotate it however they desire at that location.

With the option checked ON: The connection rotation is restricted to all three axes. The Connector icon in the viewport will also change to add a little arrow that confirms this change. This option is useful in case the object that this Connector belongs to should only be snapped to other connectors in a specific orientation. An example of this would be something like rings sliding on a cable.

IMPORTANT: Connectors will only snap to other connectors that match the Connect to Node Tags as well as the Axis requirements. If one of the two connectors has the Match All Axes = OFF, and the other has 

Match All Axes = ON, they will NOT connect.

Max Snapping Angle

This option allows the Connector to know at what angle it can start snapping with other Connectors.



The angle is calculated from the transform pivot of the Connector outwards along the Z axis, and it ranges between 0 and 90 degrees.

Default value of 30 degrees.

Snapping Distance

This property is located under the Player Settings section of the Org Settings. It allows the user to set the Snapping distance for all Connectors used by assets in that Org.

The snapping distance is represented as screen pixels, ranging from 0 to 500px. The effect will thus feel different depending on the camera zoom level. As the user zooms in, the on-screen snapping distance will remain the same, and will therefore allow for more accurate control.

The default value is 50px.





ChessboardOptimized.gifLet’s take a look at a simple example of a chess board with a Pawn and a Knight.








In order to allow the user to place various chess pieces on the board, we would need the following assets:

  • A Scene Asset
  • A Chess Board Model asset
  • A White Pawn Model asset
  • A Black Knight Model asset

Inside the Scene Asset we would need to create the Layout Container, and Model Reference nodes for the Chess Board, Pawn, and Knight models.
The Chess Board would need to be listed as the Target Surface for the Layout Container, while the Pawn and Knight nodes would need to be listed as the children.



Inside the Chess Board Model asset, we would need to create Connector Nodes for every square on the board, where the pieces can snap. These connectors could be tagged with the Node Tag #BoardConnector, and we could leave their Connect to target as blank since the user would never drag them around to snap to other pieces.



Inside the Pawn and Knight Models, we would need to add a Connector node, which needs to be tagged with the tag #PieceConnector. The Connect to target for this node would then be the #BoardConnector. This ensures that chess pieces would not snap to each other.


Share this