Merge branch 'main' of https://huggingface.co/spaces/PiperMy/Academy

docs/creating-pipelines/connect-nodes.mdx

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 2
+sidebar_position: 3
 ---
 
 # Connecting Nodes
@@ -41,7 +41,7 @@ Each node has specific input and output types such as:
 
 - **Boolean**
 - **Integer**
-- **Float
+- **Float**
 - **String** or **String[]** (Array of strings)
 - **Image** or **Image[]** (Array of images)
 - **Archive**

docs/creating-pipelines/define-inputs-and-outputs.mdx

@@ -1,47 +1,192 @@
 ---
-sidebar_position: 3
+sidebar_position: 2
 ---
 
 # Define Inputs & Outputs
 
-Once your nodes are connected, the next step is to define where your pipeline starts (inputs) and ends (outputs).
+To make your pipeline interactive and user-friendly, you need to define **inputs** (what the user can control) and **outputs** (what the pipeline returns).
 
-## What are Inputs?
+Inputs and outputs are made available by **extracting them from specific nodes**. This makes them visible in the **Playground** (for user input) and **Results tab** (for viewing outputs).
 
-Inputs are the data your pipeline begins with.  
-For example:
+---
 
-- A **text prompt** 
-- An **image** uploaded by the user
-- A **number** or configuration value used in calculations
+## Extracting Inputs & Outputs
 
-To define an input:
+To expose an input or output:
 
-Here
+1. Hover over the desired node.
+2. Click the small **circle port** of the input or output you want to extract.
+3. Press the **"Take out"** button.
 
-Video
+Once extracted, the item will appear in the Playground interface (for inputs) or Results tab (for outputs).
+
+---
+
+## 1. Defining Inputs
+
+### Option A: Through the Playground
+
+After extracting inputs, they automatically appear in the **Playground** — a simple interface for providing data to your pipeline.
+
+Users can:
+
+- Enter values directly into the input fields
+- Run the pipeline using those values
+- View results instantly in the interface
+
+#### Setting Default Values
+
+You can define **default values** that will be shown in the Playground:
+
+1. Click on the **name** of an input field.
+2. This opens the **input editor**.
+3. Enter the default value — it will be pre-filled for users but can still be changed.
+
+#### Organizing Inputs
+
+To rearrange inputs for better clarity:
+
+- Click and hold the input field
+- Drag it using the **hand icon**
+
+:::tip
+Place inputs in a logical and visually clear layout to improve usability, especially in larger pipelines.
+:::
+
+You can extract inputs from **multiple nodes**, regardless of their order in the pipeline.
 
-## What are Outputs?
+---
+
+### Option B: Through the Node Editor (Workspace)
+
+You can also configure node inputs directly inside the node editor:
 
-Outputs are the final result produced by the pipeline.  
-For example:
+1. Hover over a node and click the **edit icon**.
+2. The editor displays all configurable inputs for that node.
 
-- A generated text
-- A generated or modified image
-- JSON data for use in another app
+Here you can:
 
-To define an output:
+- Set **default values** — used when the Playground input is empty
+- Enable or disable **auto-run** (toggle in the top-left corner)
 
-Here
+> If auto-run is enabled, the node executes when the pipeline starts.  
+> If disabled, it runs only after receiving data from another node.
+
+To test pipeline execution from the workspace, press the **Play** button in the top-left corner. The entire pipeline will run, and results will be shown inline.
 
 Video
 
-## Tips for Working with Inputs and Outputs
+---
+
+## 2. Defining Outputs
+
+To expose the final result of the pipeline:
+
+1. Click on the **output port** of the node.
+2. Press **"Take out"** — the output will now be visible in:
+   - The **Results** tab after execution
+   - The **Playground**, where results appear interactively
+
+You can extract outputs from **any node**, regardless of its position or execution order. This makes it easy to monitor intermediate values or final results.
+
+In the next section, we’ll look at how to **connect nodes** to pass data between them.
+
+
+---
+sidebar_position: 3
+---
+
+# Определение входов и выходов
+
+Чтобы пайплайна могла принимать данные от пользователя и возвращать результат, необходимо определить:
+
+- **Входы** — данные, которые можно подать извне (например, через Playground)
+- **Выходы** — результат выполнения пайплайны, который можно отобразить в интерфейсе
+
+Для этого необходимо **вынести** нужные входы и выходы из конкретных нод.
 
-- Use **clear names** for your input/output nodes to make the pipeline easy to understand.
-- You can have **multiple inputs and outputs** if your use case requires it.
-- Some nodes can act as both intermediate processors and final outputs — choose what makes the most sense for your flow.
+---
+
+## Как вынести входы и выходы
+
+Чтобы сделать вход или выход доступным:
+
+1. Наведите курсор на нужную ноду.
+2. Кликните на кружок рядом с нужным входом или выходом.
+3. Нажмите кнопку **"Take out"**.
+
+После этого:
+- **Вход** появится в интерфейсе **Playground**, где поль��ователь сможет ввести данные.
+- **Выход** отобразится во вкладке **Results** после выполнения пайплайны.
+
+---
+
+## 1. Определение входов
+
+### Способ A: Через Playground
+
+После того как входы были вынесены, они автоматически появляются в **Playground** — простом пользовательском интерфейсе для ввода данных.
 
-:::tip Tip
-Defining inputs and outputs makes your pipeline reusable and easier to integrate into other systems.
+Пользователь может:
+- Ввести данные вручную
+- Запустить пайплайну и получить результат
+
+#### Установка значений по умолчанию
+
+Можно настроить значения, которые будут подставляться по умолчанию:
+
+1. Нажмите на название входа.
+2. Откроется редактор входа.
+3. Введите нужное значение — оно автоматически подставится в интерфейс, но его можно будет изменить.
+
+#### Организация входов
+
+Для удобства чтения и аккуратного вида:
+
+- Зажмите поле входа и переместите его, используя значок **ладошки**
+
+:::tip
+Располагайте входы логично и визуально понятно, особенно если их много.
 :::
+
+Можно вынести входы из **нескольких нод**, независимо от порядка их выполнения.
+
+---
+
+### Способ B: Через редактор ноды (в рабочей области)
+
+Входы можно настраивать напрямую внутри ноды:
+
+1. Наведите курсор на ноду и нажмите **иконку редактирования**. 
+2. Откроется редактор ноды, в котором отображаются все доступные входы.
+
+Здесь можно:
+
+- Указать **значения по умолчанию**, которые будут использоваться, если пользователь ничего не ввёл
+- Включить или отключить **автозапуск ноды** (ползунок в левом верхнем углу)
+
+> Если автозапуск включён — нода будет запускаться автоматически при старте пайплайны.  
+> Если выключен — нода сработает только при получении данных из другой ноды.
+
+Чтобы проверить выполнение пайплайны из рабочей области, нажмите кнопку **Play** в верхнем левом углу.
+
+🎥 *[Здесь можно вставить видеоинструкцию]*
+
+---
+
+## 2. Определение выходов
+
+Чтобы результат работы ноды отобразился в интерфейсе:
+
+1. Нажмите на **кружок выхода** у нужной ноды.
+2. Нажмите **"Take out"** — после выполнения пайплайны этот результат появится:
+   - Во вкладке **Results**
+   - В интерфейсе **Playground**
+
+Выход можно вынести из **любой ноды**, вне зависимости от её расположения или порядка выполнения. Это удобно для отслеживания промежуточных результатов или финального вывода.
+
+---
+
+## Что дальше?
+
+Теперь, когда вы знаете, как управлять входами и выходами, давайте рассмотрим, как соединять ноды между собой и передавать данные по цепочке.