어드민 시스템 권한 목록 페이지 UI 스타일 정합 개선

운영 관리 페이지 UI 톤 정합 작업을 했다. 어드민 시스템 내 다른 페이지들과 스타일이 튀던 부분을 맞추고, 텍스트 사이즈도 같이 올린 작업.

왜 이 타이밍에

sysCapabilityList.jsp — 시스템 권한(Capability) 목록 페이지다. 기능 자체는 진작에 붙어 있었는데, 어드민 전체 UI를 훑어보다가 이 페이지만 스타일이 혼자 다른 걸 발견했다. 폰트 사이즈도 주변 페이지 대비 작았고, 버튼이나 레이블 톤도 약간 달랐다.

작은 스타일 이슈를 왜 따로 커밋으로 챙겼냐 하면, 이런 게 쌓이면 나중에 한꺼번에 건드리기 훨씬 귀찮아지기 때문이다. 특히 어드민 페이지는 내부 운영자들이 매일 쓰는 화면인데, "이 페이지만 이상하게 작아요" 같은 피드백이 슬쩍 들어올 때 방치하면 신뢰도가 은근히 깎인다.

어드민 UI 정합이 생각보다 중요한 이유

기능 중심으로 개발하다 보면 어드민 페이지의 스타일 정합성은 우선순위에서 자꾸 밀린다. 근데 실제로 운영자 입장에서 보면 얘기가 좀 다르다.

어드민이라고 해서 UX를 대충 봐도 된다는 인식이 있는데, 솔직히 그게 가장 위험한 생각이다. 내부 운영자들은 이 화면을 하루에도 수십 번씩 보는 사람들이고, 불편한 UI는 결국 실수로 연결되기도 한다.

작업 내용

sysCapabilityList.jsp 한 파일을 수정했다. 변경 범위는 크지 않다 — 기능 로직은 건드리지 않고 스타일만 핀포인트로 수정한 케이스.

주요 작업 내용:

• 어드민 공통 톤에 맞게 레이블/버튼/헤더 스타일 정합 맞춤
• 텍스트 사이즈를 주변 목록 페이지 기준에 맞게 상향
• 전체 레이아웃 흐름이 다른 sysconfig 하위 페이지들과 일관되도록 조정

코드 레벨에서는 대략 이런 방식으로 처리했다:

<%-- Before: 개별 인라인 스타일이 파편화되어 있던 구조 --%>
<th style="font-size:11px; font-weight:normal;">권한명</th>

<%-- After: 공통 어드민 클래스 기준으로 맞춤 --%>
<th class="admin-th">권한명</th>

인라인 스타일이 박혀 있으면 나중에 전체 테마 변경할 때 일일이 다 찾아야 하는 문제가 생긴다. 그래서 공통 클래스 기준으로 맞추는 게 맞다. 지금 당장은 작아 보이는 변경이지만 나중에 어드민 전체 스타일을 리터치할 일이 생기면 이런 정합이 쌓여 있는 것과 파편화된 것의 차이가 크게 난다.

회고

팀 리딩하면서 이런 류의 작업을 직접 하는 게 맞나 싶을 때도 있다. 근데 내가 이런 걸 직접 챙기면 팀원들한테도 신호가 된다 — "이런 것도 커밋으로 남기는 게 맞다", "기능 작업이 아니어도 정합 맞추는 게 일이다"라는 것.

반대로 리드가 기능 커밋만 올리면, 팀에서도 스타일 정합 같은 잡다한 작업은 아무도 안 챙기게 되더라. 코드리뷰할 때도 마찬가지인데, "이 페이지 폰트 사이즈 다른 페이지랑 다르지 않아요?" 같은 피드백을 자연스럽게 남기려면 리드가 먼저 이걸 중요하게 여기는 태도를 보여야 한다.

작은 커밋이지만 이게 그냥 style 픽스로 끝나는 게 아니라, 어드민 UI 기준을 팀 전체가 어떻게 다루는지에 대한 맥락을 하나 쌓아가는 작업이다.

끝.

🛒 이 글과 어울리는 추천 상품

• 모니터암 쿠팡에서 보기 →
• 책상조명 쿠팡에서 보기 →
• 기계식키보드 쿠팡에서 보기 →

*위 링크는 쿠팡파트너스 활동의 일환이며, 일정액의 수수료를 제공받을 수 있습니다.