Чек-лист

3 скилла, которые чинят «уродливый» дизайн ИИ

Чек-лист: скачать → установить → использовать. Для Claude Code и Codex.

Содержание5 глав
  1. 01Подготовка (один раз)
  2. 021. Impeccable — язык дизайна · анти-слоп
  3. 032. Taste Skill — вкус топ-студий
  4. 043. Animation Skill (emil-design-eng) — motion · «дорого»
  5. 05Порядок применения

Claude Code и Codex по умолчанию генерят дженерик-дизайн («AI-слоп»). Эти три открытых скилла дают агенту язык дизайна, вкус на уровне топ-студий и анимацию. Ставятся в минуты, работают и на новых, и на уже готовых проектах.

Подготовка (один раз)

  • Установлен Node.js (нужен для npx). Проверка: node -v
  • Открыт терминал в папке проекта, дизайн которого улучшаешь (cd путь/к/проекту)
  • Claude Code или Codex CLI уже стоит и работает в этом проекте

1. Impeccable — язык дизайна · анти-слоп

Автор: Пол Бакаус (Paul Bakaus, @pbakaus)

Даёт агенту реальный визуальный словарь (23 команды), детектор «слопа» и Live Mode — правки прямо в браузере. Тем же скиллом можно переделать свои старые макеты, а не только новые.

github.com/pbakaus/impeccable · сайт: impeccable.style · лицензия Apache-2.0

  • В папке проекта выполни: npx impeccable install (сам находит папки Claude Code / Codex)

  • Только Claude Code — как плагин: /plugin marketplace add pbakaus/impeccable

  • Для Codex: после установки открой /hooks и подтверди project hook

  • В агенте один раз запусти: /impeccable init — задаст пару вопросов и создаст PRODUCT.md / DESIGN.md

  • Улучшить секцию: /impeccable polish форму оплаты

  • Аудит дизайна: /impeccable audit · сделать смелее/тише: /impeccable bolder

  • Живые правки в браузере: /impeccable live

  • Проверить проект на слоп без агента: npx impeccable detect src/

2. Taste Skill — вкус топ-студий

Автор: Леон Лин (Leon Lin, @Leonxlnx)

Обучен на сотнях награждённых сайтов и интерфейсов. Заставляет агента искать недефолтные решения — не «очередной такой же лендинг», а сложные варианты уровня топовых студий.

github.com/Leonxlnx/taste-skill · сайт: tasteskill.dev

Работает с Claude Code, Cursor, Codex, Devin. Апгрейд v1 → v2 — той же командой, имя скилла не меняется.

  • Скилл подхватывается автоматически. Проси агента: «сделай лендинг с вкусом, используй taste-skill»
  • Для редизайна: «пройди по проекту скиллом taste и убери дженерик»

3. Animation Skill (emil-design-eng) — motion · «дорого»

Автор: Эмиль Ковальски (Emil Kowalski, @emilkowalski) — Linear, курс animations.dev, автор Sonner

Добавляет на сайт качественную анимацию и motion, чтобы интерфейс выглядел максимально дорого. Ревьюит твой UI, ловит типичные ошибки (ease-in, анимация частых действий) и держит правила: движения короче ~300 мс, кастомные easing вместо дефолтных.

github.com/emilkowalski/skill · сайт: emilkowal.ski/skill

  • Одной командой: npx skills add emilkowalski/skill

  • Вручную: положить SKILL.md в ~/.claude/skills/emil-design-eng/ — Claude подхватит на след. сессии

  • Создать/улучшить анимации: «используй emil-design-eng, добавь motion на этот блок»

  • Проверить готовые анимации: попроси прогнать review-animations

Порядок применения

Impeccable задаёт систему и чистит слоп
Taste Skill поднимает уровень до топ-студии
Animation Skill добавляет motion

Ставим все три в проект. Один проект — три слоя качества.

Точные команды — в README каждого репозитория; проекты обновляются, сверяйся с актуальной версией на сайте/GitHub.