roast-my-design-system — плагин
Сканер дизайн-системы репозитория с MCP и хуком правок: оценка от 0 до 100 и правила, чтобы агент не выдумывал UI
- 65 ★ репозитория
- Последний коммит
- MIT
Расширенный доступ
Почему такой уровень
- Флаг `--apply` дописывает блок правил в файлы агентов, а хук плагина срабатывает на каждую правку
- Локальный MCP-сервер читает файлы репозитория при запуске и отвечает по ним агенту
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add plugins/roast-my-design-systemОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемРасширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.
- Флаг `--apply` дописывает блок правил в файлы агентов, а хук плагина срабатывает на каждую правку
- Локальный MCP-сервер читает файлы репозитория при запуске и отвечает по ним агенту
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
roast-my-design-system — пакет npm без зависимостей, который читает файлы интерфейсного репозитория и показывает, где ИИ-агент начнет выдумывать UI. Команда `npx roast-my-design-system@latest` в корне проекта через секунду открывает отчет: оценка здоровья дизайн-системы от 0 до 100, где начать правки и найденные отклонения вроде цветов и отступов, написанных вручную там, где есть токен. В монорепозитории оценка считается по каждому пакету. Инструмент учит агента тремя способами. Флаг `--apply` записывает сгенерированные правила в файлы агентов: `CLAUDE.md`, `AGENTS.md`, `.cursorrules`, `.cursor/rules/`, `.windsurfrules` и `.github/copilot-instructions.md`. Флаг `--mcp` запускает локальный MCP-сервер с пятью инструментами, например `roast_find_token`, и подсказкой `roast-fix`, которая отдает главное исправление из свежего сканирования. Плагин для Claude Code добавляет хук, проверяющий каждую правку. Все числа берутся из детерминированного разбора файлов, а текст объяснений, написанный Claude, помечен как ИИ и отделен от чисел. Работа локальная: без аккаунта, без сети, без телеметрии, и репозиторий не меняется, пока вы не попросите `--apply`. Для CI есть вывод `--sarif`.
Для кого. Фронтенд-командам и дизайн-инженерам, которые пускают агента править интерфейс и хотят, чтобы он брал токены и компоненты проекта.
Подходит, если
- Агент рисует новый график или панель, а в репозитории нет палитры, и он жестко прописывает цвета
- Нужна оценка дизайн-системы с подробным отчетом и списком, с чего начать исправления
- Правила для `CLAUDE.md`, `AGENTS.md` и `.cursorrules` должны собираться из самого репозитория
- В CI нужен гейт по результатам сканирования в формате SARIF
Не подходит, если
- В репозитории нет интерфейсного кода: сканер читает файлы фронтенда
- Нужна проверка отрисованного вида: инструмент ничего не рендерит и дизайн не оценивает
- Нужно судить о визуальном качестве по скриншотам: оценка строится только по коду
Пример запроса к агенту
Запусти roast-my-design-system в корне проекта, покажи оценку и три главных исправления, а затем примени правила для агента через --applyОграничения
- Оценка отражает код. Нулевое число находок означает, что код следует правилам, но дизайн при этом не проверялся и ничего не отрисовывалось.
- Агент не всегда вызывает инструмент MCP: в октябрьских замерах автора Sonnet обращался к нему в 7 сессиях из 24, Haiku в 2 из 24, поэтому устойчивее работает хук правок из плагина.
- Для библиотек вроде MUI, Mantine, Chakra UI и Ant Design оценка учитывает собственные обертки и темы, но результат зависит от того, как репозиторий читается.
- Замеры автора сделаны на десяти открытых продуктах и их полный разбор обещан отдельной публикацией.
Как отключить. Плагин снимает `/plugin uninstall roast-my-design-system`, MCP-сервер командой `claude mcp remove roast`. Блок правил в файлах агентов стоит стереть вручную между метками, которые вставил `--apply`.
Частые вопросы
Как запустить roast-my-design-system?
Выполните `npx roast-my-design-system@latest` в корне репозитория с интерфейсом. Через секунду откроется отчет, аккаунт и сеть не нужны.
Как подключить MCP-сервер в Claude Code и Cursor?
Для Claude Code выполните `claude mcp add roast -- npx roast-my-design-system@latest --mcp`. Для Cursor добавьте в `.cursor/mcp.json` блок `mcpServers` с командой `npx` и аргументами `roast-my-design-system` и `--mcp`.
Что делает флаг --apply?
Записывает правила, собранные из репозитория, в каждый найденный файл агента, внутри помеченного блока, и проверяет, не устарели ли уже написанные правила.
Отправляет ли инструмент мой код куда-нибудь?
Нет. README заявляет отсутствие сети, аккаунта и телеметрии, а тесты падают, если в `package.json` появится зависимость.
Как подключить плагин Claude Code?
Выполните `/plugin marketplace add gregkozakiewicz/roast-my-design-system`, затем `/plugin install roast-my-design-system@roast-my-design-system`. Сервер MCP и хук правок идут в комплекте.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
ПлагиныMCP-сервер и скилл для интерфейсов: 31 дизайн-система для shadcn/ui, принципы UI и UX и проверка доступности для кода агента
MCP-сервер и линтер дизайн-системы: агент читает токены и правила до генерации UI, а проверка возвращает нарушения
Проверка по 147 правилам дизайна: находит признаки ИИ-интерфейса, чинит механические и передает остальное скиллу агента
Ищет в сгенерированном фронтенде приметы ИИ, от фиолетовых градиентов до терракотового тона, и переписывает интерфейс
Дизайн-студия для людей и агентов: CLI dsa, MCP по адресу /mcp и скилл правят сайты, слайды, отчеты и 3D в одном документе.
Набор скиллов, токенов и правил, который делает из Claude дизайн-архитектора: DTCG-токены, компоненты, доступность и объективные проверки качества
Сравнение с похожими
Карточки с тем же главным запросом: чем они отличаются.
| Инструмент | Официальный | Звезды репозитория | Главное отличие |
|---|---|---|---|
| roast-my-design-system (эта карточка) | нет | 65 | |
| designlang | нет | 5 058 | Тот инструмент вытаскивает дизайн-систему живого сайта, а roast-my-design-system оценивает дизайн-систему в вашем репозитории и учит агента ей следовать. |
| design.how | нет | 314 | design.how превращает интерфейс в систему для агента скиллами, а roast считает отклонения в коде и стоит на страже при правках. |
Коротко о README
README объясняет идею (агент копирует то, что находит, и выдумывает там, где ответа нет), приводит замеры на 355 сессиях, описывает отчет, оценку, генерацию правил, сервер MCP и подключение в Claude Code, Cursor и Windsurf.