Дизайн от ИИ выглядит дёшево. Три скилла, которые это чинят

Почему ИИ по умолчанию делает дёшево

Модель не «не умеет» в дизайн — она умеет ровно то, что видела. А видели все модели примерно одно и то же: миллионы одинаковых SaaS-шаблонов. Поэтому на любом проекте вылезает один и тот же набор признаков, по которым дизайнер за секунду опознаёт «сгенерировано»:

• Шрифт Inter вообще везде — и в заголовках, и в тексте, и в кнопках.
• Градиент из фиолетового в синий — на кнопке, на фоне, внутри иконки.
• Карточки внутри карточек — рамка в рамке в рамке.
• Серый текст на цветном фоне — контраст на грани читаемости.
• Квадратная иконка со скруглением над каждым заголовком.

По отдельности — мелочь. Вместе — то самое ощущение «дешёвой нейросети», которое отпугивает и заказчика, и пользователя. У явления даже есть устоявшееся название — AI slop, цифровая жижа.

Промптом это лечится плохо. «Сделай красиво, но не как ИИ» модель понимает как «добавь ещё один градиент». Нужен не разовый промпт, а скилл — постоянная инструкция, которая меняет само поведение агента.

Скилл — это не промпт и не MCP

Быстро, чтобы не путать (подробнее — в материале про MCP).

MCP даёт ИИ руки — доступ к файлам, репозиториям, свежей документации. Скилл описывает привычки — как агент действует. Технически скилл — это просто папка с файлом SKILL.md: YAML-шапка (name, description) плюс инструкция текстом. Claude Code, Cursor и Codex подхватывают её сами, когда задача попадает под описание.

Лежит скилл в одном из двух мест:

• ~/.claude/skills/<имя>/SKILL.md — глобально, во всех проектах;
• .claude/skills/<имя>/SKILL.md — только в текущем проекте.

Никакой сборки и перезапуска: файл появился — скилл заработал в этой же сессии. Всё, что ниже, — это ровно такие папки. Просто написаны они не вами в три часа ночи, а людьми, которые занимаются дизайном всю жизнь.

Три скилла, которые ставят вкус на автопилот

Все три — бесплатные, с открытым кодом, ставятся одной командой. Разберём по очереди.

Impeccable — язык дизайна против slop

Автор — Paul Bakaus. Человеку можно верить на слово: в разное время он сделал jQuery UI, работал в Google над Chrome DevTools, AMP и Web Stories, а сейчас основал стартап Renaissance Geek (сид-раунд от a16z). Impeccable — его первый продукт, и за первые недели он собрал десятки тысяч звёзд на GitHub, а сейчас перевалил за 45 тысяч. Фактически это новый стандарт дизайна в экосистеме Claude Code — и он же встроен в новое приложение GitHub Copilot.

Слоган — «язык дизайна, который делает ваш ИИ-агент лучше в дизайне». По сути Impeccable — это словарь-прослойка между вашим намерением и тем, что делает агент. Он знает про те самые признаки slop и активно их выпалывает: в комплекте детектор из 46 правил, который ловит анти-паттерны даже без ИИ (npx impeccable detect) — забаненные шрифты вроде Inter, серый текст на цвете, чистый чёрный и белый, вложенные карточки, «резиновый» bounce-изинг.

Внутри — 23 команды с общим языком дизайнера. /impeccable init заводит контекст продукта (для кого, бренд, голос, анти-референсы, палитра, шрифты, компоненты) в файлы PRODUCT.md и DESIGN.md; дальше идут craft, polish, audit, critique, shape, animate, bolder, quieter, distill и другие. Вы говорите с агентом как с дизайнером: «сделай смелее», «приглуши», «выжми суть» — а не «поменяй padding на 12».

Чинит и старое. Наводите на готовый макет цепочку document → audit → critique → polish — Impeccable считает из кода дизайн-систему, найдёт признаки ИИ и вычистит их. Лицензия — Apache 2.0, репозиторий — github.com/pbakaus/impeccable.

Taste — целимся в уровень студий, а не в шаблон

Второй скилл — Taste от Leon Lin (на GitHub — Leonxlnx). Это самый «звёздный» сторонний дизайн-скилл: больше 60 тысяч звёзд. Автор прямо называет его «анти-slop-фреймворком для ИИ-агентов».

Идея — не дать агенту скатиться в очередной одинаковый лендинг, а толкать его к сложным, «студийным» решениям: сильная типографика, нетривиальная сетка, продуманные отступы, motion. Ориентиры скилла — не средний лендинг, а эстетика уровня Awwwards, Linear, редакционного дизайна.

Главная фишка — три «крутилки» от 1 до 10, как эквалайзер на выходе модели:

• DESIGN_VARIANCE — от идеальной симметрии до «художественного хаоса», асимметрии и эксперимента;
• MOTION_INTENSITY — от статики до кинематографичной, «физической» анимации;
• VISUAL_DENSITY — от воздушной галереи до плотного дашборда-«кокпита».

Базовая настройка — 8 / 6 / 4. Выкрутили под задачу — получили не среднюю температуру по больнице, а конкретный характер. Внутри не один скилл, а набор вариантов: design-taste-frontend (основной), gpt-taste (строже, под Codex/GPT), redesign-existing-projects (аудит и починка), minimalist-ui, industrial-brutalist-ui и другие, вплоть до генерации картинок. Лицензия — MIT, репозиторий — github.com/leonxlnx/taste-skill.

Animations от Emil Kowalski — motion, от которого дорого

Третий скилл добавляет то, что отличает «нормальный сайт» от «дорогого», — анимацию. Автор, Emil Kowalski, — дизайн-инженер (сейчас в Linear, до этого в Vercel) и создатель двух библиотек, которые стоят чуть ли не в каждом React-проекте: Sonner (тосты) и Vaul (drawer) — вместе больше 70 млн загрузок в неделю. Плюс за ним курс animations.dev.

Его набор emilkowalski/skills — это тот же многолетний опыт, упакованный в скиллы. Главный — emil-design-eng (анимация плюс дизайн-решения), рядом review-animations (строгий разбор ваших анимаций по правилам), animation-vocabulary (чтобы точно объяснять агенту, какой motion вы хотите) и apple-design (принципы плавности Apple).

Скилл навязывает ровно те мелочи, на которых ИИ спотыкается:

• правильный easing — ease-out на появление, никогда ease-in;
• длительность под 300 мс — 180 мс ощущаются отзывчивее, чем 400;
• анимировать только transform и opacity — они идут на GPU, минуя перерасчёт вёрстки;
• не масштабировать из нуля — старт с scale(0.95), а не с 0;
• частотное правило — то, что пользователь видит по сто раз в день, не анимируют вовсе.

По отдельности незаметно. Вместе складывается в ощущение продукта, а не прототипа. Лицензия — MIT, репозиторий — github.com/emilkowalski/skills.

Не конфликтуют ли они

Нет — они про разное и отлично работают в связке. Рабочий порядок:

1. Taste или impeccable init задают структуру, типографику и характер.
2. emil-design-eng добавляет motion.
3. impeccable audit + polish проходят финалом и вычищают остатки slop.

Все три — обычные папки со SKILL.md, они не мешают друг другу; в комьюнити уже собирают объединённые наборы из всех трёх сразу. Точные команды установки под Claude Code, Cursor и Codex, рекомендованные настройки «крутилок» и готовый DESIGN.md-шаблон — в закрытой части, по кодовому слову из видео.