
Her kare kusursuz: arayüz neden kare kare yargılanır
tonsky.me'de yayımlanan bir yazı, bir uygulamanın ekran görüntüsünün her an açıklanabilir olması gerektiğini savunuyor; animasyonun ortasındaki kareler ise arayüzün gerçekten özenle tasarlanıp tasarlanmadığını gösteriyor.
Her kare kusursuz
İfade Wayland belgelerinden geliyor: "her kare kusursuz" bir ekran protokolünün ilan edilmiş hedefi ve giderek karmaşıklaşan GPU yığınlarından kontrolü geri alma çabasını anlatıyor. tonsky.me'de yayımlanan yazıda yazar, aynı ilkenin yalnızca grafik hattı için değil, kullanıcı arayüzleri için de geçerli olması gerektiğini savunuyor.
Önerdiği pratik kural basit: Uygulamanızın herhangi bir anında ekran görüntüsü alınırsa, ekranda ne olduğunu açıklayabilmelisiniz. Yazıya eklenen bir not, önceki ifadenin — "mantıklı olmalı" — fazla katı olduğunu belirtiyor; çünkü smear frame gibi ileri animasyon teknikleri hareketi bilinçli olarak bozar.
Geçişin ortası neden önemli
Her kareye dikkat etmenin ana gerekçesi güven. Kullanıcılar kodu göremez; kaliteyi değerlendirebilecekleri tek şey arayüzdür. Arayüz özenli görünüyorsa, ekibin kodu da aynı ölçüde cilalamaya zamanı olmuş olması muhtemeldir — bir kestirme, ama makul bir kestirme.
Yazar bunun pratikte ne anlama geldiğini sıralıyor: ekranlar arasında beyaz parlamalar olmaması, kısmen yüklenmiş içerik bulunmaması, veri yüklenirken yerleşimin değişmemesi, iç tutarlılık — arayüzün bir bölümü "1 güncelleme mevcut" derken başka bir bölümü "Güncellemeler denetleniyor..." dememeli — ve hassas animasyonlar.
En sık unutulan kısım animasyonlar. Bir arayüz başlangıç ve bitiş durumunda iyi görünüp aradaki süreçte açıkça bozuk olabilir. Geçişin ortasında alınan ekran görüntüleri, hiçbir tasarımcının bilerek çizmeyeceği konumlarda donmuş ögeler gösteriyor.
Küçük senkron kayıpları, büyük şüpheler
Örnekler günlük yazılımlardan. Safari'de yer tutucu metin merkezden hareket ederken imleç soldaki konumdan canlandırılıyor; iki bileşen uyumsuz görünüyor ve birlikte tasarlanıp tasarlanmadıkları sorusunu doğuruyor. Photos'ta Crop ile Adjust arasında geçişte görsel anında yerine oturuyor, kırpma çerçevesi ise animasyonla geliyor; bu da bir şeyin hafifçe değiştiği yönünde yanlış bir izlenim yaratıyor.
YouTube örneği ise düşünülebilecek en basit görev: bir dikdörtgeni bir konumdan diğerine taşımak. Buna rağmen sonucu açıklamak güç. Yazar bu durumları "teknoloji programcıyı alt etti" diye adlandırıyor ve DOM mimarisinin sınırlarına işaret ediyor. Nedeni ne olursa olsun, kare kusursuz değil.
Yazı, Preview uygulamasından gelen "kışkırtılmamış" bir yakınlaştırma animasyonu ve bir rica ile bitiyor: yalnızca başlangıç ve bitiş durumlarına değil, ikisi arasında olan her şeye dikkat edin.
SiTech — AI destekli web geliştirme
Hızlı ve modern web siteleri kuruyor, AI'yı gerçek iş akışlarına taşıyoruz. Projeniz veya sorunuz mu var? Yardımcı olmaktan mutluluk duyarız.