Промт для Cursor: генерируем точные блок-схемы алгоритмов в Markdown

Готовый шаблон внутри

Промт для Cursor: генерируем точные блок-схемы алгоритмов в Markdown

Шаблон промта, который заставляет Cursor выдавать валидный Mermaid-код с первого раза. Разбор структуры, три вариации под задачи и техники для сложных алгоритмов.

Mermaid.js Cursor AI Markdown Алгоритмы

Почему Cursor + Mermaid — рабочая пара

Cursor видит контекст всего проекта: структуру папок, именование переменных, паттерны кода. Когда вы просите блок-схему, он не гадает — он считывает реальную логику функций, условных переходов и циклов.

Mermaid.js рендерится прямо в Markdown-файлах, GitHub, GitLab, Notion, Obsidian и документации. Никаких внешних инструментов, экспортов картинок или ручного рисования стрелочек.

Результат: живая диаграмма в репозитории, которая обновляется вместе с кодом.

```mermaid
flowchart TD
    A[Start] --> B{Condition?}
    B -- Yes --> C[Action 1]
    B -- No --> D[Action 2]
    C --> E[End]
    D --> E
```
Минимальный валидный Mermaid — Cursor понимает этот синтаксис нативно

Анатомия промта, который работает

Хороший промт для диаграмм — это не просьба «нарисуй схему», а техническое задание с жёсткими ограничениями. Ниже — скелет, который покрывает 90% случаев.

prompt_template.md
# ROLE
You are a senior software architect. Your task: generate a precise Mermaid flowchart
for the algorithm described below. Output ONLY the Mermaid code block.

# CONTEXT
- Language: {language}
- Target file: {path/to/file_or_module}
- Complexity: {function | module | system}
- Audience: {devs | docs | review}

# REQUIREMENTS
1. Syntax: Mermaid `flowchart` (not `graph`). Direction: TD or LR.
2. Nodes: use IDs with semantic prefixes (proc_, dec_, io_, start_, end_).
3. Labels: short, imperative, max 3 words. No punctuation inside labels.
4. Edges: label only for decision branches (Yes/No, True/False, Error/OK).
5. Subgraphs: group by logical phase (validation, processing, persistence).
6. Styling: apply classDef for node types — no inline styles.
7. Clickable: add `click` directives for node IDs that map to source symbols.
8. Output: single fenced block ```mermaid ... ``` — no commentary.

# ALGORITHM DESCRIPTION
{paste code, pseudocode, or step-by-step logic here}

# EXAMPLE OUTPUT FORMAT
```mermaid
flowchart TD
    subgraph Validation
        proc_validate_input[Validate input]
        dec_check_format{Format valid?}
    end
    subgraph Processing
        proc_transform[Transform data]
        dec_retry{Retry needed?}
    end
    classDef proc fill:#1A1A1A,color:#FFF,stroke:#D80621;
    classDef dec fill:#D80621,color:#FFF,stroke:#B50518;
    classDef io fill:#FFF0F1,color:#1A1A1A,stroke:#E53348;
    class proc_validate_input,proc_transform proc;
    class dec_check_format,dec_retry dec;
    click proc_validate_input "../src/validator.ts#L12";
    click proc_transform "../src/transformer.ts#L45";
```

Role + Context

Задаёт персону и привязку к кодовой базе. Cursor использует контекст открытых файлов.

Requirements

Жёсткие правила синтаксиса, именования, группировки и стилей. Исключает «творчество» модели.

Algorithm Description

Вставляете код, псевдокод или шаги. Чем точнее вход — тем точнее схема.

Example Format

Феw-shot образец. Фиксирует ожидаемый стиль классов, кликабельные ссылки, сабграфы.

Три вариации под тип задачи

Вариант А: Одна функция

Для ревью сложной функции с вложенными условиями, циклами и ранними возвратами.

# CONTEXT
- Language: TypeScript
- Target file: src/billing/calculate.ts
- Complexity: function
- Audience: devs

# ALGORITHM DESCRIPTION
Function calculateTotal(items, userTier):
  1. If items empty -> return 0
  2. Sum = reduce items price * qty
  3. If userTier == PREMIUM -> apply 15% discount
  4. If sum > 1000 -> apply extra 5%
  5. If promoCode valid -> apply promo
  6. Round to 2 decimals
  7. Return total
Ключевой нюанс: явно перечислите шаги нумерованным списком — Cursor переносит их в узлы 1-в-1.

Вариант Б: Модуль / Сервис

Для документирования сервиса с несколькими публичными методами, зависимостями и побочными эффектами.

# CONTEXT
- Language: Python
- Target file: services/order_service.py
- Complexity: module
- Audience: docs

# ALGORITHM DESCRIPTION
Class OrderService:
  - create_order(user, cart)
    * validate cart not empty
    * check inventory reservation
    * create order record (PENDING)
    * emit OrderCreated event
    * return order_id
  - process_payment(order_id, payment)
    * verify amount matches
    * call payment gateway
    * on success -> CONFIRMED, emit Paid
    * on fail -> FAILED, emit PaymentFailed
  - cancel_order(order_id, reason)
    * if status != PENDING -> error
    * release inventory
    * update status -> CANCELLED
Ключевой нюанс: добавьте в Requirements: «Subgraphs: one per public method. Show events as io_ nodes with dashed edges.»

Вариант В: Асинхронный пайплайн

Для event-driven систем: очереди, ретраи, dead-letter, компенсирующие транзакции.

# CONTEXT
- Language: Go
- Target file: internal/worker/video_processor.go
- Complexity: system
- Audience: review

# ALGORITHM DESCRIPTION
Pipeline stages (Kafka consumer):
  1. Consume message -> validate schema
  2. Download source from S3 (retry 3x)
  3. Transcode to 3 resolutions (parallel)
  4. Upload results to CDN
  5. Update DB status -> READY
  6. Emit VideoProcessed event

Error handling:
  - Download fail -> retry queue (max 3)
  - Transcode fail -> DLQ + alert
  - CDN fail -> retry 5x with backoff
  - DB fail -> compensating: delete CDN files
Ключевой нюанс: требовите `subgraph` для каждого этапа, `classDef retry` для ретраев, `classDef dlq` для dead-letter. Укажите `direction: LR` для горизонтального потока.

Типичные сбои и как их чинить

❌ Сбой: Сломанный синтаксис

Cursor выдает `graph TD` вместо `flowchart TD`, пропускает кавычки в лейблах со спецсимволами, ломает подграфы.

✅ Фикс

В Requirements жёстко: «Syntax: Mermaid `flowchart` only. Labels with special chars in double quotes. Subgraph syntax: `subgraph Title … end`.»

❌ Сбой: Генерация текста вместо кода

Модель объясняет алгоритм словами, оборачивает в markdown-проразу, добавляет комментарии вне блока кода.

✅ Фикс

Добавьте: «Output: single fenced block «`mermaid … «` — no commentary, no explanation, no extra text.» Role: «You output ONLY the code block.»

❌ Сбой: Узлы не кликабельны

Диаграмма красивая, но `click` директивы отсутствуют или ссылаются на несуществующие строки.

✅ Фикс

Укажите: «Clickable: add `click nodeID \»file.ts#L123\»` for each node mapping to a real symbol. Use Cursor’s @file reference to get line numbers.»

❌ Сбой: Хаос в стилях

Каждый узел с инлайн-стилями, цвета случайные, схема нечитаема в темной теме GitHub.

✅ Фикс

Требовите `classDef` с 3-4 классами (process, decision, io, error). Цвета: темный фон процесса, красный решений, розовый ввода/вывода. Работает в любой теме.

Продвинутые приёмы: сабграфы, стили, навигация

Сабграфы как архитектурные слои

Группируйте узлы не произвольно, а по слоям ответственности: Validation → Processing → Persistence → Notification. Внутри сабграфа — только узлы этого слоя. Переходы между сабграфами показывают контракты.

subgraph Validation proc_check_input[Check input] dec_valid{Valid?} end subgraph Processing proc_transform[Transform] dec_retry{Retry?} end subgraph Persistence proc_save[Save to DB] io_event[Emit Event] end

Классовые стили для темной и светлой темы

Определяйте 4 класса через `classDef`. Используйте CSS-переменные Mermaid — они уважают настройки темы просмотрщика.

classDef proc fill:var(--mermaid-bg-process, #1A1A1A), color:var(--mermaid-fg-process, #FFFFFF), stroke:var(--mermaid-stroke-process, #D80621); classDef dec fill:var(--mermaid-bg-decision, #D80621), color:var(--mermaid-fg-decision, #FFFFFF), stroke:var(--mermaid-stroke-decision, #B50518); classDef io fill:var(--mermaid-bg-io, #FFF0F1), color:var(--mermaid-fg-io, #1A1A1A), stroke:var(--mermaid-stroke-io, #E53348); classDef err fill:var(--mermaid-bg-error, #FFF0F0), color:var(--mermaid-fg-error, #B50518), stroke:var(--mermaid-stroke-error, #D80621), stroke-dasharray: 5 5;

Назначайте классы: `class nodeID proc;`. Для ошибок — пунктирная рамка `stroke-dasharray`.

Кликабельные узлы → навигация по коду

Самая ценная фича для ревью: клик по узлу открывает файл в IDE или на GitHub. Два подхода:

  • Локально (Cursor): `click proc_validate «../src/validator.ts#L12″` — относительный путь от .md файла.
  • В репозитории (GitHub/GitLab): `click proc_validate «https://github.com/org/repo/blob/main/src/validator.ts#L12″` — абсолютный URL.
Совет: добавьте в промт: «Use relative paths for local dev, absolute GitHub URLs for committed docs. Detect from context.»

Детали, экономящие часы правок

Используйте @-ссылки в Cursor

В чате наберите `@file:src/module.ts` — Cursor подтянет контент файла в контекст. Промт становится короче, точность — выше.

Итеративное уточнение

Первый вариант редко идеален. Пишите следом: «Fix: node IDs must follow prefix convention. Add missing error branch. Move retry logic into subgraph.» Курсор поправляет точечно.

Экспорт в документацию

Сохраняйте `.mmd` файлы рядом с кодом. MkDocs, Docusaurus, VitePress рендерят их нативно. CI может проверять валидность: `mermaid-cli -i diagram.mmd -o /dev/null`.

Версионируйте схемы

Коммитьте `.mmd` в тот же PR, что меняет логику. Ревьюер видит diff диаграммы рядом с diff кода. Никаких устаревших картинок в вики.

Один промт — живая документация, которая не устаревает

Скопируйте шаблон, адаптируйте под свой стек, добавьте в snippets Cursor. Следующая схема соберется за секунды — и будет точной, кликабельной и версионируемой.

Чек-лист перед запуском:
  • Контекст: язык, файл, сложность
  • Requirements: синтаксис, префиксы, сабграфы
  • ClassDef: 4 класса под темы
  • Click: относительные или абсолютные пути
  • Output: только fenced block