WWDC 2026과 디자인 리소스 이야기
어제 있었던 WWDC 2026 발표에서 iOS 26이 공개되었습니다.
예전에 모바일 디자인을 하던 시절에 새로운 UI를 보며 예전에 디자인 작업을 하면서 각종 목업(mockup)을 검색하고 라이브러리를 만들었던 기억이 떠올랐습니다. 그때 우리는 다양한 디바이스의 디자인 템플릿을 찾아다녔고, 때로는 직접 만들어서 사용하기도 했죠.
오늘은 그런 수고를 덜 수 있도록, 각 플랫폼에서 공식 제공하는 디자인 리소스를 소개해드리려고 합니다.
디자이너뿐만 아니라 개발자에게도 매우 유용한 자료들이니 꼭 한 번 확인해보세요!
🍎 애플 디자인 리소스
Apple Design Resources
Design apps accurately and quickly using official Apple design templates, icon production templates, color guides, and more.
developer.apple.com
애플은 iOS, iPadOS, macOS, watchOS, visionOS 등 다양한 플랫폼에 대한 공식 디자인 템플릿과 UI 키트, 아이콘, 컴포넌트를 제공합니다. Sketch, Figma, Adobe XD 등 주요 디자인 툴 포맷으로 제공되며, HIG(Human Interface Guidelines)도 함께 참고할 수 있어 매우 유용합니다. (Sketch로 제작된 iOS 26 라이브러리가 이미 업데이트되어 있습니다.)
🤖 구글 머티리얼 디자인 리소스
Material Design Resources 바로가기
Material Design
Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences.
m3.material.io
구글은 자사의 디자인 시스템인 머티리얼 디자인(Material Design)을 통해 안드로이드 앱, 웹, 크로스플랫폼 UI 작업을 위한 풍부한 컴포넌트, 템플릿, 아이콘 세트를 제공합니다. 특히 Material 3 (M3)부터는 개인화와 다크모드 대응, dynamic color 등 최신 트렌드가 반영되어 있어 실무에 바로 적용 가능합니다. Figma 기반 템플릿도 매우 잘 정리되어 있습니다.
📱 삼성 디자인 시스템
Design | Samsung Developer
Inspired by Humans, Creating the Future.
developer.samsung.com
삼성은 One UI에 맞춘 디자인 가이드와 함께 디자인 리소스를 제공합니다.
갤럭시 디바이스를 위한 UI 디자인 시, 사용성에 대한 권장사항과 디바이스별 해상도, 컴포넌트 스타일 등을 참고할 수 있으며, 디자이너를 위한 Figma UI Kit도 다운로드 받을 수 있습니다.
💠 그외 주요 플랫폼 디자인 리소스
- Microsoft Fluent Design System
Fluent UI
Windows 및 웹/리액트 앱을 위한 디자인 시스템으로, 디자인 가이드라인, React/Vue/Web 컴포넌트, 아이콘, 컬러 시스템, Figma 리소스 등을 제공합니다. - IBM Carbon Design System
Carbon Design System
IBM이 제공하는 오픈소스 엔터프라이즈 UI 프레임워크로, React/Vue/Web Components, 디자인 키트, 접근성 도구, IBM Plex 폰트 리소스 등을 포함합니다. - Adobe Spectrum
Spectrum Design System
Adobe의 UI 설계 시스템으로, 구성 요소, 디자인 토큰, 접근성 기준, 일러스트레이션 스타일 등을 망라한 Spectrum 2 버전을 제공합니다. - Atlassian Design System
Atlassian Design System
Jira/Confluence 기반 웹앱 디자인을 위한 핵심 가이드라인과 React 컴포넌트, Figma 라이브러리가 준비되어 있습니다. - Shopify Polaris
Polaris Design System
전자상거래 관리자 UI 설계를 중심으로 구성된 디자인 시스템으로, React 컴포넌트, 디자인 가이드, 코드 샘플 및 접근성 가이드 등이 포함되어 있습니다.
맺음말
디자인 리소스를 잘 활용하면 시간과 비용을 절약할 수 있을 뿐 아니라, 플랫폼 가이드에 부합하는 결과물을 만들 수 있습니다.
오늘 소개한 자료들이 여러분의 프로젝트에 도움이 되었길 바랍니다 😊
그럼, 또 다른 포스팅에서 뵙겠습니다!