AIKraft/Skills/extract

extract

Извлекает и консолидирует переиспользуемые компоненты, дизайн-токены и паттерны в дизайн-систему. Полезен при создании компонентов, рефакторинге UI или построении дизайн-системы.

pbakaus official Разработка ★ 76.2k

Что делает навык

Навык идентифицирует переиспользуемые паттерны, компоненты и дизайн-токены в целевой области, а затем извлекает и консолидирует их в дизайн-систему для систематического повторного использования. Он решает задачу создания или рефакторинга дизайн-системы, устраняя дублирование и жестко закодированные значения.

Когда применять

  • Создание дизайн-системы с нуля при отсутствии существующей структуры.
  • Рефакторинг UI для выявления и устранения повторяющихся компонентов и стилей.
  • Консолидация разрозненных дизайн-токенов (цвета, отступы, типографика) в единую структуру.
  • Стандартизация компонентов (например, кнопок или карточек) для устранения несогласованных вариаций.

Как работает

  1. Найти дизайн-систему, библиотеку компонентов или общую директорию UI, используя поиск по ключевым словам (например, 'design system', 'ui', 'components').
  2. Проанализировать структуру существующей дизайн-системы: конвенции именования компонентов, структуру токенов, паттерны документации и соглашения об импорте/экспорте.
  3. Если дизайн-система отсутствует, обязательно спросить пользователя о предпочтительном расположении и структуре перед созданием.
  4. Выявить повторяющиеся компоненты (кнопки, карточки, инпуты) и жестко закодированные значения (цвета, отступы, тени), которые следует преобразовать в токены.
  5. Обнаружить несогласованные вариации одних и тех же концепций (например, несколько стилей кнопок) и паттерны компоновки, подлежащие систематизации.
  6. Извлечь и консолидировать выявленные элементы в дизайн-систему для обеспечения переиспользуемости.

Примеры запросов агенту

Найди повторяющиеся компоненты в проекте и извлеки их в общую дизайн-систему.
Проанализируй UI-код на наличие жестко закодированных цветов и отступов, преобразуй их в токены.
Устрани дублирование стилей кнопок, консолидируй их в единый компонент дизайн-системы.

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «extract» из репозитория: # https://github.com/pbakaus/impeccable
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r extract/ ~/.claude/skills/extract/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.