홈페이지 » UI / UX » Flat 2.0 및 평면 디자인의 사용 편의성 문제 해결 방법

    Flat 2.0 및 평면 디자인의 사용 편의성 문제 해결 방법

    평면 디자인은 국제 타이포그래피 스타일이 개발 된 1950 년대 초반부터 사용되어 왔습니다. 최근에는 마이크로 소프트의 신제품 출시 이후 폭 넓은 인기를 얻었습니다. 기하학 및 타이포그래피 중심의 메트로 디자인 언어, 처음에는 2010 년에 새로운 Windows Phone에서, 그 다음 Windows에서 8 월에.

    평면 디자인은 3 차원 효과 및 광택있는 시각적 요소 부족 달성하기 위해 청결, 미니멀리즘, 과 명쾌함. 그것은 이전의 주된 디자인 스타일 인 반짝이는 버튼과 일러스트를 사용하여 실제 3D 객체를 모방 한 skeuomorphism에 반대합니다.

    평면 디자인은 기본적으로 웹 사이트를 능률화하고 콘텐츠에 집중하며보다 직관적 인 상호 작용을 제공하고보다 빠르고 기능적인 사용자 환경을 제공하는 것을 목표로합니다. 반응 형 디자인을 위해 간단하고 상자 모양의 요소와 그리드 기반 레이아웃을 사용하는 것도 쉽습니다..

    평면 디자인의 유용성 문제

    평평한 디자인은 사용자에게 빠르고 도움이되는 웹 사이트를 제공하기 위해 엄청난 도움과 훌륭한 툴킷을 제공하지만 특히 사용량이 많은 경우에는 사용성 문제가 발생할 수 있습니다.

    Clickability의 시연 부호 없음

    우리가 3 차원 효과를 사용한다면 자연스럽게 우리의 디자인에 환상을줍니다. 이를 통해 사용자는 신속하게 상호 작용하는 요소를 찾는다., (버튼과 아이콘 같은) 클릭하거나 양식 필드와 같이 채울 수 있습니다. 플랫 디자인의 주된 관심사 중 하나는 사용자가 클릭 가능한 요소를 인식한다..

    평평 해지기 전에 웹 디자이너는 일반적으로 다음과 같은 시각적 솔루션을 사용하여 클릭 가능성을 나타냅니다. 그라디언트, 텍스처, 가장자리 올리기 또는 그림자 놓기 클릭 할 수있는 것처럼 버튼 및 기타 클릭 가능한 객체가 보이게 만들기.

    평면 디자인은 이러한 시각적 기호를 갖지 않으며 훨씬 작은 도구 세트로 동일한 작업을 해결해야합니다. 색상, 모양, 근접, 과 문맥 요소.

    왜 이것이 문제입니까? 실험을 해보 죠..

    아래 스크린 샷을보십시오. 이 스크린 샷을 기반으로 클릭 할 수있는 요소를 추측 해보십시오. 당신이 처음 생각하는 것이 아닙니다. 우리는 웹상에서 다른 많은 유사한 사용성 문제를 발견 할 수 있습니다..

    Z 축이 없어서 발견 가능성 감소

    실생활에있는 사람들은 물체를 찾고 x, y, z 축의 3 차원으로 이동합니다. 3D 효과가없는 미니멀리즘 디자인 된 평면 웹 사이트를 실행하면 익숙한 것과 다른 경험을 얻을 수 있습니다..

    즉, 객체 간의 관계를 발견하기 위해 더 많은 노력을 기울인다., 과 시각적 계층을 이해한다. 사이트의 예를 들어 정보를 시각적으로 디코딩하고 사이트의 다른 요소의 목적을 위해 Microsoft Developer Network 홈 페이지에 더 많은 시간을 할애해야합니다.

    UX 디자인의 경험적 규칙은 사용성을 극대화하기 위해 항상 사용자의인지 부하를 최소화하려고 노력하는 것입니다. 많은 경우에 볼 수 있듯이 평면 디자인에서는 항상 그런 것은 아닙니다..

    낮은 정보 밀도

    평면 디자인은 UX 전문 가인 Nielsen-Norman Group이 낮은 정보 밀도를 위험에 빠뜨린다고 비난 받았다..

    Windows 8의 유용성에 대한 비판에서 그들은 Windows Store 응용 프로그램의 예와 Los Angeles Times의 웹 사이트를 사용하여 낮은 정보 밀도 (초기 화면에 이야기가 거의없고, 요약이없는 헤드 라인, 거의 인식 할 수없는 그룹화 등) 유용성의 관점에서 발생할 수 있습니다.

    또 다른 측면에서 볼 때주의 분산을 제거하는 것으로 보이는 정보가 줄어들어 사용자는 중요한 일에만 집중할 수 있지만 미니멀리즘이 과도하게 지나치면 사이트의 기본 목표를 쉽게 희생 할 수 있습니다. 즉 정보를 시청자에게 전달할 수 있습니다..

    플랫 2.0의 부상

    점점 더 많은 디자이너가 평면 디자인의 유용성 결함을 인식하게되면서 더 새롭고 성숙한 버전이 탄생했습니다. “플랫 2.0” 또는 “거의 평평한” 디자인. skeuomorphism에서 평면으로의 변화가 급진적 이었지만 평면 디자인의 진화는 훨씬 더 어렵습니다.

    새로운 스타일은 여전히 ​​편평하지만 디자인에 약간의 3 차원을 다시 추가합니다. 형태 미묘한 그림자, 하이라이트, 과 . Flat 2.0은 잘 사용한다면 약간의 사실주의 (skeuomorphism)를 되찾고 간결한 웹 사이트, 명확성 및 빠른 페이지로드 시간과 같은 최소한의 이점을 유지하면서 깊이와 세부 사항을 추가하여 앞서 언급 한 사용성 문제를 해결할 수 있습니다.

    이미지 : Dapper Gentlemen

    재료 디자인

    Material Design이라고하는 Google의 새로운 디자인 언어가 아마도 Flat 2.0 스타일의 가장 주목할만한 예 일 것입니다. Google은 2014 년 Android L을 사용하여 Material Design을 출시했습니다. Material Design은 평면 디자인의 주요 특징을 유지하지만 물리학의 은유를 사용하여 사용자가 실제 세계와 디지털 세계의 유사성을 신속하게 찾을 수 있도록 도와줍니다..

    Material Design은 z 축을 사용하여 미묘한 깊이 디자인에, 그리고 지능적으로 레이어를 사용하여 그림자로 그들을 분리 애니메이션. Google은 그것이 작동하는 방식에 대한 과냉가 기술을 가지고 있으며, 주요 원리와 규칙을 이해하기 위해 읽어야합니다..

    결론

    좋은 디자이너는 항상 사용자의 경험을 향상시키기 위해 노력하기 때문에 웹 디자인 산업은 끊임없이 변화하고 있습니다. 평평한 디자인은 skeuomorphism을 빠르게 대체하여 그리드 기반, 최소한의 레이아웃과 단순한 요소 최근에는 웹을 오버런 시켰습니다 (웹 디자인이 지루하거나 심지어 죽어가는 것에 대한 이야기가 나오지만 진실에서 멀어 질 수는 없습니다).

    평면 2.0은 평면 디자인의 인식 된 문제에 대한 해답을 제공합니다.. 기능, 미학 및 유용성간에 현명한 절충안입니다. 물론 머티리얼 UI 키트는 사용할 필요가 없습니다. 어디에나, 그 뒤에있는 철학을 이해하면 우리 자신의 스타일을 개발하는 법 사용자 경험 디자인의 최신 결과에 따라.