Görsel Tasarım Terimleri: Hangisi Bir Kararı Değiştirir?

Terim listesi ezberlemenin bir faydası yok. Bir kavramın değeri, bir tartışmayı kapatıp kararı değiştirdiği yerde ortaya çıkıyor. Aşağıda her terim için tanım kısa tutuldu; ağırlık ne yapılacağında ve sonucun nasıl kontrol edileceğinde.

Fitts yasası: büyütmek değil, yaklaştırmak

Hedefe ulaşma süresi kabaca MT = a + b · log2(2D / W) ile ilerler. D hedefe olan uzaklık, W hareket yönündeki genişlik. Bütün mesele o logaritmada: genişliği iki katına çıkarmak süreyi yarıya indirmez, kazanç hızla düzleşir. Yani zaten yeterince büyük bir düğmeyi daha da büyütmek neredeyse hiçbir şey kazandırmaz, oysa aynı düğmeyi imlecin bulunduğu yere yaklaştırmak D'yi doğrudan küçültür.

Ekran kenarlarının değeri de buradan gelir: imleç kenarda durur, hedefin etkin genişliği pratikte sınırsız hale gelir. Mobildeki karşılığı başparmağın rahat eriştiği alt bant.

Bir yönetim panelinde kaydet düğmesinden şikayet gelince önce düğmeyi büyüttük, fark etmedi; ekranın alt kenarına sabitleyince şikayet kesildi.

Gestalt: gruplamayı boşlukla yapın, çizgiyle değil

Günlük işte karşılığı olan iki ilke var: yakınlık ve ortak bölge. Birbirine ait öğeleri yaklaştırın, ait olmayanların arasını açın. Etiketi kendi alanına 8 piksel, bir sonraki alana 24 piksel uzakta bırakmak, kutu çizmekten çok daha net gruplar üretir. Arayüze çerçeve eklemek çoğu zaman boşluk düzeninin tutmadığının işaretidir.

Kapanış ve benzerlik ilkeleri logo ve ikon işlerinde konuşulur, arayüz kararlarında nadiren belirleyici olur.

Kontrast gözle değil sayıyla tartışılır

Kontrast konusu "bana yeterli göründü" ile kapanmasın. WCAG normal metin için 4.5:1 ister; 24 piksel normal ya da 18,66 piksel kalın metinde eşik 3:1'e iner, arayüz bileşenleri ve durum göstergeleri için de sınır 3:1. Bunların hepsi tarayıcı denetçisinde ya da herhangi bir kontrast aracında saniyeler içinde ölçülür. Marka renginiz eşiği geçmiyorsa o rengi metinde kullanmayın, dolgu ve vurgu alanlarına bırakın.

Estetik-kullanılabilirlik etkisi testinizi bozar

Güzel görünen arayüz daha kullanışlı sanılır, kullanıcı sorunlara daha uzun süre katlanır. Bu, tasarıma yatırım yapmak için iyi bir gerekçe. Kullanılabilirlik testinde ise doğrudan bir risk: cilalı bir prototipte katılımcı takıldığı yeri kendi beceriksizliğine yorup geçer, siz de sorunu kaydetmezsiniz. Erken aşamada kaba çizimle test etmenin asıl faydası hız değil, bu maskelemenin ortadan kalkması.

Ölçek yereldir, boşluk sistemiktir

Bir başlığı büyütme kararı tek bileşende kalır, geri alması dakikalar sürer. Aralık kararı öyle değil: tek ekranda elle düzelttiğiniz boşluklar iki sprint sonra tutarsız hale gelir, çünkü aynı bileşen başka sayfalarda başka değerlerle duruyordur. Aralıkları en baştan token olarak tanımlayın (4, 8, 16, 24) ve ekran bazında istisna açmayın. Bu, tasarım kararından çok uygulama kararıdır ve bedelini kod tarafı öder.

İki bedava kontrol

Squint testi: gözlerinizi kısın ya da ekran görüntüsüne bulanıklık filtresi uygulayın. Bulanık halde ilk fark edilen şey sayfanın ana eylemi değilse hiyerarşi tutmuyordur. Sinyal-gürültü tarafında soru daha da basit: bu öğeyi silersem kullanıcı ne kaybeder? Cevabınız yoksa silin.

Flat mı skeuomorfizm mi sorusu yanlış soru

Mesele üslup değil, tıklanabilir olanın tıklanabilir görünmesi. Düz tasarımın ilk dalgasında kenarlık ve gölge topluca kalkınca insanlar düğmeyi düğme sanmadı. Bugünün arayüzleri görsel olarak sade ama o sinyali dolgu, ton farkı veya imleç tepkisiyle geri koyuyor. Tarzı markanıza göre seçin, sinyali pazarlığa açmayın.