티스토리 뷰

반응형

디자인을 어떻게 할지 고민이다. 그냥 심플하게 하자고 생각하지만, 그 심플이란 것에도 디자인이 필요하다. 고민해야 할 요소가 여럿 있지만, 그중 색상 구성은 어떻게 해야 할지, 몇 가지나 사용해야 할지에 대한 정보를 주는 영상을 우연히 유튜브에서 보았다. 

 

그리고 영상에서 배운점을 기억하기 쉽게 정리해서 자료로 남겨 두려 한다. 

 

다양한 색상을 마구마구 쓰면 주의가 산만해진다. Color palette는 어떻게 구성하면 좋을까?

영상에서 설명하는 것은 60:30:10 규칙이다.

3가지 색상을 선택하여 60:30:10 비율로 사용하는 것이다. 

 60%은 기본색상(중립, base color)이다. 앱이 밝은 테마일  경우 밝은 색으로 선택하고, 앱이 어두운 테마일 경우 어두운 색을 기본색으로 선택한다. 

30%는 주요색상(브랜드, primary  color)은 앱에서 중요 내용을 표시하거나 감쌀 때 사용한다. 

10%는 강조색상(행독촉구  call to action, secondary color)이다. 앱에서 가장 중요한 영역에 사용하는 색상이다. 앱에서 시선을 모으는 색이다.  "날 봐줘", "날 클릭해 줘"를 나타낼 때 사용하는 색이다.  

 

아래는 영상에서 예시로 보여주는 앱 UI다. 

 

https://www.youtube.com/watch?v=UWwNIMHFdW4 

 

반응형
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/07   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31
글 보관함