시각 언어 습득하는 방법 4가지
타이포, 여백, 사이즈, 컬러
비전공자가 디자인을 공부할 때 가장 막막하면서도 숨이 턱, 막히는 이유는 아마 '시각 언어'때문일 것이다.
특히 나처럼 글을 쓰는 기획자들은 활자에는 익숙하지만, 시각 언어는 당최 어떻게 읽어야할지 감도 안 잡히기 마련이니까. 그래서 웹에서 작업물을 보거나 전시를 가도, 옆에 캡션이 없으면 딱히 보려고 노력하지도 않고 지나치게 되는 경향이 있다.
시각 언어는 소위 말하는 '감각'의 영역에 가까워보여서, 주변에 감각 있는 친구들에게 어떻게 하면 그런 감각을 갖게 되느냐 물으면 항상 같은 대답만 돌아왔다.
그냥 많이 보면 돼!
실제로 그들은 그렇게 익혔겠지만, 무턱대고 보기만 하는 게 내게 어떤 취향을 만들어줄 지도 확실치 않았고, 꼭 그렇게 불투명한 삽질에 시간을 써야 할까 하는 의문도 들었다. 그래서 이번 주 화요일에 받은 REASIGN 뉴스레터가 정말 반가웠다. 이번에는 시각적 문법(타이포, 여백, 사이즈, 컬러)을 익히는 실제적인 방법들을 다뤘다.
원문 <Before you can master design, you must first master the fandamentals>를 해외 디자인 아티클 번역 뉴스레터 REASIGN에서 번역하였습니다.
최신 해외 디자인 아티클을 한글판으로 편하게 받아보세요!
읽는 디자인, <디독D.dok>(구:REASIGN) 구독링크:http://bit.ly/2FNQNpv
원문: https://medium.freecodecamp.org/before-you-can-master-design-you-must-first-master-the-fundamentals-1981a2af1fda
언어란 사람들이 다른 사람에게 어떤 개념을 전달하기 위한 방법이다. 시각 디자인은 시각 언어이다. 그리고 시각 디자인을 배우는 것은 새로운 언어를 배우는 것과 다르지 않다.
이제 당신의 디자인을 한 단계 레벨 업 시켜줄 기초 지식들을 알아보자.
1. 타이포 그래피, 기본으로 돌아가기
당신은 타입 하나만으로도 전체적인 디자인을 할 수 있다. 폰트에서 줄 몇 개를 수정함으로써 기본적인 디자인을 해볼 수도 있다.
타입을 표현하기 위한 언어를 개발해보자. 트래킹, 커닝, 리딩이 무엇을 의미하는 용어인지 배워보자. 아티클 <당신이 알아야 할 아름답게 묘사된 타이포그래피 용어>은 이러한 용어를 배우기 위한 매우 좋은 리소스이다.
그러고나서, 타이포그래피를 어떻게 웹에 적용하는지에 대한 전반적인 이해를 원한다면, 이걸 읽어보자.
(<웹 타이포그래피: 웹에 적용되는 타이포그래피 스타일의 요소들>)
끝으로, 어떻게 폰트들을 조합하는지 공부해보자. 좋은 사이트로는 FontWolf 와 FontPair가 있다. 폰트를 짝 지을 줄 알게 되면, 디자인에 있어서 엄청난 변화를 일으키게 될 것이다.
2. 여백, 율동감 설계하기
여백은 디자인에서 수직/수평적 율동감을 설계하는 데에 도움이 된다. 이는 시각적 위계질서를 구축하는 것과 요소들 간의 상관 관계를 형성하는 데에 중심적인 역할을 한다.
여백을 어떻게 다루는지 보려면 비핸스나 드리블같은 사이트를 참고하여 영감을 얻는 것도 좋다. 하지만 중요한 것은 균형을 맞추고 시각적인 조화를 구성하기 위해 여백을 사용하는 당신만의 직관을 기르는 것이다.
타이포그래피를 공부할 때, 타입의 여백의 중요성에 대해 익히 들어왔을 것이다. 폰트의 커닝과 리딩을 조절하는 것은 여백을 보는 안목을 기를 수 있는 가장 좋은 훈련 방법이다. 이런 이유로, 당신의 커닝과 전문 타이포그래퍼의 답을 비교해볼 수 있는 게임인 KernType을 해볼 것을 추천한다.
하나 더: 기존에 있는 디자인을 가지고 x/y축을 그린 뒤, 디자인을 기본적인 도형으로 단순화한 다음, 그 디자인이 어떻게 균형을 맞추었는지 분석한 다음 요소들을 재배열해보자. 네거티브 스페이스가 요소들의 균형에 어떻게 영향을 끼치는지 주의하면서 해보면 좋다.
3. 사이즈, 시각적 위계질서 만들기
크기에 대한 안목을 기르는 훈련의 비결은, 피드백을 요청하는 것이다.
랜딩페이지를 스케치하거나 와어어프레이밍해보자. 그리고 친구에게 디자인을 봐달라고 부탁하고, 눈에 띄는 요소들에 동그라미 쳐달라고 하자. 그 후에, 중요도 순으로 동그라미 쳐진 요소에 숫자를 매겨달라고 하자. 결과가 당신이 기대한 것과 동일한가?
이 훈련을 할 때는, 다음 질문들을 고려하자.
이 랜딩 페이지의 전환 목표는 무엇인가? 그 목표를 달성하기 위해 어떻게 최적화할 수 있는가?
요소들은 어떤 관계인가? 어떤 요소를 강조하고 싶은가?
레이아웃이 독자들을 잘 안내하는 형태인가?
4. 컬러, 말하지 않고 의미 전달하기
컬러를 철저하게 분석하기 위해서, 내가 쓴 <컬러로 디자인하기>를 읽어보자. 글의 핵심 요소는 다음과 같다.
컬러 팔레트를 찍기 전에 디자인의 목표를 확실하게 정하자. 좋은 디자인은 컬러 팔레트를 그것의 목표에 맞게 맞춘다.
색채론 기초를 탄탄하게 다지면, 컬러는 실험과 반복 정도의 수준으로 쉬워진다. 적극적으로 컴포트 존을 벗어나서 새로운 컬러 팔레트를 시도해보자!
당신이 좋아하는 사진, 잡지, 혹은 전시나 공연 등을 보고 컬러 팔레트를 만드는 데에 시간을 보내자. 그러고 나서 기존에 했던 디자인을 가져다가 새로운 컬러 팔레트를 적용해보자. 그 디자인의 무드와 톤이 어떻게 바뀌었는지 메모하자. 의미도 함께 바뀌었나?
최신 해외 디자인 아티클을 한글판으로 편하게 받아보세요!
읽는 디자인, <디독D.dok>(구:REASIGN) 구독링크: http://bit.ly/2FNQNpv
같이 읽으면 좋은 글
https://brunch.co.kr/@thinkaboutlove/197
https://brunch.co.kr/@thinkaboutlove/201
