Перейти к содержимому

Impeccable: точечное улучшение интерфейса AI-агентом

Impeccable — Apache-2.0 навык Пола Бакауса, который даёт кодовому агенту точный словарь дизайнерских операций. Вместо расплывчатого «сделай лучше» используются отдельные команды: усилить или успокоить направление, исправить типографику и сетку, проверить сценарий, обработать ошибки, адаптировать интерфейс и подготовить его к выпуску.

Проект вырос из Anthropic frontend-design, но добавляет собственные playbooks, CLI-детектор, hooks, браузерный live-режим и контекстные файлы. Сильнее всего он работает с уже существующим интерфейсом, где можно ограничить задачу одним компонентом или экраном.

В текущей версии README описаны 24 команды, включая устаревший alias craft.

ГруппаКомандыНазначение
Направлениеbolder, quieter, distill, colorize, delight, overdriveИзменить выразительность и характер интерфейса
Композицияtypeset, layout, animateИсправить шрифты, ритм, отступы и движение
Ревьюcritique, auditПолучить оценённый UX-разбор или технический отчёт
Завершениеpolish, harden, clarify, adapt, optimize, onboardПроверить крайние случаи, текст, устройства, скорость и первый сценарий
Итерацииlive, generateСравнить варианты выбранного элемента в браузере
Контекстshape, init, document, extractСпланировать UX, записать продукт и дизайн-систему

Например, /impeccable critique the pricing cards задаёт куда более узкую и проверяемую задачу, чем общий запрос на улучшение всей страницы. critique ранжирует UX-находки, а audit проверяет доступность, производительность, темы и адаптивность с приоритетами от P0 до P3.

/impeccable init изучает проект, спрашивает то, что нельзя надёжно вывести из кода, и создаёт PRODUCT.md. Последующие команды используют этот файл как продуктовый контекст.

/impeccable document описывает существующую визуальную систему в DESIGN.md. Это особенно полезно перед серией правок: агент получает зафиксированные токены и компоненты вместо того, чтобы заново угадывать стиль. Устройство такого контракта подробно разобрано в статье DESIGN.md.

Для WordPress этот файл можно связывать с theme.json, блочными паттернами и компонентами темы, но автоматической синхронизации между форматами нет. Изменения токенов проверяют в обеих системах; общие принципы описаны в дизайн-системах WordPress.

В детектор встроены 62 детерминированных правила. Он находит повторяющиеся признаки шаблонного AI-дизайна и технические проблемы вроде тесных отступов или пропущенных уровней заголовков. Для работы не нужны LLM и API-ключ.

Окно терминала
npx impeccable detect src/
npx impeccable detect http://localhost:5173
npx impeccable detect --list-rules

Проверка исходников JSX/TSX и проверка отрендеренной страницы дают разные результаты: контраст и размер текста нужно смотреть в браузере. Для CI доступны JSON и аннотации GitHub Actions. Правила можно отключать точечно с объяснением причины, например когда «слишком популярный» шрифт действительно является обязательным элементом бренда.

Окно терминала
npx impeccable install

После перезапуска кодового инструмента выполните:

/impeccable init

В Codex используется $impeccable init. Установщик определяет поддерживаемые среды и предлагает project- или global-область, а также design hook. Перед включением hook проверьте, какие команды он сможет запускать вне обычного подтверждения модели.

/impeccable live открывает локальный dev-server с overlay: элемент выбирают в браузере, сравнивают варианты и записывают принятый в исходники. Режим предназначен только для локальной копии; его не следует встраивать в опубликованный сайт или ослаблять production CSP.

Особое внимание требует Apply для текстовых правок. Если chat-сессия не забирает подготовленные изменения, README описывает fallback на локальный Codex или Claude CLI с отключёнными approvals и sandbox. Чтобы не допускать такого запуска, заранее задайте IMPECCABLE_LIVE_COPY_AGENT=chat, а для полного отключения Apply — off. В незнакомом репозитории также проверьте необязательный скрипт impeccable:manual-edit-validate.

Команды направления отражают авторские представления о качестве и не заменяют исследование. Детектор выявляет признаки, а не доказывает плохой дизайн: каждое правило имеет контекст и допустимые исключения.

Навык поддерживает нативные платформенные правила для отдельных дизайн-команд, но detector, edit hook и browser live-режим остаются веб-инструментами. Для WordPress и любого другого стека итоговую проверку проводят на реальных шаблонах, состояниях и устройствах.

UI UX Pro Max подбирает исходную систему по каталогу, Taste Skill и Hallmark задают более цельный процесс сборки страницы. Impeccable удобнее как набор коротких, адресных операций над существующим интерфейсом.