frontend-designlisted
Install: claude install-skill U2SY26/u2dia-kanban
# Frontend Design — UI/UX 원칙
## 사용 시기
- "UI 디자인", "랜딩 페이지", "대시보드", "컴포넌트 디자인" 요청 시
## 디자인 헌법
1. **사용자 중심** — 기능보다 사용자 경험 우���
2. **일관성** — 색상, 타이포그래피, 간격, 컴포넌트 스타일 통일
3. **접근성** — 대비율, 키보드 네비게이션, 스크린 리더 고려
4. **반응형** — 모바일 → 태블릿 → 데스크톱 적응
5. **성능** — 초기 로딩 최소화, 지연 로딩, 불필요한 렌더링 제거
## 시각적 원칙
- **계층(Hierarchy)**: 크기/색상/위치로 정보 우선순위 표현
- **여백(Whitespace)**: 충분한 여백으로 가독성 확보
- **대비(Contrast)**: 텍스트와 배경의 명확한 대비
- **정렬(Alignment)**: 그리드 시스템 기반 정렬
## e커머스 특화
- **대시보드**: 매출/재고/주문을 한 눈에 파악 가능한 레이아웃
- **차트**: Recharts/D3.js로 전문적 도표 — 인터랙티브, 반응형
- **테이블**: 대량 데이터 — ag-grid 또는 가상화 테이블 사용
- **컬러**: 상승(초록), 하락(빨강), 경고(노랑) 등 데이터 시각화 컬러 규칙
## 금지 사항 없음
> 특정 프레임워크나 라이브러리를 강제하지 않는다.
> 프로젝트에 최적인 도구를 자유롭게 선택한다.