---
title: "Impeccable: точечное улучшение интерфейса AI-агентом"
description: Команды Impeccable для визуальных итераций, UX- и технического аудита, детектор антипаттернов, контекстные файлы и безопасная работа live-режима.
---

[Impeccable](https://github.com/pbakaus/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.

## PRODUCT.md и DESIGN.md

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

`/impeccable document` описывает существующую визуальную систему в `DESIGN.md`. Это особенно полезно перед серией правок: агент получает зафиксированные токены и компоненты вместо того, чтобы заново угадывать стиль. Устройство такого контракта подробно разобрано в статье [DESIGN.md](https://wpcraft.ru/kb/design/ai/design-md.md).

Для WordPress этот файл можно связывать с `theme.json`, блочными паттернами и компонентами темы, но автоматической синхронизации между форматами нет. Изменения токенов проверяют в обеих системах; общие принципы описаны в [дизайн-системах WordPress](https://wpcraft.ru/kb/stacks/wordpress/themes/design-systems.md).

## Детектор антипаттернов

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

```bash
npx impeccable detect src/
npx impeccable detect http://localhost:5173
npx impeccable detect --list-rules
```

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

## Установка

```bash
npx impeccable install
```

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

```text
/impeccable init
```

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

## Live-режим и безопасность

`/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](https://wpcraft.ru/kb/design/ai/skills/ui-ux-pro-max.md) подбирает исходную систему по каталогу, [Taste Skill](https://wpcraft.ru/kb/design/ai/skills/taste-skill.md) и [Hallmark](https://wpcraft.ru/kb/design/ai/skills/hallmark.md) задают более цельный процесс сборки страницы. Impeccable удобнее как набор коротких, адресных операций над существующим интерфейсом.

## Материалы и источники

- [Impeccable на GitHub](https://github.com/pbakaus/impeccable)
- [Официальная документация](https://impeccable.style/docs)
- [Детектор и его конфигурация](https://impeccable.style/docs/detector)
- [Автоматические design hooks](https://impeccable.style/docs/hooks)
- [Приватность](https://impeccable.style/privacy)