좋은 시각 디자인을 위한 '그리드' 법칙

세상에는 수많은 법칙과 규칙이 존재한다..
이런, 규칙을 많이 알고 있어야 새로운 것을 시도할 수 있다.
결국, 규칙은 창조의 시작이다.

누군가 규칙 때문에 창의성이 떨어진다고 주장한다.
예를 들어’’ 한글로, 또는 영어로‘ 글을 써야 한다고 해서,
창의성이 떨어지지 않는다.

창의성이 떨어지는 진짜 이유는 철저히  규칙’하나만 지키려는 당신의 수동적 자세이다.
규칙을 배우는 이유는 그 규칙을 깨기 위함이다.

제임스 카메룬은 세상의 모든 영화 규칙을 배워야 한다고 했다.
그래야만 그것을 효율적으로 깨부술 수 있다고 주장한다.

디자인 이론서를 통해 가장 기본적인 규칙을 찾아본다.
나는 디자인 업계는 아니지만, 레이아웃에 대한 디자인 규칙이 정말 중요하다는 사실을 인지하고 있다.
영화에 나오는 수많은 이미지와 그림들도 사실 디자인 이론이 많이 가미된다..
또한, 블로그를 좀 더 전문적으로 작 상하고 싶은 개인적 욕망에 이론을 찾아본다..
==

1. 사람의 시선 처리 방향.

사람의 시선은 왼쪽에서 오른쪽 하단으로 움직인다.
왼쪽 상단이 가장 강렬하고, 중심이 되는 이미지와 이야기를 적어야 효율적이다.
오른쪽 하단으로 내려갈수록 집중도가 떨어지고, 소극적으로 보게 된다..

특히, 블로그나 웹 형식의 문서들은 ’F’ 형태로 글을 읽는다.
한눈에 들어오는 출판물은 빠르게 주요 디자인 요소를 찾는다.
하지만, 웹은 한눈에 보이지 않기 때문에, 빠르게 2줄씩 하단으로 내려 읽는다.

출판물 취약점 = 오른쪽, 하단
웹페이지 취약점 = 본문, 하단

2. 역동성을 강조하는 비례.

비례는 보통 ‘적극적, 소극적‘으로 분류된다.
비례는 레이아웃에 역동성을 강조할 수 있다.
비례만 조금 수정해도 강한 힘이 생긴다.



소극적 비례 = 동일한 크기로 이미지를 제시하기 때문에, 여기에서 역동성의 주체는 이미지 자체이다.
이미지가 더욱 매력 있고 강한 쪽으로 시선이 움직인다.

적극적 비례 = 시선을 ’’ 큰 이미지-> 작은이미지작은 이미지’의도적으로 유도한다.
먼가 의도를 갖고 스토리를 전달하는 목적으로 사용된다..

 

 

3. 정보 자체의 중요도를 구분 짓는 위계

위계는 많은 정보 중에서 무엇이 중요한지를 제시한다.
대개 크기나 배 치르 조절해서 이뤄진다.

(중립) 서로 중립적이며, 자연스럽게 왼쪽에서 오른쪽으로 시선을 옮긴다.	(위치) 왼쪽에 혼자 제목을 두고, 오른쪽에 본문을 둬서 제목 자체를 강조한다.
(위치와 크기) 시선이 가장 먼저 들어오는 왼쪽 상단에 요소를 넣고, 크기를 바꾸고 사이에 공백을 둬서 정보의 우위를 나눈다.	(위치, 크기, 강조) 위치와 크기와 동일하지만, 강조를 더욱 강하게 만든다. 주로 색을 다르게 표현한다.

일종의 흐름과 스토리텔링을 부여할 수 있고, 더 많은 사람들이 보게 되는 좋은 글이 된다.

 

 

4. 3등분 법칙과 홀수 법칙

3등분 법칙은 너무 유명하다.

전체를 위아래 3x3으로 나누고, 가로 세로가 겹치는 부분에 들어간 이미지를 강조하는 것이다.
3등분 법칙은 안정감을 준다.
반대로 3등분 법칙을 지키지 않으면 긴장감을 만들어 이미지의 강한 힘을 부여한다..


너무 인의적이며 안정감을 추구하는 3등분 법칙에 비해 자연스러움을 강조하는 ‘홀수 법칙’이 있다.
짝수는 균형을 의미하고 실제 세상은 불균형 형태가 가장 많다.
홀수로 이미지를 배열하는걸 홀수 법칙이라 한다.

5. 지루함을 달래는 브로 사이드

쉽게 말해 본문 방향을 갑자기 가로에서 세로로 틀어 버리는 것이다.
책 이과 문서는 특정 형식과 흐름이 일정하기 때문에
방대하고 많은 분량을 읽다 보면 지루함을 느낀다.

갑작스러운 읽기 방향을 틀어줌으로 독자는 잠 쉬 휴식하고 흥미를 유발시킨다..

6. 무게 중심 균형을 유지하는 축 설정

 

중심축을 어디에 유지하냐에 따라 이미지가 역동적, 안정적으로 보이게 만든다.

왼쪽에 정렬된 축은 공백이 오른쪽에 일정하게 유지하고, 자극이 상대적으로 부족하기 때문에 약한 힘을 갖는다.
가운데에 정렬된 축은 여러 구성물들이 느슨하게 위태롭게 긴장감 있게 유지된다.
긴장감 때문에 사람은 좀 더 집중하고, 흥미를 유발한다..