한 줄로
블로그 로드맵의 132개 항목 지도 바로 위에 경력 5단계를 다시 넣어 배포했다(0b5f80f). 다섯 단계는 기초 → 주니어 → 미들 → 시니어 → 스태프다. 경력 단계는 기술 지도에 섞지 않고 따로 뒀다. 기술 항목 하나하나를 경력 단계에 나눠 붙일 근거가 없어서다.
같은 ‘단계’라는 말, 다른 두 축
로드맵 페이지에는 ‘단계’라는 말을 쓰는 것이 두 가지 있다.
- 기술 지도: 132개 항목을 주제 상자로 묶은 지도다. ‘1단계 · 기초’ 같은 자체 단계가 있고, 단계마다 색이 있다. 목표를 가리키는 빨간 번호도 붙어 있다.
- 경력 단계: 맡는 범위가 어떻게 넓어지는지를 다섯 칸으로 나눈 것이다. Dropbox와 CircleCI가 공개한 커리어 프레임워크를 참고했다. 커리어 프레임워크는 회사가 직급마다 기대하는 바를 문서로 정리한 것이다.
기술 지도는 기술 항목을 다루고, 경력 단계는 맡는 범위를 다룬다. 이름은 비슷해도 재는 대상이 다르다. 이번 작업에서 나온 결정은 대부분 이 차이에서 나왔다.
무엇을 넣었나
다섯 칸, 한 줄
기초부터 스태프까지 다섯 칸을 한 줄로 놓았다. 칸마다 세 가지를 적었다.
- 맡는 범위
- 다음 단계로 넘어가는 계기
- AI를 쓰는 방식
전에 빠져 있던 AI 내용과 단계 사이를 잇는 문장도 이번에 다시 넣었다.
‘지금 여기’와 ‘다음’
칸 두 개에 표시를 달았다.
- 미들: 파란 테두리와 ‘지금 여기’
- 시니어: 빨간 점선과 ‘다음 · 번호 1~4’
시니어 칸의 빨간 점선과 ‘번호 1~4’는 지도의 빨간 번호에 맞춘 것이다. 다음 경력 단계가 지도에서 빨간 번호로 표시한 목표와 같다는 점을 보여 주려는 것이다.
바닥글에는 Dropbox·CircleCI 커리어 프레임워크 출처 링크를 다시 붙였다.
결정: 따로 두고, 이어 주는 곳은 한 군데만
처음 떠올릴 수 있는 방법은 지도의 기술 항목마다 ‘주니어용’, ‘시니어용’ 같은 꼬리표를 다는 것이다. 이렇게 하지 않았다. 항목 하나하나를 어느 경력 단계에 붙일지 정할 근거가 없기 때문이다. 근거 없이 붙이면 그럴듯해 보여도 틀린 지도가 된다.
그래서 경력 단계는 지도 위에 별도 줄로 두었다. 두 축이 섞여 보이지 않도록 두 가지를 뺐다.
- 칸 번호를 매기지 않았다. 경력 칸에 1~5 같은 번호를 붙이면 지도의 ‘1단계 · 기초’와 경력의 ‘기초’가 같은 것처럼 읽힌다.
- 지도의 단계 색을 쓰지 않았다. 같은 색이면 같은 단계로 보인다.
두 축을 이어 주는 곳은 시니어 칸의 ‘다음 · 번호 1~4’ 한 군데뿐이다. 그 칸이 가리키는 목표가 지도의 빨간 번호와 같다는 것만 드러낸다.
확인한 것
배포 작업은 성공했다. 실제 사이트에 ‘지금 여기’가 나오는 것도 확인했다.
화면 폭 다섯 가지를 라이트 모드와 다크 모드로 모두 열어 봤다.
| 폭 | 라이트 | 다크 |
|---|---|---|
| 1400 / 1100 / 1000 / 920 / 390px | 확인 | 확인 |
세 가지를 봤고, 모두 문제가 없었다.
- 가로 스크롤이 생기는지
- 항목이 주제 상자와 겹치는지
- 화면 밖으로 나가는 항목이 있는지
900~1100px 폭은 지난번에 보지 않은 구간이다. 이번에는 이 구간에서 ‘보안·암호화’와 ‘NoSQL’ 주제를 따로 캡처했고, 둘 다 깨지지 않았다.
새로 넣은 글자가 모두 블로그 폰트에 들어 있는 것도 확인했다.
확인하지 않은 것
실제 휴대폰과 태블릿에서는 열어 보지 않았다. 브라우저에서 화면 폭만 바꿔 가며 확인했다.