아이콘

Windows 아이콘

 

아이콘은 설명 없이 필요한 사항을 전달합니다. 아이콘은 탐색의 핵심 부분입니다. 본질적으로 기호이기 때문에 아이콘은 의미 전달 측면에서 텍스트를 능가합니다. 기본적으로 효율성을 높이고 가능한 한 빨리 사용자를 다음 단계로 유도합니다. 아이콘은 생산성의 구성 요소이며 UI 내 탐색이 빌드되는 시각적 기반을 제공합니다.

Windows의 아이콘

Windows 아이콘은 그래픽과 기호입니다. 쉽게 인식할 수 있는 명확한 선과 단순한 모양을 사용합니다. 터치 우선 시스템을 탐색하는 데 중요하며 사용자의 UI 탐색에 도움이 되어야 합니다. 목록에서 글머리 기호 대신 사용하면 안 됩니다.

Windows 아이콘은 최소한의 부분과 세부 정보를 사용하여 개념을 요약하고 단순화합니다. 본질적으로 그래픽이고 원근감이 평면이고 단색이므로 크롬에서 콘텐츠 아이디어를 강화합니다.

원근감

Windows 아이콘은 2D 기호 모양입니다. 아이콘에서 볼륨이나 깊이를 정교하게 암시할 수도 있지만, 일반적으로 원근감 있는 선이나 각도는 추가하지 않습니다. 대부분의 아이콘은 하나의 개념 또는 개체를 나타냅니다. 아이콘이 둘 이상의 개체를 나타내는 경우 앞에 있는 개체가 뒤에 있는 개체를 "녹아웃"합니다.

 

녹아웃이 포함된 아이콘

 

 

 

 

개체 "녹아웃"은 아이콘의 한 요소가 다른 요소와 겹치는 것처럼 표시될 때 겹침으로 인해 배경색과 일치하는 간격이 만들어짐을 의미합니다.

 

 

Windows 아이콘의 기본 색은 흰색입니다. 흰색은 앱 타일, 앱 바 등 풍부한 컬러 배경을 사용하는 대부분의 색 컨텍스트에서 제대로 표시되는 단일 색입니다.

 

Windows 스토어 앱용 아이콘

 

세부 정보

Windows에서는 선 두께, 각도, 모서리, "녹아웃" 등의 세부 사항에 주의를 기울입니다. 세부 사항에 주의하면 다양한 문자 모양 아이콘의 큰 집합을 하나의 패밀리로 결합할 수 있습니다. 터치 시스템의 선 두께는 너무 가늘면 안 됩니다. 작은 크기의 아이콘에서는 1픽셀의 차이로도 선 또는 개체가 너무 무겁거나 너무 가볍게 느껴질 수 있습니다. 터치 아이콘의 경우 항상 가벼운 것보다 무거운 것이 더 낫습니다. 녹아웃을 비롯한 세부 사항은 2픽셀 이상의 두께를 사용해야 합니다.

높은 DPI에 맞게 조정

Windows 아이콘은 세 가지 기본 크기 조정 수준을 대상으로 합니다. 기본 아이콘 크기는 1x입니다. 더 높은 DPI 크기는 1.4x 및 1.8x입니다. 높은 크기 조정 수준에 맞게 조정할 때 부분 픽셀이 발생할 경우 가장 가까운 픽셀로 내립니다.

프로덕션

모든 Windows 아이콘은 Adobe Illustrator 또는 Expressions Design에서 벡터를 사용하여 그리는 것이 좋습니다. 문자 모양 시스템에서는 벡터 모양을 픽셀 그리드로 끄는 것이 중요합니다. Windows 아이콘에는 선명하고 깨끗한 가장자리가 있어야 합니다.

아이콘 사용 방법

아이콘은 단순하기 때문에 개성을 추가할 적절한 장소를 제공합니다. 아이콘 시스템을 살펴보면 브랜드가 자신뿐 아니라 사용자도 나타내는 방법을 확인할 수 있습니다. 아이콘은 가장 기본적인 수준에서 그려진 시각 신호를 통해 의미를 전달합니다. 아이콘을 사용하여 간단한 방법으로 앱을 차별화할 수 있습니다. Foursquare 앱처럼 균일한 위치 아이콘을 그리거나 Songza 앱처럼 시나리오를 그릴 수 있습니다.

 

Foursquare 앱의 아이콘

 

Songza 앱의 아이콘

 

아이콘화는 기능 제공 이상의 역할을 합니다. 사용자를 앱의 전체 비전과 연결하는 데 도움이 되며, 앱에 대한 호감을 유발할 수도 있습니다. Songza는 응용 프로그램에 적합한 도해를 효율적으로 제공합니다. 인터페이스의 효율성을 유지하는 동시에 브랜드 개성이 돋보입니다.

관련 항목

Segoe UI Symbol 아이콘에 대한 지침