normalize
작성자 pbakaus디자인 시스템 표준에 맞춰 UI 기능을 감사하고 재정렬하여 일관된 간격, 토큰 및 패턴을 보장합니다. 디자인 이탈을 수정하고 디자인 시스템 원칙을 강제하는 데 이상적입니다.
개요
normalize 스킬이란?
normalize 스킬은 사용자 인터페이스 기능을 감사하고 디자인 시스템 표준에 엄격히 부합하도록 재정렬하는 데 목적이 있습니다. 간격, 디자인 토큰, UI 패턴의 불일치를 식별하고 수정하는 데 중점을 둡니다. 이 스킬은 프론트엔드 프로젝트 전반에 걸쳐 시각적 및 기능적 일관성을 유지하려는 팀에 필수적입니다.
누가 normalize를 사용해야 하나요?
normalize는 디자인 이탈, 스타일 불일치 문제를 해결하거나 기능을 확립된 시스템 가이드라인에 맞추고자 하는 UI 디자이너, 프론트엔드 개발자, 디자인 시스템 관리자에게 적합합니다.
해결하는 문제
- 디자인 시스템 표준에서 벗어난 부분을 감지하고 수정
- 토큰, 간격, 패턴의 일관된 사용 보장
- 성장하는 코드베이스에서 디자인 이탈 방지 및 수정 지원
사용 방법
설치 단계
-
다음 명령어로 normalize 스킬을 설치하세요:
npx skills add https://github.com/pbakaus/impeccable --skill normalize -
자세한 워크플로우와 요구사항은
SKILL.md파일을 검토하세요. -
추가 맥락을 위해
README.md,AGENTS.md,metadata.json등의 지원 파일을 살펴보세요.rules/,resources/,references/,scripts/폴더가 있으면 확인하세요.
워크플로우 개요
- 준비:
$frontend-design에이전트를 호출하여 디자인 원칙과 컨텍스트를 수집합니다. 디자인 컨텍스트가 없으면 먼저$teach-impeccable을 실행하세요. - 계획: 디자인 시스템 문서, UI 가이드라인, 컴포넌트 라이브러리를 검토합니다. 핵심 원칙, 토큰, 패턴을 파악하세요.
- 분석: 현재 UI 기능을 감사하여 디자인 시스템과의 불일치나 이탈을 찾습니다.
- 실행: 기능을 디자인 시스템 표준에 맞게 재정렬하는 변경 사항을 적용합니다.
- 정리: 모든 변경 사항이 일관되고 문서화되었는지 검토하고 마무리합니다.
normalize를 사용해야 할 때
- UI 불일치나 디자인 이탈이 발견될 때
- 주요 기능 개발 또는 리팩토링 후
- 디자인 시스템 도입 또는 이전 시
자주 묻는 질문
normalize 스킬은 정확히 무엇을 하나요?
normalize는 UI 컴포넌트와 기능을 감사하고, 간격, 토큰, 패턴에 대해 디자인 시스템 표준에 맞게 복구하는 계획을 제공합니다.
normalize는 대규모 디자인 시스템에만 해당되나요?
아니요, normalize는 팀 규모와 관계없이 UI 일관성과 디자인 원칙 준수가 중요한 모든 프로젝트에 유용합니다.
어떤 파일부터 검토해야 하나요?
주요 워크플로우는 SKILL.md에서 시작하세요. README.md와 AGENTS.md 같은 지원 파일도 추가 안내를 제공합니다.
normalize가 모든 UI 문제를 자동으로 해결할 수 있나요?
normalize는 체계적인 프로세스와 지침을 제공하지만, 완벽한 디자인 시스템 일치를 위해서는 일부 수동 검토와 조정이 필요합니다.
더 자세한 내용이나 스크립트는 어디서 찾을 수 있나요?
저장소의 Files 탭에서 중첩된 참조, 보조 스크립트, 추가 문서를 확인하세요.
