도메인 위젯의 통일성

대시보드는 서비스가 가진 도메인의 거울 입니다. 도메인이 5 개인데 위젯이 3 개면 사용자는 "나머지 2 개 도메인은 미완성인가" 를 본능적으로 의심합니다. 통일성은 디자인 감수성의 문제가 아니라 기능 인지 의 문제입니다.

1. 통일성이 깨진 대시보드의 증상

증상	사용자 해석	실제 원인
4 도메인 중 3 도메인만 위젯	"나머지 1개는 베타?"	위젯 SSOT 컴포넌트 누락
위젯마다 아이콘 컬러 다름	"이 색은 무슨 카테고리?"	컬러 토큰 미정
검색바 위치가 위젯마다 다름	"검색이 안 되는 위젯도 있나"	Layout 패턴 미정
어떤 위젯은 카운트, 어떤 위젯은 평균	"기준이 뭐지"	TOP-N · 평균값의 정합 미정

2. 위젯 SSOT 컴포넌트 — 한 컴포넌트가 N 도메인을 책임진다

[DomainWidget]   ← 한 컴포넌트
   │
   ├─ title + icon (도메인별 prop)
   ├─ 검색바 (debounce + AbortController)
   ├─ TOP N 리스트 (BFF 응답)
   └─ "더 보기" 링크 (도메인 라우트)

도메인별로 prop 만 바꿔 N 인스턴스

같은 패턴을 N 도메인에 복제 해 두면 신규 도메인 도입 시 위젯 누락이 코드 리뷰 단계에서 잡힙니다.

3. 통일성 체크리스트 — 신규 도메인 도입 시

도메인 1 개를 추가했을 때 사용자가 같은 자리에서 같은 방식으로 그 도메인을 만날 수 있어야 합니다. 다음 7 곳이 같이 갱신되어야 통일성이 유지됩니다.

1. 대시보드 위젯 — 다른 도메인과 같은 컴포넌트로 + 아이콘·컬러 토큰
2. 메인 빠른 칩 — N 칩 중 한 자리
3. 사이드바 / 네비 — 인증 사용자 메뉴
4. 푸터 링크 — 비인증 사용자가 크롤러 인덱싱 가능
5. 검색 결과 카테고리 — 도메인별 카테고리 탭
6. i18n 키 — ko/en 동량
7. 공개 라우트 화이트리스트 — 비인증 진입 허용 시 (→ 공개 라우트 화이트리스트 참조)

4. 적용 전 / 적용 후

측면	통일성 미달	통일성 회복
도메인 N + 위젯 (N-1)	누락 1 개	정확히 N 개
새 도메인 도입 비용	7 곳 수동	같은 컴포넌트 prop 한 번
사용자 신뢰	"왜 어떤 건 없지"	"균질하다"
아이콘·컬러	위젯마다 임의	도메인 → 토큰 매핑
검색 UX	위젯마다 다름	한 가지 인터랙션

5. 자신의 프로젝트에 적용하려면

• 대시보드에서 N 도메인 중 위젯이 빠진 도메인 이 있는지 grep.
• 가장 잘 만든 위젯 1 개를 SSOT 컴포넌트로 추출 (검색 + TOP N + 링크 패턴).
• 도메인별 아이콘 · 컬러 토큰을 한 상수로 묶고, 위젯이 prop 으로 받게.
• 신규 도메인 도입 PR 체크리스트에 7 곳 동기화를 코드 리뷰 항목 으로 등록.
• 통일성 회귀를 막을 회귀 테스트 — "대시보드 마운트 시 위젯 컴포넌트가 N 개 렌더링" 식 카운트 가드.

대시보드는 제품의 첫인상 이자 도메인 카탈로그 입니다. 누락 한 자리가 다른 도메인 N-1 개의 신뢰까지 흔듭니다.