Mikro Etkileşimler: Ne Zaman Yardım Eder, Ne Zaman Yavaşlatır

Mikro etkileşim, arayüzde tek bir işi olan küçük geri bildirimdir: butona basınca gelen tepki, forma yazarken beliren uyarı, işlem bitince görünen onay. Kullanıcının sistemin ne yaptığını anlayabildiği tek yer çoğu zaman burasıdır. Ama yanlış zamanlanmış bir tanesi arayüzü olduğundan yavaş gösterir, ve bu en sık atlanan kısımdır.

Dört parça

Dan Saffer'ın Microinteractions kitabında kurduğu ayrım hâlâ en kullanışlısı: tetikleyici, kurallar, geri bildirim, döngü ve modlar. Tetikleyici kullanıcı hareketi ya da sistem olayıdır. Geri bildirim görülen, duyulan veya hissedilen yanıttır. Döngü, etkileşimin ne kadar sürdüğünü ve tekrarlanıp tekrarlanmadığını belirler.

Atlanan parça hep aynısı: kurallar. Kalp simgesinin dolması geri bildirimdir; ürün zaten favorilerdeyse ne olacağı, kullanıcı giriş yapmamışsa ne olacağı, istek başarısız dönerse simgenin ne göstereceği kurallardır. Tasarım dosyasında yalnızca dolu ve boş kalp varsa o etkileşim tasarlanmamış demektir.

Zamanlama geri bildirimin kendisinden önemli

Tepki süresi eşikleri elli yıldır aynı ve hâlâ geçerli. 100 ms'nin altındaki yanıt anında hissedilir. Bir saniyeye kadar olan gecikmede kullanıcı düşünce akışını korur, ama sistemin çalıştığını görmek ister. On saniyeyi geçtiğinde dikkatini tamamen başka yere verir.

Buradan çıkan sonuç sezgiye ters: 200 ms süren bir işlem için spinner göstermek arayüzü yavaşlatır. Kullanıcıya, olmayan bir beklemeyi haber vermiş olursun, üstelik simge belirip kaybolurken ekranda bir titreme bırakır. Doğrusu, göstergeyi 300 ila 500 ms geciktirmektir: hızlı yanıtlar hiç gösterge görmez, yavaş olanlarda gösterge tam gerektiği anda çıkar.

Belirsiz süreli işlemlerde ilerleme çubuğu kullanma. Yüzde göstermeyen ama dolan bir çubuk, veremeyeceğin bir söz veriyor.

Beklemeyi arayüze yansıtma

Favorileme, beğenme, kaydetme gibi işlemlerde sık yapılan hata, animasyonu sunucu yanıtına bağlamaktır. O anda kalp simgesi bir geri bildirim olmaktan çıkıp gecikme ölçeri olur: aynı buton kimi zaman anında, kimi zaman yarım saniyede tepki verir, kullanıcı da tıklamanın işleyip işlemediğini anlayamaz.

Durumu hemen değiştir, isteği arkada gönder, başarısız olursa geri al ve sebebini yaz. Bu işlemlerin başarısızlık oranı zaten çok düşük, dolayısıyla nadir durumu kural haline getirip her tıklamayı bekletmek yanlış takas.

Hata önleme: doğrulamanın zamanı

Şifre kurallarını yazarken canlı göstermek doğru bir örnek, çünkü şifre yazılırken kısmen geçerli olabilir: sekiz karaktere ulaşınca ilgili madde işaretlenir, kullanıcı ilerlediğini görür.

Aynı yaklaşım e-posta alanında ters çalışır. Kullanıcı henüz "ali@" yazmışken "geçersiz e-posta" uyarısı doğrudur ama gereksizdir, ve yazma boyunca kırmızı kalır. Kısmen doğru olamayan alanlarda doğrulamayı alandan çıkışta yap, düzeltmeyi ise yazarken göster. Hata mesajı da alanın yanında dursun: formun üstündeki toplu hata listesi, uzun formlarda kullanıcıyı sorunlu alanı aramaya mecbur bırakıyor.

Hareket herkes için nötr değil

Mikro etkileşim erişilebilirliği genellikle renk körlüğü ve işitme kaybıyla anlatılır. Oysa animasyonun doğrudan etkilediği grup başka: vestibüler bozukluğu ve hareket duyarlılığı olan kullanıcılar. Kayan geçişler, paralaks ve büyüyerek açılan kutular bu kişilerde baş dönmesi ve mide bulantısı yaratabiliyor.

İşletim sistemlerinin bunun için bir ayarı var ve tarayıcıya prefers-reduced-motion ile ulaşıyor. Bu ayar açıkken hareketi tamamen kaldırmak gerekmiyor, yer değiştiren animasyonu kısa bir opaklık geçişiyle değiştirmek yetiyor.

İkinci kural: hiçbir geri bildirim yalnızca harekete ya da yalnızca renge yaslanmasın. Titreyen bir alan ekran okuyucuda hiçbir şey değildir. Durum değişikliği metinde de karşılığını bulmalı.

Markanın payı ne kadar

Xbox'ın açılış sesi ya da iMessage'daki balon efekti gerçekten iz bırakıyor, ama ikisinin de ortak özelliği nadir olması. Marka kişiliği taşıyan etkileşimler ilk açılış, tamamlanan bir satın alma, uzun bir kurulumun sonu gibi tek seferlik anlara aittir.

Kullanıcının günde kırk kez bastığı butona karakter yüklemek ise ürünü yavaşlatır. Orada doğru davranış, fark edilmeyecek kadar sade olmaktır. Bir mikro etkileşimin başarı ölçüsü hatırlanması değil, kullanıcının onu hiç fark etmeden doğru şeyi yapmış olmasıdır.