NeVibeCode · 2 909 карточек
Скиллы по теме «Фронтенд и UI»
Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов.
css-native скилл Скилл для ИИ-агента, который подсказывает, как делать анимации и визуальные эффекты на нативном CSS без библиотек.
CX Codex +1
1 100установок
gsap скилл Скилл помогает агенту писать анимации GSAP: таймлайны, каскадные эффекты и ScrollTrigger. Нужен для сложных движений и прокрутки.
CX Codex +1
997установок
canvas-generative скилл Скилл для алгоритмической графики на Canvas 2D: частицы, flow fields, шум, фракталы и L-системы. Пригодится, когда нужна анимация или генеративная картинка в браузере.
CX Codex +1
995установок
r3f-interaction скилл Настраивает события указателя, выбор объектов, перетаскивание и управление камерой в React Three Fiber. Помогает связать ввод мыши и клавиатуры без конфликтов между контроллерами сцены.
CX Codex +1
3 300установок
llm-icon-finder скилл Скилл находит ссылки на иконки AI-моделей и провайдеров из библиотеки lobe-icons и помогает скачать их в SVG, PNG или WEBP.
CX Codex +1
952установок
antv-x6-editor скилл Помогает собрать редактор блок-схем, DAG или ER-диаграмм на @antv/x6 и разобраться с плагинами, портами и ошибками отрисовки.
CX Codex +1
676установок
framer-motion скилл Подсказывает агенту правила работы с Framer Motion и Motion в React: анимации раскладки, жесты и хуки без лишних ререндеров.
CX Codex +1
990установок
desktop-principles скилл Скилл с правилами десктопного UX: ховеры, точность указателя, горячие клавиши, несколько окон. Пригодится, когда интерфейс делают под macOS, Windows или Linux.
CX Codex +1
982установок
om-auto-qa-pr скилл Проверяет визуальные изменения в интерфейсе через реальный браузер, делает скриншоты и формирует отчёт. Пригодится для приёмки пулреквестов или локального дерева файлов.
CX Codex +1
3 200установок
swap-integration скилл Помогает настроить обмен токенов через Uniswap в веб-интерфейсах, бэкенд-скриптах и смарт-контрактах. Пригодится при работе с Trading API или Universal Router.
CX Codex +1
2 200установок
mobile-principles скилл Набор правил для мобильного интерфейса: размеры тап-зон, отказ от hover, зоны большого пальца, safe area и жесты. Подключается, когда агент видит мобильную платформу.
CX Codex +1
974установок
ecommerce-checkout-optimization скилл Разбирает воронку оформления заказа и подсказывает, где покупатели бросают корзину. Пригодится, если конверсия чек-аута проседает.
CX Codex +1
1 200установок
qt-ui-design скилл Скилл для ИИ-агентов, который проводит через проектирование и аудит интерфейсов Qt/QML, веба и встраиваемых панелей: раскладка, навигация, контраст, размеры целей нажатия.
CX Codex +1
1 100установок
qt-qml скилл Скилл внедряет стандарты оформления кода на QML при написании компонентов, рефакторинге и ревью. Пригодится разработчикам интерфейсов на Qt 6.
CX Codex +1
1 100установок
interface-kit скилл Скилл задаёт агенту план работы над интерфейсом: доступность, типографика, сетка, цвет, анимация. Пригодится, когда верстаете компонент или лендинг и не хотите получить шаблонный вид.
CX Codex +1
2 200установок
product-showcase скилл Скилл собирает из работающего веб-приложения многостраничный сайт с реальными скриншотами и GIF-инструкциями. Пригодится, когда интерфейс трудно объяснить одним изображением.
CX Codex +1
1 100установок
onboarding-ux скилл Скилл проходит по приложению как новый пользователь, находит места, где он застрянет, и пишет текст с кодом для пустых состояний, подсказок и приветствия.
CX Codex +1
1 100установок
ui-craft скилл Скилл для дизайна и вёрстки интерфейсов: сначала разведка проекта, потом код. Помогает уйти от типовых AI-макетов.
CX Codex +1
1 400установок
ui-mobile скилл Задаёт агенту правила мобильного интерфейса: минимальный размер нажатия 44×44, контраст по WCAG 2.1 AA, видимые границы кнопок.
CX Codex +1
1 200установок
compatibility-testing скилл Скилл помогает настроить кроссбраузерное и адаптивное тестирование вёрстки на разных экранах. Пригодится перед релизом и после крупных правок стилей в веб-проекте.
CX Codex +1
651установок
workflow-progress-screenshots скилл Скилл обязывает агента присылать реальные скриншоты интерфейса по ходу работы, а не в конце задачи. Пригодится при правках фронтенда, анимаций, 3D-сцен и вёрстки.
CX Codex +1
341установок
compose-multiplatform скилл Скилл помогает писать кроссплатформенный интерфейс на Compose Multiplatform для Android, iOS, Desktop и Web. Пригодится при переносе общих компонентов в commonMain.
CX Codex +1
951установок
apple-launch-film скилл Собирает лонч-фильм в стиле Apple для Mac целиком в коде: меню-бар, чёлку, виджеты и градиентные обои. Пригодится, когда нужен ролик без записи экрана и After Effects.
CX Codex +1
1 500установок
title-sequence-3d скилл Скилл собирает кинематографичный 3D-опенер на Three.js в одном HTML-файле. Пригодится, когда для видеоролика или рассылки нужна яркая заставка с неоновыми вывесками и логотипами.
CX Codex +1
1 500установок
launch-video скилл Собирает промо-ролики для запуска продуктов на 30–45 секунд в виде автономного HTML-файла с покадровой анимацией и экспортом в MP4. Пригодится при релизе SaaS или курса.
CX Codex +1
1 500установок
ux-designer скилл Скилл для ревью и сборки интерфейсов: проверяет доступность, состояния экранов и микрокопирайт, подсказывает числа для отступов и контраста.
CX Codex +1
1 600установок
swiftui-motion скилл Задаёт правила и готовые паттерны анимаций SwiftUI для ИИ-агента. Помогает настроить пружины, переходы и многофазные эффекты без лишнего визуального мусора.
CX Codex +1
943установок
compose-motion скилл Скилл по анимациям Jetpack Compose: подсказывает, какой API взять под задачу, и даёт готовые спеки пружин. Для Android и Compose Multiplatform.
CX Codex +1
943установок
swiftui-graphics скилл Скилл для продвинутой графики SwiftUI: Metal-шейдеры, .visualEffect, Liquid Glass из iOS 26 и Canvas. Пригодится, когда встроенных модификаторов уже не хватает.
CX Codex +1
939установок
compose-graphics скилл Скилл для продвинутой графики в Jetpack Compose: пружинная физика Material 3 Expressive, AGSL-шейдеры, Canvas и эффекты graphicsLayer.
CX Codex +1
937установок
frontend-testing-debugging
официальный скилл Помогает агенту находить баги в интерфейсе, проверять локальный dev-сервер и верстку. Организует пошаговую валидацию через плагин Browser или Playwright.
CX Codex GP ChatGPT
159установок
design-system скилл Собирает дизайн-систему по скриншотам или макетам и записывает её сразу в два файла: docs/design.md для агента и docs/design.html для браузера.
CX Codex +1
1 800установок
svelte5-best-practices скилл Скилл для ИИ-агента, который подсказывает руны Svelte 5, сниппеты и паттерны SvelteKit при написании и рефакторинге компонентов.
CX Codex +1
16 600установок
swiss-design скилл Скилл задаёт ИИ-агенту дизайн-систему в духе швейцарского интернационального стиля: типографика IBM Plex Sans, сетка, оттенки stone и акцентный цвет.
CX Codex +1
951установок
paper-cinder-transition скилл Скилл для WebGL-перехода между сценами: линия огня съедает старую страницу и открывает новую. Пригодится, когда fade или slide выглядит дешёво.
CX Codex +1
330установок
responsive-patterns скилл Скилл внедряет правила адаптивной вёрстки на Container Queries, subgrid и fluid typography в React. Помогает строить гибкие интерфейсы без десятков медиа-запросов.
CX Codex +1
1 600установок
craft-design-engineering скилл Скилл с правилами дизайн-инженерии: типографика, цвет, отступы, анимации и цифры. Пригодится, когда доводишь UI до аккуратного вида.
CX Codex +1
479установок
wireframe скилл Проектирует структуру экранов: что на них есть, где стоит и что важнее. Пригодится, пока макет ещё дешёво переделать.
CX Codex +1
2 300установок
3d-orbit-inspect-demo скилл Скилл для Three.js: объект наклоняется под курсором, а по клику поднимается в руку для осмотра. Пригодится для карточек товара и портфолио.
CX Codex +1
321установок
edgeone скилл Публикует HTML-разметку или проект сайта на EdgeOne Pages и возвращает публичную ссылку. Пригодится, когда нужно быстро показать страницу без регистрации.
CX Codex +1
2 200установок
1 281–1 320 из 2 909
