본문 바로가기

UX ⁄ UI

UI디자인의 원리 - 아이콘(icon)

 

1. 간결성

 

간결하고 직관적인 형태로 명료하게 의미를 전달할 수 있어야 한다.

가독성을 최대화할 수 있도록 추상화한다.

복잡한 형태는 피한다.

 

(출처) Google Material Design

 

 

2. 일관성

 

일관성 있는 디자인으로 통일감과 안정감을 줄 수 있어야 한다.

크기, 비례감, 스타일(fill or hollow) 등에 있어서 동일한 스타일을 유지한다.

 

선으로 된 아이콘일 경우, 선의 굵기, 선 끝처리 처리에 유의한다. 가독성을 위해서는 선의 두께를 2dp로 하는 것이 좋다. 선의 두께가 2dp 이하일 경우, 끝처리 반경은 1dp로 한다.

 

(출처) Google Material Design

 

 

 

 

 

System Icons - Icons and Images - iOS - Human Interface Guidelines - Apple Developer

System Icons (iOS 12 and Earlier) In iOS 13 or later, prefer using SF Symbols to represent tasks and types of content in your app. If your app is running in iOS 12 or earlier, follow the guidance below. The system provides built-in icons that represent com

developer.apple.com