Почему AI-дизайн серый — и как скилл это лечит
Любая нейросеть, когда её просят «сделай красиво», выдаёт статистическое среднее всех сайтов интернета: шрифт Inter, фиолетовый градиент, три одинаковые карточки. Это называют дистрибутивной конвергенцией — миллион сайтов от ИИ, и все на одно лицо.
Скилл — это модуль знаний и правил, который подключается к AI-агенту (Claude Code) и меняет сам процесс работы. Design не даёт модели прыгнуть сразу в код: сначала — реальные ассеты и факты о вашем бизнесе, затем осознанный выбор эстетики под отрасль, затем дизайн-система в токенах. И в конце — обязательная проверка результата скриншотами в настоящем браузере.
Бриф и ассеты
Логотип, брендбук, действующий сайт, факты о продукте. Скилл запрещает выдумывать контент — только реальное.
Направление и токены
Одна смелая эстетика под отрасль + дизайн-система: палитра с посчитанным контрастом, пара шрифтов с кириллицей, сетка, motion.
Сборка и верификация
Код собирается по токенам, затем скилл сам рендерит страницу на 4 размерах экрана, смотрит скриншоты и чинит найденное.
Что внутри скилла Design
Шесть подсистем закрывают полный цикл: от выбора эстетики до технического контроля доступности и производительности.
Матрица 18 отраслей
Финтех, медицина, e-commerce, люкс, промышленность… Для каждой — готовый стиль, hex-палитра, пара шрифтов с проверенной кириллицей и характер анимации. Плюс запасная пара против «одинаковости».
Три «крутилки вкуса»
Смелость макета, интенсивность анимации, плотность информации — по шкале 1–10. Каждое значение привязано к конкретным приёмам в коде, а не к пожеланиям.
Анти-slop фильтр
Жёсткий запрет штампов машинного дизайна: фиолетовые градиенты, emoji вместо иконок, стены одинаковых карточек, lorem ipsum и выдуманные факты о вашем продукте.
Дизайн-токены + DESIGN.md
Вся система — в переменных: цвета, шрифты, отступы, тени, длительности. Для многостраничных проектов — паспорт дизайна DESIGN.md: токен, правило и «почему» в одном файле.
Верификация в браузере
Скилл не сдаёт работу «на глаз»: рендерит страницу через Playwright на 375, 768, 1024 и 1440 px, изучает скриншоты и чинит переполнения, поехавшие сетки и нечитаемый контраст.
Тех-ревью: 11 категорий
Доступность WCAG, формы, клавиатура и фокус, анимации, типографика, изображения, производительность, тёмная тема, мобильные касания, локализация — по чек-листу из 60+ правил.
Из чего собран — шесть источников синтеза
Мы разобрали лучшие мировые дизайн-скиллы для AI-агентов, взяли сильное из каждого и переработали в единую систему под русскоязычные проекты.
Anthropic Frontend Design
официальный скилл AnthropicБазовая философия: смелое эстетическое направление до кода, отказ от «средних» решений, соответствие сложности кода амбициям дизайна.
UI/UX Pro Max
самый популярный дизайн-скилл, 23 000+ ★Идея отраслевых баз: стили, палитры, шрифтовые пары под тип продукта, чек-лист перед сдачей и персистентная дизайн-система проекта.
Vercel Web Interface Guidelines
100+ правил инженерии интерфейсовДоступность, фокус, формы, производительность, тёмная тема, i18n — переработаны в наш чек-лист из 11 категорий с русской типографикой.
Taste Skill + Claude Design
+ каталог awesome-claude-design«Крутилки вкуса», работа от реальных ассетов, режим советника с тремя направлениями на выбор и формат дизайн-паспорта DESIGN.md.
Ключевая адаптация — кириллица. Мировые скиллы советуют шрифты, треть которых не имеет русских букв: заголовок молча превращается в системный Arial. В Design каждый шрифт проверен на поддержку кириллицы, а для латинских красавцев прописаны русские замены.
Проверен строже, чем принято у людей
Перед выпуском скилл прошёл адверсариальное ревью — отдельная AI-модель Opus 5 в роли беспощадного арт-директора искала, к чему придраться.
35 находок ревью — учтены
Критик проверил каждый факт, каждое правило и каждый шрифт. Все замечания — от нормативов WCAG до внутренних противоречий — исправлены до релиза.
Кириллица — фактчек по глифам
Каждый рекомендуемый шрифт проверен по официальному реестру Google Fonts, а не «по памяти» нейросети — классическая ошибка мировых скиллов.
Контраст — математикой
В скилл встроен скрипт расчёта контраста по формуле WCAG: палитра считается до вёрстки. «Вроде читаемо» в качестве аргумента не принимается.
Анти-конвергенция
Правило против «одинаковых сайтов»: скилл обязан варьировать направления, шрифты и темы между проектами — у каждого клиента своё лицо.
Готов и работает в наших проектах
Design — рабочий инструмент ITfresh: на нём мы делаем сайты, лендинги и веб-интерфейсы для клиентов. Вы получаете его пользу двумя способами: заказываете разработку у нас — или внедряете скилл в собственную команду вместе с настройкой Claude Code.
Внедрение включает установку скилла, адаптацию отраслевой матрицы под ваш бренд, настройку браузерной верификации и обучение команды процессу.
- Исследование — разобраны 6 мировых дизайн-скиллов и каталогов практик
- Синтез — единая система: матрица отраслей, крутилки вкуса, токены, верификация
- Адверсариальное ревью — Opus 5 как строжайший критик, 35 находок исправлено
- Работа на проектах — скилл применяется в разработке для клиентов ITfresh
- Публичная версия — открытый релиз с документацией для сообщества