1. 머티리얼 디자인 센터

구글의 디자인 철학과 이에 따른 가이드, 리소스 그리고 머티리얼 Icon과 폰트 등, 웹/모바일 디자이너와 기획자라면 북마크하고 자주 방문하여 참조 해야할 사이트가 아닐까 싶다. 개인적으로 제일 관심이 쏠린 첫번째 섹션은 “카드“, 구글이 말하는 카드 UI의 일관된 요소가 먼지 확실하게 세겨진 듯하다.

구글 머 2잘된 사례와 주의해야할 사례의 비교

구글 머 3 아이콘센터는 아이콘 제작가이드와 함께 시스템/웹폰트를 제공하고 있다.구글 머

Action 아이콘과 시스템아이콘은 이름과 아이콘이 좀 난해하게 매칭된 부분도 보이는 듯하지만 새로이 올라운 아이콘 다운로더는 필요한 것들만 다운 받을 수 있어서 나름 사용자 편의를 제공한다.

구글 머 1폰트섹션으로 가면 Roboto와 Noto를 다운 받을 수 있도록 해주었고, 지금은 윈도우의 기본폰트를 Noto로 설정하여 쓰고 있는데 Cleartype이 맑은고딕 보다 잘 적용되는 듯 하기도 하고 정리정돈된 듯한 느낌은 매우 만족스럽니다. 다음은 역시 큰 구경거리는 애니메이션쪽이다. 설명보다는 직접방문을 권하고 싶다.

그리고 가장 최근 업데이트된 곳으로 Adaptive UI 디자인 섹션은 방문 해 볼만하다. 아래는 Adaptive UI 중 GRID가 어떤 방식을 반응하는 것인지를 에니메이션으로 보여주고 있다.

구글 머티리얼 센터 (바로가기)

2. 플레이스토어의 툴 & 리소스

머티리얼 디자인센터의 완성도가 높아지기도 전에 머티리얼 디자인을 소화 해낸 마스터급으로 지목한 5개의 앱중에 심플하면서 단연 돋보이는 것은 Numix 계산기 앱이다. (Youtube 동영상보기)

머티리얼 다자인 적용 앱
머티리얼 다자인 적용 앱

그외에 메신저기상위젯은 흔히 Google Play에서 볼 수 있는 앱이고, 검색창에서 “Material Design”을 입력하여 여러앱을 브라우징 할 수 있다. 그리고, GitHub에서 프로젝트를 하거나 Demo로 올려 놓은 앱을 다운받아 머티리얼 디자인 입문자는 도움을 받을 수 있다.

앱 리소스
디자인라이브러리와 데모 및 칼러조견표 앱

에니메이션의 데모를 보여주는 Material Library DemoUI Template는 목업 또는 개발에전시에 맞게 바꾸어 쉽게 데모버전을 만들어 놓을 수 있을 것 같다. 가장 마지막에 있는 Material design 툴킷은 디자인센터에 ICON섹션을 모바일로 옮겨 놓은 듯 하다.

ㅎㅁ
출처: Google Play Store

3. 트랜드 피드

마지막으로, Material Design 관련 트랜드와 새로운 정보를 얻는데 중요한 채널 보자면;

첫 번째, 가장 우선 챙겨야 할 트위터계정은 @GoogleDesign 이다.

두 번째, @materialdesignB 블로그와 Reddit Feed인 @materialdesign_ 받아보면 좋을 것 같다.
xmdnl

세번째,  왠만한 새로운 정보를 여기서 접할 수 있을 것 같은 #Materialdesign 피드를 구독하는 것이다.

트위터의 #materialdesign
트위터의 #materialdesign

Material 디자인은 단순한 플랫디자인에서 진보된 느낌은 WhatsApp과 Numix 계산기를 사용해 보면서 바로 알 수 있었고, 2008년도 애플의 수도모피즘의 UI를 생각해보면 평면에서 입체감을 주기위해 생고생들을 한 것 같다는 생각이 든다.

….

..


그외에 좋은 Digital Marketing & Strategy 정보를 계속 받아 보고 싶으시면 이메일로 “디지털 전략마인드 뉴스레터를 구독” 하시면 구독회원 전용 컨텐츠도 보실 수 있습니다.

이메일 구독 신청하기