brunch

You can make anything
by writing

C.S.Lewis

by 루리초 Sep 26. 2016

UI 디자이너가 보는 컬러 Purple

Purple컬러 분석

에이전시에서의 UI 디자이너가 된 지 5년이 넘어가고 있다. 


가장 최근의 프로젝트를 생각해보면 우리나라에서 디자인의 자유도는 없다 라고 봐도 무방할 정도이다.

'모험'을 좋아하지 않는 클라이언트와 보수적인 기업들이 상당수며, 특히나 접근성 및 장차법에 따라 컬러의 자유도 또한 매우! 떨어지고 있다.


하지만 우리는 디자이너가 아닌가! 

클라이언트를 설득하는 건 우리의 몫이다. 물론 어떻게 보면 가장 가까운 팀장이나 사장부터 설득해야겟지만... 


새로운 디자인을 갈망하는 디자이너들에게 도움이 되고자 이렇게 글을 써본다.





Purple





이미 팬톤에서는 2014 올해의 컬러로 "레디언트 오리취드"라는 퍼플 컬러를 선보인 바 있다.

2016년이 다 가는 마당에 왜 2014년 컬러를 꺼내느냐고 하는 사람도 있을는지도 모르겠다.


"웹이나 모바일 환경에서는 2016년 2015년의 컬러는 적용하기 힘든 컬러이기 때문입니다."라고 말하고 싶다.

프로모션에서는 가능하겠지만 전체적인 콘셉트 컬러로는 어렵기 때문이다. 포인트 컬러 또한 되기 힘든 컬러이다.

 

2016 올해의 컬러  /  2015 올해의 컬러






단순히 이 이유로 퍼플 컬러를 고른 게 아니라는 점 잊지 말아 주길 바란다.

안드로이드의 플레이스 토의 인기순위 1위부터 10위까지의 앱을 살펴보자



                                                                                     


이것만 봐도 현재 우리나라의 앱(웹도 마찬가지이다.)에서 퍼플 컬러는 사용되지 않는다. 

최근에 와서 퍼플 컬러의 매력이 돋보이는 이유는 무엇일까?


필자는 일주일 전에 윈도 10을 설치했다.


윈도우10  시작메뉴


블랙 bg위에 포인트 컬러로는 퍼플이 사용되었다.

시작 메뉴 아래 실행되고 있는 아이콘 아래 퍼플 bar가 생겨났다.

포인트 컬러로 인해 텍스트의 가독성이 매우 뛰어나고 심미성 또한 탁월하다.

  

그동안의 윈도를 생각해보자면 블루 컬러가 지배적이었다. 


응? 퍼플이 아니라 다른 컬러로 해도 괜찮을 거 같다고?


그렇게 생각하는 당신들을 위해 준비했다. 






Purple Color의 의미




"예술, 창조, 우아함, 신비스러움, 품위 "


윈도는 모든 사람들에게 이미 신뢰가 넘칠 만큼 흐르는 os가 되었다. 그에 따라 컬러도 블루를 고집할 필요가 없다. 새로운 윈도는 확실히 독창적이고 신비스러운 컬러인 퍼플과 함께함으로써 더욱 크리에이티브한 느낌이다.



대표적으로 쓰인 예시는  현대카드의 퍼플카드이다.

프리미업 카드로써 사람들에게 정확한 의미 전달을 하고 있다.

현대카드 퍼플카드




소니의 엑스페리아 또한 퍼플 컬러로 유니크함을 선보이기도 했다.


소니 엑스페리아 퍼플




게임을 좋아하는 필자로써 게임 예시도 빠질 순 없겠지.

대부분의 게임에서 유니크 아이템의 컬러는 퍼플 컬러로 표현되고 있다.


오버워치 유니크 스킨



던전앤파이터 유니크아이템


이렇게 여러 가지 예시를 들어서 나열해보았다. 

퍼플이 가지는 의미와 포인트 컬러로써의 디자이너 의도가 딱 맞아떨어진다.





'신카이 마코토'




필자가 좋아하는 애니메이션인 '초속 5cm'의 감독이다.

신카이의 작품은 상당히 아름다운 배경에 감탄하게 된다. 여기서도 퍼플의 아름다움을 느낄 수 있다.

초속5센티미터 포스터


오른쪽이 정식 포스터이고 왼쪽이 퍼플 컬러를 뺀 포스터이다. 느낌으로 알 수 있을 것이다.



애니메이션 중 한컷

퍼플의 느낌을 빼면 상당히 차갑고 무겁다. 유독 신카이의 작품은 퍼플끼가 많은걸 느낄 수 있다.

초저녁과 밤의 컬러에 퍼플 컬러를 더해 분위기를 따듯하고 신비롭게 표현하였다.




그럼 UI 디자이너로써 퍼플 컬러 적용방법에 대해 알아보자.

01. 구글의 컬러 파렛트 활용

https://material.google.com/style/color.html#

컬러 팔레트를 다운로드할 수 있다. 이외에도 여러 가지 컬러가 있다. 확인해보자.


하지만 필자는 포토샵의 스와치 윈도를 꺼놓고 사용하지 않는다.
여러 가지 블로그와 브런치 글을 보면 대다수가 스와치에 등록시켜놓고 사용하는 팁을 올려놓곤 하는데 좋은 방법이 아니라고 생각한다. 

자료가 많았지만 찾는 시간도 걸릴뿐더러 웬만해선 다시 사용할 일도 없다. 

무엇보다 컬러 감각이 떨어질 수도 있다. 이론에만 충실하지 말자. 우리는 사람들의 감성과 시각을 자극시키는 디자이너라는 걸 잊지 말자. 



02. 파레톤

http://paletton.com/


선택한 컬러의 보색, 유사색을 컬러톤 별로 알 수 있다. 

퍼플컬러의 보색


03. 컬러의 적용 사례

https://brunch.co.kr/@ebprux/65

적용사례를 한글로 번역을 잘 해주었다. 어떤 UI에서 포인트 컬러를 사용하는지 확인해보자.



그 외에 국내 예시를 들자면 http://www.ssfshop.com/ 이 대표적인 퍼플 컬러를 포인트로 준 사이트라고 볼 수 있다. 




마지막으로 개인적으로 좋아하는 퍼플 컬러의 팔레트를 뽑아보았다.

유사색



보색



마무리 글

이 글을 보는 모든 디자이너들이 퍼플 컬러의 매력에 대해서 조금이나마 알게 되었다면 그걸로 나는 만족한다.

모두 자신의 눈과 감각에 믿음을 가지고 디자인하길 바라며 글을 마치겠다. 

작품 선택
키워드 선택 0 / 3 0
댓글여부
afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari