개요
칩은 사용자가 아래 콘텐츠를 필터링하거나 빠른 작업을 트리거할 수 있는 대화형의 작은 요소입니다. 작은 구성요소는 콘텐츠와 관련된 상황별 옵션을 제공하고 탐색 시간을 단축하여 이동 중 작업을 간소화하는 데 도움이 됩니다.
시각적 명확성을 유지하려면 레이아웃을 행당 최대 7개의 칩으로 제한해야 합니다. 칩은 브랜드의 시각적 언어에 맞게 매우 유연하게 사용할 수 있습니다. 선택한 UI 테마에 따라 모양, 배경 색상, 테두리 색상을 맞춤설정할 수 있습니다.
칩에는 다음이 포함될 수 있습니다.
- 아이콘만
- 텍스트 라벨만
- 아이콘과 라벨 (양방향)
음악작품
1. 선행 아이콘 또는 이미지
2. 라벨 텍스트
UX 요구사항
모든 앱에서 안전하고 일관된 환경을 보장하려면 다음 디자인 요구사항을 따르세요.
요구사항 수준 |
콘텐츠 |
|---|---|
필수(MUST) |
아이콘 또는 라벨을 포함합니다. |
해야 하는 작업(SHOULD) |
고유한 색상이나 모양과 같은 고유한 시각적 스타일을 사용하여 다양한 칩 상태를 전달합니다. |
해야 하는 작업(SHOULD) |
앱 전체의 모든 칩에 일관된 스타일을 구현합니다. |
해야 하는 작업(SHOULD) |
동일한 구성요소 그룹 내에서 상태 칩과 상태 비저장 칩을 혼합하지 않습니다. |
해야 하는 작업(SHOULD) |
중요하거나 권장되는 칩을 컨테이너의 선행 가장자리에 배치합니다. |
해야 하는 작업(SHOULD) |
라벨 텍스트를 간결하고 설명적으로 유지합니다. 잘림을 트리거하고 인지 부하를 증가시키는 긴 텍스트는 피합니다. |