Kısa cevap
Mikro etkileşim, belirli bir küçük eyleme veya durum değişimine verilen odaklı arayüz davranışıdır.
Nerede işine yarar?
Tetikleyici, davranış ve geri bildirim birlikte düşünülür. Kaydetme onayı, yükleme durumu veya açılır kontrolün değişimi bir işin durumunu görünür kılabilir. Etkileşim klavye ve azaltılmış hareket tercihinde de anlaşılabilir kalmalıdır.
Tanımdan uygulamaya, kendi denemene.
Bir cümlede uygulaması
Kaydet düğmesinin işlem boyunca yükleniyor, sonunda kaydedildi durumunu göstermesi.
Neyle karıştırılmamalı?
Mikro etkileşim süsleme değildir; kullanıcının eyleminin sonucunu anlamasına yardımcı olur.
Kaydet düğmesinden sonra gelen sessizlik
Bir okuma uygulamasında kişi yazıyı daha sonra okumak için kaydediyor. Parmağı düğmeden ayrılıyor, fakat görünürde hiçbir şey değişmiyor. Kayıt aslında başarılı olabilir; yine de kişi işlemin gerçekleştiğini bilmiyor. Bir daha basıyor, belki bu kez kaydı kaldırıyor. Bu küçük belirsizlik, mikro etkileşimin neden yalnız süslü bir animasyon olmadığını gösterir. Tetikleyici, sistemin kararı ve görünen karşılık aynı davranışın parçalarıdır. Amacımız bir varsayımsal uygulama üzerinden doğru geri bildirimin nasıl kurulacağını incelemek; belirli bir ürünün kullanıcı verisini anlatmak değildir.
İlk karar düğmenin görünümü değildir. Kaydın hangi anda başarılı sayılacağı belirlenmelidir. Ağ yanıtı gelmeden işlem tamamlandı gibi gösteriliyorsa hata durumunda ne olacağı açıklanır. Yanıt bekleniyorsa kullanıcı düğmenin çalıştığını fark edebilmelidir. ‘Kaydediliyor’ ve ‘Kaydedildi’ aynı durum değildir. İşlem başarısız olduğunda önceki görünümün geri gelmesi, kısa bir açıklama ve yeniden deneme olanağı gerekebilir. Görsel tepkinin hızını artırmak için gerçeği yanlış anlatmak, deneyimi geçici olarak akıcı gösterse de güveni zayıflatır.
Geri bildirim birden çok kanalla anlaşılabilir. İkonun dolması, etiketin değişmesi ve uygun bir durum bildirimi birbirini tamamlar. Renk değişikliği tek başına yeterli olmayabilir; renkleri ayırt edemeyen ya da ekran okuyucu kullanan kişi de ne olduğunu anlayabilmelidir. Bunun için bütün ekrana büyük bir başarı penceresi açılması gerekmez. Mesajın önemiyle orantılı, mevcut odağı bozmayan bir karşılık seçilebilir. Düzenin aniden büyüyüp küçülmesi ve yakınındaki düğmelerin yer değiştirmesi de geri bildirimin maliyetidir. Küçük hareket büyük bir yerleşim sorunu üretmemelidir.
İyi tasarlanmış mikro etkileşim tekrar kullanıma da dayanır. Bir kez etkileyici duran uzun kutlama, her kayıt işleminde yorucu olabilir. Kullanıcının art arda yaptığı işlemler, yavaş bağlantı, yanlışlıkla basma ve geri alma yolu birlikte düşünülür. Kaydetme eylemi geri alınabiliyorsa bunu anlaşılır kılmak, her tıklamadan önce onay istemekten daha doğal olabilir. Ancak silme, ödeme veya dışarıya gönderme gibi etkisi farklı işlemler aynı davranışı otomatik devralmaz. Küçük kontrolün tasarımı, yaptığı işin gerçek sonucuyla uyumlu olmak zorundadır.
Küçük geri bildirimlerin dili de markanın karakterini taşır. Bununla birlikte önemli bir hatayı şakaya dönüştürmek, kullanıcının ne yapacağını anlamasını zorlaştırabilir. Bir kayıt sorunu için açık açıklama, gerekirse kısa bir yeniden dene eylemi ve mevcut bilgilerin korunması daha yararlı olabilir. Ton, kullanıcının o andaki ihtiyacına göre değişir. Mikro etkileşimin metni, görsel durumuyla aynı şeyi söylemelidir; başarı rengiyle gösterilen hata veya kaydedilmemiş bilgiye verilen onay, tasarım ile sistem arasındaki güveni zedeler.
Süs tepkisi mi, durum bilgisi mi?
Her basışta parlayan düğme
Düğme her etkileşimde aynı parlamayı gösterir; kayıt başarılı olsa da hata verse de sonuç değişmez. Kullanıcı hareket gördüğü için bir şey olduğunu bilir, fakat ne olduğunu bilemez. Bu tepki basışı hissettirebilir, ancak işlem sonucunu temsil etmez. Üzerine rastgele bir onay ikonu eklemek de veri kaydedilmeden başarı iddiası üretir.
Gerçek davranışa bağlı karşılık
Kontrol önce basışı, sonra işlem sonucunu anlaşılır biçimde gösterir. Bekleme sırasında etiket işi anlatır; sonuç başarılıysa kaydedilmiş durum kalır. Hata olduğunda metin sorunu ve sonraki adımı açıklar. Kısa ışık veya ikon hareketi bu bilgiyi destekler. Tasarımın doğruluğu, animasyonun güzelliği kadar sistemde gerçekten ne olduğuna bağlıdır.
Geri bildirimi doğru ana koymak
Bir mikro-etkileşim kullanıcının yaptığı işlemin algılandığını açıklayabilir. Kaydetme, açma veya seçme eyleminden sonra görülen küçük değişim, belirsizliği azaltır. Geri bildirim işlemin başarı durumuyla uyumlu olmalı; sunucu yanıtı gelmeden kalıcı başarı varmış gibi davranmamalıdır.
- Tetikleyiciyi ve gösterilecek durumu belirle.
- Bekleme, başarı ve hata hallerini ayır.
- Hareket olmadan da aynı bilginin okunmasını sağla.
Hover efekti tek başına yeterli mi?
Dokunmatik ve klavye kullanıcıları hover durumuna güvenemez. Bir öğenin tıklanabilirliği varsayılan görünümünde anlaşılmalı, odak durumunda da karşılık bulmalıdır. Hover bu bilgiyi güçlendirebilir fakat onun yerine geçmez.
İşin içinde sorulacaklar.
Hover bir mikro etkileşim sayılır mı?
Evet, bir kontrolün etkileşime hazır olduğunu anlatan sınırlı davranış olarak düşünülebilir. Fakat hover olması kontrolün işlevinin açık olduğu anlamına gelmez. Dokunmatik kullanıcı hover yaşamaz; klavye kullanıcısı odak göstergesine ihtiyaç duyar. Bu yüzden hover, zaten anlaşılır bir kontrolün ek geri bildirimi olmalı; tek başına onun tıklanabilirliğini veya anlamını ortaya çıkarmamalıdır.
Her işlemden sonra bildirim göstermek gerekir mi?
Hayır. Bazı sonuçlar kendi yerinde görünür: seçili filtre, kaydedilmiş ikon veya güncellenen liste gibi. Aynı sonucu ikinci bir bildirimle tekrarlamak gereksiz olabilir. Mesajın kaybolması halinde kişinin durumdan hâlâ emin olup olmayacağına bakılır. İşlem ekranın başka bir yerinde tamamlanıyorsa daha belirgin bir bildirim gerekebilir; tercih bağlama göre yapılır.
Mikro etkileşim dönüşümü artırır mı?
Belirsizliği ve hatalı tekrarları azaltmaya yardımcı olabilir; bunun her üründe aynı ölçüde ticari sonuç yaratacağı söylenemez. Önce hangi problemi çözdüğünü tanımlamak gerekir. Kişiler kayıt düğmesine tekrar basıyor mu, sonucu anlamıyor mu, hata sonrasında takılıyor mu? Ölçüm ve gözlem bu sorulara odaklanırsa görsel tepkiyle iş sonucunu birbirine karıştırmadan değerlendirme yapılabilir.
Bir kontrolün bütün hikâyesini çiz
Kendi sitenden kaydetme, takip etme veya tercih değiştirme gibi küçük bir işlem seç. Sadece ilk ekranını değil, kullanıcının kontrolle kurduğu kısa ilişkinin tamamını incele. Gerçek kullanıcı bilgisi toplamadan kurgusal içerikle çalışabilirsin.
Bir mikro etkileşimi tamamlayan şey zıplayan ikon değil, kullanıcının ‘ne oldu ve şimdi ne yapabilirim?’ sorularına aldığı karşılıktır. Hareketi kapattığında da bu cevap görünür kalıyorsa tasarımın taşıyıcı kısmı yerindedir.
Bağlantılı kavramlar
- Motion designMotion design, grafik öğelerin zaman, hareket ve ritim üzerinden anlam taşımasını tasarlamaktır.
- Mikro metinMikro metin, düğme, form etiketi, hata ve durum mesajı gibi bir etkileşimi anlaşılır kılan kısa arayüz metnidir.
- Azaltılmış hareketAzaltılmış hareket, hareket yoğunluğunu azaltmayı tercih eden kullanıcıların ayarını dikkate alan arayüz yaklaşımıdır.