[Design] 비전공자를 위한 디자인 TIP! 01. 컬러와 폰트는 1~2개만 사용하자!

비전공자와 디자인 초보자를 위해 좋은 디자인을 할 수 있는 간단한 팁을 알아보도록 하겠습니다.

이번에는 일반적인 문서작성 시 도움이 될 기본적인 디자인 팁 중 컬러와 폰트에 대해서 알아보고, 다음에는 디자인 구성요소에 대한 개념과 디자인 이론 및 방법론을 자세히 알아보는 과정에서 그 이유를 이해할 수 있도록 진행하겠습니다.


차례

  1. 폰트는 고딕체, 한 종류의 폰트만 사용!
    1) 폰트는 고딕체를 사용하세요.
    2) 폰트는 한 종류만 사용하세요.

  2. 컬러(Color)는 흑백으로 시작해서 중요한 색상은 1~2개, 5~10%만 사용!
    1) 컬러를 적용할 때는 처음부터 색을 적용하지 말고 흑백(B&W)으로 시작하세요.
    2) 중요한 역할을 하는 요소에 중요한 컬러 1~2개, 그리고 5~10%만 사용하세요.

1. 폰트는 고딕체, 한 종류의 폰트만 사용!

디자인을 하는 데 있어서 글자에 어떤 폰트를 사용할지 고민하게 됩니다. 고딕체와 명조체 중? 그리고 어떤 폰트를? 선택할지 모르겠다면 아주 쉬운 방법은 고딕체 계열의 폰트, 한 종류만 사용하면 된다는 것입니다.


1) 폰트는 고딕체를 사용하세요.

보통의 경우 명조체와 고딕체 중 어떤 종류의 글자체를 사용해야 할지 고민된다면 고딕체를 사용하세요.

폰트는 크게 명조체와 고딕체로 나누어지는데 컴퓨터와 핸드폰이 보급되면서 디지털 환경에 친화적인 고딕체가 많이 사용되고 있습니다. 그래서 일반적으로 사용자에게 고딕체가 익숙한(Familiar) 글자체가 되었습니다.

[그림 1] 명조체와 고딕체

2) 폰트는 한 종류만 사용하세요.

고딕체 계열의 폰트 한 종류만 사용한다는 것은 예를 들어 “나눔고딕”만을 사용하면 된다는 것입니다.

폰트 한 종류의 의미는 지정한 폰트의 세트를 말합니다. 대부분의 폰트는 보통 Light, Regular, Bold 등의 세트로 구성되어 있습니다.

예를 들어 [그림 2]와 같이 나눔고딕을 보면 나눔고딕 Light, 나눔고딕 (Regular), 나눔고딕 Bold, 나눔고딕 ExtraBold가 한 세트로 구성되어 있습니다.

[그림 2] “나눔고딕” 타이프페이스(Typeface)

이러한 폰트의 세트 또는 폰트 패밀리를 “타이프페이스(Typeface)“라고 하는데 중요한 것은 글자 역할의 중요도에 맞춰서 타이프페이스(Typeface)에서 적절한 폰트를 골라서 적용해주는 것입니다.


[그림 3] 폰트의 적용 사례

“[그림 3] 폰트의 적용 사례”를 보면 왼쪽의 디자인은 너무 많은 종류의 폰트를 사용한 예입니다.

오른쪽의 디자인은 한 종류의 폰트인 나눔고딕 세트 , 즉 “나눔고딕 타이프페이스(Typeface)”만을 사용한 예입니다. 그리고 글자의 역할의 중요도에 맞춰 제목, 소제목, 키워드에는 나눔고딕 Bold를 본문에는 나눔고딕을 사용하였습니다.

너무 많은 종류의 폰트를 사용하지 마세요! 한 종류의 폰트(Typeface)로도 충분합니다!


그리고 명조체를 사용해도 됩니다! 한 종류의 폰트, 즉 하나의 타이프페이스(Typeface)를 사용하는 것이 비전공자와 초보자가 아주 쉽게 좋은 디자인을 할 수 있는 방법인 것입니다.


[그림 4] 명조체와 고딕체 타이프페이스(Typeface) 적용 사례

현재 디지털 기술의 발전으로 인하여 고밀도/고해상도 디스플레이가 보급되면서 앞으로는 명조체 또한 많이 사용될 것으로 예상됩니다.



2. 컬러(Color)는 흑백으로 시작해서 중요한 색상은 1~2개, 5~10%만 사용!

1) 컬러를 적용할 때는 처음부터 색을 적용하지 말고 흑백(B&W)으로 시작하세요.


[그림 5] 흑백에서 컬러 적용 과정

디자인 작업물을 시작하는 단계부터 색을 사용하지 말고 흑백 또는 회색톤(Gray Scale)으로 완성 후 필요한 컬러를 적용해주세요.

숙련된 디자이너는 컬러 계획(Color Scheme)을 확립하고 작업을 진행하기 때문에 괜찮지만, 이러한 컬러 계획없이 비전공자와 초보자는 작업을 시작하기때문에 디자인이 나빠질 확률이 높아집니다.


2) 중요한 역할을 하는 요소에 중요한 컬러 1~2개, 그리고 5~10%만 사용하세요.


[그림 6] 컬러의 적용 사례

[그림 6]을 보면 제목에는 주제색인 파란색, 본문에서 키워드는 강조색인 빨간색이 사용되었습니다. 이와 같이 중요한 역할을 하는 제목과 키워드에만 중요한 컬러(주제색, 강조색)가 적용되었습니다. (참고: [Design] 중요한 디자인 구성요소에는 중요한 컬러를 적용)

비전공자와 디자인 초보자가 가장 많이 실수하는 부분이 색을 너무 많이 사용한다는 것입니다.

너무 많은 색을 사용하면 어떤 단어 또는 부분이 중요한지 인지하기 쉽지않고 혼란스럽습니다. 그래서 1~2개 정도의 중요한 컬러만 적용해주세요.

그리고 전체적으로 5~10% 정도로 중요한 디자인 구성 요소에만 중요한 컬러를 적용해주세요. 중요한 컬러라고 너무 많은 부분에 남용하게 되면 이 또한 중요성이 떨어지게 되겠죠?

너무 많은 컬러를 사용하지 마세요! 중요한 부분에만 중요한 컬러 2개 이하의 색상만 사용하세요!


[그림 7] 컬러의 적용 사례

[그림 7]의 처음 페이지처럼 제목과 키워드에 주제색 한 가지만 적용해도 충분히 좋은 디자인 작업이 될 수 있는 것입니다.


그리고 더욱 세련된 디자인을 하는 방법은 흑백의 컬러에도 어둡기 정도(명도)를 조절을 해주는 것입니다.


[그림 8] 흑백톤의 적용 사례

[그림 8]의 왼쪽의 경우 모든 글자에 100% 어둡기의 검정색을 적용하였습니다.

디지털 환경에서는 오른쪽 처럼 본문의 경우 80% 정도의 검정색을 적용하면 보기에도 좋고 가독성도 높아진다고 합니다. 부제목의 경우도 90%를 적용하였고, 이러한 흑백의 명도 조절은 확연히 표시나지 않지만 좋은 디자인을 하는 세밀한 작업입니다.