ДРАКОН — это визуальный язык для проектировании блок-схем. Наша команда использует его при работе над сценариями голосовых помощников.

Преимущества

ДРАКОН предлагает ряд правил, упрощающих восприятие блок-схем. Это особенно важно при вычитке сценариев и передаче их в разработку.

Также ДРАКОН отлично передает нелинейность разговорных сценариев, не перегружая схему дополнительными линиями.

Базовые правила

1. Время на схеме движется сверху вниз, а ветвление — слева направо.
2. Вместо стрелок используются обычные линии.
3. Пересечения запрещены.
4. Разрешены только прямые углы и линии.

Так выглядит простая ДРАКОН-схема с несколькими условиями:

Наиболее благоприятный путь сценария всегда отображается слева. Это называется царской дорогой или happy path. В нашем случае это путь от user_00 к bot_01.

Обратите внимание, что все зеленые блоки выровнены по горизонтали — это называется общей судьбой и говорит об их смысловом родстве.

Базовые элементы

В ДРАКОН используются те же элементы, что и в обычных блок-схемах:

• Действие — что сделал пользователь или как отреагировала на это система.

• Вопрос — условие с вариантами «да/нет».

• Выбор — вопрос, на который можно дать несколько ответов, отличных от «да/нет».

• Ограничитель — показывает, что сценарий закончился или перешел во внешнюю среду.

• Цикл for — если действия повторяются до наступления определенного события.

Силуэт и ветви

Силуэт — это схема, разбитая на логические части. Как если бы мы взяли длинный текст и разбили его на главы.

Части силуэта называются ветвями. У каждой ветви есть имя, вход и выход. Последние два элемента мы неофициально называем порталами.

Разбиение на ветви помогает отразить нелинейность диалога. Если к одной и той же части сценария можно прийти несколькими способами, достаточно вынести эту часть в отдельную ветвь. Так на рисунке ниже это ветка C.

Проходящая по периметру линия со стрелкой очерчивает границы сценария и показывает, что после входа в портал нужно вернуться в вернюю часть схемы. В редакторе DRAKON Editor эта линия появляется автоматически, а вот рисовать её в Figma или Miro весьма утомительно — приходится постоянно выравнивать. Поэтому вместо линии можно использовать фрейм или правило внешнего-внутреннего.

Как проектировать сценарии на языке ДРАКОН

Держите алгоритм:

1. Разбиваем сценарий на этапы.
2. Строим happy path.
3. Достраиваем оставшиеся варианты развития диалога.
4. Упрощаем схему, избавляемся от избыточных веток.

На словах звучит просто. Попробуем реализовать на практике.

Спроектируем сценарий бронирования столиков в кафе. Перед тем, как браться за схему, составим пример диалога:

Шаг 1. Размещаем на схеме основные этапы сценария:

Шаг 2. Строим happy path, как если бы пользователи всегда всё делали правильно.

На этом этапе важно сформировать каркас сценария, который потом будет обрастать деталями. Если вам нравится описывать всё «на ходу» и вы опасаетесь, что забудете отразить что-то важное, попробуйте отмечать подобные места стикерами.

Шаг 3. Для каждой ветки описываем варианты развития диалога. Что если пользователь скажет «Нет» или назовёт время без даты? А если все столики заняты? Добавляем всё это на схему и поражаемся её размерам.

Чтобы открыть схему на весь экран, используйте «Открыть картинку в новой вкладке» в браузере

В ветке «Валидация» появились порталы в ветки «Дата» и «Гости». Теперь в них можно попасть из нескольких мест сценария.

Шаг 4. Попробуем упростить схему. В ветку «Резюме» можно попасть только из ветки «Имя», поэтому их можно объединить в одну. То же самое можно было бы сделать с ветками «Гости» и «Валидация», но я предлагаю оставить их как есть, т.к. «Валидация» достаточно большая и не вяжется по смыслу с «Гостями».

Задание «под звёздочкой». На схеме есть неучтённый момент, из-за которого общение с ботом может получиться длиннее, чем могло бы быть. Попробуйте найти и исправить его самостоятельно.

Когда не стоит использовать ДРАКОН

ДРАКОН хорошо справляется с многошаговыми сценариями. Для простых сценариев формата «запрос-ответ» лучше подойдут карточки ситуаций.