İçindekiler
UX ve etkileşim tasarımı alanlarında en etkili psikolojik teorilerden biri Gestalt teorisidir. Teori Alman psikologlar tarafından kurulmuştur ve "Gestalt" kelimesi şu anlama gelmektedir form veya şekil Adından da anlaşılacağı üzere, Gestalt ilkelerinin ardındaki fikir, insanların tek tek nesnelerden ziyade nesne gruplarını örüntü olarak algılamasıdır.
Gestalt ilkeleri hakkında pek çok makale var ancak bunların pek çoğu bir UX/UI tasarımcısı olarak bunları işinize nasıl uygulayacağınızı anlamanıza yardımcı olmuyor. Bu makale, insanların hedeflerine daha az çabayla ulaşmalarına yardımcı olacak daha iyi UX ve UI tasarımları oluşturmak için Gestalt ilkelerini nasıl kullanacağınız konusunda size bazı fikirler verecektir.
Ayrıca bakınız: Tüm Zamanların En Havalı 2D Animasyon ReklamlarıBenzerlik Yasası
Benzerlik ilkesi, nesneler fiziksel olarak birbirine benzediğinde onları birlikte gruplayın ve sahip olduklarını varsayalım aynı işlevsellik Örneğin, aşağıdaki resimde bordo kırmızı daireleri içeren çizgiyi, farklı rengi nedeniyle resmin geri kalanından ayırt etmek oldukça kolaydır.
Benzerlik ilkesine bir örnek. Fotoğraf yazara aittir.
UX ve UI Tasarımında Benzerlik Kullanımı
Şirketinizin ABD ve Kanada'daki İtalyan yemeği meraklıları tarafından kullanılan "Il Mio Chef" adlı bir uygulama geliştirdiğini hayal edelim (Bu makalenin geri kalanında bunu kullanacağız). UX araştırmacınızın size yakın zamanda verdiği bir rapor, İtalyan yemeği siparişi söz konusu olduğunda, kullanıcıların çoğunlukla kendilerine en yakın restoranların hangileri olduğunu önemsediklerini belirtiyor.lazanya ya da pizza hala taze ve sıcakken teslim edilir, değil mi?
Ayrıca bakınız: Yarasa Nasıl ÇizilirUygulama kullanıcılarımızın kendilerine en yakın restoranları görmelerini kolaylaştırmak için, bu restoranları kullanıcı arayüzünde vurgulayarak benzerlik ilkesini kullanabiliriz. Aşağıdaki resimde, bu seçenekleri sarı renkle vurgulamanın (sağda), en yakın restoranlar ile daha uzak olanlar arasındaki farkı görsel olarak vurgulayarak nasıl büyük bir fark yarattığını görebilirsiniz.kullanıcılarınızın aradıklarını hızlı bir şekilde bulmalarına yardımcı olmak için benzerlik ilkesini kullanabilir.
Gestalt benzerlik ilkesini kullanarak. Resim yazara aittir.
Yakınlık Yasası
Yakınlık ilkesi, birbirlerine yakın konumdaki nesnelerin daha ilişkili görünmektedir Örneğin, ilk görüntü ve ikinci görüntüde aynı miktarda daire vardır. Ancak, ikinci görüntüde bazı sütunlar birbirine daha yakındır ve büyük bir grup yerine üç ayrı grup varmış izlenimi yaratır.
Yakınlık - örnek 1 - büyük bir grup. Resim yazara aittir.
Yakınlık - örnek 2 - üç farklı grup. Resim yazara aittir.
UX ve UI Tasarımında Yakınlık Kullanımı
Bilgi görselleştirme alanından bir örnek verelim.
Bu kez, "Il Mio Chef" uygulamanızın nasıl performans gösterdiğini görmek isteyen bir yönetici olduğunuzu hayal edelim. Finansal performansı, kullanıcı katılımını ve memnuniyetini ölçen KPI'lara bakmak istiyorsunuz. İlk başta, bilgi görselleştirme uzmanınız, sizin ve diğer tüm yöneticilerin sayıların içinde kaybolmasına ve daha fazla soru sormasına neden olan aşağıdaki gösterge tablosunu oluşturur. Bir ay sonra çoğunuzbu panoyu kullanmayı tamamen bırakın.
KPI gösterge tablosu - Il Mio Chef. Resim yazar tarafından.
Bu noktada bilgi görselleştirme uzmanınıza geri dönüyor ve gösterge tablosunu yeniden tasarlayarak insanların büyük resmi anlamasını kolaylaştırmasını istiyorsunuz. Yakınlık ilkesi bu durumda işe yarıyor ve aşağıda yeni tasarımı görebilirsiniz. KPI türüne göre ayrılmış üç grup içeriyor ve herkesin uygulamanın finansal açıdan nasıl gittiğini anlamasına yardımcı oluyorNesneleri birlikte gruplamak ve gruplar arasında daha fazla beyaz alan kullanmak, kullanıcılarınızın bilgileri daha hızlı sindirmesine yardımcı olabilir.
Gösterge paneli tasarımında Gestalt yakınlık ilkesinin kullanılması. Görsel yazara aittir.
Süreklilik Yasası
Süreklilik ilkesi, gözün bir nesneyi takip etmeye başladığında, başka bir nesneyle karşılaşana kadar o yöndeki "hareketi" takip etmeye devam edeceğini belirtir. Bu hareket, nesneyi bilgiyi bulmak için geçmemiz gereken aynı yolun bir parçası olarak algılamamıza yardımcı olur. Aşağıdaki resim, gözümüzü yönlendiren bu tür görsel modeller oluşturmak için süreklilik ilkesini nasıl kullanabileceğimizi göstermektedirgözün belirli bir yöne bakması.
Süreklilik ilkesine bir örnek. Resim yazara aittir.
UX ve UI Tasarımında Sürekliliği Kullanma
UX araştırmacınız, kullanıcıların "Il Mio Chef" uygulamasını kullanmalarındaki ana motivasyonun, her hafta yeni İtalyan yemek restoranlarına erişmelerine olanak tanıdığı için yemek keşfi olduğunu gösteren yeni bir rapor sundu. Aşağıdaki resimde (sol taraf) mevcut kullanıcı arayüzü tasarımıyla insanların seçeneklerini kaç kez kaydırdıklarını gösteren metriğe bakıyorsunuz ve hiçbir zaman iki kereden fazla kaydırmadıklarını görüyorsunuzhangi seçeneklerin mevcut olduğunu görmek için ortalama bir süreye ihtiyaç duyarlar.
UX tasarımcınız süreklilik ilkesini kullanarak (aşağıdaki resimde sağ taraf) bu sayının ortalama 10 kaydırmaya çıkmasına yardımcı oldu. Bu nasıl oldu? Resmin bir kısmını gizleyerek ve orada ne olduğunu görmek için sola veya sağa kaydırmanız gerektiğini vurgulayarak, kullanıcılarınızın gözleri kelimenin tam anlamıyla "kaydırma" hareketi oluşturmaya yönlendirildi ve daha fazla restoranı keşfetmek için daha fazla motive oldular.Bu, daha önceki tasarımın sizi hiç motive etmediği bir şeydir, zaten bunu yapmak için doğal olarak motive olsanız bile.
UX/UI tasarımında Gestalt süreklilik ilkesinin kullanılması. Görsel yazara aittir.
Özetlemek gerekirse Bu makalede sunulan Gestalt ilkelerini UX ve UI tasarımınızda kullanmak, kullanıcılarınızın bilgiyi daha hızlı bulmasına ve daha iyi sindirmesine yardımcı olabilir. Ayrıca, onları en çok sevdikleri eylemleri gerçekleştirmeye motive ederek ürününüzden duydukları memnuniyeti artırabilir.
Kapakta Miklos Philips'in Vectornator'da düzenlenmiş çizimleri yer almaktadır.
