Atomic Design Planning

概要

Streamline frontend development by applying Atomic Design principles to categorize UI elements into atoms, molecules, organisms, templates, and pages. This skill fosters a 'reuse-first' philosophy, guiding developers through a structured decision process to determine if a new component is necessary or if existing assets can be extended. By identifying common architectural anti-patterns and providing clear classification hierarchies, it ensures that design systems remain maintainable and organized while integrating seamlessly with project management workflows.

主な機能

• Reuse-first evaluation framework for UI development
• Integration guidelines for Linear project management workflows
• 1 GitHub stars
• Hierarchical component classification from atoms to pages
• Anti-pattern detection to prevent improper component abstraction
• Structured decision tables for component categorization

ユースケース

• Planning the architecture for a new design system or component library
• Evaluating whether to build a new UI component or extend an existing one
• Organizing complex page layouts and feature-specific component organisms