Что это?
Это skill, дающий Claude Code (или любому кодинг-агенту с поддержкой skills) возможность генерировать диаграммы Excalidraw из описаний на естественном языке, причём компоновка действительно отражает концепцию (разветвления, таймлайны, схождение), а не безликие прямоугольники.
Это skill, дающий Claude Code (или любому кодинг-агенту с поддержкой skills) возможность генерировать диаграммы Excalidraw из описаний на естественном языке, причём компоновка действительно отражает концепцию (разветвления, таймлайны, схождение), а не безликие прямоугольники.Это самостоятельное приложение или то, что я добавляю в своего кодинг-агента?Это набор файлов skill, который вы кладёте в папку skills своего агента, а не отдельное приложение. Агенты, читающие .claude/skills/ (вроде Claude Code и OpenCode), подхватят его автоматически.
Это набор файлов skill, который вы кладёте в папку skills своего агента, а не отдельное приложение. Агенты, читающие .claude/skills/ (вроде Claude Code и OpenCode), подхватят его автоматически.Нужно ли что-то настроить, прежде чем агент сможет отрисовывать диаграммы?Да, конвейеру отрисовки нужна одноразовая настройка: можно попросить своего кодинг-агента выполнить за вас команды настройки из SKILL.md или сделать всё вручную.
Да, конвейеру отрисовки нужна одноразовая настройка: можно попросить своего кодинг-агента выполнить за вас команды настройки из SKILL.md или сделать всё вручную.Диаграмма генерируется вслепую или агент проверяет свою работу?Skill использует конвейер отрисовки на базе Playwright, поэтому агент видит свой результат, ловит проблемы вроде наложенного текста или смещённых стрелок и в цикле исправляет их, прежде чем отдать финальную диаграмму.
Skill использует конвейер отрисовки на базе Playwright, поэтому агент видит свой результат, ловит проблемы вроде наложенного текста или смещённых стрелок и в цикле исправляет их, прежде чем отдать финальную диаграмму.Как на деле попросить его нарисовать диаграмму?Вы просто описываете желаемое простым языком — например, 'создай диаграмму Excalidraw, показывающую, как протокол AG-UI передаёт события от ИИ-агента к фронтенду' — а skill берёт на себя отображение концепции, компоновку, генерацию JSON и отрисовку.
Вы просто описываете желаемое простым языком — например, 'создай диаграмму Excalidraw, показывающую, как протокол AG-UI передаёт события от ИИ-агента к фронтенду' — а skill берёт на себя отображение концепции, компоновку, генерацию JSON и отрисовку.Можно ли поменять цвета и брендинг диаграмм?Да, все цвета и фирменные стили живут в одном файле — references/color-palette.md, — и его правка меняет каждую диаграмму, которую создаёт skill.
Да, все цвета и фирменные стили живут в одном файле — references/color-palette.md, — и его правка меняет каждую диаграмму, которую создаёт skill.Что включено, кроме фигур и стрелок?В диаграммы можно включать подтверждающие артефакты вроде настоящих фрагментов кода и реальных JSON-полезных нагрузок, а не только безликие блоки.
В диаграммы можно включать подтверждающие артефакты вроде настоящих фрагментов кода и реальных JSON-полезных нагрузок, а не только безликие блоки.Это работает только с Claude Code?Нет, он работает с любым кодинг-агентом с поддержкой skills; агенты, читающие папку .claude/skills/, вроде Claude Code и OpenCode, могут использовать его напрямую.
Нет, он работает с любым кодинг-агентом с поддержкой skills; агенты, читающие папку .claude/skills/, вроде Claude Code и OpenCode, могут использовать его напрямую.What are similar projects?live-panel-skill, huashu-art-motion, drawio-skill, claude-ads, archify, procedural-film, geo-sleuth, guizang-product-video-skill
live-panel-skill, huashu-art-motion, drawio-skill, claude-ads, archify, procedural-film, geo-sleuth, guizang-product-video-skillWhich topics is it in?diagrams-as-code, diagram, claude-code-skill, playwright, opencode, visualization, design, json, skill, agent-skills, agent, claude-code
diagrams-as-code, diagram, claude-code-skill, playwright, opencode, visualization, design, json, skill, agent-skills, agent, claude-code