№114

7 ноября 2026

дизайн · инструменты · агенты

Как убрать типовые следы ИИ из интерфейса скиллом unslop для Claude Code

Команда /unslop в Claude Code находит в интерфейсе типовые следы ИИ-генерации (фиолетовые градиенты, эмодзи вместо иконок, свечения, неровные отступы) и исправляет их, не меняя структуру экрана.

2 мин чтения · бесплатно, CC BY 4.0 · 10–15 минут на установку

Где подвох
Перед правками скилл показывает список проблем и описание будущего стиля и ждёт согласия. Если передумать со стилем после начала правок, всё переделывается с нуля.

Как повторить

  1. Клонируйте репозиторий:
git clone https://github.com/heydamir/unslop
  1. Скопируйте скилл в глобальную папку. Для одного проекта используйте .claude/skills/ внутри него вместо ~/.claude/skills/.
mkdir -p ~/.claude/skills && cp -r unslop/skills/unslop ~/.claude/skills/
  1. Чтобы скилл мог снять скриншот живого сайта по ссылке, нужен Playwright, ставится из папки проекта:
npm install -D playwright
npx playwright install chromium

Если ещё нужно видео «до/после», доустановите ffmpeg.

  1. Запустите скилл в Claude Code на нужном экране:
/unslop this dashboard

или на странице по ссылке:

/unslop the hero of https://example.com
  1. Скилл покажет аудит и описание стиля и остановится. Прочитайте их и подтвердите.
  2. Дальше скилл сам пройдёт по экрану девять раз, отрисует его и сверит результат со списком из аудита.
  3. В Codex команда $unslop. По README установка такая: $skill-installer install https://github.com/heydamir/unslop/tree/main/skills/unslop. Ещё можно вручную скопировать скилл в ~/.agents/skills/.

Генерация картинки для первого экрана через fal, Replicate, OpenAI images или Higgsfield по умолчанию выключена. Перед каждой платной генерацией скилл спрашивает разрешения.

Как проверить результат

Для пробы подойдёт свой экран или примеры из папки examples в репозитории. В аудите должны быть конкретные находки вроде «градиент на кнопке» или «эмодзи в заголовке карточки». Описание стиля должно подходить именно вашему продукту. После правок на экране остаются те же разделы в том же порядке, но пропадают градиенты, эмодзи-иконки и восклицательные знаки в подписях. Если получился безликий «чистый минималистичный» шаблон, описание стиля не сработало.

Как это устроено

Сначала скилл проводит аудит по чеклисту типовых признаков: одна строка на каждую проблему с указанием, где она находится. Потом агент пишет описание стиля в пять строк: что делает продукт, его характер в двух-трёх словах, к какому миру он ближе, один-два ярких момента и одна фирменная деталь. Слова «чистый», «современный» и «минималистичный» в промпте запрещены, потому что ими можно описать любой шаблон.

Затем идут девять проходов в таком порядке: отступы, цвет, иконки, текст, типографика, раскладка, детали, визуалы, анимация. Отступы стоят первыми, потому что от ритма зависит, как читается всё остальное. Текст правится раньше шрифтов, потому что от длины заголовка зависит его размер. Каждый проход меняет один слой, поэтому любой из них можно откатить отдельно.

Ссылки

  • heydamir/unslop: скилл, README, SKILL.md и чеклисты для аудита. Лицензия CC BY 4.0 требует сохранять имя автора при копировании.
  • heydamir.design/unslop: платная услуга автора скилла, который за 3 дня доработает один ключевой экран в вашем стеке. Цена на странице не указана.

Источник: Damir Sokolovsky (@heydamir), репост в Instagram от alexeybychkov_.

Больше подобного

Разбираю по находке в день и складываю сюда. Свежее и то, что до сайта не доехало, выходит в канале «Евдокимов как обычно».