Android ayarları tasarım yönergeleri

Bu dokümanda, Android platform ayarlarını, GMS temel ayarlarını (Google Ayarları) tasarlayan herkes veya Android uygulaması için ayar tasarlayan tüm geliştiriciler için ilkeler ve yönergeler vurgulanmaktadır.

Tasarım ilkeleri

Etkili bir genel bakış sunun

Kullanıcılar ayar ekranlarına göz atıp her bir ayarı ve bunların değerlerini anlayabilmelidir.

Şekil 1. Ayarlar ve geçerli değerleri, üst düzey ekranda gösterilir.

Öğeleri sezgisel olarak düzenleyin

Sık kullanılan ayarları ekranın üst kısmına yerleştirin. Tek bir ekrandaki ayar sayısını sınırlandırın. 10-15'ten fazla öğe göstermek bunaltıcı olabilir. Bazı ayarları ayrı bir ekrana taşıyarak kolay anlaşılır menüler oluşturun.

Şekil 2. Genel ayarlar ekranın üst kısmındadır

Ayarların kolayca bulunmasını sağlayın

Bazı durumlarda, tek bir ayarı iki farklı ekranda kopyalamak yararlı olabilir. Farklı durumlar kullanıcıların bir ayarı değiştirmesine yol açabilir. Bu nedenle, ayarı birden fazla yere eklemek kullanıcıların bu öğeyi bulmasına yardımcı olacaktır.

Yinelenen ayarlar için ayar için ayrı bir ekran oluşturun ve farklı yerlerden giriş noktaları kullanın.

Şekil 3 ve 4. "Varsayılan bildirim sesi", hem "Bildirim" hem de "Ses" ekranında

Net bir başlık ve durum kullanın

Ayarlarınızın başlıklarını kısa ve anlamlı hale getirin. "Genel ayarlar" gibi muğlak başlıklar kullanmaktan kaçının. Başlığın altında, ayarın değerini vurgulamak için durumu gösterin. Yalnızca başlığı açıklamak yerine spesifik ayrıntıları gösterin.

Başlıklar şu şekilde olmalıdır:

  • Etiketinizdeki en önemli metni en başa yerleştirin.
  • "Yapma" veya "hiçbir zaman" gibi olumsuz kelimeleri, "engelleme" gibi nötr terimlerle anlatın.
  • "Bana bildir" yerine "Bildirimler" gibi kişisel olmayan etiketler kullanmayın. İstisna: Ayarı anlamak için kullanıcıdan bahsetmek gerekiyorsa birinci kişi ("I") yerine ikinci kişiyi ("siz") kullanın.

Başlıklarda kaçınılması gerekenler:

  • Belirlenme, değiştirme, düzenleme, değiştirme, yönetme, kullanma, seçme veya seçme gibi genel terimler.
  • Bölüm ayırıcısında veya alt ekran başlığında tekrarlanan kelimeler
  • Teknik jargon.

Sayfa türleri

Ayar listesi

Bu, en yaygın ekran türüdür. Birden fazla ayarın bir araya getirilmesini sağlar. Ayar listeleri; anahtarlar, menüler ve kaydırma çubukları gibi kontrollerin bir karışımı olabilir.

Bir kategoride birçok ayar varsa bunlar birlikte gruplanabilir. Daha ayrıntılı bilgi için Gruplandırma ve ayırıcılar bölümüne bakın.

5. Şekil. Ayar listesi örneği

Liste görünümü

Liste görünümü; uygulamalar, hesaplar, cihazlar ve daha pek çok öğenin listesini göstermek için kullanılır. Filtreleme veya sıralama kontrolleri ekrana eklenebilir.

6. Şekil. Liste görünümü örneği

Varlık ekranı

Varlık ekranı; uygulama, hesap, cihaz, kablosuz ağ gibi farklı bir öğenin ayarlarını sunmak için kullanılır.

Görsel olarak varlık üst tarafta bir simge, başlık ve alt başlıkla gösterilir. Bu ekrandaki tüm ayarlar bu varlıkla ilgili olmalıdır.

7.Şekil Uygulama bilgilerinde kullanılan Varlık ekranı örneği

8. Şekil. Storage'da kullanılan Varlık ekranı örneği

Ana ayar

Ana ayar, kablosuz bağlantı veya Bluetooth gibi bir özelliğin tamamı açılıp kapatılabildiğinde en iyi şekilde kullanılır. Kullanıcı, ekranın üst kısmındaki bir anahtarı kullanarak bu özelliği kontrol edebilir. Özelliği devre dışı bırakmak için ana ayar kullanıldığında diğer tüm ayarlar devre dışı bırakılır.

Bir özellik daha uzun bir metin açıklamasına ihtiyaç duyuyorsa, bu ekran türü daha uzun altbilgi metnine olanak tanıdığından ana ayar kullanılabilir.

Bir ayarın kopyalanması veya birden fazla ekrandan bağlanması gerekiyorsa ana ayarı kullanın. Ana ayar ayrı bir ekran olduğundan, aynı ayar için farklı yerlerde birden fazla anahtarın olmasını önlersiniz.

9. Şekil. Uygulama bildirimleri ekranında kullanılan ana ayar örneği; ana açma/kapatma düğmesi kapatıldığında bu uygulama için özelliğin tamamı kapatılır

Şekil 10. Ana açma/kapatma düğmesi kapalıyken Uygulama bildirimleri ekranında kullanılan ana ayar örneği

Radyo düğmesi seçim ekranı

Bu ekran, kullanıcının bir ayar için seçim yapması gerektiğinde kullanılır. Radyo düğmeleri, bir iletişim kutusunda veya ayrı bir ekranda gösterilebilir. Radyo düğmeleri, kaydırma çubukları, menüler veya anahtarlarla birlikte kullanılmamalıdır.

Radyo düğmesi ekranının üst kısmında bir resim, alt kısmında ise altbilgi metni olabilir. Her bir radyo düğmesinde bir başlıkla birlikte alt metin olabilir.

Şekil 11. Ayarlar listesinde radyo düğmeleri kullanılmamalıdır

Şekil 12. Ayarlarda radyo düğmelerinin doğru kullanımı

Bileşenler

Android 8.0'dan başlayarak işlem araç çubuğu, diğer ilgili işlemlerin yanı sıra arama ve yardım özelliklerini de sunar. Kullanıcılar bu menülerde gizlenmiş işlemleri keşfedemeyebileceği için taşma menüleri önerilmez.

Ekrana özgü işlem içermeyen araç çubukları için. Arama ve yardım işlemlerini göster.

Şekil 13. Arama ve yardım işlemlerini içeren araç çubuğu

Tek işlem içeren araç çubukları için: İşlemi aramadan önce sunun.

Şekil 14. Arama ve yardım işlemlerinden önce tek bir işlem içeren araç çubuğu

Birden fazla işlem içeren araç çubukları için: Birincil işlemi aramadan önce yerleştirirken gelişmiş işlemleri taşma menüsüne yerleştirin.

Tüm işlemler gelişmişse veya yalnızca küçük bir kullanıcı grubu için yararlıysa tüm işlemleri taşma menüsüne yerleştirmeyi düşünün.

Şekil 15. İşlemler için taşma menüsü içeren araç çubuğu

Varlık başlığı

Varlık başlığında yalnızca bir başlık veya alt metinli bir başlık gösterilebilir (alt metin için birden fazla satıra izin verilir). Aşağıdaki işlem isteğe bağlıdır. En fazla iki işlem yapabilirsiniz.

Şekil 16. Varlık başlığı

Simge ve başlık (Uygulama1) kısmı, başlığın (Uygulama bilgisi) altına kaydırılır.

Şekil 17. Buradaki uygulama bilgi başlığı, araç çubuğunun bir parçasıdır ve ekranın geri kalan kısmı altında kaydırılır

Başlık zorunludur. Ayrıca ayarın durumunu vurgulayan alt metin de göstermelisiniz. Simge kullanmak isteğe bağlıdır.

Başlık metnini kısa ve öz tutmaya çalışın. Başlıklar uzunsa kısaltılmak yerine bir sonraki satırda devam edebilir. Menüleri veya işlemleri uzun bastığınızda etkinleştirmeyin.

Örnekler:

Şekil 18. Simge, başlık ve alt metin içeren menü bağlantısı

19. Şekil. Başlık ve alt metin içeren menü bağlantısı

Şekil 20. Yalnızca başlık içeren menü bağlantısı

Simge, başlık, alt metin ve sağ tarafta ayrı bir isabet hedefi içeren menü bağlantısı

Diğer dokunma hedeflerinde tema rengi kullanılmalıdır.

Şekil 21. İki dokunuşla hedef menü örneği

Simge, başlık, alt metin ve istatistikler/numara/uyarı simgesini içeren menü bağlantısı

Yüzde ve süre gibi sayısal değerler alt metinle birlikte sağda gösterilmektedir. Aşağıda ise bir çubuk grafik gösterilmektedir.

Çoğunlukla sayısal değerler, kullanıcıların kolayca bakıp karşılaştırabilmeleri için sağda sunulur.

Şekil 22. Simge, başlık, istatistik ve grafik içeren menü örneği

Gruplandırma ve ayırıcılar

Bir ekranda birçok ayar varsa bunlar bir ayırıcıyla gruplandırılıp ayrılabilir. Eski Android sürümlerinin aksine ayırıcılar artık tek tek ayarları ayırmak yerine, ayarları bir grupta toplamak için kullanılmaktadır.

Bir gruptaki ayarlar yakından alakalıysa grup başlığı ekleyebilirsiniz. Grup başlığı kullanıyorsanız her zaman ayırıcı eklemeniz gerekir.

Şekil 23. Ayırıcılarla gruplandırılmış ayarlar

Geçiş yap

Simge, başlık ve alt metin ile değiştirme

Şekil 24. Simge, başlık ve alt metinle geçiş yap

Başlık ve alt metin ile değiştirme

Şekil 25. Başlık ve alt metinle değiştir

Yalnızca başlıkla geçiş yapma

Başlıklara sol tarafta bir simge eşlik edebilir.

Şekil 26. Yalnızca başlıkla değiştir

Liste öğesi artı anahtar

Liste öğesini bir anahtarla birleştirebilirsiniz. Dikey çizginin sol tarafına dokunmak bir bağlantı işlevi görür ve kullanıcıyı bir sonraki ekrana götürür. Sağ taraf, standart bir anahtar gibi davranır.

Sol taraftaki liste öğesi için bir başlık zorunludur. Simge ve alt metin isteğe bağlıdır.

Şekil 27. Liste öğesi ve bir anahtar

Kaydırma çubuğu

Kaydırma çubuğundaki simge isteğe bağlıdır.

28. Şekil. Kaydırma çubuğu

Ekran düğmesi

Olumlu işlemler tema rengini kullanır, olumsuz işlemler ise gridir. Uygulama açma, uygulama yükleme, yeni öğe ekleme gibi olumlu işlemler olumlu işlemler arasındadır. Verilerin temizlenmesi, uygulamanın yüklemesini kaldırma, öğelerin silinmesi vb. olumsuz işlemler olabilir.

29. Şekil. "Yüklemeyi kaldır" ve "Durmaya zorla" düğmeleri

30. Şekil. "Şimdi aç" için mavi düğme

Aşamalı açıklama (Gelişmiş)

Sık kullanılmayan ayarlar gizli olmalıdır. "Gelişmiş" seçeneğini yalnızca gizlenecek en az 3 öğe olduğunda kullanın.

Burada, alt metin gizlenen ayarların başlıklarını gösterir. Alt metin yalnızca tek satır olmalıdır. Ek metin üç nokta ile kısaltılır.

Şekil 31. "Ekran" ekranında kullanılan gelişmiş

Açılır menüler kullanılabilir, ancak ideal olarak bunun yerine bir iletişim kutusu veya radyo düğmesi seçim ekranı kullanmanız gerekir. Tek seçim için üç farklı kalıp olduğundan, ayarları basitleştirmek amacıyla bu işlem önerilir.

Gerekirse, ayarın basit seçeneklere sahip olduğu durumlarda açılır menüler kullanılabilir.

Şekil 32. Açılır menü

Onay kutusu

Mümkün olduğunda onay kutuları yerine anahtarları kullanın.

Onay kutuları kullanılabilir:

  • Uygulamaları kısıtlama veya bir hizmeti engelleme gibi olumsuz işlemler için.
  • Ekranda çok fazla anahtar olmasını önlemek için.

Şekil 33. Onay kutuları, bu ekrandaki anahtarların sayısını azaltmak için kullanılır

Ayarlarda bağlantı kullanılması önerilmez. Bağlantıları yalnızca kesinlikle gerekli olduğunda kullanın. Bağlantılarda altı çizili olmayan bir vurgu rengi kullanılmalıdır.

Şekil 34. Ayarlarda kullanılan bağlantı

Altbilgi metni, açıklayıcı içerik eklemek için kullanılabilir. Altbilginin üst kısmında her zaman bir ayırıcı olmalıdır. Altbilgi, ekranın alt kısmında gösterilir. Altbilgiler gerekirse bağlantı içerebilir.

35. Şekil. Altbilgi metni

Desenler

Veri

Kritik veriler, çubuk veya pasta grafik gibi bir grafikte gösterilebilir. Bu veriler, varlık başlığında gösterilebilir. Örnek olarak şunlar verilebilir: mobil veri ve depolama.

Kritik olmayan diğer veriler, normal bir liste görünümü kullanılarak sunulabilir.

Şekil 36. Depolama alanının gösterildiği örnek

37 Şekil. Ağı gösteren örnek

Kullanıcı eğitimi

Bazı özellikler için açıklama veya kullanıcı eğitimi gerekebilir. Metinle birlikte bir animasyon veya resim de kullanabilirsiniz. Animasyon veya resim ekranın üst kısmında sunulmalıdır. Altbilgi metni ise açıklama eklemek için kullanılabilir.

38. Şekil. Animasyon ve altbilgi metni kullanma ayarı

Formlar

Formda bir giriş alanı varsa normal iletişim kutusunu kullanın. Bu da kullanıcıların tek bir giriş girmesini kolaylaştırır.

Ancak, formda birden fazla alan varsa tam ekran iletişim kutusu kullanmayı düşünün. Böylece, alanların net bir desende ayarlanması için daha fazla ekran alanı sağlanır.

39. Şekil. Normal iletişim kutusuyla form

Arama sonuçları

Arama sonuçları, ayarın başlığını, alt metnini (varsa) ve içerik haritası konumunu gösterir.

Şekil 40. Arama sonucu