Пишешь агенту: «собери лендинг для SaaS».
Он приносит фиолетовый градиент, три карточки, заголовок на полэкрана и
Get started. Иногда ещё стеклянный navbar, чтоб совсем без шансов.Первый такой сайт выглядит нормально. Потом они все сливаются в одну папку
final-final-2.Собрал 5 скиллов, которыми можно это подправить.
1. UI UX Pro Max
Когда сайт делаешь с нуля.
Помогает выбрать стиль под сам продукт: шрифты, цвета, плотность интерфейса, блоки, UX-паттерны. Лендинг, личный кабинет, приложение — без разницы.
https://github.com/nextlevelbuilder/ui-ux-pro-max-skill
2. Taste Skill
Когда сайт уже собран, но выглядит как результат промпта «сделай современно и красиво».
Скилл сначала смотрит, что за продукт и кто им будет пользоваться. Потом чистит одинаковые карточки, дефолтные шрифты, градиенты и прочие следы вайбкодинга.
Я бы запускал после первой рабочей версии.
https://github.com/Leonxlnx/taste-skill
3. Brandkit
Для нового продукта или личного бренда.
Собирает палитру, типографику, направление для логотипа и базовые правила. Потом не приходится на каждой странице снова думать, почему тут зелёная кнопка, а тут вдруг синяя.
https://github.com/Leonxlnx/taste-skill/tree/main/skills/brandkit
4. Frontend Visual QA
Для меня самый обязательный.
Агент открывает готовый сайт в браузере, делает скриншоты и ищет то, что код-ревью обычно не ловит: текст обрезался, кнопка уехала, на мобиле всё поехало.
Можно кинуть ему одной строкой:
Прогони интерфейс через Visual QA и исправь найденные проблемыhttps://github.com/daymade/claude-code-skills/tree/main/frontend-visual-qa
5. Web Animation Skills
Анимации скролла, переходы, микроанимации, SVG.
Нужная штука, если хочется, чтобы интерфейс не стоял как скриншот. Главное не дать агенту добавить анимацию на каждый чих.
https://github.com/iart-ai/web-animation-skills
Я бы делал так:
Brandkit → UI UX Pro Max → Taste Skill → Web Animation Skills → Frontend Visual QA