AI Design Skills
6,6kДва скилла для агента: один проводит от вопросов о продукте до готового лендинга со строгой визуальной системой, второй превращает статичный макет из Figma или скриншот в живую анимацию с экспортом в видео и GIF. MIT.
Сами не запускали: описание по документации и репозиторию.
В цифрах
Как это выглядит
Что это
Когда просишь агента сделать лендинг, он обычно сразу пишет код и выдаёт страницу, похожую на тысячу других. AI Design Skills меняет порядок работы. Скилл landing-page-design сначала одним списком спрашивает про цель, аудиторию, возражения и доказательства, потом раскладывает структуру и тексты, и только затем собирает страницу по жёстким правилам: какие шрифты, отступы, скругления, иконки и анимации можно, а какие нельзя. Второй скилл, design-to-motion, берёт готовый макет и оживляет его: элементы появляются из пустого экрана, графики и списки разыгрывают свою историю по кругу, а на выходе ролик для X и два GIF.
От соседних наборов в каталоге он отличается охватом. Emil Kowalski Skills учит агента тонкостям движения внутри интерфейса, а здесь один скилл отвечает за весь путь лендинга от брифа до правил оформления, другой за показ готового дизайна. Набор пригодится тем, кто собирает сайт с Claude Code, Cursor или Codex и хочет, чтобы агент думал о продающей странице, а не только о вёрстке.
Как устроено
.claude/skills проекта и дальше просят обычными словами. Для Cursor, Codex, Windsurf и Cline файл SKILL.md кладут в их файл правил, в Claude.ai загружают в проект.landing-page-design идёт в два шага: сначала опрос, структура страницы и тексты, потом визуальная система. Перед кодом агент показывает план, тексты первого экрана, FAQ и выбор типа страницы.Знать до установки
design-to-motion лучше всего работает со ссылкой на Figma и токеном доступа; с плоской картинки слои разделяются неидеально, и скилл предупреждает об этом сам.
Комментарии