글자의 배치와 배열, 그룹핑, 간격
1. 글자의 배치와 배열
- 타이포그래피는 배치, 배열을 통해 정보 전달을 해야 함
- 하나의 화면 안에 정보를 어떻게 배치해 효과적으로 전달할 것인가?
- A 그룹: 이름
B 그룹: 이메일, 전화번호
C 그룹: 주소 - 첫 번째 명함
- B그룹(이메일, 전화번호)이 A그룹(이름)에 속하는지, C그룹(주소)에 속하는지 모호함
- 동일한 간격으로 인해 강조하고자 하는 내용이 무엇인지 명확하지 않음
- 두 번째 명함
- B그룹(이메일, 전화번호)을 C그룹(주소)에 가깝게 배치할 경우, 이름이 더 강조되는 효과 발생
- 간격 차이를 많이 둘수록 더욱 강조됨
- 세 번째 명함
- A그룹(이름)과 B, C그룹(이메일, 전화번호, 주소)으로 두 개의 축이 존재
- 글자 색상, 크기 등에 변화를 주지 않고 배치, 배열만으로도 강조 가능
2. 글자 배치 방법: 그룹핑(Grouping)
- 관련성 있는 정보끼리 그룹핑해야 정보 인지가 빠름
- 축을 통해 그룹핑하되, 축이 너무 많아지면 그룹핑이 어려움
- 그룹 개수는 최소화하고, 각 축의 길이를 다르게 하여 정보 그룹핑을 용이하게 할 수 있음
축의 길이에 차이를 두면 특정 정보를 강조하는데 효과적 - 유사한 정보끼리 그룹 묶고, 강조하고 싶은 그룹은 요소를 줄여 강조하고 싶은 요소만 남기고, 나머지는 다른 그룹으로 넘겨 축의 길이를 비대칭적으로 만들면 정보가 훨씬 강조됨
- 그룹핑이 잘된 디자인은 여백 공간이 깔끔하게 떨어짐
- ex) 첫 번째 명함은 이름을 강조하기에 매우 적합한 형태로 그룹핑이 가장 잘되어 있음
두 번째 명함은 첫 번째 명함에 비해 이름 강조가 부족, 주소가 강조됨
세 번째 명함은 그룹의 개수가 너무 많아 정리되지 않고, 정보 인지가 어려움
- 첫 번째 명함의 경우, 축이 왼쪽과 오른쪽에 있어 시선이 밖으로 이동하게 됨
(축이 왼쪽 정렬, 오른쪽 정렬로 바깥쪽으로 형성) - 두 번째 명함의 경우, 첫 번째 명함에 비해 축이 안으로 형성되어 있어 시선이 안으로 이동하게 됨
- 두 번째 명함과 같이 보는 순간 구조가 명쾌하게 드러나는 디자인을 좋은 디자인이라 할 수 있음
- 첫 번째 명함에서 세 번째 명함으로 갈수록 강조하고자 하는 내용이 명확하고 정보 전달이 매우 용이함
- 그룹 개수를 최소화하고, 각 축의 길이를 다르게 하면(비대칭적) 특정 정보를 강조하는데 효과적임
- 디자인을 취향에 따라 접근하면 설득하기 어려워짐
- 타이포그래피는 정보 전달이 중요
3. 글자 배치 방법: 간격(Spacing)
- 간격 차이를 통해 정보 구분, 전달 용이함
- 일정한 간격보다 간격에 차등을 주면 강조하고자 하는 내용이 무엇인지 명확해짐
- 간격은 그룹 안에서도 발생하고, 그룹과 그룹 사이에서도 발생
- ex) 첫 번째 명함은 두 개의 그룹이지만 간격의 차이를 통해 정보 구분이 용이하고, 이름 강조 가능
두 번째 명함은 하나의 그룹으로 간격 길이 차이를 통해 특정 정보(이름)를 강조함
세 번째 명함은 동일한 간격 차이로 인해 강조하고자 하는 것이 무엇인지 모호함 - 하나의 그룹이라 할지라도 그룹 내에서 간격 차이를 통해 특정 내용을 강조할 수 있음
- 간격은 그룹 내에서도 발생하고, 그룹과 그룹 사이에서도 발생
- 간격 차이가 일정한 것보다 간격 차이를 둔 경우 정보 전달이 보다 효과적
- 첫 번째 명함은 그룹핑은 되어 있으나, 명함 오른쪽의 여백이 너무 넓어 정보가 왼쪽으로 치우친 느낌
두 번째 명함은 가운데 배치로 축이 하나밖에 없으나, 간격을 다양하게 사용해 유사한 정보끼리 그룹핑한 느낌을 제공
세 번째 명함은 A그룹(이메일, 이름, 직업, 전화번호)과 B그룹(주소)의 간격 차이로 정보 구분이 명확함
4. 세로 명함
- 세로 명함의 경우, 글자 배치와 글줄길이 등이 가로 명함과 다름
- 가로에서 세로로 바꾸게 되면 글줄의 변화가 가장 많아짐
- 로고, 아이콘을 사용하면 해당 영역으로 시선이 가기 때문에 특정 내용이 더 강조됨
- 배치, 그룹핑, 간격만으로도 정보 처리가 다르고, 정보 구조를 탄탄하게 만들 수 있음
- 첫 번째 명함의 경우, 로고, 이름, 나머지 정보순으로 강조되어 정보를 읽기 쉽게 디자인함
두 번째 명함의 경우, 하나의 축으로 연결되어 있어 그룹이 하나지만 간격에 차이를 두어 정보를 구분함