안드로이드의 머티리얼 디자인은 2014년 구글이 도입한 포괄적인 디자인 언어로, 10년 넘게 발전해오면서 현대 모바일 인터페이스 디자인의 표준을 정의해왔습니다. 그 발전 과정을 시대별로 살펴보겠습니다.
머티리얼 이전: 홀로(Holo) 디자인 시대 (2011-2013)
머티리얼 디자인 이전에는 홀로(Holo) 디자인 언어가 안드로이드의 시각적 정체성을 담당했습니다[1][2][3]. 안드로이드 4.0 아이스크림 샌드위치에서 처음 도입된 홀로 디자인은 팜(Palm)의 전 디자이너였던 마티아스 두아르테(Matías Duarte)가 주도했습니다[1].
홀로 디자인의 주요 특징은 다음과 같았습니다[1][4]:
- 미래적이고 디지털적인 미학
- 네온 블루 라인과 어두운 배경
- 스큐어모피즘(사실적 디자인)에서 벗어난 플랫 디자인 원칙
- 안드로이드 4.0부터 호환성 요구사항으로 제정되어 모든 기기에서 일관된 디자인 구현[2][3]
하지만 홀로는 모바일에만 국한되어 있었고, 구글의 다른 제품들과의 시각적 일관성이 부족했습니다[5].
머티리얼 디자인 1.0의 탄생 (2014-2018)
발표와 개발 배경
2014년 6월 25일 구글 I/O 컨퍼런스에서 머티리얼 디자인이 공식 발표되었습니다[6][7][8]. 초기 코드명은 “Quantum Paper”였으며[6][9][10], 이는 디지털 종이라는 핵심 개념을 반영한 것이었습니다.
마티아스 두아르테 구글 디자인 부사장은 머티리얼 디자인의 철학을 다음과 같이 설명했습니다: “실제 종이와 달리 우리의 디지털 소재는 지능적으로 확장하고 재구성할 수 있습니다. 소재에는 물리적인 표면과 가장자리가 있으며, 이음새와 그림자는 만질 수 있는 것에 대한 의미를 제공합니다”[9][11].
핵심 철학과 원칙
머티리얼 디자인은 “종이와 잉크”에서 영감을 받았지만, 물리적 제약을 뛰어넘는 디지털 소재의 특성을 구현했습니다[6][12][10]. 주요 원칙은 다음과 같았습니다[1][7]:
- 기하학적 레이어와 깊이감: 명확한 그림자를 통한 계층 구조 표현
- 매끄러운 애니메이션: 현실적인 움직임과 전환 효과
- 대담한 색상 팔레트: 선명하고 활기찬 색상 사용
- 떠다니는 액션 버튼(FAB)과 햄버거 메뉴 같은 새로운 UI 컴포넌트
- 반응형 디자인: 모바일부터 데스크톱, TV까지 모든 플랫폼 지원
안드로이드 롤리팝(5.0)에서의 구현
2014년 11월 안드로이드 5.0 롤리팝이 출시되면서 머티리얼 디자인이 본격적으로 적용되었습니다[13][14][11]. 이때의 주요 변화는:
- 홀로의 어두운 배경에서 밝은 배경으로 전환
- 그라디언트와 베벨 제거, 자연스러운 그림자 효과 도입
- 더 밝고 선명한 색상 팔레트 사용
- 로보토 폰트 재디자인
- 소프트 키의 깔끔하고 대칭적인 디자인
현실과 이상의 간극
초기 머티리얼 디자인 프레젠테이션은 매우 화려하고 역동적인 비전을 제시했지만, 실제 구현에서는 더 보수적인 접근이 필요했습니다[1][15]. 구글의 각 앱 팀들이 서로 다른 해석으로 머티리얼 디자인을 적용했고, 안드로이드 5.0 출시 일정에 맞추기 위한 압박으로 인해 많은 앱들이 “종이 껍질”을 입힌 것 같은 느낌이었습니다[1][15].
머티리얼 디자인 2.0 시대 (2018-2021)
2018년 구글은 머티리얼 디자인의 대대적인 개편을 발표했습니다[6][16][17]. 이 버전은 “구글 머티리얼 테마” 또는 “머티리얼 디자인 2”라고 불렸습니다[9].
주요 변화점
- 구글 산스(Google Sans) 폰트 도입[16][9]
- 더 많은 여백(white space) 강조
- 둥근 모서리 확산
- 다채로운 아이콘 사용
- 하단 네비게이션 바 도입
- 더 깔끔하고 미니멀한 디자인 방향
하지만 2020년경 머티리얼 디자인은 정체기에 접어들었습니다. 구글의 앱들이 점점 획일적이 되어갔고, 초기의 다양하고 생동감 있던 색상 팔레트는 사라져 갔습니다[15].
머티리얼 유(Material You) – 머티리얼 3.0 시대 (2021-2025)
2021년 구글 I/O에서의 발표
2021년 5월 구글 I/O에서 머티리얼 유(Material You), 공식적으로는 머티리얼 디자인 3.0이 발표되었습니다[6][18][19][20]. 이는 개인화와 표현에 중점을 둔 새로운 디자인 철학이었습니다.
핵심 특징
동적 색상 시스템: 사용자의 배경화면에서 추출한 색상을 기반으로 한 개인화된 테마[18][21][22]
향상된 접근성: 모든 디자인 요소에 접근성이 내장됨[23][22]
더 큰 요소들: 버튼, 위젯 등이 더 크고 둥근 형태로 변경[18][22]
개인화 중심: 사용자의 개성과 선호도를 반영하는 적응형 디자인[16][19]
다양한 형태 지원: 폰에서 태블릿, 웨어러블까지 모든 기기에 최적화[22]
안드로이드 12에서의 구현
머티리얼 유는 안드로이드 12를 통해 처음 도입되었고[24][9], 픽셀 6 시리즈에서 본격적으로 선보였습니다[9]. 이때부터 사용자는 자신의 기기를 더욱 개인적이고 표현적으로 커스터마이징할 수 있게 되었습니다.
머티리얼 3 익스프레시브(Material 3 Expressive) 시대 (2025-현재)
2025년의 최신 진화
2025년 구글은 머티리얼 3 익스프레시브를 발표했습니다[5][23][25][26]. 이는 머티리얼 디자인의 완전히 새로운 버전이 아니라 머티리얼 3의 확장된 형태입니다[23].
새로운 특징들
물리학 기반 모션 시스템: 기존의 지속시간과 이징 기반에서 스프링 물리학으로 전환하여 더 자연스러운 애니메이션 구현[23][27]
확장된 모양 라이브러리: 35가지의 새로운 모양과 형태 변환 애니메이션 지원[23][27]
강조된 타이포그래피: 가변 폰트를 활용한 더 다양하고 표현력 있는 텍스트 스타일[23][27][25]
선명한 색상 스키마: 더욱 생동감 있고 개성있는 색상 팔레트[23][27]
새로운 컴포넌트들
- 버튼 그룹(Button Groups): 다양한 형태와 크기의 버튼을 담는 컨테이너[23]
- FAB 메뉴: 기존 스피드 다이얼을 대체하는 새로운 플로팅 액션 버튼 메뉴[23]
- 로딩 인디케이터: 5초 이하의 로딩을 위한 새로운 프로그레스 표시[23]
- 분할 버튼(Split Button): 메뉴 기능이 있는 분리된 버튼[23]
- 툴바: 바텀 앱 바를 대체하는 새로운 도구 모음[23]
개발자와 사용자에게 미친 영향
머티리얼 디자인은 출시 1년 내에 안드로이드 스토어의 100만 개 이상의 제품에 적용되었으며[8], 현재는 모바일 인터페이스 디자인의 공통 언어(lingua franca)가 되었습니다[28].
구글은 머티리얼 디자인을 오픈소스로 공개하여 전 세계 디자이너와 개발자들이 자유롭게 사용할 수 있도록 했습니다[28][8]. 이는 디자인의 민주화를 이루고, 일관성 있는 사용자 경험을 전 세계적으로 확산시키는 데 크게 기여했습니다.
머티리얼 디자인의 10년 역사는 단순한 시각적 변화를 넘어서, 사용자 중심의 개인화된 디자인 철학으로의 전환을 보여줍니다. 초기의 통일된 디자인 언어에서 시작해 현재의 표현적이고 개인화된 접근 방식까지, 머티리얼 디자인은 계속해서 디지털 인터페이스의 미래를 만들어가고 있습니다.
출처
[1] Android UI through the ages: From Droid Sans to Material … https://www.androidcentral.com/android-ui-design-holo-material-design-material-you
[2] Holo Everywhere https://android-developers.googleblog.com/2012/01/holo-everywhere.html
[3] 안드로이드 개발자 블로그 (비공식): 어디에서나 Holo http://android-developers-kr.blogspot.com/2012/01/holo.html
[4] List Of Free Holo Themed Apps For Android https://www.addictivetips.com/android/holo-themed-apps-for-android/
[5] The Evolution of Google Material Design: From Holo to … https://dtptips.com/the-evolution-of-google-material-design-from-holo-to-material-3-expressive-a-visual-journey-into-androids-future/
[6] Material Design https://en.wikipedia.org/wiki/Material_Design
[7] Google Introduces Material Design at Google I/O https://www.infoq.com/news/2014/06/google-material-design-android/
[8] Google’s Material Design: A Look Back at Its Beginning https://design.google/library/material-design-launch-2014
[9] 머티리얼 디자인 – 위키백과, 우리 모두의 백과사전 https://ko.wikipedia.org/wiki/%EB%A8%B8%ED%8B%B0%EB%A6%AC%EC%96%BC_%EB%94%94%EC%9E%90%EC%9D%B8
[10] How To Learn Material Design – PopArt Studio https://www.popwebdesign.net/popart_blog/en/2017/01/how-to-master-material-design/
[11] Android Lollipop https://en.wikipedia.org/wiki/Android_Lollipop
[12] What is Material design? https://tuatara.co/en/blog/design/material/
[13] Android Material Design: Getting Started with Lollipop https://blog.iamsuleiman.com/android-material-design-tutorial/
[14] Android 5.0 Lollipop: A look into Material Design https://www.appy.berlin/geschichte/2015/01/android-5-0-lollipop-a-look-into-material-design/index.html
[15] Google in 2014 vs 2025: The 3 Eras of Material Design https://www.youtube.com/watch?v=TlauiHqWf1s
[16] From Material Design to Material You (Material 3). https://espeo.eu/content/the-evolution-of-material-design/
[17] Material 3 vs Material 2: Key Differences Designers Must … https://www.racool.studio/blogs/material-3-vs-material-2-key-differences-designers-must-know
[18] Google Material You – new design system https://flex4b.com/en/content/blog/material-you-by-google
[19] A first look at Material You https://www.droidcon.com/2021/12/24/a-first-look-at-material-you/
[20] Start building with Material You https://m3.material.io/blog/start-building-with-material-you
[21] [해외 IT/UX] 2021 구글 I/O 매테리얼 유(Material You) 사용자 … https://bekoinny.tistory.com/36
[22] Material Design Overview: Versions, Basics & Resources https://motiff.com/design-system-wiki/design-systems-overview/material-design-overview
[23] Material 3 Expressive: What’s New and Why it Matters for … https://supercharge.design/blog/material-3-expressive
[24] Material You design https://source.android.com/docs/core/display/material
[25] Introducing Material 3 Expressive for Wear OS https://android-developers.googleblog.com/2025/08/introducing-material-3-expressive-for-wear-os.html
[26] Start building with Material 3 Expressive https://m3.material.io/blog/building-with-m3-expressive
[27] Material 3 Expressive 톺아보기 – Haeti.log https://palms.blog/haeti/material-3-expressive
[28] Material Design: Secrets & Stories Behind Google’s UI https://design.google/m10
[29] Material 3 Design Kit https://www.figma.com/community/file/1035203688168086460/material-3-design-kit
[30] Material UI 2024 end-of-year updates https://mui.com/blog/material-ui-2024-updates/
[31] Releases · material-components/material … https://github.com/material-components/material-components-android/releases
[32] Compose Material 3 | Jetpack https://developer.android.com/jetpack/androidx/releases/compose-material3
[33] What’s New https://m2.material.io/whats-new
[34] Explore First 10 Years of Material Design’s Evolution https://design.google/library/material-design-eras
[35] Material Design 3 for MDC-Android https://m3.material.io/develop/android/mdc-android
[36] The Evolution of Material Design https://1brand.design/blog/the-evolution-of-material-design/
[37] Material Design 3 in Compose | Jetpack Compose https://developer.android.com/develop/ui/compose/designsystems/material3
[38] Material Design 3 – Google’s latest open source design system https://m3.material.io
[39] Material Design: Homepage https://m2.material.io
[40] Introduction https://m2.material.io/design/introduction
[41] Material design in the 2014 Google I/O app https://android-developers.googleblog.com/2014/08/material-design-in-2014-google-io-app.html
[42] Google I/O 2014 – Material design: Visual style and imagery https://www.youtube.com/watch?v=ctzWKRlTYHQ
[43] Material 3 Expressive updates and more in the latest Pixel … https://blog.google/products/pixel/september-2025-pixel-drop/
[44] Google I/O 2014 – Material design: Structure and components https://www.youtube.com/watch?v=dZqzz5lZFvo
[45] Google I/O 2014 – Material design in Google Play https://www.youtube.com/watch?v=ZlY714W4uww
[46] Google I/O 2021 in 15 mins: Android 12, Material You, new … https://www.youtube.com/watch?v=ExNFx3oeZMc
[47] Materials Science and Engineering/Timeline of … https://en.wikiversity.org/wiki/Materials_Science_and_Engineering/Timeline_of_Material_Advances
[48] Angular Material 18 SASS API Changes for Material 2 (M2) … https://gist.github.com/shhdharmen/435f11430bcc4eb6ef9bdb768917d513
[49] Web design history: Breaking down the major milestones https://contentsnare.com/web-design-history/
[50] use holo theme on Android < 4.0 https://stackoverflow.com/questions/9311988/use-holo-theme-on-android-4-0
[51] Material Design 1 vs Material Design 2 vs Material Design 3 https://www.creative-tim.com/blog/web-development/material-design-comparison/
[52] [Theme] Holo (Android 4.x look) : r/androidthemes https://www.reddit.com/r/androidthemes/comments/8rkjrn/theme_holo_android_4x_look/
[53] 2018.2의 재료 데이터베이스 변경 사항 https://help.autodesk.com/cloudhelp/2018/KOR/MoldflowInsight-WhatsNew/files/GUID-D934C120-C236-4C68-AC50-2D14CA542F00.htm
[54] What Is Material Design? Definition, Uses, and Examples https://elementor.com/blog/what-is-material-design/
[55] negusoft/holoaccent: Android library to customize the Holo … https://github.com/negusoft/holoaccent
[56] Facing Our Interfaces: Matías Duarte, Google https://interfacecafe.com/facing-our-interfaces-design-notes-matias-duarte/
[57] Matias Duarte https://www.youtube.com/watch?v=x17VCmuxByQ
[58] Google VP of design Matias Duarte talks origin of Material … https://9to5google.com/2014/06/27/google-vp-of-design-matias-duarte-talks-origin-of-material-design-and-more-in-interview/
[59] What is the best way to implement material design in pre- … https://stackoverflow.com/questions/31428138/what-is-the-best-way-to-implement-material-design-in-pre-lollipop-devices
[60] A brief history of quantum vs classical computational … https://arxiv.org/html/2412.14703v1
[61] Google I/O 2014 – Material design principles https://www.youtube.com/watch?v=isYZXwaP3Q4
[62] Material Design For Pre-Lollipop Devices https://mentormate.com/blog/material-design-pre-lollipop-devices/
[63] Google’s Matias Duarte on the future of software design https://www.wired.com/story/google-matias-duarte-design-interview/
[64] 3 years ago today, Android 5.0 Lollipop was released with … https://www.reddit.com/r/Android/comments/7cg6ff/3_years_ago_today_android_50_lollipop_was/
[65] Harnessing quantum power: Revolutionizing materials … https://onlinelibrary.wiley.com/doi/10.1002/mgea.73
[66] Matias Duarte on Creating Material Design in Android 5.0 … https://www.businessinsider.com/matias-duarte-material-design-android-lollipop-2014-11