extract

Name: extract
Availability: InStock
Author: ky-zo

Identify reusable UI patterns, components, and design tokens for consolidation.

Updated Aug 12, 2023

Search Tags:#components #migration #patterns #tokens #design-system #extract

Ready to run

npx skills add https://github.com/ky-zo/kyzo --skill extract-ky-zo

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: extract
Source: https://github.com/ky-zo/kyzo/tree/main/.agents/skills/extract
Command: npx skills add https://github.com/ky-zo/kyzo --skill extract-ky-zo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Identify opportunities to consolidate reusable UI patterns, components, and design tokens into a centralized design system.

Core Features & Use Cases

Pattern extraction: Locate repeated UI patterns, tokens, and components to standardize across products.
Token creation & consolidation: Turn hard-coded values into semantic design tokens for reuse and maintainability.
Migration planning: Outline steps to replace scattered implementations with shared, versioned assets.
Documentation & governance: Update design-system docs and guidelines to reflect the new shared resources.

Quick Start

Identify and consolidate reusable patterns and tokens from the target area into the design system.

Frequently Asked Questions about extract

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I consolidate reusable UI patterns into a centralized design system?▼

To consolidate reusable UI patterns into a design system, locate repeated component implementations and hard-coded values, then standardize them into shared, versioned assets and semantic design tokens for ongoing maintenance.

How do I turn hard-coded styling values into semantic design tokens?▼

Turning hard-coded styling values into semantic design tokens involves identifying scattered styling implementations across products and converting them into centralized, reusable tokens to ensure maintainability and consistency.

What is the best way to plan a design-system migration across multiple products?▼

The best way to plan a design-system migration is to outline structured steps to replace fragmented UI implementations and inconsistent styling with shared, versioned assets, ensuring consistent updates to documentation and governance.

Can I use this to extract components from projects with fragmented UI implementations?▼

Yes, you can extract components from projects with fragmented UI implementations. The process identifies repeated UI patterns to standardize across products and supports structured component extraction to centralize shared resources.

When do I need to update design-system documentation and governance guidelines?▼

You need to update design-system documentation and governance guidelines after extracting new shared resources and tokens, ensuring the living system accurately reflects the newly standardized components and migration steps.