Mobil açılır formlar için daha iyi bir seçim
Bu makale @SKYUI tarafından çevrildi ve yayınlandı. Herkes bir ürün yöneticisidir. Asıl yazar Zoltan Kollin'dir. Orijinal başlık: "Mobil Açılır Formlar için Daha İyi Bir Seçim". İzinsiz olarak yeniden basılması yasaktır.
Formdaki açılır menülerin kullanımı önemli görünmüyor: Kullanıcı arayüzünde çok az yer kaplıyorlar, girişi otomatik olarak doğrularlar, tüm tarayıcılar ve platformlar onları destekleyebilir, uygulanması kolay ve rahattır ve kullanıcılar ne kadar iyi olduklarını bilirler .
Aynı zamanda, Luke Wroblewski ve bazı kişilere göre, açılır menü (veya seçim) en sık kullanılan tablo modlarından biridir, "son kullanıcı arayüzü olmalıdır".
Şimdi bazı sınırlamalara ve endişelere bir göz atalım:
- Açılır listede, onu yalnızca veya düğmesine tıklayarak açabilirsiniz ve mevcut seçenekler görünmez. Ek olarak, formun uzunluğu ilk bakışta gizlenebilir, bu da kullanıcıların açılır menünün 2 veya 50 öğe içerip içermediğini tahmin edemeyeceği anlamına gelir.
- Açılır listeden bir seçeneği belirlemek (özellikle mobil cihazlar için) çok adımlı bir işlemdir: seçenekler listesini açmak için açılır menüyü tıklamanız, ardından bir öğeyi seçmek için kaydırıp taramanız ve ardından açılır listeyi kapatmanız gerekir.
- Açılır menü tasarımcıyı tembelleştirecektir: olası tüm seçenekleri açılır listeye herhangi bir öncelik olmadan eklemek (bu hamburger menüsüne benzer) çok basittir.
- Ülke seçicileri gibi daha uzun açılır listeler, özellikle klavye aramalarının genellikle mümkün olmadığı telefonlarda kabus taraması olabilir.
- Bazı mobil ekranlarda, görünür ve kaydırılabilir liste alanı çok küçüktür ve kaydırma seçenekleri rahatsız edici olabilir:
(İOS'ta, görünür seçeneklerin sayısı ilk bakışta şaşırtıcı derecede düşüktür)
Çoğu durumda, sizin için daha iyi çalışabilecek birçok alternatif giriş denetimi vardır.
Seçeneklerin sayısını düşünün
İkili (açık / kapalı) kararlar için açılır menü çok kötü bir seçimdir. İhtiyacınız olan şey bir onay kutusu veya geçiş anahtarıdır.
(Açılır listeniz yalnızca "evet / hayır" veya "açık / kapalı" seçeneklerini içeriyorsa, lütfen bunun yerine basit bir anahtar kullanın)
Birbirini dışlayan birkaç seçenek için, mevcut tüm seçeneklerin listeyi açmadan görülebilmesi için radyo düğmelerinin veya bölümlere ayrılmış kontrollerin kullanılması önerilir.
(Parçalı kontrol, hem seçilen seçeneği hem de alternatif seçeneği görüntüler)
(Görsel seçeneklerin sayısı ekran genişliğine ve seçenek etiketinin uzunluğuna bağlıdır, 5 öğeden fazla kullanılması tavsiye edilmez)
Çok sayıda belirtilen seçenek için, kullanıcılar ne aradıklarını bildiklerinde, ilk veya iki harften sonra filtreleme seçeneklerinin bir listesinin görüntülendiği "yazmaya başla ..." çözümünü düşünün.
(Listeyi kaydırmadan, kullanıcının yazmaya başlamasına ve yalnızca filtrelenmiş seçenekleri görüntülemesine izin verin)
Büyük ve çeşitli listeler için, bu seçeneğe öncelik vermek için mevcut kullanıcı verilerini kullanmayı deneyin ve kullanıcılar tarafından tercih edilen en popüler seçenekleri listeleyin. Bu şekilde, kullanıcıların% 90'ı tercihlerini hemen bulacak ve yalnızca% 10'u "diğer" i seçip sonraki soruda belirtmelidir.
("Diğer" şık bir çözüm olmasa da, böyle bir öncelik çoğu kullanıcı için kullanıcı deneyimini iyileştirebilir)
Beklenen girdiyi düşünün
Açılır listenin avantajlarından biri, kullanıcının çok fazla yazmasına gerek olmamasıdır. Ancak beklenen girdi çok uzun değilse ve sık soruluyorsa (örneğin, kişisel veriler), listeden seçmek yerine yazmak genellikle daha kolaydır:
(Kaydırma aygıtında doğum yılını girmek için sayısal klavyeyi kullanmak, uzun bir listede gezinmekten daha kolaydır)
Kısacası, bir mobil cihazın sayısal tuş takımına sayısal değerler girmek genellikle daha etkilidir.
(Sayı açılır listesinin sıralama düzeni açık olsa da, kaydırmaya göre yazmak daha kolay olabilir)
Kullanıcı girdisinin doğrulanması çok önemliyse, "yazmaya başla ..." yöntemi, mevcut seçenekleri filtrelemek için girdi alanlarını kullanmak için yararlıdır.
(ABD'nin durumunu belirtirken, filtrelemek için bir harf girmeniz yeterlidir)
Elemanların sıralama düzeni net olmadığında, seçenek listesinde arama yeteneği çok yararlıdır.
(Para birimlerinin sıralama düzeni kullanıcılar için net olmayabilir, bu nedenle ada ve para birimi koduna göre arama yaptıklarından emin olun)
Aynı teknik güzel bir ülke listesine uygulanmalıdır: 200'den fazla öğe listelemek yerine, kullanıcıların mümkün olduğunca hızlı bir şekilde yazmaya başlamasına ve sonuçları filtrelemesine izin verin.
Miktarı temsil eden tahmini değer için (yolcu sayısı veya alışveriş sepetindeki ürün sayısı gibi), step, kullanıcının tek bir tıklama veya düğme ile miktarı hızlı bir şekilde artırmasına veya azaltmasına olanak tanır.
(Sayısal aralık dahilindeki tahmin edilmeyen ve tahmin edilen değerler için kaydırıcıyı kullanmayı düşünün.)
(Minimum ve maksimum değerlerin sayısal aralığını görüntülemek, bağlamın anlaşılmasına yardımcı olur)
Çoklu seçim menülerinde tarih seçmek dayanılmaz bir deneyim olabilir, bu nedenle en yakın tarihi girin ve her zaman tarih seçiciyi kullanın. (Ama doğum tarihini girmek için kullanmayın!)
Daha akıllı açılır listeler tasarlamayı düşünün
Açılır menülerden her zaman kaçınılmamalıdır. Seçim menüsü en uygun giriş kontrolü olduğunda, bunu mümkün olduğunca kullanıcı dostu yapmanız gerektiğini göreceksiniz.
- Anlamlı etiketler kullanın : Liste açık olsa bile menü etiketinin açıklaması açıkça görülmelidir. Seçim menüsünde, kullanıcıya neyi seçtiklerini söylemek için açıklayıcı etiketleri kullanın (yani, "lütfen seçin" yerine "türü seçin").
- Ürünleri makul bir şekilde dağıtın : Kullanıcı verilerine göre, en popüler seçenekleri listenin en üstüne koymaya çalışın. Veya varsayılan olarak en popüler olanları önceden seçin.
- Akıllı varsayılanları kullan : Telefon ve tarayıcı, kullanıcının yerini, tarihini ve diğer birçok bilgiyi bilir. Her kullanıcı için en olası seçeneği önceden seçmek için bu verileri kullanın.
- Bilgisayarın çalışmasına izin vermek için alanların sayısını azaltın : Kullanıcı posta kodunu girerse, bilgisayar şehri ve eyaleti bilir - hiçbir gereksinim gerekmez. Kullanıcı kredi kartı numarasını girerse, bilgisayar bunun bir MasterCard olduğunu bilir - herhangi bir gereksinim gerekmez.
- API kullanmayı düşünün : Kaydolmak için Facebook'un Bağlan düğmesini kullanmak, kayıt formunu doldurmaktan daha kolaydır. Paypal ile ödeme yapmak, kredi kartı verilerinizi girmekten daha kolaydır.
