디자인이 뭐야? 타이포그래피가 뭐야?

이름을 알면 대상을 더 깊게 이해할 수 있다.

꽤 오래 전에 크리스마스 선물로 식물 도감을 받은 적이 있다. 책에 처음 나온 나무는 조슈아 나무였는데 한 눈에 알아볼 수 있을만큼 정말 희한하게 생긴 나무였다. 책을 들고 집밖으로 나갔는데 여섯 채의 이웃집들중 4채의 앞마당에 조슈아 나무가 있었다. 나는 그 집에서 13년을 살았지만 조슈아 나무를 본 적이 없었다. 사람들이 조경을 할 때면 최소한 80%는 앞마당에 조슈아 나무를 심었다. 그런데 나는 지금까지 한 번도 이 나무를 본 적이 없었던 것이다. 즉 내가 이 나무의 이름을 알게 된 이후로 어디에서든지 이것을 볼 수 있었다. 이게 바로 나의 요점이다.

김춘수의 꽃이라는 시에는 이런 구절이 있습니다. 내가 그의 이름을 불러주었을 때 그는 나에게로 와서 꽃이 되었다.

무언가의 이름을 알게 되면 그 대상이 사람이든 사물이든 더 친숙해지고 깊게 이해할 수 있습니다. 이 책은 타이포그래피의 개념들에 이름을 붙이고, 그 이름들을 조합해서 새로운 개념을 만들어내는 것을 돕습니다. 그래서 이 책을 읽고 난 뒤에 어떤 디자인이 좋은 이유를 구체적으로 설명할 수 있게 되었죠.

타이포그래피의 기본 원리

1. 근접의 원리

근접의 원리는 서로 관련이 있는 항목들을 함께 무리 짓고, 실제로 그것들을 서로 가깝게 옮겨서, 서로 관련이 있는 항목들이 아무 상관없는 조각들이 아니라 하나의 응집된 덩어리로서 보여지도록 만드는 것이다.

UI/UX의 10가지 법칙에서 밀러의 법칙이라는 개념이 나옵니다. 밀러의 법칙이란, 어떤 정보를 통으로 기억하는 것보다는 덩어리화 하는게 더 기억하기 쉽다는 것입니다.

이 책에서 나온 근접의 원리도 밀러의 법칙과 비슷한 개념입니다. 연관있는 내용을 가깝게 배치해서 하나의 덩어리로 만들어 기억하기 쉽게 만드는 것입니다.

2. 정렬의 원리

정렬의 원리는 '페이지 상의 무엇도 독단적으로 앉혀져서는 안 된다'는 것이다. 모든 요소는 반드시 페이지 상의 무언가와 시각적인 연계성을 가져야만 한다.

시각적으로 조화롭게 보이는 것의 비밀은 각 요소들이 암묵적으로 연결되어 있다는 것입니다. 이때 각 요소간의 연결성을 만드는 것이 정렬입니다. 사진 찍을때 가상선에 맞춰 구도를 잡아본 적이 있으신가요? 남자들은 여자친구 사진 찍어줄 때 한번쯤 해봤을텐데, 대상과 배경을 가상선에 맞추면 대상이 배경에 잘 어울리는 것처럼 보입니다.

3. 대비의 원리

대비의 원리는 만약 두 항목들이 완전히 똑같지 않다면, 그것들을 다르게, 완전히 다르게 만들라는 것을 말한다. 그저 과감해지기만 하면 된다. 겁내지 말고 과감하게 하자!
검은색 드레스를 입고, 검은색 망사 모자를 쓴 여자가 빨간 하이힐과 빨간 립스틱을 바른게 바로 대비입니다. 상상만 해도 매력적이지 않나요? 반대로 빨간 드레스와 빨간 모자를 쓴 여자가 있다면 무슨 느낌이 드나요?

대비의 첫번째 목적은 페이지 상에 재미를 만드는 것입니다. 보기에 흥미로우면 읽힐 가능성이 커지죠. 대비를 하려면 과감하게 해야합니다. 그래야 눈에 띄이고, 더 흥미로워집니다.

두번째 목적은 내용의 체계화를 돕는 것입니다. 대비를 이루는 요소들은 각각이 하나의 덩어리가 되기 때문에 이해하기 쉽습니다.

보고, 말하고, 스케치하라

참고용 파일을 모아서 간직하자.(전단, 브로슈어, 그래픽, 손글씨 무엇이든 느낌이 왔던 것이라면 상관없다.) 말하라. 좋아하는 이유를 적어보라. 타이포그래피 원리가 사용된 곳을 의식적으로 찾아보라.

위 내용은 단지 타이포그래피에만 해당되는 말은 아닌 것 같습니다. 인상깊었던 무언가를 모아두는 것은 좋은 삶을 살아가는데 큰 도움이 된다고 생각합니다.

가족들의 사진, 좋아하는 음악, 여행 중 찍은 사진, 마음에 드는 책들을 간직하고 모아두는 것 자체가 그 사람의 취향을 만들고 취향이 그 사람을 이룬다고 생각합니다. 한 가지 예외는 전애인의 흔적은 모아두는 것이 좋지 않다는 것입니다.

본론으로 돌아와서 저는 UI 애니메이션 클립이나 아티클들을 모아두고 나중에 따라서 만들어봅니다. 피카소가 말했듯 우리들은 모두 예술가이며, 남의 것을 훔쳐서 자신을 표현해야합니다.

활자체 종류

누구나 세리프, 산세리프라는 용어를 들어봤을 것입니다. 이 용어는 활자체의 종류를 나타내는 용어입니다. 세리프는 글자의 끝이 돌출된 형태를 나타냅니다. 한글에서는 궁서체가 대표적인 세리프이죠.

이 책에서는 활자를 세리프의 여부와 굵은선과 가는선의 대비정도를 기준으로 6가지로 분류합니다.

위 표는 활자의 종류를 나누는 기준을 설명한 표입니다. 다른 종류의 활자를 사용하여 문자를 대비시키면 더 흥미로운 디자인을 만들 수 있습니다. 지금 보고 계신 이 포스트에도 활자의 대비를 사용했는데요, 어디서 사용하고 있을까요?