Görevler tamamlanana kadar devam et düğmesini gizlemeli miyim?

Web uygulamam aynı iş akışına sahip ve tüm form alanları girildiğinde etkinleştirilen Devam düğmesinin devre dışı bırakılmış bir sürümünü gösteriyoruz. Kullanıcı tüm bilgileri girmeden Devam düğmesine tıklarsa, açılır pencerede bir kullanıcı mesajı gösterilir, bu yüzden B'nin en iyi çözüm olduğunu düşünüyorum.

Seçenek A, kullanıcı için sinir bozucu olabilir, çünkü Devam'ı tıklayıp hata mesajı alabilirler. Devre dışı bırakılan Devam düğmesi, görevleri devam etmeden önce tamamlamaları gereken geleneksel bir görsel ipucu sağlar.

C seçeneği kullanıcı için kafa karıştırıcı olabilir, çünkü bir sonraki adım olduğunu veya devam edip edemeyeceklerini bilmezler. Ayrıca, birincil gezinme denetimlerini gizlemek iyi bir uygulama değildir Umarım bu yardımcı olur!

Bu bir anti-desendir malları görsel olarak devre dışı bırakmak, malları işlevsel olarak devre dışı bırakmak veya malları gizlemek. LÜTFEN yapmayın. Üçü için de bir dava açacağım.

Affordances'i devre dışı bırakmak veya gizlemek, özellikle çözümün aşırı mühendisliği söz konusu olduğundan, en büyük evcil hayvan tüylerimden biridir:

• Bir şeyi aralıklı olarak gizlemek veya devre dışı bırakmak her zaman ekstra mühendislik ve tasarım çabasıdır.
• İstemci tarafı veri doğrulaması, verilerin kaydedilmesinin (veya diğer sonuçların) başarısız olabileceği sayısız yoldan yalnızca biridir, bu nedenle istemci tarafı doğrulaması geçse ve şimdi düğmenizi “göster” ve “etkinleştir” olsanız bile, kullanıcı Devam öğesini tıkladığında hala bir hata olabilir ve yine de bu hatayı Güzel bir şekilde ele almanız gerekir. Örneğin, sunucu tarafı doğrulaması başarısız olabilir, bir ağ veya başka bir sunucu hatası olabilir, cihazda bir dosya sistemi hatası olabilir.
• Bazen istemci tarafı doğrulaması yanlış (eski veya hatalı) veya doğru zamanda düğmeyi "gösteremez" veya "etkinleştiremez". Bu, bir kullanıcı alt kümesini tamamen engeller ve bu tür bir hatayı tespit etmek zordur - genellikle bir kullanıcının destekle iletişim kurmasını ve bu bilgilerin onu düzeltebilecek kişilere geri akmasını beklersiniz.

Özetle, ekstra tasarım ve mühendislik çabanız değerden daha fazla risk oluşturmaktadır. Riskleri% 100 azaltabileceğinizi düşünseniz bile, aşağıda açıklandığı gibi hala bir anti-desendir.

----------------

En saldırgandan en az saldırgana:

Neden paranızı gizlemesiniz?

Her şeyden önce, neden bir şeyi gizlemelisiniz ? Bazı şeyleri gizlilik veya güvenlik amacıyla gizlemelisiniz. Peki neden buralarda güç var? İki amaca hizmet eder: uygulamanın faydası hakkında iletişim ve kullanıcının niyetlerini ve inançlarını uygulamaya iletmesi için bir mekanizma. Dolayısıyla, uygulamanızın yardımcı programını gizli veya güvenli hale getirmeye çalışmadığınız sürece siz uygunlukları gizlememelisiniz . Bu noktada, özel uygulama yapmaya çalışmadığınızı ve uygulamanızın Devam ediyor özelliğine sahip olduğunu güvence altına almadığınızı ve düğmeyi kalıcı olarak görünür yaptığınızı varsayalım. Bu noktada, bir malikanenin görünür olmasının avantajlarına dikkat edelim:

• Kullanıcı onu keşfedebilir - uygulamanın yetenekleri hakkında bilgi edinebilir.
• Uygulamanın yeteneklerini bilmek, onu kullanmak için motivasyon sağlar ve bu yetenekleri gerçekleştirme yolunda görevleri tamamlar. Örneğin. formu doldurmaya daha motive olurlar çünkü sonunda “devam edebileceklerini” bilirler.
• Deneyimli kullanıcılar onu nerede bulacağını biliyorlar ve - bu biraz komik - ama onu bulduğunuzu bilmek, bir nedenden dolayı şu anda kullanmanıza izin verilmese bile, kullanıcı deneyimi için gerçekten önemli ve tatmin edici. Bulamazsanız, taşınıp taşınmadığını veya belleğinizin başarısız olup olmadığını merak edersiniz ve genellikle bir süre etrafa bakıp sonunda uygulamaya olan güveninizi kaybedersiniz. Özelliği sildiler mi? Bu kırık mı? Birkaç ayda bir hareket edecekler mi?

Neden ekonomik olarak işlevselliği devre dışı bırakmıyorsunuz?

Önceki bölümde buna değindik. Bu, bir geleceğin ikinci amacına iner: kullanıcının niyetlerini ve inançlarını uygulamaya iletmesi için bir mekanizma olarak. Bu büyük bir karışıklık noktası. Tasarımcıların ve geliştiricilerin çoğu değer düşüklüğünde değer alır: tıkladığınızda “devam” yazan bir düğme devam eder veya tıkladığınızda “sil” yazan bir düğme silinir. Nihai hedef bu, ancak düğme bundan çok daha fazlası. Bir düğmeyi tıklatarak kullanıcı aşağıdakilerden birini veya birkaçını iletir:

• onlar bir eylem gerçekleştirmeyi planlıyorlar
  • Kullanıcının niyetini yakalamak düpedüz bir mucizedir. Bu bilgileri kesinlikle kendi yararınıza kullanmalısınız - elinizde hazır ve istekli bir kullanıcı var. Bunları huniden yönlendirin.
• onlar eylemin tıkladığında gerçekleşeceğine inanır
  • Kullanıcı size sadece düğmeyi tıklamak dışında başka bir taşıma yolu bulunmadığı bir şey aktardı: bu işlemi gerçekleştirme ölçütlerini yerine getirdiklerine inanıyorlar. Eğer yapmadılarsa, bu onlara rehberlik etmek için mükemmel bir fırsattır ve onlarla iletişim kurmak için en iyi zamandır, çünkü uygulama ile aktif olarak etkileşime girmektedirler.
• onlar inanıyorlar tıklamaları gerekiyordu
  • Belki farklı bir geçmiş deneyime sahip yeni bir kullanıcı olabilirler veya belki de internette yenidirler (şaka yok) veya belki bugün (veya her gün) biraz bulanıktırlar. Ama bir nedenden dolayı bu düğmeyi tıkladılar. Olmayacak ... ama yine de, bu onları başarıya yönlendirmek için mükemmel bir fırsat - açıkçası, bu düğmeyi tıklamak için kullanıcı arayüzündeki diğer tüm iletişimde ilerlediler. Düğme dikkatlerini çekti, bu yüzden dikkatlerini gerçekten yapmaları gereken şeye yönlendirin (düzeltmek için ne gerekiyorsa).

Son olarak, Neden parayı görsel olarak devre dışı bırakmıyorsunuz?

Çünkü engelli bir maliye, bir maliye değildir. Hiçbir şey yapmayan düğmelerin görsel stiliyle eşleşme sorununa gittiğiniz için, kullanıcıya hiçbir şey yapmadığını başarıyla bildirdiniz. Bu nedenle dikkatlerini çekmeyecek, tıklamaları gerektiğine inanmayacaklar, hiçbir şey yapacağına inanmayacaklar ve bu nedenle niyetlerini veya inançlarını iletmenin bir yolu olduğuna inanmıyorlar ( veya karışıklık) size. Sayfanın etrafında başka bir şey arayabilirler, ancak başka bir UX hatası veya kod hatası nedeniyle onu kaçırmaya devam ederse ne olur? Tıklamaya hazır olduklarına inandıkları düğmeyi tıklamak çok daha kolay ve daha hızlı olurdu ve daha sonra ne yapacakları konusunda net bir rehberlik verebilirsiniz. Diğer bir deyişle, kullanıcı düğmeyi tıklamak için “erken” değil arayüzde “kaybolur”.

Görevler zorunluysa ve yalnızca satın alma işlemine başlamadan önce bir ceketin rengini seçmek gibi deneyimi artıran özellikler için böyle olmalıdır, o zaman tavsiyem düğmenin görünür olması, ancak devre dışı bırakılması olacaktır.

Bu, isteğe bağlı olarak etiketleme alanlarının iyi bir şekilde kullanılması ve mesajlaşma ile birleştirildiğinde, kullanıcılarınızın adımları sorunsuz bir şekilde tamamlamalarına izin vermelidir.

Evet, insanları rahatsız etmek istemiyoruz, bu, kullanıcının beklenen sonucunun doğru olduğundan emin olmak için kontrolleri kullanmamamız gerektiği anlamına gelmez ve bir sürecin sonuna geldiklerinde rahatsız olmadıklarını ve bir eylemi tamamlamak için bir sayfaya dönmek zorunda kaldığımız halde, zorunlu olmasa bile uygulayamadık.

Çerçeve zorluğu: çoğu zaman, sizden şimdi ne istediğini bitirene kadar size ne soracağını (hatta görmenizi) sağlamayacak çok adımlı "sihirbaz" iş akışı kullanıcı dostu ve karanlık bir örüntüdür. Kullanıcıya, kendileri için yararlı olup olmayacağını veya tüm operasyonu gerçekleştirebileceklerini bilmeden önce bilgi vermeleri isteniyor gibi görünüyor - ortaya çıkabilir daha sonraki bir adımda ihtiyaç duyacakları ek bilgilere sahip değildir veya daha sonraki bir adımın devam edebilmek için uygun olmadıklarını söyleyecektir.

Doğru UX, her şeyi bir sayfaya koymak çok zorsa, aşağıdakileri yapan sayfalandırılmış bir işlemdir:

• tüm bilgileri girmeden serbestçe ileri ve geri hareket etmenizi sağlar
• bunu yapabileceğinizi netleştirir
• tüm süreci tamamlayabilmeniz için gereken bilgileri atladığınızda size açıklık getirir
• süreci terk ederseniz veya daha sonraya kadar bir kenara bırakırsanız kısmi çalışmanızın kaydedilip kaydedilemeyeceğini açıkça belirtir

Son zamanlarda tıp doktorlarının başvurmak için doğru tıbbi lisansları bulmalarına yardımcı olan benzer çok adımlı bir sihirbaz üzerinde çalıştım.

TL/DR: devre dışı bırakılmış düğme seçeneğiyle gittik.

Her soruya verilen yanıtın sonraki soruları yönlendirdiği aşamalı bir adım adım yaklaştığımızdan, 'Devam' CTA'sının her yanıttan sonra olması gerekiyordu. Bu akışla ilgili tüm soruların zorunlu olduğunu lütfen unutmayın.

Bunun için kullanıcı aşağıdaki iki yaklaşımı test ettik

1. Ne olursa olsun, 'etkin' durumunu gösteren etkin bir 'devam' düğmesi gösteriliyor.
2. Kullanıcı devam etmek için gerekli tek eylemi/seçimi yaptığında etkin hale gelen devre dışı bırakılmış bir 'devam' düğmesi gösteriliyor.

Üçüncü olarak 'Devam Et' CTA'sını gizleme seçeneğini test etmedik çünkü bunun aslında sistem durumunun yetersiz yansımasıyla sezgisel olmadığını düşündük.

Bulgularımız şöyleydi:

1. İkinci seçenek (ilgili oluncaya kadar düğmeyi devre dışı bırak), kullanıcılara odaklanılması gereken eyleme geçirilebilir alanlarda görsel bir ipucu sağladı.
2. Kullanıcılar (çok nadiren) devre dışı bırakılan düğmeyi tıklamaya çalıştıysa, devre dışı bırakılan (soluk) durumun sağladığı ipucu nedeniyle sezgisel olarak soruya geri döneceklerdi.
3. Düğmeyi her zaman etkin (seçenek 1) boyunca tutmak, ilgili soruyu gerçekten yanıtlamadan düğmeyi tıklayacakları ve ardından gelen hata iletisinin tereddüt ettiği ve yavaşlattığı için kullanıcıların kafasını karıştırdı.

Bu nedenlerle, seçenek 2 (devre dışı bırakılmış düğmeler) ile gittik.

Seçenek 2'ye giderken aklınızda bulundurmanız gereken bazı şeyler (devre dışı düğmesi)

1. Girişlerin metin girişleri değil, yalnızca kapalı kelime seçimleri (radyo düğmeleri, onay kutuları vb.) Olduğu akışlar için idealdir. Çünkü metin girişlerinde, makine 'Devam' düğmesini etkinleştirmek için formun gerçekten eksiksiz olup olmadığını bilemez.
2. Kullanıcılar soruyla etkileşime geçtiğinde düğme görünür olmalıdır, böylece kullanıcılar düğmenin durumunun değiştiğini görebilir.
3. Ayrıca, 'Devam Et' düğmesinin etkileşimini tutarlı kılmak için her bir aşamanın sadece 1 sorusu olan akışlar için idealdir. (yani: bir sonraki soruyu yalnızca devam düğmesine tıkladıktan sonra alırsınız).

Bu yardımcı olur umarım!

Bence ikinci yaklaşım yolumuz. Kullanıcı daha sonra nereye devam edebileceğini ve daha fazla adımın geleceğini zaten biliyor.

üçüncü yaklaşım da işe yarayabilir, bunun için bazı örnekler görmem gerekir. Gerçekten zarif olabilir, ancak kullanıcıyı şaşırtma tehlikesi vardır. Bence ikincisi tasarruflu, güvenilir ve kullanıcı dostu.

D seçeneği nerede? Düğmeyi etkin durumda gösterin ve devam edebilmeniz için formun doldurulması gerektiğini belirten talimatları da gösterin. Bu şekilde bir şeyin keşfetmesine izin verirsiniz. Kullanıcı talimatları okuyabilir (ve okumalıdır), ancak okumazsa, yine de düğmeyi tıklayıp daha sonra ne yapacağına dair geri bildirim alabilir.

Herhangi bir uyarı veya hata mesajı atmamanızı tavsiye ederim, ancak kibarca talimatları tekrar göstermeli veya yanıp sönmeli veya yapılması gerekenler hakkında ek bilgiler göstermem. Ekran okuyucular için, tıklamadan sonra ne olacağını bilmenin bir önceliği olduğundan aria-live=“assertive” Öğesini kullanmak isteyebilirsiniz.