Feature Branch: agent/ahp-system
Created: 2026-08-15
Status: Draft
Input: User description: "하네스로 일하는 개발자를 위한 지도 폰트가 너무 크며, 그 밖의 폰트도 전체적으로 조정한다. 시각 비교안 B의 균형 있는 비율을 전체 사이트에 적용한다."
User Scenarios & Testing (mandatory)
User Story 1 - 부담 없이 핵심 내용을 훑어보기 (Priority: P1)
개발자는 사이트에 들어왔을 때 큰 제목 하나가 화면을 과도하게 차지하지 않고, 제목과 설명을 함께 보면서 페이지의 목적을 빠르게 이해한다.
Why this priority: 첫 화면의 제목 크기가 이번 작업의 직접적인 문제이며, 첫인상과 정보 탐색 효율에 가장 큰 영향을 준다.
Independent Test: 큰 데스크톱 화면에서 홈페이지를 열어 제목, 리드 문장과 첫 행동 요소가 균형 있게 보이며 제목이 정해진 최대 크기를 넘지 않는지 확인한다.
Acceptance Scenarios:
- Given 사용자가 1440px 너비의 화면으로 홈페이지를 열었을 때, When 첫 화면을 확인하면, Then 주 제목은 72px 이하이고 리드 문장과 행동 요소도 같은 화면 맥락 안에서 읽을 수 있다.
- Given 사용자가 어느 핵심 공개 경로에 들어갔을 때, When 페이지 제목과 섹션 제목을 차례로 읽으면, Then H1·H2·H3·본문의 크기 차이가 일관된 시각적 위계를 만든다.
User Story 2 - 화면 크기가 달라도 같은 위계로 읽기 (Priority: P2)
개발자는 모바일, 태블릿, 데스크톱에서 제목이 잘리거나 카드 밖으로 넘치지 않는 상태로 동일한 콘텐츠를 읽는다.
Why this priority: 전체 사이트는 375px부터 1440px까지 지원해야 하며, 크기 조정이 특정 화면에서만 좋아 보이면 공통 스케일로서 가치가 없다.
Independent Test: 네 핵심 공개 경로를 375px, 768px, 1440px에서 열어 제목 줄바꿈, 카드 경계와 가로 스크롤 여부를 확인한다.
Acceptance Scenarios:
- Given 375px 너비의 모바일 화면에서, When 사용자가 네 핵심 경로를 탐색하면, Then 제목이나 본문이 잘리지 않고 페이지 전체에 불필요한 가로 스크롤이 생기지 않는다.
- Given 화면 너비가 375px에서 1440px 사이일 때, When 화면 크기를 바꾸면, Then 제목과 본문 크기가 급격한 단절 없이 해당 범위 안에서 비례해 변한다.
User Story 3 - 작은 정보와 강조 수치를 또렷하게 구분하기 (Priority: P3)
개발자는 기술 라벨, 내비게이션, 상태 배지, 근거 메타데이터와 강조 점수를 각각의 역할에 맞는 크기로 읽는다.
Why this priority: 전체 글자를 일괄 축소하면 작은 보조 정보의 접근성이 나빠지고, 큰 데이터 숫자를 그대로 두면 새 제목 체계와 다시 불균형해진다.
Independent Test: 로드맵의 강조 점수와 전 페이지의 작은 보조 텍스트를 확인해 점수는 제목을 압도하지 않고 보조 텍스트는 기존 최소 크기보다 작아지지 않는지 검증한다.
Acceptance Scenarios:
- Given 사용자가 로드맵의 성숙도 점수를 볼 때, When 점수와 주변 제목을 비교하면, Then 점수는 최대 96px이며 주변 정보의 위계를 압도하지 않는다.
- Given 사용자가 기술 라벨, 내비게이션, 배지 또는 코드 예시를 읽을 때, When 조정 전후를 비교하면, Then 해당 텍스트는 기존 최소 크기보다 작아지지 않는다.
Edge Cases
- 200% 확대에서도 제목이 다른 요소와 겹치거나 페이지 전체의 가로 스크롤을 만들지 않아야 한다.
- 긴 한국어 제목이나 공백이 적은 기술 문자열도 카드 및 읽기 영역 밖으로 넘치지 않아야 한다.
- 라이트 모드, 다크 모드와 인쇄 화면에서 같은 제목 계층을 유지해야 한다.
- 글꼴을 내려받지 못하고 시스템 대체 글꼴로 표시되어도 콘텐츠가 잘리지 않아야 한다.
- 1440px보다 넓은 화면에서도 제목과 본문이 정해진 최대 크기를 넘지 않아야 한다.
Requirements (mandatory)
Functional Requirements
- FR-001: 사이트는 기본 본문을 16px에서 17px 사이의 크기로 표시해야 한다.
- FR-002: 사이트는 모든 페이지의 H1을 40px에서 72px 사이로 표시해야 한다.
- FR-003: 사이트는 모든 페이지의 H2를 28px에서 44px 사이로 표시해야 한다.
- FR-004: 사이트는 모든 페이지의 H3를 18px에서 22px 사이로 표시해야 한다.
- FR-005: 홈페이지, 가이드, 적용 근거와 로드맵의 히어로 리드 문장을 17px에서 20px 사이로 표시해야 한다.
- FR-006: 로드맵의 성숙도 강조 점수를 56px에서 96px 사이로 표시해야 한다.
- FR-007: 기술 라벨, 내비게이션, 상태 배지, 근거 메타데이터와 코드 블록은 조정 전의 최소 글자 크기를 유지해야 한다.
- FR-008: 조정된 크기 체계는
/,/guide,/5240lab,/roadmap과 찾을 수 없음 페이지에 일관되게 적용되어야 한다. - FR-009: 375px부터 1440px까지 제목과 본문 크기는 화면 너비에 따라 연속적으로 변하고 승인된 최소·최대 범위를 벗어나지 않아야 한다.
- FR-010: 글자 크기 조정은 콘텐츠, 제목 순서, 링크, 필터와 기타 사용자 동작을 변경하지 않아야 한다.
- FR-011: 375px, 768px, 1440px 및 200% 확대에서 콘텐츠 잘림, 요소 겹침과 페이지 전체의 불필요한 가로 스크롤이 없어야 한다.
- FR-012: 조정된 위계는 라이트 모드, 다크 모드와 인쇄 화면에서 유지되어야 한다.
Documentation Impact (mandatory)
- Affected audiences: 공개 사이트를 읽는 개발자와 디자인 시스템을 유지하는 개발자
- Affected manuals/paths:
manual-impact: none—/guide의 표현 크기는 달라지지만 내용, 작업 순서, 명령과 운영 절차는 변경되지 않는다. 구현 기준인design-system/5240lab-harness/MASTER.md의 타이포그래피 수치는 동기화한다. - Required evidence: 네 핵심 경로의 375px·768px·1440px 화면 검증, 200% 확대 확인, 자동화된 크기 범위와 회귀 검사 결과
- Release condition: 공개 페이지와 가이드가 같은 릴리스 후보에서 검증되고 기존 전체 품질 게이트를 통과해야 한다.
Success Criteria (mandatory)
Measurable Outcomes
- SC-001: 1440px 화면에서 모든 H1은 72px 이하, 모든 H2는 44px 이하, 기본 본문은 17px 이하로 표시된다.
- SC-002: 375px 화면에서 모든 H1은 40px 이상, 모든 H2는 28px 이상, 기본 본문은 16px 이상으로 표시된다.
- SC-003: 네 핵심 공개 경로 모두 375px, 768px, 1440px에서 텍스트 잘림과 페이지 전체의 불필요한 가로 스크롤 없이 읽을 수 있다.
- SC-004: 네 핵심 공개 경로 모두 200% 확대에서 제목, 링크와 본문을 콘텐츠 손실이나 요소 겹침 없이 사용할 수 있다.
- SC-005: 기존 공개 콘텐츠, 제목 순서, 링크, 필터와 상태 정보에 대한 자동 검증이 100% 통과한다.
Assumptions
- 기존 글꼴 패밀리, 색상, 간격, 콘텐츠와 레이아웃 구조는 유지한다.
- 화면 너비에 따른 자연스러운 크기 변화는 기존 사이트와 같은 유동형 타이포그래피 경험으로 제공한다.
- 작은 보조 텍스트는 이번 작업에서 확대하지 않으며 현재 최소 크기만 보존한다.
- 접근성 기준은 기존 사이트의 375px 최소 너비, 200% 확대, 키보드 탐색과 색상 모드 지원을 그대로 따른다.
- 이 변경은 정적 표현 조정이므로 새 데이터, 사용자 권한, 오류 메시지나 운영 절차를 추가하지 않는다.