Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

GESTALT PRENSİPLERİ

Prof. Dr. Kürşat ÇAĞILTAYAyşe Hilal YERGÖK

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

• Dünya ile olan etkileşimimiz ağırlıklı olarak görme duyumuz sayesinde gerçekleşmektedir.

• Bilgisayar ile de etkileşirken karşımızdaki arayüzden bize sunulan bilgileri algılama ve anlamlandırma süreci kritik bir öneme sahiptir.

• Görsel bilginin algılanması, sınıflandırılması ve organize edilmesi konusu ile ilgili en önemli araştırmalar Gestalt psikologlarınca gerçekleştirilmiştir.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Gestalt Prensipleri nedir?

• Gestalt psikolojik bir terim olarak “birleştirilmiş bütünlük” anlamı taşımaktadır.

• Alman psikologlar tarafından 1920’ de geliştirilen “Görsel Algı” teorisine atıfta bulunmaktadır.

• Bu teoriler insanların görsel öğeleri gruplandırma eğilimlerini veya prensipler uygulandığında elde edilen “birleştirilmiş bütünlük” olgusunu açıklamaya çalışmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

GESTALT PRENSİPLERİ

• Kelime olarak, organizasyon, yapılandırma anlamına gelen Gestalt teorisine göre, dünyayı anlamamız etrafımızdan gelen uyaranların tek tek yorumlanması ile değil uyaranların bir bütün olarak algılanması ile olur.

• Diğer bir deyişle bir bütün onu oluşturan alt birimlerin toplamından farklıdır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

GESTALT PRENSİPLERİ• Gestalt teorisi görsel bazı örneklerde daha iyi anlaşılabilir.

Aşağıdaki şekilde ne görüyorsunuz?

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

GESTALT PRENSİPLERİ• Gestalt teorisi görsel bazı örneklerde daha iyi anlaşılabilir.

Aşağıdaki şekilde ne görüyorsunuz?

• Bu soruya cevap veren kişilerin büyük bir çoğunluğu, bunun bir çember olduğunu söyleyeceklerdir. Çok büyük ihtimalle dokuz adet nokta diye bir cevap kimseden gelmeyecektir. Gestalt teorisine göre algı sistemimiz, bu örüntüyü zihnimizde yapılandırmaya ve anlamlı şekilde organize etmeye çalışmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Örnek Soru:

• Ancak birbiri ile çelişen ya da tam anlaşılamayan bir uyaranın olması durumunda bilişsel sistemiz hatalı kararlar da verebilmektedir.

• Örneğin, aşağıdaki şekilde ne görüyorsunuz:

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Cevap:

• Gestalt teorisine göre zihnimiz bu resimdeki eksik parçaları birleştirme eğilimindedir ve birleştirme işlemini yaparken geçmiş deneyimimiz doğrultusunda da anlam vermeye çalışır.

• Cevap verenlerin bir kısmı bunu bir At olarak algılarken bir kısmı Zebra olarak algılayabilmektedir. Parçalar tek başlarına bir anlam ifade etmemekte ama aradaki boşluklar zihnimizde doldurulduğunda anlamlı bir resim ortaya çıkmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Gestalt Teorisi - Bilgisayar Ortamı

• Gestalt teorisini bilgisayar arayüzlerine uyarlayacak olursak, bir arayüz kendisini oluşturan tüm parçalardan (menü, buton, resim, yazı, vb.) daha farklıdır.

• Bütün bu birimleri teker teker incelemek arayüzün genel değerlendirmesini yapmak için yeterli değildir.

• Gestalt teorisi doğrultusunda yapılan araştırmalar sonucunda bir dizi tasarım kuralı oluşturulmuştur.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Tasarım Kuralları:

• Benzerlik Kuralı (Law of Similarity): • Yakınlık Kuralı (Law of Proximity): • Simetri Kuralı (Law of Symmetry): • Süreklilik Kuralı (Law of Continuity): • Kapalılık Kuralı (Law of Closure): • Aynı Yön Kuralı (Law of Common Fate):• Desen – Zemin Kuralı (Law of Figure and Ground)

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Benzerlik Kuralı (Law of Similarity):

• Bilişsel sistemimiz benzer elemanları anlamlı bir bütün oluşturması için gruplar. Gruplama işlemi renk, büyüklük ya da şekle göre olabilir.

• Yukarıdaki örnek 11 ayrı objeden oluşmuştur fakat tek bir cisim olarak algılanmaktadır. Bunun sebebi şekillerin birbirine benzerliğinden kaynaklanmaktadır.

• Alt tarafta kartal görüntüsü oluşturan üçgen şekiller üstteki güneş ışığı şeklini oluşturanlarla aynı göründüğü için bütünlük oluşturur.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Benzerlik Kuralı (devamı)

Benzerlik kuralının oluştuğu durumlarda, objelerden biri diğerlerinden farklı olursa vurgulanmış olur. Bu duruma “aykırılık” denir.

Sağ tarafta en sonda bulunan figür odak nokta olarak algılanmaktadır, çünkü diğerlerinden şekil olarak farklılaşmıştır..

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Benzerlik Kuralı

• Soldaki resimde görüldüğü gibi, iki taraftada aynı nesneler olmasına rağmen sağda yatay kareler ayrı bir grup olarak algılanmaktadır.

• Benzer şekilde, Yahoo’nun web sitesinde sağ üstteki seçenekler (Mail, Messenger, Puzzles, Weather, Events, Horoscope) benzerlik kuralına uyduğu için bir grup olarak algılanmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Yakınlık Kuralı (Law of Proximity):

• Bilişsel sistemimiz birbirine mekansal ya da zamansal olarak yakın elemanları anlamlı bir bütün oluşturması için gruplar.

Üstteki 9 kutucuk yakınlık kuralı gözetilmeksizin yerleştirilmiştir. Dolayısıyla ayrı ayrı şekiller olarak algılanırlar.

Kutucuklar bu şekilde yerleştirildiklerinde ise bütünlük sağlanır. Halen ayrı ayrı şekiller olmalarına rağmen bu kez bir grup olarak algılanırlar.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Yakınlık Kuralı (devamı)Yanda bulunan 15 farklı şekil ise yakınlık kuralına göre yerleştirildiklerinden dolayı bir bütün (ağaç) olarak algılanmaktadır.

•Sol taraftaki şekiller kolonlar arasına gelen boşluk nedeni ile daha farklı algılanmaktadır.Boşluk nedeni ile kolonlar birer grup gibi görülmektedir.

•Sağdaki ekran görüntüsünde de Ürünlerimiz ya da Site Sahipleri İçin başlıkları altındaki kısımlar birbirlerine yakın oldukları için onlar birer grup olarak algılanmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Simetri Kuralı (Law of Symmetry):

• Bilişsel sistemimiz simetrik elemanları, birbirlerinden uzakta da olsalar, anlamlı bir bütün oluşturması için gruplar.

• Üstteki şekiller birbirlerinden ayrı olmalarına rağmen simetrik olduklarından dolayı 2’li gruplar halinde algılanmaktadır.

{ } { } { } { }

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Simetri Kuralı (devamı)

{ } { } { } { }

Sayfada üstte bulunan bağlantılar birbirlerinden “|” işareti ile ayrılmış olmalarına rağmen bütünlük sağlamaktadır.

Sağ tarafta bulunan Navigation ve Photography bağlantıları ise alt başlıklar içermektedir fakat simetrik oldukları için aynı tür kategoriyi belirtmektedir.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Süreklilik Kuralı (Law of Continuity):

Bilişsel sistemimiz görsel ya da işitsel elemanlarda oluşan boşlukları birbirine bağlayıp, anlamlı bir süreklilik sağlar.

Gözümüz bir objeden koptuğu anda diğer bir objeye bakmaya devam etmek zorunda kalıyorsa süreklilik durumu ortaya çıkar.

Üstteki örnekten de anlaşılacağı üzere, bakan kişinin gözü doğal olarak bir çizgiyi (eğriyi) takip etmek durumunda kalıyor. H harfindeki enine devam eden yumuşak kıvrım bakan kişiyi yaprağa götürüyor.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Süreklilik Kuralı (devamı)

• Bu kez de ayrı ayrı noktalar sıralanışları bakımından bir devamlılık sağlamakta, dolayısıyla süreklilik sağlayacak şekilde algılanmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Kapalılık Kuralı (Law of Closure):

• Bilişsel sistemimiz görsel ya da işitsel elemanlarda oluşan boşlukları doldurup, anlamlı bir bütün oluşmasını sağlar.

• Herhangi bir obje görseli tamamlanmamışsa veya boşluk tarafından tamamen çevrelenmemişse kapalılık durumu oluşur. Görselin yeterli kısmı algılanabiliyorsa, eksik kısımlar bakan kişi tarafından otomatik olarak tamamlanır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Kapalılık Kuralı (devamı)

Yandaki şekilde panda görseli tam olarak çizilmemiş olmasına rağmen gözümüz tamamlanmış olarak görmekte ve panda olduğunu algılamaktadır. Bakan kişinin algısı şekli tamamladığında, kapalılık kuralı ortaya çıkmaktadır.

Yandaki şekilde yerleşimleri uygun ayarlanmış tamamlanmamış şekiller, ortada ayrı bir üçgen figürü oluşturmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Kapalılık Kuralı (devamı)

Soldaki örnekte herhangi bir çerçeve yapısı kullanılmamasına rağmen sitenin içerik ve menü bölümleri rahatlıkla ayırt edilebilmektedir.

Sağdaki örnekte ise sayfanın üstünde ve altında kullanılan resimler ile boşluklar kapalılık kuralına göre tasarlanmış ve bir bütünlük sağlanmıştır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Aynı Yön Kuralı (Law of Common Fate):

• Bilişsel sistemimiz aynı yönü gösteren elemanları gruplar.

• Bakan kişi mantıksal olarak yukarıyı gösteren ok işaretlerini veya sağ tarafı gösteren el işaretini gruplar. Ters tarafı veya yönü gösteren objeler ise gerilim yaratır ve bakan kişi bunu grubun bir parçası olarak görmez, farklı bir grup olarak algılar.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Aynı Yön Kuralı (devamı)

• Üstteki örnekte sol bölümde bulunan ikonlar aynı hiza ve yönde oldukları için bir grup olarak, sağdaki ikon tıklandığında yer değiştirdiği için diğerlerinden ayrı olarak algılanmaktadır.

• Alttaki örnekte ise menüde dikey ve yatay yerleştirilen öğeler ayrı ayrı gruplanmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Desen – Zemin Kuralı (Law of Figure and Ground)

• Görsel bir nesneye bakıldığında içsel olarak 2 farklı yapı görme eğilimi söz konusudur. Hem görselin ön planındaki figür, hem de arka plan ayrı birer katman gibi algılanır.

• Gestalt prensiplerine göre bakan kişi objeyi ve onu çevreleyen alanı ayırt ederek bir yapıyı, silueti veya şekli figür olarak, kalan kısmı da zemin olarak algılar. Fakat bu her defasında bu kadar keskin olmayabilir. Arka planda olan imajı asıl imaj olarak algılayabilir veya ön plandaki figürü önce algılayıp diğer katmanı arka plan olarak düşünebilir.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Desen – Zemin Kuralı (devamı)

Yandaki şekilde açıkça beyaz olan kısım arkaplan olarak, siyah olan kısımsa figür olarak algılanıyor.

Bu durumda desen ve zemin dengesi incelenir. Algıya göre görselde bir yüz silueti görülebilir veya figür bir panjur olarak düşünülebilir.

Alttaki görselde ise daha karmaşık bir yapı gözlemlenmektedir. Desen-Zemin ilşkisine bakıldığında yapraklar ayrı, su dalgası ayrı ve ağaç ayrı ayrı algılanmaktadır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Desen – Zemin Kuralı (devamı)

Soldaki örnekte içerik ve görseller arka plan zemininden keskin bir şekilde ayrılmaktadır. Sağdaki görselde ise zemin ve desen geçişi daha yumuşaktır.

Prof.Dr. Kürşat Çağıltay, İnsan Bilgisayar Etkileşimi ve Kullanılabilirlik Mühendisliği: Teoriden Pratiğe, Kitap Notları

Prensipleri anlamlı şekilde kullan

• Yakınlık ve benzerlik AAA BBB• Yakınlık ve kapalılık [] [] []

• İki prensibi çelişir şekilde kullanma!– Yakınlık vs Kapalılık ][ ][ ][ – Yakınlık vs Benzerlik AAB BBC CCD