iOS7에서 사용된다는 평면 디자인의 6가지 가이드

iOS7에서 애플은 평면 디자인을 사용할 것이라는 소문이 돌고 있습니다. 평면 디자인은 아이콘이나 UI에 음영을 통하지 넣지 않고 2차원적인 디자인을 평면 디자인이라고 합니다. 애플이 하면 그 어떤 것도 큰 관심을 가지게 하는데요.
이번에도 많은 사람들이 평면 디자인에 대한 관심을 끌고 있습니다. 

Designmodo에서는 이 새로운 트랜드가 될 평면디지안에 대한 6가지 가이드를 소개하고 있습니다. 

원문 출처 : http://designmodo.com/flat-design-principles/

 

1. 불필요한 효과는 넣지 마라

평면 디자인 즉 플랫 디자인의 특징은 불필요한 그림자와 경사, 양각, 깊이 등을 표현하지 않는 것입니다.  이미지의 프리엠에서 버튼, 탐색 도구 까지 모든 요소가 명확하고 간단한 2차원 디자인입니다.  이

 

2. 간단한 요소

 

 

평면 디자인의 생명은 심플한 UI입니다. 디자이너는 직사각형이나 정사각형, 원, 그외의  도형을 버튼이나 아이콘으로 사용합니다. 모서리는 직각이나 둥근 모서리등을 사용하며  각각의 UI는 클릭과 탭을 쉽게 할 수 있도록 간편하면서도 사용자가 한번에 알 수 있게 직관적이어야 합니다. 

심플한 디자인과 함께 사용자의 사용을 좀 더 편리하게 하기 위해 화려한 색상을 사용해서 클릭하기 쉬운 버튼을 만드세요.  그러나 심플한 요소와 심플 디자인을 혼돈하면 안됩니다. 평면 디자인 콘셉은 그 어떤 디자인보다 아주 복잡합니다. 

 

 

3. 타이포그래피에 집중해라

 

 

평면 디자인의 핵심은 단순함입니다. 따라서 활자의 배치, 구성, 서체 등의 타이포그래피는 아주 중요합니다. 문자의 서체는 디자인 전체와 맥을 같이 해야 합니다. 디자인은 심플한데 서체는 아주 장식적이고 화려하면 디자인이 언밸러스하게 됩니다

디자인이나 텍스트나 일관된 하나의 톤을 유지해야 하며 서체는 강력하고 간단하고 효과적이어야 합니다. 웹 디자인에 평면 디자인을 사용할 때 인쇄술의 기본으로 많이 사용하고 있는 산세리프 서체를 사용할 것을 권합니다.  레이블 버튼이나 다른 요소도 도입하면서 사용자가 쌍방향성을 느끼게 하세요.

 

 

4. 컬러에 집중해라

컬러는 평면 디자인에서 가장 중요한 요소입니다. 평면 디자인을 사용해서 웹 사이트를 디자인 할 때 사용하는 색은 다른 디자인 보다 밝고 화려한 것을 많이 사용합니다. 대부분의 디자인 프로젝트에는 2~3 컬러 팔레트에만 초점을 맞추지만 평면 디자인은 6~8가지의 컬러 팔레트를 사용합니다

색조는 밝은 색으로 하고 컬러 휠에서 가장 순수한 색을 사용합니다. 농담이나 명암은 없고 원색이나 자주 사용되는 색을 사용하세요 연어색이나 퍼플, 그린, 블루 같은 복고풍 컬러가 인기가 있습니다. 이 부분은 제가 디자이너가 아니라서 정확한 내용을 모르겠지만 위 이미지들이 그 예를 들어주고 있습니다. 저런 심플하고 깔끔한 색들이 참 좋죠.

5. 미니멀로 다가가라

평면 디자인의 본질은 심플하고 전체적으로 미니멀리즘적인 다지인입니다. 너무 많은 부가적인 요소는 넣지 마세요. 심플한 컬러와 텍스트로 충분합니다. 만약 비쥬얼을 더 강화시키고 싶으면 심플한 사진을 넣으세요

예를들어 위 이미지들이 있는 Svpply 사이트를 참고하시면 좋습니다. 심플한 배경에 상품을 소개하면 보다 효과적입니다. 상품 사진에는 명암이 있어서 3차원적으로 보이지만 전체적인 디자인은 명암이 없는 평면디자인입니다.  이 모습은 국내 웹 사이트들이 배워야 합니다. 화려함만 너무 추구해서 정작 필요로하는 정보는 어디에 쳐 박아 놓고 찾기 힘들게 하거나 플래시를 떡칠해서 로딩 속도 느리게 하는 행동은 모바일 시대에는 전혀 어울리지 않습니다. 사용자들은 시간이 돈입니다. 예전같이 여유롭지 못합니다. 조금만 느리고 어쩌고 하면 다른 곳으로 가버립니다.

6. “거의”  평면 디자인

 

“거의” 평면 디자인에 많은 디자이너들이 동의 합니다. 기본은 평면 디자인으로 하고 그 위에 몇개의 효과를 더해가세요. 약간의 명암을 주고 그림자 효과를 줍니다. 

예를 들어 버튼에는 약간의 경사를 주고 그림자 등을 넣습니다. 평면 디자인만 고집하지 말고 거의 평면 디자인이지만 각각의 부분요소에서 입체효과를 넣을 수 있습니다. 다만  하나의 디자인에 2가지의 스타일을 넣으면 평면 디자인의 개념이 헝클어지니 통일성을 유지하세요

 

 

 

 

 

이 사이트에는 평면 디자인에 대한 관련 글이 꽤 있네요.  http://designmodo.github.io/Flat-UI/ 에는 평면 UI의 기본요소를 소개하고 있습니다.

평면 디자인 애플이 하면 바로 또 유행이 될 것입니다. 아니 애플이 아니더라도 저런 평면UI나 디자인은 심플하고 간편해서 요즘 스마트폰 트랜드와 궁합이 잘 맞고 스마트폰이 아니더라도 오프라인에서도 잘 먹힐 것입니다. 화려한 장식도 좋지만 심플함이 위대하다고 느껴질 때가 많으니까요. 심플한 스마트폰으로 유명한 애플 아이폰에 심플함을 무기로 한 평면 디자인이 들어오겠네요.