구글의 머티리얼 디자인, 알아보기

 안녕하세요, 까만거북이입니다.
 역시 늘 그랬듯이(...) 정말 오랜만에 글을 작성하네요.
 블로그에 글을 남긴지 꽤 되었는데.. 최근에는 예전처럼 지식을 습득하는 것 같지 않았는데, 그 이유를 블로그에서 찾았습니다.
 스크랩은 아무리 해도 머리 속에 남지 않지요..

 오늘은 머티리얼 디자인을 알아볼텐데, 그 동안 어렴풋이 알았던.. 머티리얼 디자인이란, 종이를 겹겹이 쌓아올린 디자인이야.. 잘 한 앱으로는 리멤버, 언니의 파우치 정도가 있어..에서 넘어서서 조금 더 구체적으로 파보려고 하고, 그 전에 알아보기용 링크들을 정리하고자 합니다.

# 머티리얼 디자인이란

 안드로이드(Android) 디자인이 iOS 대비 공대스럽다(...), 촌스럽다(..!!)는 평을 많이 들어온 구글에서 2014년 여름에 야심차게 내놓은 디자인 가이드입니다.
 인터넷 세상을 넘어서서 온 우주를 지구를 삼키려는 구글답게 다양한 화면 사이즈를 가진 디바이스들을 아우르는 디자인으로 많은 고민을 한 흔적이 느껴지는.. 그런 작품(!)입니다.

 안드로이드 5.0부터 지원하고 있으며, 2014년 발표 당시에는 롤리팝(5.0)만 지원하고 있어서 먼 미래 이야기 같았지만.. 누가(7.0)까지 런칭된 마당에 이제는 보편화된 가이드로 자리 잡고 있어 보입니다. ( 몇몇 iOS 앱들도 머티리얼 디자인을 따르고 있지요. 예시는 기회를 만들어 추후에 다루는 걸로.. )

 자세한 이야기는 아래 2개의 링크를 소개합니다.

▶ 안드로이드 앱 디자이너를 위한 쪽집게 과외, '머티리얼 디자인' - beSUCCESS

 2015년 8월 포스트이며, 애플의 iOS6까지 이어진 `스큐어모피즘`과 지금의 윈도우와 iOS의 기초가 되는 `플랫 디자인`과 머티리얼 디자인을 비교하고 있습니다.

 특히 머티리얼 디자인이 잘 적용된 앱으로 리멤버와 언니의 파우치, 이밥차를 예시로 인용하고 있습니다.

스큐어모피즘이 실제 세상의 사물을 그대로 묘사한 정밀화라면, 플랫 디자인은 디지털 세계관 속에만 존재하는 추상화다.
반면 머티리얼 디자인은 단순히 플랫 디자인의 확장 버전이라고 정의되기도하고, 플랫 디자인과 스큐어모피즘의 혼합체라고 이해되기도 한다.

▶ 슬로워크 __ 머티리얼 디자인(Material Design)의 핵심은 무엇인가_

결국 머티리얼 디자인은 구글의 다양한 기기와 서비스를 하나로 묶기 위한 방법입니다. 이 디자인의 기반에는 여러 기기들을 사용할 때 끊김이 없는 사용 흐름을 위한 똑똑한 기술들이 있습니다.

# 구글의 머티리얼 디자인 공식 가이드 문서 ( 영어 / 한글 )

 무엇보다 공부(!)를 위한 것에는 공식 가이드라인을 기초로 두는 것이 좋지요.
 아래 2개의 링크를 참고하시고, 특히 두번째는 David HY Kim님이 한글 번역을 해주신 사이트입니다. 고맙습니다.

 그리고 정확한 수치를 바로 보기 위해.. 일부러 레이아웃 부분을 링크로 걸었습니다.

▶ Principles - Layout - Material design guidelines

▶ 기본 원리 - 레이아웃 - 구글 디자인 가이드라인

 추가로 구글은 2016년 머티리얼 디자인 어워드를 개최(?)했는데, Airbnb와 Kitchen Stories 등이 수상했습니다. 수상작 5개를 보면, 머티리얼 디자인의 진가를 느끼게 되는 것 같네요.

▶ Material Design Awards 2016 - Articles - Google Design

# 개발자를 위한 머티리얼 디자인

 머티리얼 디자인이 안드로이드를 위한 디자인 가이드라인이기 때문에 개발로서도 나름 손쉽게 프로젝트에 탑재할 수 있도록, 되어 있습니다.
 머티리얼 테마를 사용할 수도 있고, 제한적이지만, 커스터마이징도 간단하게 지원하고 있습니다.

▶ 개발자를 위한 머티리얼 디자인 _ Android Developers

RecyclerView 위젯은 ListView의 더욱 향상되고 유연해진 버전입니다. 이 위젯은 한정된 수의 뷰를 유지함으로써 매우 효율적으로 스크롤할 수 있는 큰 데이터 집합을 표시하기 위한 컨테이너입니다. 사용자 작업 또는 네트워크 이벤트에 따라 런타임에 요소가 변경되는 데이터 컬렉션이 있는 경우 RecyclerView 위젯을 사용하세요.

 논외의 이야기일 수 있는데, 위에서 인용한 Android Developer 사이트는 사실 다양한 트레이닝을 설명하고 있습니다. 아래는 툴바를 이용해 앱 바를 추가하는 강의(?)를 볼 수 있습니다.

▶ 앱 바 추가 _ Android Developers

# 머티리얼 라이트 - 머티리얼을 웹사이트에 도입하다

 다양한 멀티 스크린을 지원해야 하는 플랫폼은 바로 `웹`이지요. 머티리얼은 웹사이트에도 최적화되어 있고, 그러기 위해 나온 것이 머티리얼 라이트입니다.
 다수의 구글 웹사이트들은 이를 활용해 만들어지고 있고, 아래 사이트에서 KIT를 받으면, 이것저것 시도해볼 수 있습니다.
 저는 트위터의 부트스트랩이 생각나네요.

▶ Material Design Lite

# 개발 협업을 위한 안드로이드 디자인 가이드

 머티리얼이고 뭐고(...), 일단 맨들어져야(!) 비로소 작품이 되겠지요. 디자인 가이드는 그러기 위해 개발 협업이 꼭 필요하고, 중요한 요소입니다.
 안드로이드 디자인 가이드에서 중요한 DIP, DP 개념과 가이드 문서 작성에 대한 좋은 글이 있어 소개합니다.

▶ 개발 협업을 위한 안드로이드 디자인 가이드 #01 __ Leipiel의 잡다한 이야기

▶ 개발 협업을 위한 안드로이드 디자인 가이드 #02 __ Leipiel의 잡다한 이야기

끝.