Whoogy — MCP-сервер для Claude Code: QA дизайна Figma и сайта
Сравнивает макет Figma с живым сайтом и возвращает отчёт о расхождениях прямо в чат с агентом.
claude mcp add --transport http whoogy-mcp https://mcp.whoogy.com/mcpЧто делает Whoogy
Whoogy — удалённый MCP-сервер. Он берёт файл Figma и корневой адрес сайта, сам находит соответствия между фреймами и страницами, а затем сравнивает вёрстку с макетом. В отчёте — оценка схожести и список проблем с типом (отступы, шрифты, цвет, раскладка, пропавшие блоки) и уровнем важности.
Работает через OAuth 2.1 + PKCE: Claude регистрируется как OAuth-клиент, вы один раз подтверждаете вход в аккаунт Whoogy, и дальше все вызовы идут от вашего имени. Токен — это JWT на 60 дней, refresh-токенов нет, по истечении Claude заново проходит авторизацию. Сравнение страниц тратит кредиты Whoogy, по одному на страницу, поэтому перед запуском стоит вызвать check_credits и посмотреть остаток.
Типичный сценарий: start_scan, опрос get_scan_status, list_discovered_pages, подтверждение списка страниц, run_selected_pages, снова опрос статуса, затем get_report и get_visual_diff для картинки «до/после» по конкретной странице. Для файлов Figma на бесплатном или ограниченном тарифе есть отдельный путь через плагин Whoogy: create_plugin_session, check_plugin_ingest, run_scan_from_ingest, а также duplicate_figma_file, который копирует файл в командный аккаунт Whoogy.
Какие задачи решает
- найти расхождения между макетом Figma и собранной страницей
- проверить отступы и типографику после правок вёрстки
- сопоставить фреймы Figma с реальными маршрутами сайта
- получить отчёт о проблемах с уровнями важности вместо ручного сравнения скриншотов
- прогнать дизайн-проверку перед деплоем, не выходя из чата
Примеры запросов агенту
- Запусти скан Whoogy для файла Figma и корневого адреса сайта, покажи найденные страницы
- Сколько кредитов Whoogy осталось на аккаунте?
- Покажи отчёт по последнему скану и визуальный дифф для главной страницы
Как установить Whoogy
Командой платформы: удалённый сервер
claude mcp add --transport http whoogy-mcp https://mcp.whoogy.com/mcpКомандой платформы: удалённый сервер
codex mcp add whoogy --url https://mcp.whoogy.com/mcpФайл настроек
{
"mcpServers": {
"whoogy": {
"url": "https://mcp.whoogy.com/mcp"
}
}
}Файл настроек
{
"servers": {
"whoogy": {
"type": "http",
"url": "https://mcp.whoogy.com/mcp"
}
}
}Командой платформы: удалённый сервер
gemini mcp add -t http whoogy https://mcp.whoogy.com/mcpПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о Whoogy
Как установить Whoogy в Claude Code?
Добавьте сервер командой claude mcp add --transport http whoogy-mcp https://mcp.whoogy.com/mcp. После этого Claude откроет страницу входа Whoogy, подтвердите доступ один раз.
Что делает Whoogy?
Сравнивает файл Figma с живым сайтом и возвращает структурированный отчёт: оценку схожести и список проблем по типам и уровням важности. Плюс отдаёт картинку с визуальным сравнением по выбранной странице.
Нужен ли ключ API для подключения?
Нет, сервер удалённый и авторизуется через OAuth 2.1 + PKCE под вашим аккаунтом Whoogy. Токен действует 60 дней, после чего Claude повторяет вход.
