Продукт ITfresh · AI-разработка

Дизайн-скилл Design: интерфейсы от ИИ, которые не выглядят как ИИ

Design — модуль дизайн-интеллекта для Claude Code, собранный ITfresh из шести лучших мировых практик AI-дизайна. Он заставляет нейросеть работать как сильный продуктовый дизайнер: сначала бриф и реальные ассеты, потом выбор смелого направления, дизайн-токены с посчитанным контрастом — и только затем код, который скилл сам проверяет скриншотами в браузере.

Прошёл адверсариальное ревью Opus 5 · применяется в проектах ITfresh
6
мировых практик в синтезе
18
отраслевых пресетов дизайна
11
категорий тех-контроля
4
брейкпоинта верификации
Простыми словами

Почему AI-дизайн серый — и как скилл это лечит

Любая нейросеть, когда её просят «сделай красиво», выдаёт статистическое среднее всех сайтов интернета: шрифт Inter, фиолетовый градиент, три одинаковые карточки. Это называют дистрибутивной конвергенцией — миллион сайтов от ИИ, и все на одно лицо.

Скилл — это модуль знаний и правил, который подключается к AI-агенту (Claude Code) и меняет сам процесс работы. Design не даёт модели прыгнуть сразу в код: сначала — реальные ассеты и факты о вашем бизнесе, затем осознанный выбор эстетики под отрасль, затем дизайн-система в токенах. И в конце — обязательная проверка результата скриншотами в настоящем браузере.

Итог для бизнеса: сайт от ИИ за часы, но с лицом, которое запоминается, — а не с шаблоном, который посетитель видел уже сто раз на сайтах конкурентов.

Бриф и ассеты

Логотип, брендбук, действующий сайт, факты о продукте. Скилл запрещает выдумывать контент — только реальное.

Направление и токены

Одна смелая эстетика под отрасль + дизайн-система: палитра с посчитанным контрастом, пара шрифтов с кириллицей, сетка, motion.

Сборка и верификация

Код собирается по токенам, затем скилл сам рендерит страницу на 4 размерах экрана, смотрит скриншоты и чинит найденное.

Возможности

Что внутри скилла Design

Шесть подсистем закрывают полный цикл: от выбора эстетики до технического контроля доступности и производительности.

Матрица 18 отраслей

Финтех, медицина, e-commerce, люкс, промышленность… Для каждой — готовый стиль, hex-палитра, пара шрифтов с проверенной кириллицей и характер анимации. Плюс запасная пара против «одинаковости».

клиника → Soft minimal · Literata · #0E7C7B

Три «крутилки вкуса»

Смелость макета, интенсивность анимации, плотность информации — по шкале 1–10. Каждое значение привязано к конкретным приёмам в коде, а не к пожеланиям.

дашборд = 3/2/8: строгая сетка, минимум движения, плотные данные

Анти-slop фильтр

Жёсткий запрет штампов машинного дизайна: фиолетовые градиенты, emoji вместо иконок, стены одинаковых карточек, lorem ipsum и выдуманные факты о вашем продукте.

каждый проект — своё лицо, повторы между проектами запрещены

Дизайн-токены + DESIGN.md

Вся система — в переменных: цвета, шрифты, отступы, тени, длительности. Для многостраничных проектов — паспорт дизайна DESIGN.md: токен, правило и «почему» в одном файле.

следующая доработка не сломает стиль: система зафиксирована

Верификация в браузере

Скилл не сдаёт работу «на глаз»: рендерит страницу через Playwright на 375, 768, 1024 и 1440 px, изучает скриншоты и чинит переполнения, поехавшие сетки и нечитаемый контраст.

мобильная версия проверена до сдачи, а не после жалобы

Тех-ревью: 11 категорий

Доступность WCAG, формы, клавиатура и фокус, анимации, типографика, изображения, производительность, тёмная тема, мобильные касания, локализация — по чек-листу из 60+ правил.

контраст 4.5:1 посчитан скриптом; фокус видим; iOS не зумит формы
Происхождение

Из чего собран — шесть источников синтеза

Мы разобрали лучшие мировые дизайн-скиллы для 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: палитра считается до вёрстки. «Вроде читаемо» в качестве аргумента не принимается.

Анти-конвергенция

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

Скилл живёт в системе контроля версий, синхронизируется между рабочими средами ITfresh и развивается с каждым проектом — улучшения достаются всем клиентам сразу.
Статус продукта

Готов и работает в наших проектах

Design — рабочий инструмент ITfresh: на нём мы делаем сайты, лендинги и веб-интерфейсы для клиентов. Вы получаете его пользу двумя способами: заказываете разработку у нас — или внедряете скилл в собственную команду вместе с настройкой Claude Code.

Внедрение включает установку скилла, адаптацию отраслевой матрицы под ваш бренд, настройку браузерной верификации и обучение команды процессу.

Сайт под ключ или внедрение в команду
Стоимость зависит от задачи: лендинг, многостраничник, дашборд или обучение вашей команды AI-пайплайну. Точную цену назовём после короткого разговора о проекте.
  • Исследование — разобраны 6 мировых дизайн-скиллов и каталогов практик
  • Синтез — единая система: матрица отраслей, крутилки вкуса, токены, верификация
  • Адверсариальное ревью — Opus 5 как строжайший критик, 35 находок исправлено
  • Работа на проектах — скилл применяется в разработке для клиентов ITfresh
  • Публичная версия — открытый релиз с документацией для сообщества

Хотите сайт, который не выглядит как AI-шаблон?

Расскажите про ваш бизнес и задачу — лендинг, корпоративный сайт, дашборд или внедрение AI-дизайн-процесса в вашу команду. Покажем живые примеры работы скилла и предложим план.

← Посмотреть все продукты ITfresh