TGViewer
Refat Talks: Tech & AI Refat Talks: Tech & AI @nobilix · 11.8K subscribers
Post #91 2.06K
Mermaid + AI: почему это самый недооцененный дуэт для визуализации идей

Когда мне нужно быстро объяснить архитектуру системы, бизнес-процесс или просто структурировать мысли визуально, я достаю один и тот же инструмент. Не Figma, не Lucidchart, а связку Mermaid + AI. И вот почему это работает лучше любых дизайн-тулов.

Mermaid - это текстовый формат для создания диаграмм. Пишешь простой код, получаешь схему. Фишка в том, что LLM обожают текстовые форматы с высоким соотношением сигнал/шум. Mermaid - именно такой. Никакой визуальной мишуры, только структура и логика.

Плюс Claude (пока единственный из AI-чатов) поддерживает Mermaid нативно и сразу рендерит результат. Остальные LLM тоже отлично генерируют код, но без превью - для этого можете использовать сайт mermaid.live (там же можно и скачать файлом).

Вместо абстрактных примеров - конкретные примеры промптов

Архитектура системы:
Create a Mermaid sequence diagram for user authentication flow: user logs in through frontend, request goes to API, checks database, returns JWT token. Show all interactions between components.


Бизнес-процессы:
Generate a Mermaid flowchart for hiring process: from receiving resume to final decision, including HR screening, technical interview, final interview and offer. Include decision points and rejection paths.


ER-диаграммы для БД:
Create a Mermaid ER diagram for blog system: users, posts, comments, tags. Show relationships and key fields for each entity. Include foreign keys and cardinality.


Для документации:
Generate a Mermaid user journey diagram for e-commerce checkout: from adding items to cart through payment completion. Include happy path and error scenarios.


Почему это круче обычных диаграмм:
- Скорость. Пока ты открываешь Figma и думаешь, как расположить блоки, я уже получил готовую схему и итерирую ее.
- Версионность. Mermaid-код можно хранить в гите рядом с проектом. Диаграмма всегда актуальна.
- AI-native. В Cursor даже есть отдельный гайд по архитектурным диаграммам с использованием Mermaid - они понимают ценность этой связки для разработки.

И это не только инструмент визуализации, но еще и хороший помощник в проектировании.
  • 🔥 31
  • 💯 14
  • ❤ 6
  • 👍 5
More from @nobilix
  1. Oct 10, 2026#ReDigest Продолжаем субботнюю рубрику, тут я кратко рассказываю про новости из мира техно…
  2. Oct 9, 2026На видео ролик, который я собрал с помощью Flute. Экспириенс так понравился, что решил под…
  3. Oct 3, 2026#ReDigest Продолжаем субботнюю рубрику, тут я кратко рассказываю про новости из мира техно…
  4. Sep 30, 2026AI в SDLC команды: как превратить регламенты в инструкции для агента Работать с агентом од…
  5. Sep 29, 2026Агент улучшит любую метрику. Твоя работа - выбрать правильную На днях Anthropic выпустили…
  6. Sep 26, 2026#ReDigest Продолжаем субботнюю рубрику, тут я кратко рассказываю про новости из мира техно…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →