Color

Color는 UI에서 매우 중요한 시각적이고 기능적인 요소이다. 브랜드 정체성을 표현하고, 앱의 스타일을 결정할 수도 있다. 즉각적이고 강력한 상호 작용을 유도하기도 한다.

• 사용자에게 상호작용 요소를 즉각적으로 이해시킨다. 버튼 같은 컨트롤에 고유의 색을 부여하고, 앱의 전체 화면에 일관성 있게 사용하여 시선을 집중시키고 행동을 유도할 수 있다.

<aside> ❗ Example 빨간색은 ‘거절’, 녹색은 ‘응답’에 사용된다.

통화를 종료하고 싶을 때는 빨간색 버튼을 사용한다.

</aside>

• 사용자가 상호작용이 가능한 요소를 놓치지 않도록 일관성있게 컬러를 사용해야 한다.
• 컬러가 잘못 사용된 디자인은 사용자에게 혼란을 주고, 콘텐츠에 집중하는 것을 방해한다. 이러한 디자인은 색을 전혀 사용하지 않는 디자인보다 못하다.

브랜드 컬러를 어떻게 정할까?

컬러별 의미

• 모든 색에는 긍정적인 의미와 부정적인 의미가 공존합니다.
• 색 자체의 의미도 중요하지만 색을 얼마나 쓰는지도 굉장히 중요합니다. 아무리 좋은 의미를 갖고 있다고 해도 지나치게 많이 쓰면 반감을 불러올 수 있기 때문입니다.

<aside> 💡 Example

컬러별 의미들

빨간색

긍정: 따뜻함, 에너지, 흥분, 열정, 체력

부정: 분노, 짜증, 피로, 격렬한 논쟁

빨간색이 주변에 너무 많다면 피로와 부담을 유발할 수 있습니다.

빨간색은 실제보다 더 가까워 보입니다. 그래서 눈에 잘 띄고 싶으면 빨간색을 사용합니다.

이성적인 판단보다는 감성을 자극하기 때문에 소비자의 구매 심리를 향상시킬 수 있다고 알려져 있습니다.

고급스러운 이미지를 연출하고 싶다면 검은색과 함께 매치하는 것도 효과적입니다.

분홍색

긍정: 여성스러움, 로맨스, 양육, 돌봄, 따뜻한 사랑

부정: 어딘가 부족하고, 연약하고, 힘없는 느낌

미국의 교도소 내 감방의 벽과 천장을 분홍으로 칠했더니 수감자들의 공격성이 감소하는 연구결과도 있었습니다.

노란색

긍정: 행복, 자신감, 긍정적, 낙천적

부정: 지나치게 많이 사용하면 짜증, 불안, 조바심, 우울감

주황색

긍정: 따뜻하고 친근하며 재미있음

부정: 지나치게 많이 사용하면 유치해 보이거나 경솔해 보이거나 촌스럽고 싸구려로 보일 수 있습니다.

에르메스가 주황색을 많이 사용하므로 고급스러운 색이라고 생각할 수도 있지만, 2차 세계대전 이후 에르메스 제품 포장 상자를 위해 유일하게 구할 수 있던 것이 주황색 판지였다고 합니다. 색상에 일반적인 의미가 있긴 하지만, 경험에 따라 인식이 달라질 수 있다는 것을 알 수 있습니다.

갈색

긍정: 안심, 믿음직, 안정, 편안, 따뜻

부정: 지루, 생기없음, 따분함, 고집, 비타협적

파란색

긍정: 논리성, 명료성, 신뢰성

부정: 차갑고 무심하며 냉담한 느낌

연구 결과 세계적으로 사람들이 가장 좋아하는 색으로 알려져 있습니다.

녹색

긍정: 안정감, 평화, 건강, 자연, 신선함

부정: 너무 많이 쓰면 정체되고 지루한 느낌

짙은 녹색은 부와 명예를 전달하는 데 사용되기도 합니다.

보라색

긍정: 고차원의 우주, 왕족, 권력, 신비

부정: 사치, 멍하고 현실감각 없는 느낌

보라색 염료가 비싸고 만들기 어려웠기 때문에 왕족, 권력, 신비로운 이미지가 만들어졌다고 합니다.

검은색

긍정: 미스터리, 권력, 전통, 신뢰성, 권위, 우아함

부정: 무섭고, 위협적이고, 차갑고, 불친절, 지나치게 심각해 보일 가능성

회색

긍정도 부정도 아닌 중립, 차분한 색이고 우울, 피곤, 따분한 의미

애플이나 벤츠는 실버의 느낌으로 사용하는 수준이고, 회색으로 변형해서 사용하긴 합니다.

</aside>

색의 속성

색의 3속성

Hue(색상), Saturation(채도), Value(명도)

Hue(색상)

<aside> ❗ 빨강, 파랑, 초록 등 색 자체가 가지고 있는 고유의 특성

</aside>

진짜 딱 색상 그 자체