웹, 그리고 포인트 컬러 '블루'

파란색

파란색, 우리가 보편적으로 거부감이 없고 친근하게 생각하는 색상이 바로 '블루' 이다.

눈의 피로도 덜고, 넓고 상쾌한 느낌까지 갖고 있는 '블루'는 웹에서 포인트 컬러로 많이, 자주 사용된다. 특히, 어두운 곤색 계열이 아닌 손에 물들것만 같은 스카이블루를 포인트로 많이 사용하는 추세이며, 이 색은 아이러니하게도 검은 바탕에도, 흰 바탕에도 동일하게 잘 어울린다.

어두운 색보다 밝은 색을 선호하는 모바일

#35aefd ■

요즘 다들 한 번 쯤은 다운 받아보셨을 'whowho'

기본으로 어두운 바탕으로 깔고 가장 중요한 상단의 검색 부분을 포인트 컬러 '블루'를 선택했다. 화이트 컬러를 배재하지 않고 상단과 하단에 적절한 어울림과 대칭을 만들었다.

#097ce6 ■

카카오톡에서 대체 메신저로 화두에 올랐던 '텔레그램'

필자는 애용중인데, 이 텔레그램이 화이트 & 블루의 가장 흔한 예라고 할 수 있다.

화이트 바탕에 회색으로 음영 및 단조롭지 않은 레이아웃을 만들어주고 정말 중요한 부분(서칭이나 채팅, 버튼 활성화 등)은 라이트블루 컬러로 선택했다.

#3598fe ■

모바일 '잡코리아' 앱

이 어플도 화이트 & 블루의 대표적인 예이다.

어플 용도상 내용과, 폰트의 가독성을 중요시해야하기 때문에 디자인적인 부분을 최대한 살리기 어렵다. 글씨도 눈에 보여야하는데 미적 감각도 살려야하니.. 디자이너로서 여간 골치 아픈 부분이 아닐 수가 없다.

#0091e4 ■

은행 어플 '우리은행'

가장 번잡하게 가독성이고 디자인이고 뭐든 다 고려안한 UI ....최대한 넣고 싶은 부분을 꾸역꾸역 다 담아야 했기에, 그리고 디자이너가 하고 싶은 색을 모두 넣어야 했기에 이런 참담한 결과가 나오지 않았나 싶다.

색상은 부분 화이트 & 블루 인 셈

모바일은 최대한 눈이 편해야하며 최대한 눈에 띄는, 이쁜 분위기를 풍겨야 하므로, 블랙보다 화이트 & 블루 색상의 조합이 더 많다.

또한, 채도도 어두운 것보다 밝게 전향되는 추세여서 일반 진블루(진청) 보다 라이트블루, 스카이블루를 선호한다.

웹에선 어느 용도로나 사랑받는 블루

#18a3fa ■

스크립트 에디터 'WebStorm' 공식 사이트

https://www.jetbrains.com/

포인트 컬러와 폰트 모두에서 사용되고 있다. 가독성을 고려한 여백과 레이아웃의 적절함, 폰트의 탁월한 선택으로 블랙, 화이트가 모두 잘 어울린다.

메인에서는 블랙 + else 인데, 각각의 서브에서는 화이트 + 라이트 블루로 통일되어있다.

#002e5b ■

벤처 기업 'Endeavour Capital'

http://ecap.co.nz/

기업 홈페이지이다 보니 발랄한 색감보다 절제되고 진취적인 느낌을 갖고 있는 곤색을 선택했다.

블루 + 포인트컬러 옐로, 화이트 로 버튼 뿐만이 아니라 웹 상에서 '블루'가 애용된다는 것을 알 수 있는 예이다.

#406de4 ■

솔루션, 인트라넷 등 여러 팀을 보유한 컨설턴트 'Sparked'

http://www.sparked.nl/

'다음'과 같은 분위기의 파스텔톤 색상을 사용했다. 너무 파스텔 톤도 아니고 너무 오리지널 색도 아닌, 사용자 입장에서 매료될 수 있는 적절한 채도이다.

#003366 ■

'White house'

https://www.whitehouse.gov/

백악관과 어울리는 중후함, 경건함, 진취적인 색상으로 채도가 다운된 블루를 선택했다.

#00acd4 ■

광고, 미디어 회사 'Chams'

http://www.brandingsolutions.in/

색상을 딱 보자마자 '트위터'가 생각났다 .......... 발랄하고 창의적인 느낌의 채도가 높은 블루와 동글동글한 텍스처들로 동적인 친근함을 형성했지만, 보통 웹을 만들 때 예시로 들만한 보편적이지는 않다.

#009fe3 ■

소매 솔루션 'Kendu'

http://www.kendu.com/en/

요즘 트랜트(유행이 좀 지났다고 생각할 수도 있지만 아직 보편적인)로 많이 사용 중인 디자인이다. 포인트 컬러로 폰트나 텍스처를 만들어 주고, 그 외의 것엔 의미를 주지 않아 사진의 커버와 폰트로 내용을 대체한다.

전달해주고자 하는 바가 무엇인지 글자와 사진, 두가지의 컨텐츠로 정확하게 이야기 할 수 있으며 이때에 사진에 색이 많이 들어가 있으므로 스카이 블루를 포인트컬러로 선택한다.

웹에서는 모바일보다 표현 해 낼 수 있는 컨텐츠와 위치가 넓게 잡혀 있기 때문에, 자신이 원하는 부분에 원하는 색으로 포인트 컬러를 넣는다.

그래서 라이트한, 혹은 헤비한 어떤 '블루'도 잘 어우려져 자리 잡힌다. 굳이 화이트와의 조합이 아니어도 충분한 이목을 잡는다.

우리가 느끼는 블루 ?

출처 : http://www.blogkwater.or.kr/2967

우리들은 흔히 '블루' 는 차갑고, 냉소적이고 쌀쌀맞다고 생각한다. 하지만 눈은 그렇게 생각하지 않는다.

보이는 색에 대한 무게감 때문에 시원하고 진취적인 느낌의 '블루'를 좋아한다. 그리고 '블루'와 가장 잘 어울리는 색이 바로 '화이트'이다.

그래서 우리는 모바일과 웹에서, 아니 훨씬 그 이상의 일상에서 '블루'와 '화이트'를 만날 수 있는 것이다.

가장 비슷한 느낌을 갖고 있는 것이 무엇이냐고 물어본다면 우리들과 가장 가까이에 있는 바다와 하늘을 예시로 알려주고 싶다.

■ '블루' 의 느낌 및 분위기

진중함, 진취적임, 넓음, 젊음, 변화, 나아감, 차분함, 경쾌한, 맑은, 편안함, 안정적인 등등..

-

모바일에서는 충분한 가독성이 필요하기때문에 화이트 & 블루가 보편적이었지만, 웹은 충분히 표현해낼 넓은 공간이 있기 때문에 가독성을 굳이 고려하지 않아도 포인트 컬러로서 충분한 효과를 내보였다.

언제 분석할지는 모르겠지만 ..

다음 포인트 컬러로는 강렬한 '레드'를 알아보려고 한다.