웹디자인 - 색의 기본 원리와 효과

웹디자인 기본기 다지기 - 색의 기본 원리와 효과

웹디자인을 디자인의 기본은 색의 원리를 이해하는 것이 중요합니다.

기본적인 색의 원리와 효과를 알아보겠습니다.

 

 

색의 분류

 

무채색 : 

• 채도가 없음.
• 명도만으로 구별

유채색 : 

• 색상이 있음 (색상, 명도, 채도 속성을 모두 가지고 있다.)
• 무채색을 채외한 모든색
• 난색, 한색 온도감이 느껴지는 색이 있다. 

---

색의 3속성

 

색상(Hue)

명도, 채도와는 상관없이 색채만을 구별한다.

우리나라는 먼셀의 표준 20색상환 사용

 

색상환에서 근거리에 있는 색 : 유사색

색상환 반대에 있는 색 : 보색

색상환에서 거리가 먼 색 : 반대색

 

 

명도=밝기(Value, Lightness)

사람의 시각은 명도에 민감하게 반응한다. 

가장 어두운 블랙을 0, 화이트를 10으로 총 11개의 명도가 존재한다. 

 

채도(Chroma, Saturation)

색의 맑고 탁한 정도를 나타냄.

순색 : 채도가 가장 높은 정도를 말함.

청색 : 맑에 보임

탁색 : 탁하게 보임. 순색이나 청색에 회색을 혼합한 컬러.

 

 

---

 

색의 혼합

 

가산혼합(가법혼함, 색광혼합)

빛의 삼원색을 혼합.

혼합이 될 수록 백색이 되고 명도는 높아진다. 

빨강 + 파랑 + 녹색 = 흰색

ex) 모니터, 스크린, TV, 무대조명 등.

 

감산혼합(색료혼합)

혼합이 될 수록 명도와 채도가 낮아진다. 

자주 + 청록 + 노랑 = 검정

ex) 색채 사진

 

중간혼합(평균혼합)

병치혼합 : 명도, 채도가 평균값으로 되어 가산혼합에 속한다.

ex)점묘화, 직물, 인쇄

 

회전혼합

두 색의 중간밝기로 혼합되어 보이게된다. 

명도와 채도가 평균값으로 보이게됨.

ex) 바람개비

 

 

---

표 색계

물체색을 표시하는 색상체계를 뜻한다. 

구성방식에 따라 현색계와 혼색계로 분류된다. 

 

현색계 : 

색채를 표시하는 표색계이다. 

우리나라는 먼셀의 표색계를 채택하여 표준으로 보고있다. 

 

혼색계 : 

색광을 표시하는 표색계

대표적인 혼색계로는 CIE 표준 표색계가 있음.

 

 

먼셀의 색 입체

색상, 명도, 채도를 시작적으로 고른 색채가 되도록 고려하여 세로축은 명도, 원주에는 색상, 가로축은 채도로 구성한 것이다. 

 

오스트발트의 포색계

무채색은 흰+검=100%

유채색은 흰+검+순색=100%되어 언제나 일정하다. 

 

오스트발트는 모든 빛을 완전하게 흡수하여 이삭적인 흑색, 모든빛을 반사하는 백색, 그리고 특정영역 빛을 완전하게 반사하고 나머지 파장영역을 흡수하는 이상적인 순색을 가정하고 이를 3색 혼합에 의하여 물체색을 체계화 하였다. 

 

---

색명체계

 

기본색명 : 

기본적인 색의 구별 (KS에서 규정)

기본 10색 사용.

 

관용색명 : 

오랜시간 전해 내려오는 습관적인 색의 이름, 장소, 식물, 고유한 이름을 붙여 부르는 색.

시대나 유행에 따라 변할 수도 있기떄문에 정확한 색의 전달이 어려울 수 있다. 

ex) 벽돌색, 쑥색, 귤색

 

일반색명(계통색명)

기본색명에 형용사나 수식어를 붙여 사용.

관용색명의 단점을 보완하였다. 

색의 3속성에 따라 분류되어 있다. 

 

---

색의 대비

 

동시대비 

비슷한 선상에 있는 두 개 이상의 색을 동시에 볼때 일어나는 현상으로 각 색상의 영향에 따라 색이 다르게 보일 수 있다. 

 

색상대비	두가지 색을 동시에 바라볼때 색상차이가 느껴지는 현상
명도대비	사람의 눈에 가장 강하게 반응하는 대비 명도에 따라 밝고 어두움 뿐만아니라 무게감도 다르게 보여진다.
채도대비	채도가 다른 두가지 이상의 색이 영향을 받아 채도 차이가 나는 현상.

 

보색대비 

색상환에서 정반대에 있는 두색상이 서로 인접해 있을때 서로 영향을 받아 채도가 높아보이며 더 선명해 보이는 현상을말한다. 

 

면적대비  

면적의 크기에 따라 색이 다르게 느껴지는 현상을 말한다.

면적이 클수록 명도,채도가 높아 보이며 먼적이 작아지면 명도,채도가 낮아보임

 

한난대비

한색이나 난색 옆에 중석색을 놓으면 같은 중성색이라도 따뜻함 or 차갑게 느껴지는 것.

 

연변대비 

두 색이 붙어 있을때 색상, 명도, 채도 대비현상이 더 강하게 일어남.

 

계시대비 (계속대비 or 연속대비)

먼저 본 색상의 영향으로 나중에 보는 색이 시간적 간격에 따라 다르게 보이는 것.

 

---

색의지각

 

동화현상 (폰-베졸트 효과)

특정색이 색의 영향을 받아 인접색에 가까운 색이 되어 보이는 현상.

 

잔상 (망막의 피로현상)

망막에서 느껴진 자극이 계속 남아있어 형상이 사라져도 형상이 일시적으로 남아있는 것 처럼 느껴짐.

 

명시도 (명시성, 가시성)

어떤 색이 다른 색의 영향을 받아 더 잘보이는것.

 

주목성

시선유도를 잘하는 성질을 나타낸다.

 

진출색과 후퇴색

진출색 : 앞으로 나와있는 것처럼 느껴지는 색

후퇴색 : 뒤로 물러나 있는 것처럼 느껴지는 색

 

팽창색과 수축색 

팽창색 : 실제보다 더 크게 보이는색

수축색 : 한색, 저명도, 저채도의 색