Gestalt Prensipleri: Arayüzde Şekil/Zemin, Prägnanz, Kapanış ve Ortak Kader
Gestalt yasaları, bir arayüzde gözün hangi parçaları birlikte hangilerini ayrı okuyacağı sorusunun cevabıdır. Şekil/zemin, Prägnanz, kapanış ve ortak kader; dördü de tasarım toplantısında “böyle daha güzel duruyor” cümlesinin yerine geçecek gerekçeyi verir. Dördünün de arayüzde net bir karşılığı, bir de sınırı var.
Şekil/zemin: öne çıkanı siz seçin
Göz bir ekranı açtığında nesneyi zeminden ayırmak için birkaç yüz milisaniye harcar. O ayrımı siz kurmazsanız kendi kurar, genelde de yanlış yerde kurar: en büyük görsel, en doygun renk, en hareketli alan öne çıkar. Ana eylem butonunuz bunlardan biri değilse kaybeder.
Boyut ve kontrast bu ayrımın iki kaldıracı. Kontrast tarafında göz kararı yerine ölçüt var: WCAG normal metin için 4.5:1, büyük metin ile buton ve ikon gibi arayüz bileşenleri için 3:1 ister. Bu eşiğin altındaki bir şekil zemine karışır, ve konu tasarım zevki tartışması olmaktan çıkıp ölçüm sonucuna dönüşür.
Şekil/zemin ilişkisi kararlı, tersine çevrilebilir ya da belirsiz olabilir. Belirsiz olanı afişte ve logoda kullanın, arayüzde kullanmayın. Kullanıcı bir butona bakarken bunun buton olup olmadığını düşünmemeli.
Prägnanz diğerlerinin yanında değil üstünde
Prägnanz çoğu listede dört ilkeden biri gibi sıralanır. Doğrusu bu değil. Gestalt kuramında Prägnanz, yani iyi biçim yasası, diğerlerinin türediği çatı ilkedir; yakınlık, benzerlik ve kapanış, algının en sade ve en düzenli yorumu seçtiği varsayımının özel halleridir. Ayrımı bilmek pratikte işe yarar, çünkü iki ilke çakıştığında hangisinin kazanacağını size söyler: hangi yorum daha basitse o kazanır.
Arayüzdeki karşılığı sadeleştirme sloganı değil, kullanıcının vermek zorunda kaldığı karar sayısını azaltmak. Kart düzeni, tutarlı boşluk ritmi ve tekrar eden blok yapısı ekranı tek bir düzen kuralına indirger. Bunu wireframe aşamasında görmek kolaydır, renk ve fotoğraf girince kaybolur, o yüzden düzen kararını gri kutulardayken verin.
Kapanış: eksik bırakılan çizgiyi göz tamamlar
Kapanış, bir formun tamamı çizilmediğinde gözün kalanını doldurmasıdır. WWF panda logosu en bilinen örneği: siyah lekelerin arasındaki beyaz alan hiçbir yerde çizgiyle sınırlanmaz, ortada gözün tamamladığı bir panda vardır.
Arayüzde bu ilkenin verimli kullanıldığı yerler ikon setleri ve boş durum görselleri. Tabloda, formda, uzun listede işi yok. Bir tablo satırının üç kenarını çizip dördüncüsünü göze bırakmak zeka gösterisidir ve tarama hızını düşürür.
Ortak kader en güçlü gruplama ipucudur
Birlikte hareket eden ögeler tek grup olarak okunur. Ortak kader yakınlıktan ve benzerlikten baskındır: birbirinden uzak duran, farklı görünen iki öge aynı anda aynı yöne gidiyorsa göz onları birleştirir. Bu hem ipucunun gücü hem de tehlikesi.
Bir projede menünün açılış animasyonunu daha yumuşak dursun diye uzatınca alt menü ana menüden kopmuş ayrı bir katman gibi okunmaya başlamıştı. Aynı sayfada birbiriyle ilgisiz iki bileşeni aynı süre ve aynı easing eğrisiyle canlandırırsanız benzer bir yanlış gruplama üretirsiniz. Geçiş süresi burada dekorasyon parametresi değil, gruplama parametresi.
Bu ilkeler neyi çözer, neyi çözmez
Gestalt yasaları tasarımı güzelleştirmez, tartışmayı kısaltır. Kontrast oranı ölçülür, animasyon süresi bir sayıdır, kart düzeni kuralı tek cümleyle yazılır. Zevk meselesi gibi görünen konular böylece kontrol edilebilir maddeye dönüşür.
Sınır da net: bu yasalar neyin birlikte okunacağını söyler, neyin doğru bilgi olduğunu söylemez. Yanlış gruplanmış doğru içerik kadar, düzgün gruplanmış yanlış içerik de kullanıcıyı yanıltır. Gruplama kararı, içerik hiyerarşisi oturduktan sonra gelir.