안드로이드 5.0 롤리팝의 디자인 언어, 머티리얼 디자인

저만의 카카오톡을 만들기 위해 맨땅에 헤딩 정신으로 덤벼든지 일주일만에 Black Theme가 탄생했습니다. 여기저기서 정보를 하나씩 찾아가면서 힘들게 만든 첫 테마였지만 무언가 아쉬움이 남았습니다. 특히 디자인적으로 만족스럽지 못했습니다. CyanogenMod 테마에서 추출한 아이콘은 그럭저럭 봐줄만 했는데 더보기탭의 아이콘들이 정말 마음에 안들었습니다. 그렇다고 아이콘을 새로 만들기에는 실력이 부족했습니다. 이러한 고민을 하던 중 머티리얼 디자인을 알게 되었습니다.

머티리얼 디자인(Material Design)은 안드로이드 5.0 롤리팝에서부터 적용된 구글의 디자인 가이드라인입니다. 머티리얼 디자인은 질감이 느껴지는 표면, 대담하고 선명한 그래픽 디자인 그리고 아름답고 직관적인 사용자 경험을 위한 자연스러운 애니메이션을 특징으로 합니다. 또한 머티리얼 디자인에서 표면과 그림자는 물리적인 구조를 형성하여, 사용자들이 화면 상의 어떤 부분을 터치할 수 있고 움직일 수 있는지 쉽게 이해할 수 있도록 돕습니다. 위의 동영상을 보시면 쉽게 이해하실 수 있습니다.

드디어 구글이 디자인에도 본격적으로 신경을 쓰게 되어 신났습니다. 개인적으로 아이스크림 샌드위치 버전에서 본격적으로 사용한 홀로 테마(Holo Theme)도 이쁘다 생각했는데 머티리얼 디자인은 차원을 뛰어넘더군요. 여기저기서 정보를 찾으며 머티리얼 디자인을 적용한 카카오톡 테마를 만들어야겠다는 결심을 했습니다. 아직 안드로이드 L 개발자 프리뷰 버전만 나온 상태였고, 정식으로 안드로이드 5.0 롤리팝이 나오기에는 시간이 꽤 남던 상황이었기 때문입니다. 이러한 과정에서 나온 것이 바로 다크 테마였습니다.

깔끔하면서 어두운 테마를 제작하려고 했던 저는 머티리얼 디자인을 소개하는 구글의 웹사이트에서 다크 테마의 이미지를 찾았습니다. 이 사진을 보고서 이거다 하는 생각이 들었구요. 이 스크린샷에서 모티브를 따와서 바로 카카오톡 테마를 제작하기 시작했습니다. apk manager가 슬슬 손에 익어 작업속도가 이전보다 훨씬 빨라져 두번째 자작테마인 다크 테마(Dark Theme)가 쉽게 나왔습니다. 과거 Black Theme에서 테마의 기본적인 틀을 다졌다면 다크 테마에서는 각종 아이콘과 색상 조합을 정할 수 있었습니다. 

Dark Theme v1.0 스크린샷

아쉽게도 카카오톡 테마의 한계로 인해 상단탭 아래에 그림자 효과를 넣으려고 시도했지만 각 뷰의 깊이값을 설정하는 것은 거의 불가능했습니다. 그래도 이전보다 훨씬 완성도 있는 테마가 나와서 기분이 좋았습니다. 카카오톡을 실행할 때 2초 가량 보게되는 스플래쉬 이미지(Splash image)를 비롯해서 몇가지만 다듬으면 쓸만한 테마가 될 것 같았습니다. 막상 만들어놓으니 혼자만 쓰기에는 뭔가 아까웠고 구글 플레이에 올려도 욕은 먹지 않겠다는 생각이 들었습니다. 그래서 구글 플레이에 테마를 등록하려고 시도했지만 이내 난관에 봉착하게 됩니다.

참고

- Google Design

http://www.google.com/design/

- 머티리얼 디자인 (Material Design) 이란?

http://googledevkr.blogspot.kr/2014/07/this-is-material-design.html