Freeive

uiux·발행 2026.07.02

Rule of thirds, 1797년 영국 풍경화 책에서 시작

화면을 3x3 격자로 나누고 중요한 요소를 격자의 교차점에 두라는 구성 법칙입니다. 230년 된 풍경화 이론이 지금도 모든 카메라 앱에 살아 있습니다.

한 줄로

화면을 3×3 격자로 나누고, 중요한 요소를 격자의 교차점에 두라는 구성 법칙입니다. 230년 된 풍경화 이론이 지금도 모든 카메라 앱에 살아 있습니다.

어디서 왔나

1797년, 영국의 화가이자 작가 존 토머스 스미스(John Thomas Smith)가 책 Remarks on Rural Scenery를 출간했습니다. 그는 풍경화의 구도에 대해 한 가지 원칙을 제안했습니다.

"그림의 빛 부분과 그림자 부분의 비율을 가로 1:2 또는 세로 1:2 정도로 나누면, 단조로움을 피하면서도 균형을 유지할 수 있다."

이게 rule of thirds의 시작입니다. 그림을 가로로 1/3, 세로로 1/3 지점에 가상의 선을 그리면 9분할 격자가 만들어집니다. 풍경의 지평선을 이 가로선 중 하나에 맞추면 자연스럽습니다.

이 원칙이 19~20세기 회화, 사진, 영화로 차례로 옮겨갔습니다. 1920년대 모더니즘 사진가 에드워드 웨스턴(Edward Weston)의 작품들이 rule of thirds를 의식적으로 활용한 대표 사례입니다.

스마트폰 카메라 앱에 격자선이 기본 옵션으로 들어가면서 모든 일반인이 이 원칙을 알게 됐습니다.

UI에서 활용

  • 히어로 섹션: 메인 카피를 격자 가로선 위쪽 1/3에, 이미지를 오른쪽 2/3에.
  • 카드 디자인: 카드 안의 핵심 요소를 1/3 지점에.
  • 콘텐츠 페이지: 본문의 인용구를 페이지 1/3 지점에.

Golden ratio와의 비교

  • Rule of thirds: 1:1:1 = 1:2 비율.
  • Golden ratio: 1:1.618 비율 (조금 더 비대칭).

황금비가 "더 우아하다"는 신화가 있지만, 실제 디자인에서는 두 비율이 거의 같은 효과를 냅니다. 사용자 눈은 두 비율의 차이를 잘 인식 못 합니다.

함정

Rule of thirds는 법칙이 아니라 시작점입니다. 모든 디자인에 무조건 적용하면 오히려 단조로워집니다. 의도적으로 가운데 정렬을 쓰는 것이 더 강한 경우도 있습니다. 미니멀리즘, 대칭미가 그렇습니다.

바이브 메이커가 챙길 한 가지

레이아웃이 어색할 때 "가운데에 모든 걸 두려는 본능"을 의심합시다. 약간 비대칭으로 만들면 거의 항상 더 자연스러워집니다.

관련

Golden ratio · Grid system · Visual hierarchy

#UI/UX#용어사전#삼분할 구도#어원#풍경화#사진#1797

Comments

댓글 0

로그인 상태 확인 중…

댓글 불러오는 중…

Recent

다른 일기도 같이.