Процессы и потоки
Диаграмма состояний онлайн
«Состояния» показывают, через какие статусы проходит объект и какие события переводят его из одного в другой. Это конечный автомат в читаемом виде: заказ, подписка, тикет, сетевое соединение.
Когда использовать
- Жизненный цикл заказа или платежа
- Статусная модель тикета в поддержке
- Состояния протокола или соединения
- Карта фаз процесса с ожиданиями и итогами
Как с ней работать в Dele
- Узлы — состояния: обычное состояние (скруглённый прямоугольник), начало (закрашенная точка), конец (кольцо с точкой). Начало и конец обычно без подписи.
- Переход подписывайте как «событие [условие] / действие», коротко. Переход в то же состояние рисуется петлёй.
- Бюджет: до 9 состояний и 10 переходов. Если переходов больше, чем вдвое больше состояний, разбейте автомат.
- Правило «из любого состояния» пишите в заметку (note), например «* → Ошибка по таймауту», а не множеством стрелок.
- Акцент — либо на ошибочном состоянии, либо на успешном завершении, не на обоих.
- Для карты фаз задайте полосу (band): основные фазы (4–5), ожидания (до 2, переходы пунктиром) и итоги (до 2, отмена и сбой — разные состояния).
Три способа собрать диаграмму
Словами. Откройте ИИ-ассистента в редакторе или подключите своего агента по MCP и опишите задачу, например:
«Нарисуй диаграмму состояний заказа: создан, оплачен, собран, отправлен, доставлен, а также отменён и возврат. Выдели доставку как успешный итог.»
В редакторе. Создайте диаграмму из шаблона «Состояния», меняйте элементы на холсте и в панели справа — раскладка пересчитывается сама.
Кодом. Диаграмма — это JSON-спецификация. Её можно править в панели «Спецификация», генерировать скриптом и хранить в git.
Спецификация примера (JSON)
{
"type": "state",
"title": "Жизненный цикл заказа",
"description": "Диаграмма состояний: заказ проходит путь от оформления через оплату, сборку и отправку до доставки, с повтором оплаты и отдельными исходами «отменён» и «сбой».",
"direction": "LR",
"nodes": [
{
"id": "start",
"kind": "start",
"band": "main"
},
{
"id": "placed",
"label": "Оформлен",
"band": "main"
},
{
"id": "paid",
"label": "Оплачен",
"band": "main"
},
{
"id": "packed",
"label": "Собран",
"band": "main"
},
{
"id": "shipped",
"label": "Отправлен",
"band": "main"
},
{
"id": "delivered",
"label": "Доставлен",
"band": "main",
"focal": true
},
{
"id": "retry",
"label": "Повтор оплаты",
"sublabel": "≤ 3 попыток",
"band": "wait"
},
{
"id": "cancelled",
"label": "Отменён",
"band": "terminal"
},
{
"id": "failed",
"label": "Сбой",
"band": "terminal"
}
],
"edges": [
{
"from": "start",
"to": "placed"
},
{
"from": "placed",
"to": "paid",
"label": "оплата [ок]"
},
{
"from": "placed",
"to": "retry",
"label": "оплата [отказ]",
"dashed": true
},
{
"from": "retry",
"to": "paid",
"label": "повтор ок",
"dashed": true
},
{
"from": "paid",
"to": "packed",
"label": "сборка"
},
{
"from": "packed",
"to": "shipped",
"label": "отгрузка"
},
{
"from": "shipped",
"to": "delivered",
"label": "получение",
"style": "accent"
},
{
"from": "placed",
"to": "cancelled",
"label": "отмена"
},
{
"from": "retry",
"to": "failed",
"label": "3-й отказ"
}
],
"note": "* → Отменён по запросу клиента до отгрузки"
}Когда выбрать другой формат
- Логика решений без устойчивых статусов → Блок-схема
- Обмен сообщениями между участниками во времени → Последовательность
- Работа на доске по колонкам статусов → Канбан-доска
Вопросы о формате
Как показать переход из любого состояния?
Одной строкой в заметке, например «* → Ошибка по таймауту». Так схема не обрастает десятком одинаковых стрелок.
Сколько состояний помещается на диаграмме?
До 9 состояний и 10 переходов. Если больше — автомат стоит разбить на несколько.
Это UML-диаграмма состояний?
Да, по смыслу это диаграмма состояний UML: начальное и конечное псевдосостояния, переходы с событием, условием и действием.