Mikro animasyon, bir işlemin başladığını, tamamlandığını veya bir öğenin etkileşimli olduğunu gösterebilir. Ancak her bölümü hareketlendirmek daha iyi deneyim anlamına gelmez. Hareket, kullanıcının dikkatini doğru noktaya yönlendirdiğinde faydalıdır; okumayı veya işlem yapmayı geciktirdiğinde yük haline gelir.
Hareketin görevini tanımlayın
Buton tepkisi, menü açılması ve kayıt bildirimi farklı amaçlar taşır. Her efekt için hangi bilgiyi verdiğini yazın. Yalnızca dekoratif olan hareketleri daha sınırlı kullanın. Kullanıcı aynı ekrana tekrar geldiğinde uzun giriş animasyonunu yeniden beklememelidir.
Yerleşimi oynatmadan animasyon yapın
Metinlerin yüklenirken aşağı kayması veya butonların konum değiştirmesi yanlış tıklamalara neden olabilir. Hareket planlanırken alanın önceden ayrılması önemlidir. Görsel yakınlaşması gibi efektler kartın dışına taşmamalıdır. Etkileşim tamamlandığında arayüz kararlı bir konuma dönmelidir.
Mobil ve düşük hareket tercihini düşünün
Fare üzerine gelme efekti telefonda bulunmaz. Temel bilgi yalnızca bu efektle gösterilmemelidir. Hareketi azaltma tercihi olan kullanıcılar için animasyonlar sadeleştirilebilir veya kaldırılabilir. Otomatik dönen içeriklerde kontrol ve durdurma ihtiyacı değerlendirilmelidir.
Performansı gerçek cihazda kontrol edin
Güçlü bilgisayarda akıcı görünen bir efekt düşük kapasiteli telefonda takılabilir. Uzun sayfalarda aynı anda çalışan hareketleri sınırlayın. Animasyon kapatıldığında sayfa hâlâ anlaşılır ve kullanılabilir olmalıdır. İyi mikro animasyon kendisini göstermekten çok, etkileşimi daha anlaşılır hale getirir.
Uygulama örneği
Bir kart yakınlaşması ve menü açılma efekti için hareketin verdiği bilgiyi yazın. Birincisi yalnızca dekoratif, ikincisi durum değişimini açıklıyor olabilir. Hareketi kapatıp aynı görevleri tamamlayın. Bilgi kayboluyorsa tasarımı yeniden düşünün. Mobil ve azaltılmış hareket tercihinde efektin daha sakin sürümünü kullanarak temel etkileşimin korunduğunu kontrol edin.
Son kontrol
Hareketin hangi bilgiyi verdiğini açıklayamıyorsanız animasyonu sadeleştirmeyi düşünün. Bir öğenin yüklenmesi, seçilmesi veya taşınması kısa bir geçişle anlaşılabilir; sürekli hareket ise dikkati dağıtabilir. Hareket azaltma tercihini destekleyin. Telefon gibi daha sınırlı cihazlarda performansı kontrol edin. Animasyon kaldırıldığında işlevin anlaşılır kalması, görsel etkinin temel etkileşimin yerine geçmediğini gösterir.