머티리얼 디자인을 사용하는 이유 찬반 양론

5년 이상 전에 도입된 Google의 머티리얼 디자인 가이드라인은 웹사이트와 앱 기반 서비스의 시그니처 디자인이 되었습니다. 그들은 회사 브랜딩에 도움이 되는 Google과 제휴한 것으로 즉시 알아볼 수 있습니다.

머티리얼 디자인은 또한 더 넓은 디자인 커뮤니티에서 채택되었으며 이제 Google의 기본 플랫폼에서 멀리 떨어진 웹사이트와 앱(심지어 경쟁 플랫폼에서도)에서 찾을 수 있습니다. 예를 들어 Simplenote는 데스크톱 및 모바일 플랫폼용 앱 전반에 걸쳐 머티리얼 디자인 미학을 사용합니다. 머티리얼 디자인이 다양한 디자인 구현에 탁월한 선택인 이유 중 하나일 뿐입니다.

머티리얼 디자인이란?

머티리얼 디자인은 Google Now에서 활용되는 카드 기반 레이아웃을 부분적으로 기반으로 Google에서 2014년에 만들었습니다. 종이 기반의 디자인 스타일에 대한 끄덕임은 당시 널리 사용되었던 평면 디자인 스타일과 차별화되었습니다.

대부분의 디자인 시스템과 마찬가지로 Material Design은 다양한 장치, 플랫폼 및 입력 방법에 걸쳐 통합된 사용자 경험을 제공하기 위해 만들어졌습니다. Apple이 평면 디자인 원칙을 표준으로 구현한 방식과 유사하게 Google은 Material Design을 사용하여 사용자가 제품에 액세스하는 방식에 관계없이 일관된 사용자 경험을 제공하도록 했습니다.

머티리얼 디자인 사양에는 타이포그래피, 그리드, 공간, 규모, 색상, 이미지 등 모든 것에 대한 지침이 포함되어 있습니다. 그러나 머티리얼 디자인은 디자이너에게 사물을 보이게 하는 방법을 알려주는 것보다 한 걸음 더 나아갑니다. 이를 통해 디자이너는 계층 구조, 의미 및 최종 결과에 중점을 둔 의도적인 디자인을 만들 수 있습니다.

머티리얼 디자인을 사용하는 이유

잘 정립된 디자인 시스템과 마찬가지로 머티리얼 디자인을 사용할 때 디자이너가 고려해야 하는 몇 가지 주요 장점이 있습니다.

머티리얼 디자인은 단순한 스타일 지침이 아니라 사실상 전체 디자인 생태계입니다. 잠재적인 디자인 상황이 존재하는 경우 Material Design에는 이를 처리하는 방법에 대한 포괄적인 규칙 세트가 있을 수 있습니다. 여기에는 덜 포괄적인 설계 시스템에서 종종 간과되는 복잡한 사용 사례가 포함됩니다. 이러한 구조를 원하는 디자이너에게는 매우 위안이 될 수 있습니다.

Google은 머티리얼 디자인을 유지 관리하고 이를 사용 및 구현하는 방법에 대한 광범위한 문서를 보관합니다. 이러한 종류의 지원 및 문서화는 많은 현대적인 디자인 시스템에서 부족할 수 있습니다.

이러한 모든 포괄성과 문서화에도 불구하고 Material Design은 여전히 ​​상당히 유연한 디자인 라이브러리입니다. 지침 내에서 설계를 구현하는 방법에 대한 세부 사항의 대부분은 전적으로 설계자에게 달려 있습니다.

머티리얼 디자인의 보다 세분화된 이점에는 평면 디자인과 구별되고 많은 사용자에게 보다 직관적으로 만드는 미묘한 스큐어모피즘과 같은 것들이 있습니다. 또 다른 사용자 친화적인 기능은 햅틱 피드백, 미묘한 애니메이션 및 이와 유사한 형태의 사용자 피드백이 가이드라인에 내장되어 있다는 것입니다. 그것은 또한 상호 작용을 보다 직관적으로 만드는 매우 단순화된 물리학 감각을 가지고 있습니다.

머티리얼 디자인은 모바일 우선의 감성을 바탕으로 제작되었으며, 원래 목적이 Android 앱을 디자인하는 것이었음을 고려하면 이치에 맞습니다. 또한 사용자 피드백과 다양한 기능의 작동 방식에 대한 힌트를 제공하기 위해 디자인에서 애니메이션을 촉진합니다.

마지막으로 어두운 테마 옵션을 사용할 수 있게 되어 디자이너에게 시각적 유연성이 더욱 향상되었습니다. 원래 Material Design은 매우 가볍고 밝았기 때문에 일부 브랜드의 미학과 잘 어울리지 않았습니다. 어두운 테마 지침을 추가하면 이 문제가 해결됩니다.

머티리얼 디자인 사용의 단점

머티리얼 디자인에는 매우 분명한 장점이 있지만 사용에 따른 단점이 없는 것은 아닙니다.

첫째, 머티리얼 디자인은 즉시 식별할 수 있으며 Google, 특히 Android와 강력하게 연결됩니다. 이것이 모든 사람에게 반드시 나쁜 것은 아니지만 일부에게는 잠재적으로 부정적입니다.

그것이 부정적인 것일 수 있는 한 가지 큰 이유는 디자인 시스템을 사용하는 동안 다른 브랜딩의 효율성을 제한하기 때문입니다. 예, 디자이너는 로고, 색상 팔레트(머티리얼 디자인 가이드라인 내) 및 기타 차별화 요소를 통합하여 브랜드 아이덴티티를 지원할 수 있지만 머티리얼 디자인 사양을 따르는 제품 은 거의 항상 Google과 연결됩니다.

모션과 애니메이션은 머티리얼 디자인 가이드라인 내에서 홍보되기 때문에 통합되지 않은 사이트나 앱은 사용자에게 뭔가 빠진 것처럼 보일 수 있습니다. 사람들은 머티리얼 디자인의 모션 특성을 시각적 특성과 연관시키므로 모션이 부족하지 않은 디자인을 남길 수 있습니다.

물론 한 가지 솔루션은 Material Design 사양을 따르는 디자인에 항상 모션을 통합하는 것입니다. 그러나 광범위한 애니메이션은 모바일 장치에서 리소스를 매우 많이 사용하므로 데이터 사용량이 늘어나고 배터리가 더 빨리 소모될 수 있습니다. 머티리얼 디자인 가이드라인 내에서 작업할 때 디자이너가 고려해야 하는 균형 작업입니다.

초심자는 머티리얼 디자인 사양이 플랫 디자인과 같은 다른 스타일보다 구현하기 더 복잡하고 어렵다는 것을 알 수 있습니다. 머티리얼 디자인 시스템은 매우 포괄적이기 때문에 많은 새로운 디자이너가 편안하게 생각할 수 있는 것보다 더 많은 것을 고려하고 준수해야 합니다.

그 포괄성 때문에 일부 디자이너는 제약을 느끼고 자신의 창의성을 완전히 실현할 수 없다고 느낄 수도 있습니다. 또한 거의 모든 설계 과제가 계획되고 솔루션이 제공되기 때문에 혁신을 억제할 수 있습니다. 많은 경우에 도움이 되지만 이는 디자이너가 문제에 대해 새로운 접근 방식을 취하는 것을 방지하는 동시에 발생할 수 있는 새로운 아이디어의 수를 제한할 수 있습니다.

머티리얼 디자인에는 웹사이트와 앱을 매우 사용자에게 친숙 하지 않게 만들 수 있는 몇 가지 사용성 문제도 있습니다. 가장 큰 문제 중 하나는 많은 모바일 디자인 앱에서 발생하는 소위 "미스터리 고기" 탐색입니다. 아이콘은 텍스트 대신 사용되는 경우가 많으며 아이콘이 즉시 인식되고 상당히 유용할 때도 있지만 그렇지 않을 때도 있습니다.

"집"을 나타내는 원은 이전에 대부분의 Android 인터페이스에서 사용되었던 집 아이콘보다 식별하기가 훨씬 더 어렵습니다. 이것은 머티리얼 디자인의 평면 디자인 뿌리에서 파생된 기능보다 형태를 배치하는 대표적인 예입니다.

또한 하단 탐색 모음에만 있는 것이 아닙니다. 원형 플로팅 액션 버튼을 포함하는 머티리얼 디자인의 선호도 사용성 문제입니다. 이러한 원형 버튼에는 보조 텍스트가 포함되지 않은 아이콘 공간만 포함됩니다. 아이콘은 해석의 여지가 많기 때문에 많은 경우 사용자는 이 버튼이 실제로 무엇을 하는지 의문을 갖게 됩니다.

결론

앱이 주로 Android 플랫폼용으로 빌드되는 경우 Material Design을 사용하는 것이 쉬운 선택입니다. Google의 광범위한 채택으로 인해 머티리얼 디자인 원칙을 기반으로 하는 모든 앱은 기본 앱처럼 느껴질 것입니다.

그렇긴 하지만, 머티리얼 디자인이 확실한 선택인 Android 플랫폼 외부에 다른 사용 사례가 많이 있습니다. 디자인 시스템이 더욱 성숙해짐에 따라 이러한 상황은 증가할 수밖에 없습니다. 디자이너는 최소한 머티리얼 디자인을 사용하는 것이 적절한 시점과 다른 시스템이 더 적합한 시점을 스스로 결정할 수 있도록 가이드라인을 숙지해야 합니다.

• • •

Toptal Design 블로그에 대한 추가 정보:

• 효과적인 디자인 프레임워크를 구축하는 방법(무료 스케치 파일 사용)
• 더 나은 UX를 위한 UI 스타일 가이드 만들기
• 디자인 시스템 및 패턴 이해하기
• 컴포넌트 기반 프레임워크를 위한 A/B 테스팅 UX
• 디자인 심리학과 멋진 UX의 신경과학