# Скиллы по теме «Дизайн» Скиллы по теме «Дизайн»: у каждой карточки — что делает, команда установки и примеры запросов. 2133 карточки · страница 19 из 54 - HTML: https://affpapa.org/nevibecode/skills/topic/design?page=19 - Инструкция для агента: https://affpapa.org/nevibecode/agents.md - [spacing-system](https://affpapa.org/nevibecode/skills/spacing-system.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2300 установок — Задаёт шкалу отступов на базе 4px или 8px и правила её применения в UI. - [heuristic-evaluation](https://affpapa.org/nevibecode/skills/heuristic-evaluation.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2400 установок — Скилл проверяет интерфейс по эвристикам Nielsen и критериям домена, а затем расставляет найденным проблемам оценки серьёзности. - [presentation-creator](https://affpapa.org/nevibecode/skills/presentation-creator.md) — скилл · getsentry · Claude Code, Codex, Cursor +3 · 2900 установок — Создаёт интерактивные слайды на React и Vite в стиле Sentry. - [animejs](https://affpapa.org/nevibecode/skills/animejs.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2800 установок — Скилл для ИИ-агента, который подсказывает синтаксис Anime.js: таймлайны, stagger, морфинг SVG и покадровые последовательности. - [apple-hig-expert](https://affpapa.org/nevibecode/skills/apple-hig-expert.md) — скилл · Alireza Rezvani · Claude Code · 662 установки — Проверяет интерфейсы iOS, macOS, watchOS и visionOS по Apple HIG. - [figure-spec](https://affpapa.org/nevibecode/skills/figure-spec.md) — скилл · wanshuiyin · Claude Code, Codex, Cursor +3 · 456 установок — Создаёт редактируемые SVG-диаграммы из JSON-описания FigureSpec. - [liquid-metal-border](https://affpapa.org/nevibecode/skills/liquid-metal-border.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Добавляет и настраивает анимированные WebGL-рамки из metal-fx для кнопок, карточек и выбранных элементов React-интерфейса. - [beam-glow-states](https://affpapa.org/nevibecode/skills/beam-glow-states.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Скилл для React-интерфейсов: подключает анимированное свечение границ из пакета border-beam к состояниям загрузки, выбора и фокуса. - [no-ai-design-slop](https://affpapa.org/nevibecode/skills/no-ai-design-slop.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Пассивный фильтр качества дизайна: ловит рефлекторные решения и типовые дефекты интерфейса, пока вы пишете или правите UI. - [documentary-brutalist-agency](https://affpapa.org/nevibecode/skills/documentary-brutalist-agency.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Скилл для вёрстки сайтов креативных агентств и портфолио: жёсткая типографика, чёрно-белые главы, документальные коллажи. - [thinking-orbs](https://affpapa.org/nevibecode/skills/thinking-orbs.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Обучает агента внедрять анимированные Canvas-индикаторы статуса нейросети из библиотеки thinking-orbs в React 18+. - [editorial-service-booking](https://affpapa.org/nevibecode/skills/editorial-service-booking.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Помогает спроектировать сайт услуг с записью: от редакционной подачи процедур до устойчивого сценария выбора времени. - [operational-enterprise-ai](https://affpapa.org/nevibecode/skills/operational-enterprise-ai.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Скилл для вёрстки и переделки страниц enterprise-продуктов: границы системы, согласования, аудит, исключения и откат. - [generate-reference-inspired-brand-worlds](https://affpapa.org/nevibecode/skills/generate-reference-inspired-brand-worlds.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Помогает создавать серии брендовых концепций по визуальному референсу без копирования охраняемых элементов стиля. - [audit-reference-originality](https://affpapa.org/nevibecode/skills/audit-reference-originality.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Сравнивает готовый сайт с референсами и помечает совпадения текста, брендов, чисел, картинок и кода. - [browser-video-recording](https://affpapa.org/nevibecode/skills/browser-video-recording.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Собирает демо-видео интерфейса в 4K 60 fps с пропорциями 4:3 из снимков браузера. - [add-shader-cursor-trail](https://affpapa.org/nevibecode/skills/add-shader-cursor-trail.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1300 установок — Добавляет в проект hero-эффект на WebGPU: белый мерцающий полутоновый след за курсором с хроматическими волнами и плёночным зерном. - [shaders-cursor-ripples](https://affpapa.org/nevibecode/skills/shaders-cursor-ripples.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1400 установок — Встраивает водяную рябь на WebGPU поверх изображений с помощью библиотеки shaders. - [slide-maker](https://affpapa.org/nevibecode/skills/slide-maker.md) — скилл · addsumtech · Claude Code, Codex, Cursor +3 · 1200 установок — Создаёт, перерабатывает и рецензирует презентации .pptx на базе исходных документов, кода или заметок. - [rive-interactive](https://affpapa.org/nevibecode/skills/rive-interactive.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2600 установок — Скилл для работы с Rive: стейт-машины, ввод от пользователя и привязка данных к анимации в React. - [lightweight-3d-effects](https://affpapa.org/nevibecode/skills/lightweight-3d-effects.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2600 установок — Скилл для декоративных 3D-элементов и микроанимаций: псевдо-3D иллюстрации, живые фоны, наклон карточек под курсор. - [usability-test-plan](https://affpapa.org/nevibecode/skills/usability-test-plan.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Собирает план юзабилити-теста: вопросы исследования, методологию, критерии отбора участников, метрики и скрипт модератора. - [case-study](https://affpapa.org/nevibecode/skills/case-study.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Скилл помогает составить дизайн-кейс для портфолио с описанием процесса, метрик и результатов. - [design-token](https://affpapa.org/nevibecode/skills/design-token.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Помогает описать токены цвета, отступов, типографики и теней: категории, уровни и правила именования. - [error-handling-ux](https://affpapa.org/nevibecode/skills/error-handling-ux.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Скилл для проектирования ошибок в продукте: как их предотвратить, показать и дать пользователю выход. - [design-qa-checklist](https://affpapa.org/nevibecode/skills/design-qa-checklist.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Генерирует систематический чек-лист для проверки вёрстки на соответствие дизайну. - [loading-states](https://affpapa.org/nevibecode/skills/loading-states.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Проектирует состояния ожидания: скелетоны, индикаторы, постепенную загрузку и оптимистичные обновления. - [design-critique](https://affpapa.org/nevibecode/skills/owl-listener-design-critique.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Скилл ведёт командный разбор макета: рамка сессии, правила обратной связи и список задач с ответственными. - [state-machine](https://affpapa.org/nevibecode/skills/owl-listener-state-machine.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Скилл помогает спроектировать поведение интерфейса через конечные автоматы: состояния, переходы, события и гарды. - [design-token-audit](https://affpapa.org/nevibecode/skills/design-token-audit.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Проверяет, где в проекте обходят дизайн-токены: находит захардкоженные значения, дубли и пробелы в наборе токенов. - [animation-principles](https://affpapa.org/nevibecode/skills/owl-listener-animation-principles.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 установок — Скилл для настройки одной конкретной анимации в интерфейсе: подбирает easing, длительность и порядок движения элементов. - [wireframe-spec](https://affpapa.org/nevibecode/skills/wireframe-spec.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2300 установок — Составляет текстовые спецификации вайрфреймов с приоритетами контента и заметками о поведении элементов. - [micro-interaction-spec](https://affpapa.org/nevibecode/skills/micro-interaction-spec.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2300 установок — Описывает одну микромикровзаимодействие целиком: триггер, правила, отклик, циклы и режимы. - [paper-illustration-image2](https://affpapa.org/nevibecode/skills/paper-illustration-image2.md) — скилл · wanshuiyin · Claude Code, Codex, Cursor +3 · 439 установок — Скилл генерирует научные иллюстрации для публикаций через локальный мост Codex app-server. - [ant-design](https://affpapa.org/nevibecode/skills/ant-design.md) — скилл · ant-design · Claude Code, Codex, Cursor +3 · 4100 установок — Скилл-справочник по antd 6.x, Ant Design Pro 5 и Ant Design X v2. - [bencium-controlled-ux-designer](https://affpapa.org/nevibecode/skills/bencium-controlled-ux-designer.md) — скилл · bencium · Claude Code, Codex, Cursor +3 · 4600 установок — Помогает обсуждать визуальные решения для веб-интерфейсов до правок кода. - [ui-design-brain](https://affpapa.org/nevibecode/skills/ui-design-brain.md) — скилл · carmahhawwari · Claude Code, Codex, Cursor +3 · 845 установок — Скилл помогает создавать интерфейсы по реальным паттернам компонентов и правилам дизайн-систем. - [swiftui-liquid-glass](https://affpapa.org/nevibecode/skills/dpearson2699-swiftui-liquid-glass.md) — скилл · dpearson2699 · Claude Code, Codex, Cursor +3 · 4100 установок — Скилл помогает добавлять и проверять Liquid Glass в интерфейсах SwiftUI для iOS 26+. - [locomotive-scroll](https://affpapa.org/nevibecode/skills/locomotive-scroll.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2500 установок — Скилл помогает внедрить Locomotive Scroll: плавную прокрутку, параллакс и анимации от скролла. - [accessibility-test-plan](https://affpapa.org/nevibecode/skills/accessibility-test-plan.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 установок — Помогает спланировать тестирование доступности интерфейса с ассистивными технологиями и реальными пользователями. Дальше: https://affpapa.org/nevibecode/skills/topic/design.md?page=20 ## Уточнить [ui](https://affpapa.org/nevibecode/tag/ui.md) · [animation](https://affpapa.org/nevibecode/tag/animation.md) · [css](https://affpapa.org/nevibecode/tag/css.md) · [design-system](https://affpapa.org/nevibecode/tag/design-system.md) · [accessibility](https://affpapa.org/nevibecode/tag/accessibility.md) · [react](https://affpapa.org/nevibecode/tag/react.md) · [ux](https://affpapa.org/nevibecode/tag/ux.md) · [image-generation](https://affpapa.org/nevibecode/tag/image-generation.md) · [tailwind](https://affpapa.org/nevibecode/tag/tailwind.md) · [typography](https://affpapa.org/nevibecode/tag/typography.md) · [html](https://affpapa.org/nevibecode/tag/html.md) · [design-tokens](https://affpapa.org/nevibecode/tag/design-tokens.md) ## Сузить этот список Параметры: `?platform=`, `&topic=<…>`, `&sort=installs|stars|new|updated` — значения в https://affpapa.org/nevibecode/agents.md --- NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md