# 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.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.helmut.cloud/high5/stream-designer-studio/ui-overview.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.