버튼

버튼은 사용자의 작업을 나타내는 기본적인 시각적 표시기입니다.

디자인 요소는 프레임 하단에 고정해야 합니다.

행동 지향적: 버튼은 행동을 트리거한다는 것을 명확하게 전달해야 합니다.

명확한 피드백: 즉각적인 피드백을 제공하기 위해 버튼의 모양이 다양한 상호작용 상태(마우스 오버, 누름, 포커스)에서 뚜렷하게 변경되어야 합니다.

일관성: 모든 버튼은 즉시 인식할 수 있도록 핵심 시각적 언어를 공유해야 합니다.

유연성: 버튼 구성요소는 일관성을 해치지 않으면서 아이콘 삽입이나 크기 변화와 같은 다양한 변형을 충분히 반영할 수 있어야 합니다.

사용 및 배치

버튼은 관련 콘텐츠와 가까운 곳에 배치해야 합니다. 단독으로 배치하거나 카드, 목록과 같은 다른 구성요소와 함께 배치할 수 있습니다.

점진적 노출을 사용하여 관련성이 낮은 작업을 표시합니다.

너무 많은 버튼으로 사용자의 뷰를 압도합니다.

버튼을 사용하여 작업을 유도합니다. 또는 정적 요소에 제목 칩을 사용합니다.

버튼을 정적 장식 요소로 사용합니다.

1. 사용 설정됨: 기본 상태입니다. 2. 마우스 오버 3. 탭

1. 사용 설정됨: 기본 상태입니다. 2. 마우스 오버 3. 탭

버튼에는 기본 변형과 큰 변형이 포함되며, 각각에 기본, 포커스, 눌림 상태가 있습니다. 아이콘을 사용하여 버튼을 더 강조하고, 의미를 명확하게 전달하며, 사용자가 더 쉽게 인지하도록 할 수 있습니다. 버튼 크기는 중요성을 강조하는 데 도움이 됩니다.