Context: - codex cli 중단 후에도 작업 품질과 맥락을 안정적으로 복구하기 위해 Changes: - docs/00~07, 90 문서 세트 추가/정리 - commit convention 문서 및 .gitmessage-session.txt 템플릿 추가 - scripts/session/recover-context.sh 추가 - package.json에 session:recover 스크립트 추가 Validation: - npm run session:recover Session-State: session recovery docs, template, and script are in place Session-Next: apply this commit format to feature and refactor commits Session-Risks: legacy commits before this change do not include session trailers
1.5 KiB
1.5 KiB
01. UI Guidelines
디자인 톤
- 기본 톤: 감성, 저자극, 차분함
- 금지 톤: 과한 대비, 과한 번쩍임, 과도한 채도, 공격적인 카피
- CTA는 명확하되 조용한 위계로 구성한다.
컬러/표현 원칙
- 다크 + 글래스 분위기를 유지한다.
- 포인트 색상은 1차 액션에만 제한적으로 사용한다.
- 2차/3차 액션은 outline/ghost/텍스트 링크로 무게를 낮춘다.
CTA 위계 규칙
- Primary: 사용자 목표를 즉시 달성하는 액션 1개만 강조
- Secondary: 대안 액션, 가시성은 유지하되 무게는 낮춤
- Tertiary: 텍스트 링크 또는 작은 아이콘 액션
- 데스크탑에서는 불필요한 풀폭 CTA를 지양한다.
반응형 규칙
- 모바일: 터치 우선, 충분한 높이/패딩, 필요 시 풀폭 CTA 허용
- 데스크탑: 내용폭 기반 컴팩트 CTA 그룹 권장
- 텍스트 길이에 따라 버튼 폭이 과도하게 늘어나지 않게
min-w + px를 사용
마이크로카피 규칙
- 실시간/확정처럼 보이는 문구를 신중히 사용한다.
- 초기 데이터가 비어도 어색하지 않은 카피를 기본값으로 사용한다.
- 숫자 기반 과장 표현보다 분위기/큐레이션 중심 문구를 우선한다.
접근성/상호작용
- 아이콘 버튼은
sr-only텍스트를 제공한다. - 포커스 링을 유지한다.
- 실제 미구현 기능은 토스트로 피드백하되, 실제 동작처럼 오해되지 않게
(더미)를 명시한다.