awwwards — скилл
Навык /awwwards для Claude Code: арт-дирекшен фронтенда по критериям Awwwards, с типографикой, цветом, движением и WebGL.
- 59 ★ репозитория
- Последний коммит
Минимальный доступ
Почему такой уровень
- Навык описывает приемы верстки и дизайна и сам ничего не запускает
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add skills/awwwardsОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемМинимальный доступИнструмент ничего не запускает и не ходит в сеть.
- Навык описывает приемы верстки и дизайна и сам ничего не запускает
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
Навык `/awwwards` включает в Claude Code режим старшего креативного директора для верстки и интерфейсов, нацеленный на уровень сайта дня на Awwwards, оценка от 8.0. Он срабатывает вручную или сам при фронтенд-задаче. Сначала агент задает арт-направление: эмоцию, архетип и отраслевой контекст, и только потом пишет код. В набор входит основной файл `SKILL.md` и семь справочников: типографика с плавными шкалами через `clamp()` и подбором пар, цветовые системы на oklch, раскладки вроде бенто-сеток, моушн на GSAP, приемы CSS вроде прокрутки по анимации и `:has()`, WebGL с Three.js и шейдерами, философии студий и критерии жюри Awwwards. Рекомендуемая вставка для `CLAUDE.md` закрепляет принципы: не больше двух шрифтов, анимация только `transform` и `opacity`, загрузка меньше трех секунд.
Для кого. Фронтенд-разработчикам и дизайнерам, которые верстают лендинги и портфолио в Claude Code и хотят получить авторский результат вместо шаблонного.
Подходит, если
- Лендинг студии должен выглядеть дорого, а не как стандартный шаблон на сетке
- Для страницы нужна пара шрифтов и плавная шкала размеров без брейкпоинтов
- Герою страницы нужна анимация прокрутки на GSAP без потери частоты кадров
- В сцене на Three.js надо уложиться в бюджет производительности
Не подходит, если
- Нужен деловой интерфейс или админка, где важнее ясность и скорость, чем эффектность
- Проект ограничен жестким брендбуком с готовыми шрифтами и цветами
- Страница должна работать на слабых устройствах без WebGL и тяжелой анимации
Пример запроса к агенту
Вызови /awwwards и предложи арт-направление для лендинга студии звукозаписи, затем собери героя страницы с анимацией прокрутки.Ограничения
Навык задает вкусовые ориентиры, а не проверяемые гарантии: оценка 8.0 на Awwwards зависит от жюри и конкретного сайта. Поставляется как папка с `SKILL.md` и справочниками, менеджера пакетов нет, а команда клонирования использует SSH. Рекомендуемая вставка в `CLAUDE.md` заставляет агента вызывать навык для любой фронтенд-задачи, и на простых правках контекст тратится зря. Лицензия в репозитории не указана, тренды в справочниках датированы 2025–2026 годами.
Как отключить. Удалите папку `~/.claude/skills/awwwards` и, если добавляли, абзац про навык из `CLAUDE.md`.
Частые вопросы
Как вызвать навык?
Командой `/awwwards` вручную, либо агент подхватывает его сам, когда задача касается фронтенда и интерфейсов.
Что лежит в справочниках?
Семь файлов: типографика, цвет, раскладки, моушн, приемы CSS, WebGL и философия студий с критериями жюри.
Зачем вставка в `CLAUDE.md`?
Она требует звать `/awwwards` для любой фронтенд-работы и закрепляет принципы: арт-направление до кода, два шрифта, анимация `transform` и `opacity`.
Подходит ли навык для Codex?
В README он описан для Claude Code. Файлы `SKILL.md` можно подключить и в другой агент, но совместимость не заявлена.
Что считать целью по качеству?
Уровень сайта дня на Awwwards с оценкой от 8.0. Это ориентир для оформления, а не результат, который навык гарантирует.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
Скиллыawwwards и jury
awwwards and jury
Скилл /awwwards собирает анимированный сайт с WebGL по одной фразе, а /jury оценивает любой сайт по критериям жюри Awwwards
MCP-сервер, который ищет образцы среди сайтов-победителей Awwwards и разбирает анимацию и структуру любой страницы
Сборник скиллов Claude Code по копирайтингу, рекламе, SEO и дизайну интерфейсов: Ogilvy, редактура, правила и CSS-приемы.
35 скиллов для Cursor, Claude и Codex: дизайн-системы из HTML и макетов, генерация картинок, допрос по плану и передача контекста.
Команда /fireworks-design в Claude Code параллельно пробует 6–8 стилей, судит по шести критериям и доводит лучший до страницы.
Скилл дизайна веб-страниц для Claude Code: сначала спецификация DESIGN.md, потом код по ней
Коротко о README
Навык начинается с арт-направления, а не с кода. Семь справочников дают конкретные приемы вместо общих советов о красоте.