본문으로 바로가기


웹 디자인은 시각적 요소가 가장 중요하다 보니 당연히 색 의 선택은 큰 영향을 줄 수밖에 없다.

웹 디자인의 색상설계에 대해 좋은 글을 발견해 공부해 보았다.






먼셀의 20색상환이다.

10색상환도 있지만 크게 개념은 비슷하다.


빨강, 노랑, 초록, 파랑. 보라를 기본으로 20색으로 표현하였으며 각각의 색상이 주는 이미지가 다르다.

이 10~20색으로 이루어진 색상환을 이용해 다양한 색상 설계를 할 수 있다.



1. 단색설계


단색설계는 기본색상 하나를 선택한 뒤, 명도를 조절하여 만든 몇 가지 색상을 사용하는 방법이다.

특정 색상 자체가 기업 이미지를 상징하거나, 통일성이 필요한 경우 사용하면 효과적이다.



2. 무채색 설계


단색설계에 포함되는 개념이다. 색상환 표에 있는 색상은 아니지만 검정색 / 흰색 / 회색만을 사용하여 명도를 조절해 사용한다.

표현하고자 하는 컨텐츠가 화려하고 지저분할 경우 사용하면 지저분할 수 있는 페이지를 깔끔하게 표현 할 수 있다.



3. 유사색설계


색상설계에서 유사색 설계는 색상환에서 특정한 색상 하나를 고르고, 그 색과 이웃한 다른 색들로 구성한다.

굳이 바로 옆에 있는 색일 필요는 없지만, 색상환에서 1/3 이하로 선택하는 것이 좋다.

색이 주는 감정을 활용하되 단조롭지 않게 구성할 수 있다.



4. 보색설계

보색설계는 색상환에서 서로 정 반대에 위치한 색들로 구성하는 색상설계 기법이다.

빨간색 계열과 초록색 계열, 주황색 계열과 파란색 계열 등을 서로 조합하여 사용한다.

눈에 확 들어오는 디자인을 만들어 낼 수 있지만 잘못 사용하면 자칫 촌스러워질 수 있으니 주의하자.

서로 두드러지는 보색설계를 잘 이용하면 사용자의 시선을 쉽게 이동시킬 수 있다.



5. 분할보색설계

기본색 하나를 선택하고, 그 색상과 보색위치에 있는 인접한 두 색을 선택하여 구성한다.

보색설계보다 한단계 더 과장된 효과를 보일 수 있다. 다만 너무 유치해 보일 수 있다는 단점이 있다.



6. 3색설계


3색설계는 같은 간격으로 위치하는 세 가지 색상을 선택한다.




7. 4색설계


4색설계는 두 가지 보색설계를 결합하여 사용한다.




디자인하는 웹의 목적과 사용자의 특성에 맞게 선택하면 좋을듯 하다.

다만, 하나의 웹에 전반적으로 통일된 색상 설계를 적용하지 않으면 사용자는 혼란에 빠질 것이다.



 Other Contents 

댓글을 달아 주세요

티스토리 툴바