Dokunmaya Tepki Veren Evcil Hayvan Etkileşim Animasyonu Nasıl Planlanır?
Animasyonu kısa bir neden-sonuç dizisi olarak planlayın: parmak basışını anında onaylayın, evcil hayvanın tepkisini gösterin ve ardından hazır duruma geri dönün. Bir dokunmanın ne anlama geldiğine karar verin, bu anlama uyan ve kolay anlaşılan tek bir hareket seçin ve zamanlamayı cihaz üzerinde test edin. Duyarlı bir animasyon, daha fazla hareket eklemekten ziyade ilk görünür değişikliğin gecikmeden gelmesi ve tüm dizinin dokunmayla bağlantılı hissettirmesiyle ilgilidir.
1. Dokunmanın neyi iletmesi gerektiğini tanımlayın
Poz taslakları çizmeden önce tek cümlelik bir etkileşim kuralı yazın: "Dokunulduğunda, evcil hayvan kişiyi fark eder ve kısa bir selamlamayla yanıt verir." Dokunmanın sonucunu tutarlı tutun. Aynı dokunma bazen karakteri besliyor, bazen onunla oynuyor, bazen de selamlıyorsa, animasyon ne olduğunu güvenilir bir şekilde belirtemez.
Girdiyi iki ana ayırın: parmağın basılması ve parmağın kaldırılması. Parmak basıldığında basılı durumundaki küçük bir değişiklik hedefin algılandığını doğrular; parmak kaldırıldığında dokunma kabul edildiğinde evcil hayvanın ana tepkisi takip edebilir. Apple'ın duyarlılık kılavuzu, dokunmatik ekran basmalarını ve bırakmalarını ayrı görsel tepkilere sahip bağımsız etkileşimler olarak tanımlar. Bu ayrım, daha büyük karakter animasyonunun tamamlanması daha uzun sürse bile dokunmanın algılandığının hissedilmesine yardımcı olur. Kullanıcı arayüzü duyarlılığını anlama
2. Net bir görsel anlaşırlığa sahip bir tepki seçin
Karakterin görüntülendiği boyutta niyeti ileten tek bir birincil hareket seçin. Bir selamlama, gözlerin çevrilmesi ve ardından başın hafifçe eğilmesiyle gösterilebilir; oyuncu bir onaylama ise hızlı bir vücut sıçraması kullanabilir. Bunlar tasarım örnekleridir, kural niteliğindeki şablonlar değildir. Karakter küçük olduğunda bile tanınabilir kalan bir siluet veya yüz değişikliğini tercih edin ve izleyici ilkini anlayamadan birden fazla hareketi art arda yığmaktan kaçının.
Tepkiyi hazırlık (anticipation), eylem (action) ve yatışma (settle) aşamalarından oluşturun. Hazırlık, dokunulan konuma doğru kısa bir bakış olabilir. Eylem, belirleyici jesttir. Yatışma ise ani bir sıçrama olmadan rahat bir bekleme pozuna geri döndürür. Bu sekans, geri bildirimi gerçekçi, kısa ve kesin kılmaya yönelik platform yönergelerinden çıkarılan pratik bir tasarım sonucudur: hareket, eylemle rekabet etmemeli, onu güçlendirmelidir. Apple İnsan Arayüzü Yönergeleri: Hareket
3. İlk karenin dokunmayı onaylamasını sağlayın
İlk görünür değişiklik, tepkinin toplam uzunluğundan daha önemlidir. Başlangıç niteliğinde bir tasarım tercihi olarak, basma anında karakterin veya dokunma hedefinin hemen değişmesini sağlayın (hafif bir ezilme, parlama veya göz hareketi yoluyla); ardından bırakma sonrasında dışavurumcu tepkiye geçiş yapın. Tam zamanlamayı evrensel bir sayı olarak değil, bağlama göre ayarlanacak bir unsur olarak ele alın.
Animasyon yalnızca varlıklar yüklendikten, uzak veriler kontrol edildikten veya ilgisiz işler tamamlandıktan sonra başlıyorsa, etkileşim kaçırılmış gibi görünebilir. Mümkün olduğunda onaylamayı yüksek kaynak tüketen işlerden bağımsız tutun. Apple, ayrık etkileşimlerdeki fark edilir gecikmeyi donma (hang) olarak belgeler ve bunu akıcı hareketteki kesintiler olan takılmalardan (hitch) ayırır. Pratikte, hem karakterin gecikmeden tepki vermeye başlayıp başlamadığını hem de başladığında sorunsuzca hareket edip etmediğini kontrol edin. Kullanıcı arayüzü duyarlılığını anlama
4. Süreyi ve yumuşatma eğrisini amaca göre seçin
İzleyicinin tepkiyi ayırt etmesine ve yatışmasını görmesine olanak tanıyan en kısa sekansı kullanın. Hızlı bir kulak seğirmesi çabucak tamamlanabilir; başın dönmesi ise anlaşılmak için zamana ihtiyaç duyar. Animasyon hantal hissettiriyorsa, her pozu sıkıştırmadan önce belirleyici hareketinden önceki gecikmeyi kısaltın. Ani veya sert hissettiriyorsa, uzun bir duraklama eklemek yerine eyleme giriş veya eylemden çıkış geçişini ayarlayın.
Harekete amaca yönelik bir hız profili verin. Bir yanıt gecikmeden başlayıp son pozuna yumuşakça geçebilir; küçük bir zıplama ise hedefini hafifçe aşıp (overshoot) sonra durulabilir. Bunlar açıklayıcı tercihlerdir: doğru eğri, karakterin stiline ve hareketin boyutuna bağlıdır. Apple kısa ve net geri bildirimler önermekte ve kullanıcıları devam etmeden önce hareketin bitmesini bekletmeme konusunda uyarmaktadır. Apple İnsan Arayüzü Yönergeleri: Hareket
5. Tekrarlanan dokunmaların ne yapacağına karar verin
İlk tepki oynatılırken ikinci bir dokunmayı test edin. Belirgin bir kural seçin: tepkiyi yeniden başlatmak, başka bir yanıtı sıraya almak, yeni bir poza yumuşak geçiş yapmak veya net bir ana kadar sonraki dokunmaları yok saymak. Basit bir evcil hayvan etkileşimi için kısa bir tepkiyi yeniden başlatmak veya yeni poza geçiş yapmak, karakterin müsait hissedilmesini sağlayabilir; birden fazla tam tepkiyi sıraya almak ise evcil hayvanın kullanıcıdan geri kaldığı izlenimini verebilir.
Hangi kuralı seçerseniz seçin, animasyonu yarım kalmış bir durumda bırakmaktan kaçının. Hazırlık, ana jest ve yatışma sırasındaki dokunmaları kontrol edin. Ayrıca, platformunuz bunu tamamlanmış bir dokunmadan ayırt ediyorsa, basma olarak başlayıp hedefin dışında biten bir dokunmayı da test edin. Apple'ın düğme kılavuzunda, denetim sınırları içinde parmağın kaldırılmasının eylemi tetiklediği belirtilmektedir; özel dokunma işleme mekanizmaları da kendi eşdeğer davranışını net bir şekilde tanımlamalıdır. Uygulamanızdaki donmaları (hangs) anlama
6. Etkileşimi tam hareket olmadan da kullanılabilir tutun
Platformun hareket tercihleri sunduğu durumlarda tepkinin isteğe bağlı olmasını sağlayın ve gerektiğinde dokunmayla iletilen bilgiyi hareketsiz bir durum değişikliğiyle koruyun. Bir web arayüzü için, W3C'nin belgelenmiş tekniği, kullanıcı daha az hareket talep ettiğinde etkileşimle tetiklenen hareketi bastırmak veya değiştirmek için prefers-reduced-motion medya sorgusunu kullanır. W3C sayfası tam olarak bu uygulamanın kullanılmasına yönelik bir zorunluluğu değil, bir tekniği açıklar. W3C Tekniği C39: Hareketi önlemek için CSS prefers-reduced-motion sorgusunu kullanma
Ses veya dokunsal (haptik) geri bildirim eklerseniz, bunu doğrudan görünür tepkiyle eşleştirin ve bilinçli olarak sunun. Apple'ın dokunsal geri bildirim kılavuzunda geri bildirimin görsel bir değişiklikle eşleşmesi veya bir kullanıcı eylemine yanıt vermesi gerektiği belirtilmekte ve aşırı kullanımın bunun önemini azaltabileceği konusunda uyarıda bulunulmaktadır. Hareket zaten sonucu netleştiriyorsa bir evcil hayvan animasyonu ek geri bildirim kanallarına ihtiyaç duymaz. Apple İnsan Arayüzü Yönergeleri: Haptikleri oynatma
7. Odaklanmış bir dokunma testi gerçekleştirin
Yalnızca bir zaman çizelgesi düzenleyicisinden karar vermek yerine, hedeflenen cihazda ve gerçek ekran boyutunda test edin. Birkaç pratik soru sorun: basma görsel olarak algılanıyor mu, evcil hayvanın ne yaptığı anlaşılabiliyor mu, poz etkileşime hazır bir duruma dönüyor mu ve tekrarlanan bir dokunma öngörülebilir şekilde davranıyor mu? Önce normal hızda izleyin; yavaş oynatma poz geçişlerini incelemeye yardımcı olabilir ancak zamanlamanın kullanım sırasında duyarlı hissettirip hissettirmediğini ortaya koyamaz.
Ardından uç durumları test edin: art arda hızlıca birkaç kez dokunun, hedef sınırına yakın dokunun ve cihazın hareketi azaltma ayarını etkinleştirin. Gecikmeli başlangıçlara, donmuş karelere, ani sıfırlamalara ve anlam belirsizleşene kadar birbiriyle çakışan tepkilere dikkat edin. Apple, tek bir ekran yenileme aralığındaki gecikmenin bile harekette bir takılmaya (hitch) neden olabileceğini belirtmektedir, bu nedenle algılanan başlama süresinin yanı sıra akıcılığı da inceleyin. Uygulama duyarlılığını iyileştirme
Güvenilir bir plan basittir: dokunmanın anlamını tanımlayın, bunu gecikmeden onaylayın, tek ve anlaşılır bir tepki sahneleyin, yeniden kullanılabilir bir poza dönün ve kesintilerin nasıl işleyeceğine karar verin. Sekansı cihaz üzerinde ayarlayın, ardından aynı kontrolleri azaltılmış hareket ayarıyla tekrarlayın. Tamamlanan davranış, dokunma ile evcil hayvanın tepkisi arasındaki ilişkinin kolayca takip edilmesini sağlamalıdır.