작업대는 실제 화면을 보고 고쳤습니다

작업대 화면을 보면서 처음 든 느낌은 “좌우가 어딘가 치우쳐 있다”였습니다. 그래서 폭을 다시 맞추는 작업을 시작했습니다. 그런데 숫자를 재보니 예상과 달랐습니다. 2560픽셀 화면에서 좌우 여백은 정확히 660픽셀씩 같았습니다.

시안과 실제 CSS도 비교했습니다. 1240픽셀 최대 폭, 196/660/256의 세 열, 36픽셀 간격까지 값이 같았습니다. 문제는 비대칭이 아니라 대칭인데 여백이 너무 넓어서 그렇게 보이는 것에 가까웠습니다.

이 결과 때문에 처음 계획했던 폭 수정은 하지 않았습니다. 느낌을 근거로 숫자를 바꾸지 않고, 실제로 확인된 문제만 손댔습니다. 우측 사이드바가 스크롤에 따라 사라지는 문제에는 sticky를 적용했고, 시리즈 제목과 글 카드의 위계가 약한 부분은 색과 간격으로 조정했습니다.

크기를 1.3배로 키우라는 아이디어도 있었지만 생략했습니다. 그렇게 하면 시리즈 제목이 페이지 제목과 너무 가까워져 다른 위계가 무너졌습니다. 한 문제를 고치면서 더 큰 문제를 만들 이유는 없었습니다.

이 작업은 The Forge의 디자인 변경 방식에 작은 기준을 남겼습니다. ORDER에 적힌 전제도 실측과 다르면 고치지 않는다. 지시서를 그대로 실행하는 것이 아니라, 왜 그런 지시가 나왔는지를 실제 화면과 비교합니다.

CHANGE LOG

• 작업대 폭·여백을 실측해 비대칭이 아님을 확인, 폭 수정은 무작업 처리
• 우측 패널 sticky 적용
• 시리즈 제목 색상과 시리즈 간 간격으로 위계 강화
• 데스크톱/모바일 경계를 각각 실측해 회귀 확인