색상환 – 디자이너가 아닌 사람을 위한 필수 디자인 가이드

좋아하는 색이 생각나시나요? 음, 쉽습니다. 이제 브랜드 메시지와 가장 관련이 있다고 생각되는 색상을 생각할 수 있습니까? 까다롭지만 색상 심리학이 문제를 해결합니다. 이제 먼저 선택한 이 색상과 잘 어울릴 색상이 생각나시나요? 그것이 혼란이 시작되는 곳입니다, 그렇죠? 우리는 오늘 그 작은 혼란을 다룰 것입니다. 어떻게? 컬러 휠에 대해 이야기합니다.

한동안 브랜드를 위한 마케팅 디자인을 만들어 왔다면 하나의 색상이 모든 것에 적합하지 않다는 것을 이미 알고 있을 것입니다. 브랜드에 맞는 색상을 알아야 합니다. 청중에게 어떤 색상이 적합한지 알아야 합니다. 이를 위해 색상 이론과 색상 심리학이라는 두 가지 요소가 작용합니다. 우리는 색상 심리학에 대해 이야기했습니다. 이제 색상 이론에 대해 이야기합시다. 특히 색상환에 대해 그리고 그것이 "디자인"과 "좋은 디자인"을 구별하는 데 어떻게 도움이 되는지에 대해 설명합니다.

그렇다면 컬러 휠이란 무엇입니까?

색상 선택에는 창의성이 있습니다. 창의력에 약간의 과학을 적용하면 다양한 경우에 대한 색상 조합을 식별할 수 있습니다. 서로 잘 어울리는 색상, 극명하게 대조되거나 자연스럽게 섞이는 색상을 선택하는 것입니다. 색상환을 사용하면 이 선택을 더 간단하게 만들 수 있습니다.

색상환의 문자 그대로의 정의는

"색상 간의 관계를 표시하는 데 사용되는 스펙트럼의 원형 다이어그램".

간단히 말해서 색상환은 색상의 특성과 이러한 색상이 인식되는 방식에 따라 색상을 원형으로 배열한 것입니다. 아이디어는 Newton Disc 개념에서 비롯됩니다.

기본 색상환에는 다음으로 구성된 12가지 색조(단색)가 포함되어 있습니다.

• 3원색(다른 색을 조합하여 만들 수 없는 고유의 색)
• 2차색 3색(기본색 2개를 조합하여 얻음)
• 3차색 6가지(1차색과 2차색을 혼합하여 얻음)

디자인에서 일반적으로 볼 수 있는 두 가지 유형의 색상환은 RGB(빨강, 녹색, 파랑)를 기본 색상으로 하거나 RYB(빨강, 노랑, 파랑)를 기반으로 합니다. RGB는 빛의 스펙트럼을 기반으로 하지만 모든 색조의 조합은 흰색을 제공합니다. 반면 RYB는 페인트 색상의 작동 방식을 기반으로 합니다. 더 많은 페인트를 섞을수록 더 많은 색상을 결합할수록 검은색에 가까워집니다.

그렇기 때문에 인쇄 디자이너와 디지털 디자이너가 사용하는 색 구성표에서 미묘한 차이를 발견할 수 있습니다. 그렇다면 색상환을 잘 이해하는 것이 마케팅 디자인에 중요한 이유는 무엇입니까? 우리는 당신에게 말할 것입니다

컬러 휠 및 브랜드 디자인

브랜드를 나타내는 로고부터 연결을 구축하는 데 도움이 되는 명함, 메시지를 전달하는 소셜 미디어 디자인, 고객 경험에 영향을 미치는 포장 디자인에 이르기까지 브랜드를 시각적으로 표현하는 모든 곳에서 색상이 빛을 발합니다. 색상만으로도 구매 결정의 거의 85%에 영향을 미칠 수 있다는 사실을 알고 계셨습니까? 이 영향력 있는 시각적 특성을 더 잘 이해하는 데 도움이 되는 모든 아이디어는 가치가 있습니다. 그렇기 때문에 색상환을 이해하는 것이 더 나은 디자인을 향한 훌륭한 첫 걸음입니다.

어떤 색은 나란히 놓을 때 좋아 보입니다. 그러나 하나를 전경으로 가져오면 상황이 완전히 달라집니다. 전경의 색상을 구분하기 어렵거나 시각적인 산만함을 너무 많이 유발하여 디자인을 보기 불편하게 만듭니다. 당신은 그것을 원하지 않는다!

아래 표는 웹 디자인에서 다양한 색상 조합의 효과를 보여줍니다. 유사한 규칙이 마케팅 디자인의 텍스트 가독성에도 적용됩니다.

두 색상 사이의 대비는 전경의 텍스트가 배경색에 대해 읽을 수 있는지 여부를 알려줍니다. 그렇지 않으면 복사본과 메시지가 명확하지 않기 때문에 두 가지 좋은 색상이 낭비됩니다. 이를 피하는 한 가지 방법은 색상환에서 선택한 색상의 위치를 ​​이해하고 일반적으로 사용되는 색상 조화 또는 색상 구성표를 기반으로 올바른 조합을 선택하는 것입니다.

이제 색 구성표와 이를 디자인에 사용하는 방법에 대해 이야기해 보겠습니다.

당신이 알아야 할 7가지 색 구성표

색상 조화 또는 색 구성표는 둘 또는 둘 이상의 색상 조합입니다. 색상환에서 각 색상의 위치에 따라 이러한 조합에 도달합니다. 선택한 색상 간의 관계에 따라 색상을 나란히 또는 서로 마주보게 배치할 때의 모양이 결정됩니다. 그리고 좋은 디자인의 핵심은 이 조합을 올바르게 만드는 데 있습니다.

두 색상 간의 관계는 색상이 얼마나 비슷하거나 다른지에 따라 간단할 수 있습니다. 색상환에서 색상에서 멀어질수록 대비가 높아집니다. 너무 많은 대비 또는 너무 적은 대비는 모두 디자인의 가독성과 미학에 영향을 미칠 수 있습니다. 이러한 아이디어를 사용하는 방법과 위치를 알기 위해 색 구성표에 대해 이야기해 봅시다.

거기에 도달하기 전에 자주 사용되는 색조, 색조, 음영 및 톤이라는 용어를 찾을 수 있습니다. 혹시 모르니,

• 색조는 단색입니다.
• 색조 = 색조 + 흰색
• 음영 = 색조 + 검정
• 톤 = 색조 + 회색

1. 단색 배색

이것을 더 잘 이해하려면 단색의 색조와 음영을 포함하는 확장 색상환을 이해해야 합니다.

위의 색상환에서 수직으로 진행하여 색상 팔레트를 선택하면 단색 색상 팔레트가 나타납니다. 즉, 이것은 색조, 톤 또는 음영과 함께 하나의 색조의 조합입니다. 전반적으로 이 구성표는 보기에 좋습니다. 기본 색상은 하나뿐입니다. 따라서 메시지의 감정을 강하게 반영하는 한 가지 색상을 식별했다면 단색 구성표가 작동합니다. 핵심 메시지에서 시청자를 산만하게 하는 모순되는 색상이 없습니다.

브랜드 색상을 중심으로 구축된 단색 색상 구성표는 브랜드 색상을 스포트라이트에 두는 데 도움이 됩니다. 브랜딩 디자인을 위한 훌륭한 옵션입니다. 지속적으로 사용하면 고객이 브랜드와 브랜드 색상을 연관시키는 데 도움이 됩니다.

Kimp 팁: 단색 색상표를 선택할 때 가장 높은 수준의 대비는 단색 색상환의 중앙에 있는 색상과 동일한 세로 섹션의 가장 바깥쪽 색상 사이입니다. 따라서 단색 색 구성표로 작업하고 있고 디자인의 텍스트를 읽기 쉽게 유지하는 방법이 궁금하다면 더 멀리 떨어져 있는 색 값을 선택하십시오.

2. 유사한 색 구성표

단색의 단조로움을 깨고 싶지만 유연한 조합을 유지하려면 유사한 색 구성표가 최선의 방법입니다. 유사한 색 구성표를 만들려면 바로 옆에 있는 두 가지 색상과 함께 색상환에서 하나의 기본 색상을 선택합니다. 이 세 가지 색상은 점진적인 진행, 한 색상에서 다른 색상으로의 부드러운 전환처럼 보입니다. 이것이 작업하기에 즐거운 색 구성표를 만드는 것입니다.

그라데이션 배경을 만들어야 하거나 자연에서 영감을 받은 디자인과 같은 강력한 테마를 전달하려는 경우 유사한 구성표를 선택할 수 있습니다.

위의 디자인에서 분홍색은 발렌타인 데이 테마에 완벽한 색상입니다. 그러나 단색 팔레트는 대비가 적음을 의미합니다. 단색 팔레트로 작업하는 동안 CTA 또는 초점 텍스트(이 경우 가격)에 즉시 관심을 끌기가 어려울 것입니다. 그러나 발렌타인 테마를 깨는 강한 색상을 선택할 수는 없습니다. 오렌지와 같은 유사한 색상이 적합할 수 있는 곳입니다. 디자인의 초점 요소에 시선을 집중시키기에 충분한 대비이지만 주제를 깨지 않는 조화로운 조합!

Kimp 팁: 단색 및 유사 색 구성표를 사용하면 색 간에 눈에 띄는 대비가 없습니다. 따라서 두 개 이상의 매개변수 간의 뚜렷한 차이를 표시해야 하는 시각적 데이터 해석과 같은 곳에서 이러한 체계를 멀리하십시오. 그러나 약간 겹치는 매개변수를 캡처하는 막대 차트 또는 파이 차트가 있는 경우 이러한 체계가 작동할 수 있습니다.

3. 보색 배색

색상환에서 서로 정반대에 있는 색상은 보색입니다. 앞에서 설명한 것처럼 색상에서 멀어지면 대비가 증가합니다. 따라서 가장 높은 대비는 보색 사이입니다. 함께 사용해야 할 때 플러스와 마이너스입니다.

높은 수준의 대비는 대칭 균형을 사용하여 페이지에서 시각적 가중치의 균형을 맞춰야 할 때 시각적 균형 감각을 만드는 데 도움이 됩니다. 또는 디자인에서 동일한 가중치 또는 우선순위를 가진 두 개의 서로 다른 요소를 표현해야 하는 경우입니다.

그러나 높은 수준의 대비를 고려할 때 이러한 색상을 전경과 배경에 사용하면 너무 많이 충돌하게 됩니다. 그 결과 많은 시각적 부담을 유발하는 디자인이 탄생했습니다. 즉 배경색이 글자색과 보색이면 글을 읽기가 불편하다. 일부 보완적인 쌍은 괜찮아 보이지만 다른 쌍은 디자인을 나쁘게 만듭니다. 예를 들어 빨간색과 녹색은 보색입니다. 글꼴과 배경에 대해 디자인을 선택한 경우 디자인은 다음과 같습니다.

색상 사이에 대비가 잘 되어 있어 텍스트를 명확하게 읽을 수 있습니다. 의심의 여지가 없습니다. 그러나 여기서 효과를 죽이는 것은 조합입니다.

반면에 로고 디자인과 같이 보색을 나란히 사용하면 미학적으로 매력적인 균형을 이룹니다.

다음은 노란색과 보라색의 보색 쌍을 사용하는 디자인입니다.

4. 보색 배색 분할

디자인에 충분한 대비를 원하고 각 요소를 올바르게 강조하여 메시지를 전달하기 위해 최소 세 가지 색상이 필요한 경우 분할 보완 체계가 유용합니다.

분할 보색 팔레트를 만들려면 기본 색상을 선택합니다. 보색을 식별하고 이 보색의 양쪽에 있는 두 가지 색상을 선택합니다. 이 세 가지 색상이 합쳐져 분할 보완 체계를 형성합니다.

위의 디자인에서 파란색과 보라색 텍스트 섹션은 서로 너무 많이 충돌하지 않습니다. 따라서 디자인에서 카피를 읽는 것이 즐겁습니다. 대비되는 노란색의 팝이 흥미로운 요소를 더합니다. 조화를 깨지 않으면서 디자인을 더욱 매력적으로 만들어줍니다. 이것이 분할 보색 구성표가 하는 일입니다.

킴프 팁: 보색 옆의 색상 사이에는 최소한의 대비가 있습니다. 그러나 선택한 기본 색상은 이러한 각 색상과 가장 강한 대비를 갖습니다. 따라서 즐거운 조화를 만드는 것이 중요한 대부분의 디자인에서는 대비가 가장 적은 쌍을 선택할 수 있습니다. 그리고 CTA, 영웅 텍스트, 제목 텍스트 또는 텍스트 악센트와 같은 초점 요소의 경우 기본 색상을 선택할 수 있습니다.

5. 3색 배색

색상환에 정삼각형을 그려야 한다면 3색 팔레트를 얻게 됩니다. 즉, 삼색 색 구성표는 똑같이 떨어져 있는 세 가지 다른 색조를 선택하는 것입니다.

보색처럼 강한 대비나 유사색처럼 약한 대비를 걱정할 필요가 없습니다. 이것은 두 세계의 장점을 결합합니다.

여기서 딱 맞는 대비는 차이를 통해 균형을 만드는 데 도움이 됩니다. 다양한 감정적 가치의 색상을 사용하여 디자인을 생생하고 상호 작용할 수 있습니다.

3색 구성표를 사용하면 웜톤과 쿨톤을 모두 결합할 수 있습니다. 따라서 디자인이 우울하거나 너무 강렬해 보이지 않습니다.

위의 예는 디자인의 두 가지 주요 색상에 동일한 가중치를 부여하고 녹색은 주의를 끌기 위해 적절한 대비를 제공합니다.

6. 정삼각형 색 구성표

대부분의 디자이너는 디자인에 최대 2~3가지 색상을 사용하도록 권장합니다. 콘텐츠를 구획화하고 영역 간에 대비를 제공하는 데 필요한 전부입니다. 그러나 그보다 더 많은 색상이 필요한 경우에는 4차원 직사각형 색상 팔레트를 선택하는 것이 좋습니다.

정사각형 색 구성표는 어떻게 형성합니까? 보완적인 색상 쌍을 선택하십시오. 이제 이러한 보색의 양쪽에 있는 색상을 연결하는 사각형을 그립니다. 이 네 가지 색상은 사변형 직사각형 색상 팔레트를 형성합니다.

여기에는 두 쌍이 있으며 각 쌍 내의 대비는 최소화됩니다. 그러나 각 쌍에 대한 대조는 명확하게 구별할 수 있습니다. 하지만 보색과 같이 눈에 피로를 주는 대비는 없습니다. 따라서 텍스트의 가독성을 유지하면서 디자인에 생명을 불어넣기에 충분한 색상을 얻을 수 있습니다.

7. 정사각형 색 구성표

정사각형 색 구성표의 대비를 더 부드럽게 하고 밝은 색 팔레트를 만들려면 정사각형 색 구성표가 적합합니다. 이름에서 알 수 있듯이 색상환에 사각형을 그리면 얻을 수 있습니다. 균일하게 배치된 색상입니다. 그래서 비슷한 색에서 얻을 수 있는 은은한 조화와 함께 미묘한 대비를 얻을 수 있습니다.

Kimp 팁: 이 구성표의 모든 색상은 디자인에서 동일한 수준의 지배력을 가진 것으로 나타나므로 이러한 색상이 나타나는 양을 조정하여 시각적 가중치를 변경해 보십시오. 예를 들어 이 중 하나를 배경색으로 사용하고 나머지는 텍스트 섹션 및 CTA의 강조색으로 사용할 수 있습니다.

Kimp와 함께 색 구성표 혼란에 종지부를 찍으십시오.

색상, 색조, 대비, 색 구성표, 색상환 – 디자이너가 아닌 사람이 소화하기에는 다소 무리가 있을 수 있습니다. 그러나 이제 개요가 있으므로 디자인을 보는 방식이 변경될 것이라고 확신합니다. 그리고 디자이너가 추천한 기본 색상을 기반으로 특정 색상 팔레트를 선택한 이유를 이해하게 될 것입니다. 게다가 Kimp과 같은 지정된 디자인 팀과 함께 작업하면 각 디자인에서 디자이너와의 관계가 계속 좋아집니다. 따라서 디자이너가 디자인에서 기대하는 분위기와 시각적 테마를 포착할 수 있다고 확신할 수 있습니다.

7일 무료 평가판에 지금 등록 하십시오.