Düğmeler

Düğmeler, kullanıcının işlemlerinin birincil görsel göstergesidir.

İlkeler

İşleme yönelik: Düğmeler, bir işlemi tetiklediklerini net bir şekilde belirtmelidir.

Net Geri Bildirim: Düğmenin görünümü, anında geri bildirim sağlamak için farklı etkileşim durumlarında (üzerine gelme, basma, odaklanma) belirgin şekilde değişmelidir.

Tutarlı: Tüm düğmeler, anında tanınabilmeleri için temel bir görsel dil paylaşmalıdır.

Esnek: Düğme bileşeni, tutarlılıktan ödün vermeden simgeler ve farklı boyutlar gibi yaygın varyasyonları desteklemelidir.

Kullanım ve Yerleşim

Düğmeler, alakalı içeriklerinin yakınına yerleştirilmelidir. Tek başına veya kartlar ve listeler gibi diğer bileşenlerle birlikte yerleştirilebilirler.

check_circle

Yapılması gerekenler

Daha az alakalı işlemleri göstermek için kademeli açıklama kullanın.

cancel

Yapılmaması gerekenler:

Çok fazla düğmeyle kullanıcının görünümünü karmaşıklaştırma

check_circle

Yapılması gerekenler

Bir işlemi tetiklemek için düğmeleri kullanın. Alternatif olarak, statik bir öğe için başlık çipi kullanın.

cancel

Yapılmaması gerekenler:

düğmeyi statik bir dekoratif öğe olarak kullanma

Anatomi

Özelleştirme

Düğmelerde varsayılan ve büyük varyasyonun yanı sıra her biri için varsayılan, odaklanılmış ve basılmış durumlar bulunur. Simgeler, düğmeye daha fazla vurgu, açıklama ve tanıma kazandırmak için kullanılabilir. Düğme boyutu, önemi vurgulamaya yardımcı olabilir.