3.4 KiB
랜딩페이지 텍스트·타이포그래피 리터치 — 2026-11-04
변경 문구
- 슬로건: 교각·교대 설계의 새로운 기준
- 상단 설명: 설계정보 입력부터 3D 모델링, 구조검토, 철근배근, 도면작성 및 수량산출까지 하나의 플랫폼에서
- 중앙 보조 문구: 교량 하부구조 3D 통합 모델링
- 카드 1: Excel Import / 엑셀로 시작하기 / 설계정보를 불러와 교각·교대 3D 모델을 자동 생성합니다. / Excel 파일 불러오기
- 카드 2: Drawing Import / 도면으로 시작하기 / 기존 도면에서 교각·교대 정보를 추출하여 3D 모델을 생성합니다. / 도면 불러오기
- 패널: EXPLORE PROJECTS / 교각·교대 설계 라이브러리 / 12 PROJECTS
- 지도: 설계 프로젝트 위치 / 일반 / 위성
- 목록: 기존 설계 프로젝트 / 총 12개 프로젝트
- 미리보기: 하부구조 3D 미리보기
- 위치정보: 프로젝트 위치정보
- 하단 버튼: 설계 프로젝트 불러오기
- PIER & ABUT는 유지하며, 실제 교량명·주소·좌표·형식·교각 수는 변경하지 않았다. 교각 없는 원본의 안내도 유지한다.
스타일
신규 landing-typography.css는 font-family, font-size, font-weight, letter-spacing, line-height, color, 텍스트 fill/shadow만 조정한다. 기존 폰트 파일을 추가하지 않았다. 타이틀은 기존 산세리프 기반 네이비/블루, 슬로건은 가는 회청색, 카드/패널 제목은 명확한 굵기, 영문 라벨은 작은 글자와 넓은 자간으로 정리했다. 좌표 숫자는 tabular-nums를 유지한다.
배치·기능 검증
landing-page.ts와 sample-explorer.ts는 텍스트 리터럴과 타이포 CSS import만 수정했다. HTML 요소 구조, 이벤트, 선택 상태, 지도·로더·미리보기 로직을 변경하지 않았다. 카드/패널 크기·위치, 지도, 프로젝트 목록, 미리보기, 버튼, 회사 로고, 히어로 이미지와 배경은 유지한다.
1366×768와 1920×1080에서 수정 전후 카드 그룹/카드/Excel 버튼/우측 패널/패널 헤더/지도/목록/미리보기/불러오기 버튼/로고 영역의 x,y,width,height를 비교했다. 0.05px 허용 범위에서 모두 동일하다. 글자 크기로 발생했던 1px 이동은 기존 줄 높이를 복원해 제거했다. 타이틀 글자의 폭과 가운데 정렬 결과는 글꼴 변경에 따라 달라지며, 주변 UI 배치에는 영향을 주지 않는다.
두 해상도에서 Excel 입력, 도면 추출 팝업, 프로젝트 선택 후 지도 확대, 실제 운곡교 프로젝트 불러오기를 확인했다. 페이지 오류 0건. 타입 검사·프로덕션 빌드 통과(기존 대형 번들 경고 유지).
시안과 남는 차이
시안의 원본 폰트 파일/설정은 제공되지 않아 기존 설치 글꼴로 근사했다. OS별 글꼴 대체·안티앨리어싱에 따라 글자 모양은 완전히 같지 않을 수 있다. 기존 좁은 우측 패널과 축소된 카드 크기를 유지하기 위해 일부 글자는 시안보다 작다. 시안 속 교각수·좌표 등 예시 데이터는 실제 데이터로 바꾸지 않고 기존 프로젝트 값을 유지했다. 그림과 화면 구성 자체는 이번 작업 대상이 아니다.
변경 파일: landing-page.ts, sample-explorer.ts, 신규 landing-typography.css. 검사 결과: .cache/typography-results.json, .cache/typography-1366.png, .cache/typography-1920.png.