채택 레벨 L1~L4
적용 전후를 눈으로 비교하기
같은 화면입니다. 레벨을 눌러 가며 오른쪽이 어떻게 달라지는지 보세요. “L1만 해도 80%” 라는 말이 글보다 빨리 이해됩니다.
17-3. 채택 레벨 — 기존 앱이 안 깨지게
| 레벨 | 무엇을 적용 | 대상 | 효과 |
|---|---|---|---|
| L1 | 색만 — primary·accent·텍스트·배경·테두리 | 모든 앱 | 이것만 해도 “같은 회사 앱”으로 보임 |
| L2 | + 폰트 (jt-tokens.css 전체 링크) | 권장 | 폰트가 자동으로 따라옴 |
| L3 | + 컴포넌트 (jt-utilities.css) | 권장 | 화면 단위로 점진 |
| L4 | + 간격·크기 스케일 전면 | 여유 있을 때 | 레이아웃 흔들림 위험 — 마지막에 |
기존 앱은 L1부터 시작합니다. L1만 적용해도 브랜드 통일이라는 목적의 80%가 달성됩니다. 신규 앱은 처음부터 L4로 시작하세요. 이것이 v5.0 설계의 1순위 기준입니다 — 처음부터 적용하는 앱에서 안정적으로 동작하도록 값·계약·컴포넌트를 맞췄습니다.
17-4. 버전 업 시 마이그레이션 절차
- 변경 이력 확인 — §17-5에서 MAJOR인지 MINOR인지
- MINOR이면: 아무것도 안 해도 됨
- MAJOR(v4→v5)이면:
- 백업(Git 브랜치 또는 폴더 복사) 후 시작
jt-tokens.css를 통째로 교체 — v5.0은 이름은 같고 값이 바뀐 토큰이 많아 찾아 바꾸기가 통하지 않습니다- 화면 하나씩 눈으로 확인 → 다음 화면
- 라이트/다크 양쪽 확인
- 모바일 폭에서 가로 스크롤·글자 잘림 확인 (16px 전환의 영향이 여기서 드러납니다)
- 적용 후 기록 — 어떤 앱을 어느 버전으로 올렸는지 디렉터에게 공유