← ClaudeAtlas

extractlisted

extract 抽取:识别 reusable components/design tokens/patterns,整合进设计系统。
wzyxdwll/ccgx-workflow · ★ 12 · Data & Documents · score 85
Install: claude install-skill wzyxdwll/ccgx-workflow
Identify reusable patterns, components, and design tokens, then extract and consolidate them into the design system for systematic reuse. ## Discover Analyze the target area to identify extraction opportunities: 1. **Find the design system**: Locate your design system, component library, or shared UI directory (grep for "design system", "ui", "components", etc.). Understand its structure: - Component organization and naming conventions - Design token structure (if any) - Documentation patterns - Import/export conventions **CRITICAL**: If no design system exists, ask before creating one. Understand the preferred location and structure first. 2. **Identify patterns**: Look for: - **Repeated components**: Similar UI patterns used multiple times (buttons, cards, inputs, etc.) - **Hard-coded values**: Colors, spacing, typography, shadows that should be tokens - **Inconsistent variations**: Multiple implementations of the same concept (3 different button styles) - **Reusable patterns**: Layout patterns, composition patterns, interaction patterns worth systematizing 3. **Assess value**: Not everything should be extracted. Consider: - Is this used 3+ times, or likely to be reused? - Would systematizing this improve consistency? - Is this a general pattern or context-specific? - What's the maintenance cost vs benefit? ## Plan Extraction Create a systematic extraction plan: - **Components to extract**: Which UI elements become reusable