[Material design] 메테리얼 디자인 사이트

ㅡ😎 간단한 단어 정리

머티리얼 디자인(Material Design, 코드명: Quantum Paper)[4]이란 플랫 디자인의 장점을 살리면서도 빛에 따른 종이의 그림자 효과를 이용하여 입체감을 살리는 디자인 방식을 말한다. 2014년 구글이 안드로이드 스마트폰에 적용하면서 널리 퍼지기 시작했다. 플랫 디자인과 마찬가지로 최소한의 요소만을 사용하여 대상의 본질을 표현하는 디자인 기법인 미니멀리즘(minimalism)을 추구한다.

구글은 2014년 6월 25일 2014 구글 I/O 콘퍼런스에서 머티리얼 디자인을 발표하였다.

 

[출처:위키백과]

 

😁 메리얼 디자인이란?

기존의 안드로이드의 UX가 iOS에 비해 너무 밋밋하고 공대감성적이다는 의견과 모바일 뿐만 아니라 다른 기기에서 통일성 있는 사용자 경험을 제공하고자 개발되었다. 미니멀리즘을 추구하여 기존의 플랫한 디자인에 입체감과 원근감을 주는 방향으로 개발되었다. 즉 플랫 디자인의 개량형이다.

그냥 보면 별 차이가 안 느껴질 수도 있지만, 플랫 디자인이 그냥 2차원적인 평면 느낌이라는 것과 달리, 머티리얼 디자인은 그림자 등이 약간씩 있고, 한 면 위에 다른 면이 덮인다던가 어떤 면을 걷어내면서 새로운 면이 나오는 것과 같은 전환 효과를 구현하면서 조금의 입체감이 추가된 3차원이라는 느낌이 적용되었다.

안드로이드 5.0 롤리팝부터 각 기기에 적용되었으며, 구글이 개발한 앱 뿐만 아니라 페이스북과 같은 타사 앱들도 점차 이 가이드라인을 따라 앱을 리뉴얼/개발하고 있다.

21년 기준으로도 깔끔하게 딱 필요한 만큼의 시각적 정보와 미적 요소를 제공하는 머티리얼 디자인은 UI 디자인의 교과서로 쓰인다. 이 디자인이 대세로 등극하면서 반사광과 원형 도형 등 과도한 정보를 삽입해 UI를 사실적으로 구현한 스큐어모피즘 디자인은 한물 간 디자인으로 취급당하게 되었다.

 

[출처:나무위키]

 

 

---

✔ 메테리얼디자인 대표 사이트

https://material.io/

Material Design

 

-UI 참고하면 좋을 것

https://material.io/components/chips#choice-chips

Material Design

 

https://m3.material.io/components/chips/overview

Chips – Material Design 3

 

---

❤ 메테리얼 디자인 아이콘

아이콘 세트를 오픈소스로 공개하고 있다. 종류도 많고 아이콘 스타일도 Filled, Outlined, Rounded, Two-Tone, Sharp로 5개씩이나 있기 때문에 디자이너들이 자주 사용한다. 또한 아이콘들이 전체적으로 굵은 선을 사용했기 때문에 작아져도 모양이 덜 일그러진다.

 

[출처:나무위키]