Kartlar için en iyi uygulamalar

Siyah üzerine tasarım

Siyah arka planda tasarım yapmak, Wear OS için iki önemli nedenden dolayı çok önemlidir:

  • Pil verimliliği: Ekrandaki her yanan piksel güç tüketir. Siyah arka plan kullanarak etkin piksel sayısını en aza indirir ve pil ömrünü uzatırsınız.
  • Sorunsuz estetik: Siyah arka plan, kadran çerçevesini görsel olarak en aza indirmeye yardımcı olarak cihazın kenarına kadar uzanan kesintisiz bir yüzey yanılsaması oluşturur. Bu alanda kullanıcı arayüzü öğeleri bulundurmak bu etkiyi daha da artırır.

Şunu yap

Arka plan rengini her zaman siyah olarak ayarlayın.

Bunu yapmayın

Arka planı tüm alanı kaplayan bir resim veya blok renk olarak ayarlamayın.

Yalnızca gerekli öğeleri ekleyin

Bu özellik etkinleştirildiğinde (örneğin, ProtoLayout Material3 PrimaryLayout kullanılarak), Wear OS, kullanıcı Kart bandında kaydırırken otomatik olarak gösterilecek olan kalıcı uygulama simgesini otomatik olarak gösterir. Uygulama simgesi, kutunun parçası olarak tasarlanıp eklenmemelidir.

Kartınızda dinamik tema kullanıyorsanız sağlanan uygulama simgesinin tek renkli olduğundan emin olun. Markanızın uygulama simgesini nasıl oluşturacağınızla ilgili Android ürün simgesi yönergelerini inceleyin.

Şunu yap

Wear OS, kullanıcı Kart bandında gezinirken uygulama simgesini otomatik olarak gösterebilir. Kart tasarımına uygulama simgesini eklemeniz gerekmez.

Bunu yapmayın

Sistem düzeyinde de gösterilirse iki kez/üst üste görünebileceği için uygulama simgesini Kart tasarımına eklemeyin.

Minimum dokunma hedefi sağlamak için uygulama başlıklarını gizleme

Küçük ekranlarda etkileşimli öğeler için yeterli alan sağlamak amacıyla, Kart'ta iki satır (ve alt bölüm) kullanıldığında uygulama başlığı gizlenebilir. Bu sayede satırlar yeterince yüksek olur (en az 48 dp). Başlık, daha büyük ekranlarda (225 dp ve üzeri) yeniden görünebilir.

Şunu yap

Küçük ekranlarda, iki satırın minimum 48 dp yüksekliğe ve dokunma hedefine sahip olması için uygulama başlığı gizlenir.

Bunu yapmayın

Küçük ekranda uygulama başlığını gizlemezseniz ve iki satırınız varsa bileşenlerin yüksekliği erişilebilirlik standartlarımıza uygun olmaz ve minimum dokunma hedefi boyutundan daha küçük olur. Bu örnekte, düğmeler için ayrılan alan 48 dp'den küçük olduğu için düğmeler kırpılmıştır.

Vurgulanacak tek bir birincil kullanım alanı seçin

Kullanıcıların her Kart'ta ne yapacağını (uygulama açma, etkinlik başlatma veya daha fazla bilgi edinme) bilmesi için düzenlerine en az bir etkileşimli öğe eklemeleri gerekir.

Şunu yap

Bu Kart, küçük bir seçenek koleksiyonu sunması ve daha fazlasını görme olanağı sağlaması nedeniyle etkilidir.

Bunu yapmayın

Çok fazla seçenek sunulduğu için karar verme konusunda kararsızlığa yol açtığından bu çözüm kullanıcılar için daha az faydalıdır.

En az bir kapsayıcı ekleyin

Uygulamadaki her kart en az bir kapsayıcı öğe içermeli ve uygulamadaki ilgili bir ekrana bağlantı vererek tamamen dokunulabilir olmalıdır. Kartın bilgileri, kapsayıcı içinde yer alsa veya ayrı olarak sunulsa bile, bağlı içeriği veya kullanılabilen işlemi açıkça belirtmelidir.

Düğmeler kullanılıyorsa standart tasarım kurallarına uymalı ve işlevlerini net bir şekilde belirtmelidir.

Şunu yap

Bu Kart, kullanıcının net dokunma olanaklarına sahip olduğu için sunulan özelliklerin her biri üzerinde işlem yapabilmesi nedeniyle iyi çalışır.

Bunu yapmayın

Bu Kart, kullanıcının ek bilgileri görmek için içeriğe dokunabileceğini net bir şekilde belirtmediği için daha az etkilidir.

İşlemleri anında anlaşılır hale getirin

Kol saatindeki deneyimlerde, anlamlarını aktarmak için yeterli alan olmadığından en etkili Kartlar kolayca tahmin edilebilir etkileşimli bileşenlere sahiptir.

Şunu yap

Başarılı bir Kart, her işlemin sonucunu net bir şekilde iletmek için mevcut alandan tam olarak yararlanır.

Bunu yapmayın

Bu Kart'taki işlemler net değil. Albüm kapaklı kapsayıcı kullanıcıyı nereye yönlendiriyor ve bu "Oynat" düğmesinden farklı mı?

İşlemlere görsel olarak öncelik verme

Kullanıcıların bir Kart'taki en önemli işlemi anlamasına yardımcı olmak için etkileşimli kapsayıcılara görsel olarak öncelik verilmelidir.

  • Birincil işlem düğmelerinde birincil renkleri kullanın.
  • İkincil işlemlerde ikincil/üçüncül renkler kullanın

Şunu yap

Bu Kart'ta, tonlu dolgu stili kullanılarak doldurulmuş (birincil ve ikincil renk rolleri ile) ve net üçüncül alt düğme rolü bir arada kullanılmaktadır.

Bunu yapmayın

Bu Kart'ta, doldurulmuş stil düğmeleri çok fazla kullanılmış ve bunların tümü birincil renk rolünü kullanıyor.

Daha az sayıda kapsayıcıyla basitleştirme

Kartlar, belirli bir işlemi tetiklemek için birden fazla etkileşimli bileşen kullanmaktan kaçınmalı ve bunun yerine genel düzeni daha az kapsayıcı olacak şekilde basitleştirmeye çalışmalıdır.

Şunu yap

Bu kartta birkaç kapsayıcı kullanılmaktadır ve her kapsayıcı, zamanlayıcı başlatma veya yeni bir zamanlayıcı oluşturma gibi belirli bir işlemi gerçekleştirmek için düğme görevi görür.

Bunu yapmayın

Tüm bilgiler aynı konuma gideceğinden burada 4 kapsayıcı kullanılması gerekmez.

İşlevsel amaçlar için kapsayıcı kullanma

Kullanıcıların bir Kart'taki her bir bileşenin ne yapacağını tahmin edebilmesi için, hiçbir şey yapmayan dokunuşları önlemek amacıyla dekoratif veya yapısal amaçlar için kapsayıcı kullanmamanızı öneririz.

Şunu yap

Bu çözüm, Kart'ın tek işleminin bir oluşturma akışı olması ve diğer tüm içeriğin siyah arka planda yüzmesi nedeniyle işe yarar.

Bunu yapmayın

Bu Kart, kullanıcının tüm kapsayıcılarla etkileşim kurabileceği izlenimi verdiği için daha kafa karıştırıcı.

Grafiklerin ve çizelgelerin göz atılabilir gösterimlerini gösterme

Wear OS tasarımında göz atılabilirlik önemlidir. Sınırlı ekran süresinde (yaklaşık 7 saniye) temel bilgilere öncelik verin. Bu bilgileri, bir bakışta kolayca anlaşılabilecek net bir biçimde sunun.

Kol saatinin, önemli ayrıntılara hızlıca erişmenizi sağlayarak telefon deneyimini tamamladığını unutmayın.

Şunu yap

Sayısal veya istatistiksel bilgilerin hızlı ve göz atılabilir şekilde gösterilmesi ve gerekirse kullanıcının uygulamada daha fazlasını görmek için dokunmasına izin verilmesi

Bunu yapmayın

Kartta ayrıntılı sayısal veya istatistiksel bilgiler gösterme