Search

Block Code UI Screen

The XROO block coding UI is composed of the following four key areas to help users code efficiently.

① Run Block Code

To start coding, click the Block Coding button on the toolbar at the top of the screen.
Once clicked, the block coding screen will appear and allow you to start writing code.

② Block List

On the left side of the block coding screen, you’ll find the Block List.
Blocks are categorized into tabs based on function, allowing users to select and add them to the coding note.
Categories include “Event,” “Action,” “Movement,” “Condition/Loop,” and more.
Click a category to expand and view its related blocks.
You can drag and drop blocks into the coding note.

Help

Click the Help button in the bottom-left corner of the screen to open the help menu.
While in help mode, clicking on any block will display a description of that block.

③ Coding Note

The center workspace is the Coding Note.
In this area, users assemble selected blocks and organize the sequence of actions.

Connecting Blocks

Begin with a start block, then drag in additional blocks to build your code.

Deleting Blocks

To remove a block, drag it to the trash area (bottom-right of the coding note) or outside the coding note.
You can also right-click a specific block to bring up the [Delete] option.
To delete all blocks, right-click anywhere and select [Delete All].

Input and Selection Options

For blocks that require values (e.g., number, text, color), you can type directly or select from a dropdown menu.

④ Preview and Save

You can preview and save the code you've built in a real 3D space.
Preview: Click the Preview button at the top-right corner of the screen to run and test the current block code setup.
Publish: Save the current block code and view it directly via a URL.