> For the complete documentation index, see [llms.txt](https://docs.helmut.cloud/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.helmut.cloud/high5/stream-designer-studio/ui-overview.md).

# UI overview

The Stream Designer Studio is the visual workspace where you create, edit, and manage streams. It provides a graphical interface to design workflows by connecting nodes, configuring logic, and controlling execution behavior.

The interface consists of the following main areas:

<figure><img src="/files/UCwHKQSxQcgfLiQSV6nd" alt=""><figcaption></figcaption></figure>

### 1. Canvas (Workspace)

The canvas is the central area where streams are visually designed.

On the canvas, you can:

* Add nodes to define workflow steps
* Connect nodes to control execution flow
* Arrange and organize nodes
* View the overall structure of the stream

Each node represents a specific action or function. Connections between nodes define how data and execution move through the stream.

### 2. Node Connectors

Each node contains connectors that define execution paths:

* **Input connector** – receives execution from a previous node
* **Success connector** – defines the path when execution succeeds
* **Fail connector** – defines the path when execution fails
* **Global fail connector** – handles global failure scenarios

You can create connections by dragging from one connector to another.

### 3. Left Sidebar – Node and Tools Panel

The left sidebar contains tools and node management options:

**Nodes:** Displays available nodes that can be added to the stream.

**Wildcards:** Provides reusable dynamic variables or wildcard values.

**Custom Nodes:** Displays user-created or custom nodes available for use.

**Undo:** Reverts the last action performed on the canvas.

**Snapshot:** Allows you to create or restore a snapshot of the stream state.

**Search:** Helps locate specific nodes or components.

**Shortcuts:** Displays available keyboard shortcuts.

**Settings:** Provides configuration options for the Stream Designer Studio.

### 4. Top Toolbar – Stream Controls

The top toolbar provides controls for managing and executing the stream.

Available actions include:

* Save the stream
* Deploy or publish the stream
* Refresh the stream state
* Export or capture stream data
* Execute (run) the stream manually

These controls allow you to manage the lifecycle of the stream.

### 5. Agent Status Indicator

The top-right corner displays the agent connection status.

Example:\
**No Agent connected**

This indicates that no execution agent is currently connected. An agent must be connected for the stream to run.
