- Yükleme ekranları, sistemin ne yaptığını görünür kılarak kullanıcı deneyimini iyileştirebilir.
- Uygun bir yükleme ekranı oluşturmak için dikkate alınması gereken birkaç nokta vardır.
- Tasarımdan önce yükleme sistemini incelemek gerekir.
- Yüklemenin kullanıcının girişini engelleyip engellemediği, ilerlemenin görülebilir olup olmadığı, ne kadar bilginin yüklendiği, mobil deneyimin nasıl olduğu gibi unsurlar.
- Pasif yükleme mi (sistemin önceden yüklemesi), yoksa aktif yükleme mi (kullanıcının eylemine göre yükleme) olduğu gibi.
- Bir kerede gösterilen miktara göre değişimler
- Karmaşık bileşenlerde tek tek göstermek daha iyi olabilir.
- Görece basit bileşenlerde yükleme tamamlandıktan sonra hepsini bir kerede göstermek daha iyidir.
- Bileşen sayısı fazlaysa lazy loading gerekir.
- Sonsuz kaydırma, daha fazla göster düğmesi, sayfalama gibi yaklaşımlar kullanılabilir.
- Sıklığa göre değişimler
- Sürekli değişiyorsa, yüklemeyi gösteren UI en aza indirilmelidir.
- Gerçek zamanlı kaydetme yapan Google Drive arayüzü buna örnek alınabilir.
- Ara sıra değişiyorsa, bunu kullanıcıya hemen göstermek daha iyidir.
- İzlenen içeriğin güncellendiğini ve ekranın yenilenmesi gerektiğini bildiren bir açılır pencere gibi.
- Süreye göre değişimler
- Önce, ilerlemenin açıkça bilinebilir olup olmadığı ya da belirsiz olup olmadığı değerlendirilmelidir.
- 0,1 saniyenin altındaysa
- Sonuç doğrudan gösterilebilir.
- Bazı durumlarda sahte bir yükleme ekranı göstermek daha iyi olabilir.
- İş kullanıcının algısında önemliyse (kaydetme gibi) veya kullanıcının aksiyon alabilmesi için kısa bir gecikme gerekiyorsa (e-posta gönderiminde geri al düğmesi gibi).
- 0,1 saniye ile 1 saniye arasındaysa
- Bu çok yaygın bir gecikme aralığıdır ve kullanıcının dikkatini çekmez; bu yüzden yükleme ekranı eklememek daha iyidir.
- 1 saniyeden uzunsa
- 1 saniyeyi aşan anda kullanıcı bekleme süresini fark eder, bu yüzden uygun bir yükleme ekranı eklemek iyi olur.
- Yüklenen bileşen küçükse loading spinner iyi bir seçimdir. (dosya yükleme gibi)
- Ekran değişiyorsa skeleton loading ekranı uygundur.
- Görsel ana içerikse, baskın renkleri çıkarıp bulanıklaştırmak çok iyi bir yöntem olabilir.
- 2 saniye ile 10 saniye arasındaysa
- "Yaklaşık 5 saniye sürecek" gibi bir zaman göstergesi etkili olabilir.
- İlerleme çubuğu her zaman iyi bir seçimdir.
- Birkaç adımdan oluşuyorsa, bu adımları göstermek de bir yöntemdir.
- Net adımlar olmasa bile genel mesajlar kullanılabilir. (sunucuya bağlanılıyor gibi)
- 10 saniyeden uzunsa
- İlerleme açıkça bilinebiliyorsa yüzde ve kalan süre gibi bilgileri göstermek iyidir. (dosya yüklemede %50 gibi)
- Ancak %99'da takılı kalmak çok yıkıcıdır; böyle bir ihtimal varsa başka bir yöntem kullanılmalıdır.
- Daha uzun sürüyorsa ve ilerleme açıkça bilinemiyorsa, işlem tamamlandığında e-posta gibi bir yolla haber verileceğini söylemek ve kullanıcıya kontrol imkanı tanımak iyi olur.
- İşlemin tamamen arka planda yürütülmesi ve kullanıcının hiçbir eylemini engellememesi de iyi bir yaklaşımdır. (Google Drive'ın yükleme ilerleme durumu gibi)
3 yorum
Güzel yazı, teşekkürler.
. Ben 250 ms'ye kadar göstermiyorum ama bunun 1 saniyeye kadar uzamasının da uygun olup olmayacağından emin değilim
Ah, ben de tam yükleme ekranıyla ilgili dayanak arıyordum! Teşekkürler haha
Özet biraz fazla uzamış gibi... Yine de iyi içerik çok olduğu için elimden geldiğince taşımaya çalıştım.
Sahte yükleme ekranları olursa güvenilirliğin arttığı yönündeki kısım ilginç. Hacker News tarafında da bu konu epey konuşuluyordu.