밀도

레이아웃

밀도

Density

밀도는 같은 양의 정보를 화면에 얼마나 빽빽하게 담을지를 정하는 정도로, 화면의 목적에 따라 여유와 조밀 사이에서 저울질하는 선택입니다.

프로젝트 계획
디자인 리뷰
출시 준비
회고
밀도

정의

밀도는 같은 양의 정보를 화면에 얼마나 빽빽하게 담을지를 정하는 정도입니다. 여백을 넉넉히 주는 '여유(comfortable)' 방식은 요소 사이를 넓게 벌려 한 화면에 담기는 양은 줄지만 한결 편안해 보입니다. 반대로 여백을 줄이는 '조밀(compact)' 방식은 같은 공간에 더 많은 항목을 담아 한눈에 훑기 좋게 만듭니다. 밀도는 하나의 고정된 정답이 아니라, 무엇을 위한 화면인지에 따라 저울질하는 선택입니다. 같은 목록이라도 밀도를 어떻게 잡느냐에 따라 화면의 성격과 사용 느낌이 완전히 달라집니다. 밀도를 조절하는 실제 손잡이는 결국 여백과 글자 크기, 요소의 높이 같은 값들이라는 점도 함께 기억해 두면 좋습니다.

왜 중요한가

밀도가 중요한 이유는 화면의 목적마다 어울리는 정도가 다르기 때문입니다. 손가락으로 누르는 모바일 버튼이나 처음 보는 서비스의 소개 화면은 여유 있는 밀도가 어울립니다. 요소가 충분히 떨어져 있어야 잘못 누르지 않고, 읽는 부담도 줄기 때문입니다. 반대로 데이터를 많이 훑어야 하는 대시보드, 표, 이메일함은 조밀한 밀도가 유리합니다. 스크롤을 덜 하고도 더 많은 정보를 한눈에 비교할 수 있기 때문입니다. 목적에 맞지 않는 밀도는 여유가 지나쳐 비효율적이거나, 조밀함이 지나쳐 답답하고 실수를 부르는 화면을 만듭니다. 그래서 능숙한 디자이너는 예쁨보다 먼저 이 화면을 누가 어떤 상황에서 쓰는지를 떠올린 다음 밀도를 결정합니다.

흔한 실수

  • 한 화면에 여러 밀도를 뒤섞어 쓰는 것입니다. 어떤 목록은 빽빽하고 어떤 목록은 헐거우면 사용자는 규칙을 종잡을 수 없어, 화면이 정돈되지 않고 어수선하다는 인상을 받습니다. 밀도는 화면이나 영역 단위로 통일하는 것이 안전합니다.
  • 정보를 최대한 많이 넣으려고 무작정 여백을 줄이는 것입니다. 밀도를 높이면 담기는 양은 늘지만, 요소가 서로 붙어 잘못 누르기 쉬워지고 눈이 금세 피로해져, 오히려 원하는 항목을 찾는 속도가 느려질 수 있습니다.
  • 터치 화면에서까지 마우스 기준의 조밀한 간격을 그대로 쓰는 것입니다. 손가락은 마우스 포인터보다 훨씬 두꺼워서, 좁은 간격은 오조작을 크게 늘리고 사용자를 답답하게 만듭니다.

실무 팁

  • 밀도는 화면의 목적을 기준으로 정하세요. 터치와 가독성이 중요하면 여유 있게, 데이터를 많이 훑어야 하는 대시보드나 표, 이메일함이라면 조밀하게 두는 것이 잘 맞습니다. 목적을 먼저 정하면 밀도 선택이 취향 문제가 아니라 근거 있는 결정이 됩니다.
  • 여유와 조밀 두 가지 밀도 세트를 미리 정의해 두고 화면 전체에서 하나만 골라 쓰세요. 기준을 두면 화면마다 간격을 새로 고민하지 않아도 되고, 나중에 밀도를 통째로 바꾸기도 쉬워져 일관성이 안정적으로 유지됩니다.
  • 밀도를 높일 때도 요소를 누를 수 있는 최소 크기는 지키세요. 겉보기 간격은 좁혀도 실제로 반응하는 영역은 충분히 확보해 두면 조밀함과 사용성을 함께 얻을 수 있습니다.

관련 개념