Blm 3 ETKLEM INTERACTION Bahadr YILDIZ Ksaca Etkileim

Bölüm 3 ETKİLEŞİM (INTERACTION) Bahadır YILDIZ

Kısaca; • Etkileşim modelleri – Kullanıcı ve sistem arası tercümeler. • Ergonomi – Etkileşimin fiziksel nitelikleri. • Etkileşim çeşitleri – kullanıcı/sistem dialogunun doğası • Bağlam – sosyal, örgütsel, motivasyonel 1/26/2022 Bahadır YILDIZ 2

• Etkileşim en basit anlamıyla; Kullanıcı ile sistem arasındaki iletişimdir. kullanıc ı 1/26/2022 sistem Bahadır YILDIZ 3

Etkileşim Modelleri • Etkileşimin iki ana katılımcısı vardır; - Kullanıcı ve Sistem. Önceki bölümlerde gördüğümüz gibi ikisi de karmaşık yapılara sahiptirler ve iletişimlerini sağlamak oldukça zordur. 1/26/2022 Bahadır YILDIZ 4

Etkileşim Modelleri • Arada sağlıklı bir etkileşim olabilmesi için ise arayüzün taraflar arasında iyi bir tercüman olması gerekmektedir. • Etkileşim modelleri de bize bu anlamda yol gösterici olacaktır. 1/26/2022 Bahadır YILDIZ 5

Etkileşim Modelleri Norman Modeli • • • En etkili modeldir. Uygulama-Değerlendirme Döngüsü Daha sonra bu model geliştirilerek ve genişletilerek başka modeller ortaya konulmıuştur. 1/26/2022 Bahadır YILDIZ 6

Etkileşim Modelleri Bazı terimler: • • • Domain, goal, task Core Language : sistemin dili Task Language : Kullanıcı dili 1/26/2022 Bahadır YILDIZ 7

Etkileşim Modelleri Uygulama-Değerlendirme Döngüsü • Bu en etkili modeldir, çünkü sezgisel olarak etkileşim algımızla örtüşmektedir. Hedef Uygulama Değerlendirme sistem 1/26/2022 Bahadır YILDIZ 8

Etkileşim Modelleri Sezgisel olarak Etkileşim; • • Kullanıcı yapacağına karar verir, Bilgisayar arayüzü ile bunu uygular, Uygulama sonucunu gözlemler, Sonucu değerlendirerek sonraki adıma karar verir. 1/26/2022 Bahadır YILDIZ 9

Etkileşim Modelleri Norman Modeli basamakları : • • Hedefi belirlemek Amacı, şekillendirmek Yapılacak eylemlerin sırasını belirlemek Eylemleri gerçekleştirmek Sistemin durumunu kavramak Sistemin durmunu yorumlamak Amaç ve hedef doğrultusunda sistem durmunu değerlendirmek. 1/26/2022 Bahadır YILDIZ 10

Etkileşim Modelleri Norman bu modeli, bazı arayüzlerin kullanıcıları ile neden sorun yaşadığını açıklamak için kullanmaktadır. Norman bu sorun durumlarını; • Uygulama Uçurumları • Değerlendirme Uçurumları olarak adlandırmaktadır. 1/26/2022 Bahadır YILDIZ 11

Etkileşim Modelleri • Uygulama Uçurumları : Kullanıcının hedefe ulaşmak için planladığı eylemler ile sistemin yapılmasına izin verdiği eylemler arasındaki farktır. • Değerlendirme Uçurumları : Kullanıcının beklentisi ile sistemin fiziksel sunumu arasındaki uzaklıktır. Kullanıcı sistemin sunumunu kendi hedefi doğrultusunda kolayca değerlendirebiliyorsa bu uçurum küçüktür. 1/26/2022 Bahadır YILDIZ 12

Kayma ve Yanılgılar (Slips and Mistakes) İnsan hataları iki gruba ayrılmaktadır; • Kullanıcı sistemi iyi anlamış, ne yapacağının farkında ancak kaza ile yanlış zamanda yanlış tuşa basmışsa bir Kayma oluşmuştur. Daha iyi bir ekran tasarımı vb durumlar ile düzeltilmesi kolaydır. • Kullanıcı sisteme hakim değilse, ne yapacağını tam olarak kestiremiyorsa, bu şekilde ortaya çıkan hatalara da Yanılgılar denilmektedir. Düzeltilmesi daha zordur, sistemin iyi anlaşılması vb durumları gerektirir. 1/26/2022 Bahadır YILDIZ 13

Etkileşimin İskeleti(Framework) Etkileşimde 4 ana tercüme çeşidi vardır; Bildirme, Performans, Sunum, Gözlem Sunum (Presentation) Ç Çıkış Gözlem (Observation) S U Sistem dili Performans (Performance) Kullanıcı dili G Söyleme, Bildirme (Articulation) Giriş 1/26/2022 Bahadır YILDIZ 14

Etkileşimin İskeleti (Framework) • Kullanıcı giriş birimine yapmak istediklerini bildirir • Giriş birimi sistemin anlayacağı dile tercüme eder ve işlem görülür • Sistem çıkış biriminin anlayacağı dile tercüme eder • Çıkış birimi de kullanıcın anlayacağı dile tercümesini yapar • Kullanıcı da sonucu görerek değerlendirmesini yapar. 1/26/2022 Bahadır YILDIZ 15

Etkileşimin İskeleti (Framework) • Burada esas olan diller arası tercümelerin sağlıklı yapılabiliyor olmasıdır. • Tasarlanan sistemlerde dikkat edilmesi gereken ve sorunların yaşanmasına neden olan burada yapılan tercüme hatalarıdır. • Bununla birlikte karşılıklı iletişimi kolaylaştırıcı adımlar da atılmalıdır. Örn: bir odanın ışığını açmak istiyorsanız ve tüm düğmeler – üzerinde açıklamaları bulunmayan- bir dolabın içerisindeyse, düğmeleri deneme yanılma yoluyla bulmak gerekebilir. Düğme sayısının çok fazla olması durumunda bu içinden çıkılmaz bir durum olabilir. 1/26/2022 Bahadır YILDIZ 16

Ergonomi • Etkileşimin insan faktörüdür. • Fiziksel niteliklerdir; kontroller nasıl tasarlanacak, etkileşimin olacağı fiziksel ortam nasıl olacak, ekran kalitesi nasıl olacak vs. • Bunların yanında insan psikolojisi ve sistem kısıtlılıkları ile de ilgilidir. 1/26/2022 Bahadır YILDIZ 17

Ergonomi Kontrollerin ve Göstergelerin düzenlenmesi • Kontroller ve göstergeler kolay erişim için mantıksal olarak gruplanmalıdır. • Basit uygulamalar için çok önemli görülmeyebilir ancak hayati önem taşıyan sistemler için çok önemlidir. Örn: hava kontrol kuleleri, uçaklar, … • Kritik önemi olmayan sistemlerde de bu tarz gruplamalar yapılması daha iyidir, çünkü kullanıcının işini kolaylaştırmak, kullanıcıyı uğraştırmamak esastır. 1/26/2022 Bahadır YILDIZ 18

Ergonomi Kontrollerin gruplandırılması : • İşlevsel : birbirleriyle ilgili işlevleri olan kontrollerin gruplandırılması, • Sıralı : Sıralı yapılması gereken işleri gerçekleştiren kontrollerin sıraya konulması. • Frekans(Sıklık) : Kullanım sıklığına göre, en sık kullanılan kontrollerin kolay erişilebilmesini sağlayan gruplandırma. 1/26/2022 Bahadır YILDIZ 19

Ergonomi • Gruplandırma işlemlerine ek olarak sistem de kullanıcının pozisyonuna uygun düzenlenmiş olmalıdır. • Örn: kullanıcı extra bir hareket yapmadan bütün kontrollere ulaşabilmeli ve gerekli göstergeleri görebilmelidir. • Önemli uyarılar göz hizasında olmalıdır. • Kontroller arasında yeterince boşluklar bırakılmış olması gereklidir. 1/26/2022 Bahadır YILDIZ 20

Ergonomi Etkileşimin Fiziksel Çevresi • • • Sistem nerede kullanılacak? Sistem kim tarafından kullanılacak? Kullanıcı oturacak mı, ayakta mı duracak? Örn: hazırlanan sistemi kullananlar; • Fiziksel olarak küçükse de tüm kontrollere ulaşabilsin, • Fiziksel olarak büyükse de ortamda sıkışmasın. 1/26/2022 Bahadır YILDIZ 21

Ergonomi Sağlık Sorunları • Bilgisayar kullanmanın riskli bir iş olmadığını düşünebiliriz ancak tasarımlarımızın neden olabileceği sağlık ve güvenlik sorunlarını da aklımızdan çıkarmamalıyız. 1/26/2022 Bahadır YILDIZ 22

Ergonomi Etkileşimin kalitesini ve kullanıcı performansını direk etkileyen çevresel faktörler; • Fiziksel pozisyon: kullanıcılar tüm kontrollere ulaşabilmelidir, ayakta fazla durmamalıdırlar, oturacaklarsa sırtlarında destek olmalıdır vs. • Sıcaklık: çok sıcak ve çok soğuk sıcaklıklar kullanıcıların konsantrasyonun etkilemektedir. • Işıklandırma: kullanıcıların gözlerini yormayacak, ekranı rahat görmelerini sağlayan yeterli ışıklandırma sağlanmalıdır. • Ses: aşırı yüksek ses rahatsızlık vereceği gibi ağrı ve duyma kaybına neden olabilir. • Zaman: kullanıcıların sistemi kullanırken harcadıkları zaman kontrol edilmelidir. 1/26/2022 Bahadır YILDIZ 23

Ergonomi Renk Kullanımı • Göstergelerde renk kullanımı bir ergonomi sorunudur; • 1. bölümde gördüğümüz gibi, görme sisteminin bazı sınırlılıkları bulunmaktadır. 1/26/2022 Bahadır YILDIZ 24

Ergonomi Renk Kullanımı (Bazı örnekler) • Kullanılan renkler birbirinden olabildiğince ayrı olmalıdır ve kontrast değişmelerinden etkilenmemelidir. • Önemli uyarılarda mavi kulanılmamalıdır. • Belirtici olarak renk kullanılıyorsa, sadece renk yerine ek olarak kod bilgileri de verilmelidir. • Renkler gelenekler ve beklentiler doğrultusunda kullanılmalıdır. Örn: kırmızı tehlike veya alarm göstergesi iken yeşil normal bir eylem için, sarı da bekleme konumu için kullanılabilir. • Bunun yanında renklerin anlamları kültürlere göre de farklılık gösterebilmektedir. Örn: Kırmızı, batıda tehlike, uyarı anlamına gelirken, Çin’de mutluluk, iyi şansı ifade etmektedir. 1/26/2022 Bahadır YILDIZ 25

Etkileşim Çeşitleri • • Komut Satırı arayüzü Menüler Doğal dil Soru-cevap ve sorgu Form doldurma ve tablolama WIMP Nokta ve tıkla 3 boyutlu arayüzler 1/26/2022 Bahadır YILDIZ 26

Komut Satırı Arayüzü • İlk interaktif diyalog çeşididir. • Sisteme direk giriş yapıldığı için güçlüdürler. • Aynı zamanda esnektir. (komutların çok fazla parametreleri vardır aynı anda birçok farklı alt komut işletilebilir. ) • Deneyimli kullanıcılar için uygundur. 1/26/2022 Bahadır YILDIZ 27

Menüler • Mouse ya da klavye yardımıyla seçilebilen, ekranda görüntülenen bir grup seçenekten oluşurlar. • Hatırlamaya değil tanımaya dayalıdır bu nedenle kullanıcı için daha kolaydır. • Seçeneklerin mantıksal olarak gruplanması gereklidir. • Hiyerarşik olarak da gruplanırlar. 1/26/2022 Bahadır YILDIZ 28

Doğal Dil • Kullanıcıların kullandığı dile benzer • Hem konuşmayı hem de yazıyla girilen günlük konuşma dilini anlar, (araştırmalar devam ediyor) • Bir çok nedenle bilgisayarın anlaması zordur, örn: bazı kelimelerin anlamları cümledeki kullanılışına göre değişmektedir, bilgisayar bunları fark edemez. • The boy hit the dog with the stick 1/26/2022 Bahadır YILDIZ 29

Doğal Dil • Tam anlamıyla kullanılamadığı için, kullanıcıların çok fazla beklenti içerisinde olmamaları gerekmektedir. • Kullanıcılar sistemin tanıdığı sözcükleri öğrenerek o şekilde bir iletişim sağlanabilir. 1/26/2022 Bahadır YILDIZ 30

Soru-Cevap ve Sorgu Soru-Cevap (anketler) • Kullanıcıya sorular sorulur ve alınan cevaplara göre etkileşim sağlanır. • Yeni kullanıcılar için uygundur • Kısıtlı bir yapısı vardır Sorgu (SQL vb. ) • Veri tabanından gerekli bilgileri çekmek için kullanılır. • Özel sözdizimleri vardır. • Veri tabanı yapısını anlamayı gerektirir. 1/26/2022 Bahadır YILDIZ 31

Form Doldurma • Veri girerken ya da veri alırken (retrieve) kullanılırlar. • İlgili boşluklara gerekli bilgiler yazılarak kullanılırlar. • Form içerisinde kolay hareket sağlanmalıdır. • Düzeltme olanakları açık olmalıdır. 1/26/2022 Bahadır YILDIZ 32

Tablolama • Tablolar form doldurmanın daha gelişmiş ve daha karmaşık bir çeşididir. • Hücrelerden oluşur, bu hücreler; değerler yada formüller içerir. • Kullanıcı istediği gibi verileri girip değiştirebilir, süreç devam eder. • Son zamanlardaki en tanınmışı Ms Excel’dir. 1/26/2022 Bahadır YILDIZ 33

WIMP Windows Icons Menus Pointers … or windows, icons, mice, and pull-down menus! Özellikle PC’lerde gördüğümüz standart arayüzlerdir. 1/26/2022 Bahadır YILDIZ 34

Nokta ve Tıkla • Bir noktanın ya da belirli bir alanın tıklanması ile çalışmaktadırlar. • Web tarayıcılarda, dokunmatik ekranlı sistemlerde kullanılırlar. • Tıklanacak alanlar bir metinle, bir resimle ya da bir ikon ile belirtilmektedir. • Yazmaktan tasarruf sağlar. 1/26/2022 Bahadır YILDIZ 35

3 Boyutlu Arayüzler • En kolay yolu basit 2 boyutlu ikonlara gölge vermek ya da kabartma haline getirmektir. • 3 D masaüstü video 1/26/2022 Bahadır YILDIZ 36

WIMP arayüz Bileşenleri windows, icons, menus, pointers +++ buttons, toolbars, palettes, dialog boxes 1/26/2022 Bahadır YILDIZ 37

Pencereler • Ekranda bağımsızmış gibi davranan alanlardır. • Yazılar, resimler, şekiller vb bulunabilirler. • Hareket ettirilebilir, boyutlandırılabilirler. • Birbirlerinin üstüne konuşlandırılabilirler. Kaydırma Çubukları : pencere içeriğini aşağı yukarı ya da sağa-sola kaydırmak için kullanılır. Başlık Çubuğu : pencerenin adı yazılıdır. 1/26/2022 Bahadır YILDIZ 38

İkonlar • Küçük resim veya görüntülerdir. • Nesneleri genellikle de pencereleri göstermek için kullanılırlar. • Pencereler simge haline getirildiğinde ikonlar pencereleri temsil ederler. 1/26/2022 Bahadır YILDIZ 39

İşaretçiler (Pointer) • WIMP arayüzler, ekrandaki nesneleri işaretlemek ve seçmek üzerine kurulmuştur. Bu nedenle işaretçiler çok önemlidir. • Mouse, joystick, trackball vb ile hareket ettirilirler. • Çok farklı simgelerle gösterilebilirler. • Simge tıklandığında etkileyeceği alan Hot-Spot olarak adlandırılır ve şekle göre değişiklik gösterebilir. 1/26/2022 Bahadır YILDIZ 40

Menüler • Çeşitli işlemler yapmak için komutlar içeren görsel yapılardır. • İşaretçi ile seçilmesi gerekmektedir. • Penceresiz sistemlerde de kullanılamktadır. 1/26/2022 Bahadır YILDIZ 41

Menüler • Pull-down: işaretçiyi üzerine götürünce kendiliğinden aşağıya doğru açılan menü • Drop-down: işaretçiyi üzerine götürüp tıkladığımızda aşağıya doğru açılan menü • Fall-down: işaretçi başlık çubuğuna girince otomatik olarak görünen menü. • Pop-up: bir ikon yada özel ayrılmış bir alan tıklandığında ortaya çıkan menü. • Pie: işaretçi merkeze alınır ve çevresinde menü seçenekleri oluşur, her seçenek aynı uzaklıktadır. • Cascading: seçeneklerinin alt seçenekleri olan menü. 1/26/2022 Bahadır YILDIZ 42

Menü tasarım sorunları • Ne tarz kullanım • İçerisinde neler olacak • Kullanılacak kelimeler • Nasıl gruplanacak • Klavye kısayollarının seçimi … 1/26/2022 Bahadır YILDIZ 43

Düğmeler • Bir görsel ile belirtilen, bir eylemi tetikleyecek bağımsız bölgelerdir. • Radio buttons : grup düğmeleridir, aynı anda o gruptan sadece 1 seçeneğin seçilmesine izin verir • Check box : birden fazla seçeneğin seçilmesine izin veren seçme kutularıdır. 1/26/2022 Bahadır YILDIZ 44

Araç Çubuğu • Üzerinde ikonlar bulunan uzun çubuklardır. • Çok kullanılan ikonlara ve düğmelere kolay ulaşım sağlarlar. • Düzenlenebilme özellikleri vardır. 1/26/2022 Bahadır YILDIZ 45

Paletler • Menü seçimi vb bir olayla görünür hale gelirler. • bir ikon grubu içerirler. • Bazı sistemlerde menüler de palet haline getirilebilmektedir. • Palet haline getirmek için ayrılabilen menülere de tear-off menü denilmektedir. 1/26/2022 Bahadır YILDIZ 46

İletişim Pencereleri (Dialog Boxes) • Bir durum için kullanıcıdan bilgi almak ya da kullanıcının tepkisini almak için kullanılırlar. • Hata uyarılarında kullanılırlar. • Bir dosya kaydedileceği zaman da gelişmiş bir iletişim penceresi kullanılır. 1/26/2022 Bahadır YILDIZ 47

Etkileşim • Konuşmaya dayalı arayüzler; • Ses tanıma oranı çok düşüktür, ancak uçak rezervasyonu gibi sadece “evet” ve “hayır” cevabı isteyen yerlerde bu sistem işlemektedir. • Konuşmayla sisteme girdi sağlamak çok zordur buna karşın konuşmaya dayalı etkileşim daha kolaydır. 1/26/2022 Bahadır YILDIZ 48

Hissetmek • Etkileşim WIMP arayüzlerde “hissetmeyi” tanımlamak için son derece önemlidir. • Her WIMP arayüzde genel olarak aynı nesneler bulunmaktadır, ancak farklı pencere sistemler farklı davranabilirler. Örn: Mac. Os ve Windows menüleri 1/26/2022 Bahadır YILDIZ 49

İnisiyatif, teşebbüs (initiative) • Eski bilgisayarlarda inisiyatif bilgisayarlarda iken yeni WIMP sistemlerde kullanıcıya geçmektedir. • Bazı durumlarda sistem inisiyatifi kullanıcıdan almaktadır. Örn: uyarı pencerelerinin açılması ve o pencere kapatılmadan başka işlem yapılamaması. • Hatalarda kullanışlı olabilir ancak dikkatli kullanılması gerekmektedir. 1/26/2022 Bahadır YILDIZ 50

Hatalar ve giderilmesi • Hatalardan kaçınılamaz bu nedenle çeşitli yollarla azaltma ve düzelteme yoluna gidilir. • Bunlardan birisi de hata oluştuğu zaman kullanıcıya bildirmektir. • Eğer kullanıcılar hataları bulabilirlerse düzeltebilirler. 1/26/2022 Bahadır YILDIZ 51

Bağlam İnsan sosyal bir varlıktır ve etkileşim de sosyal ve örgütsel bağlamdan etkilenmektedir. • Diğer insanlar – Baskı, rekabet, başaramama korkusu… • Motivasyon – Korku, sadakat, hırs, kendini beğenme… • Yetersiz ya da uygunsuz sistemler – Sistem reddedilmesi, motivasyonsuz çalışma… 1/26/2022 Bahadır YILDIZ 52

Bağlam • Bunların yanında yeni bir teknolojiyle tanışmak, -o anki işine uygun, iyi tasarlanmış ve rekabeti arttıran bir teknolojiysemotivasyonu arttırabilir. • Dönütler de çok önemlidir. Dönüt verilmediği zaman kullanıcı ne yaptığını ya da doğru mu yanlış mı yaptığını fark edemeyebilir, sıkılır, motivasyonunu kaybeder. 1/26/2022 Bahadır YILDIZ 53

Tecrübe • İyi bit tecrübeyi anlayabiliriz ancak tecrübeyi tanımlamak ve tasarlamak oldukça zordur. • Csikszentimihalyi dağa tırmanmak gibi uç(extreme) tecrübeleri gözlemlemiş ve bazen olabilen “total engagement” hissedilebilmesi için kaygı ile can sıkıntısı arasında bir denge olması gerektiğini belirtmiştir ve buna Akış(flow) demiştir. • İnsanlar zaten bildikleri şeyleri yaparken sıkılabilirler, hiç bilmedikleri bir şeyi yaparken de endişe duyarlar, • Bu ikisinin arasında; sıkılmayacak kadar zor ve yabancı, ancak endişe duyulmayacak kadar da kolay olduğu zaman “total engagement” hissedilebilmektedir. 1/26/2022 Bahadır YILDIZ 54

flow • Eğitimde de buna benzer bir olgu vardır: ZPD ( Zone of Proximal Development ). 1/26/2022 Bahadır YILDIZ 55

1/26/2022 Bahadır YILDIZ 56

1/26/2022 Bahadır YILDIZ 57

fill in web form sender receive email To: wxv From: . . recipient closed cracker page watches progress open recipient clicks cracker opens. . . very slowly message open sender cracker page joke links mask 1/26/2022 Bahadır YILDIZ web toy 58

• real cracker virtual cracker • Surface elements • design cheap and cheerful simple page/graphics • play plastic toy and joke web toy and joke • dressing up paper hat mask to cut out • Experienced effects • shared offered to another sent by email message • co-experience pulled together sender can't see content until opened by recipient • excitement cultural connotations recruited expectation • hiddenness contents inside first page - no contents • suspense pulling cracker slow. . . page change • surprise bang (when it works) WAV file (when it works) 1/26/2022 Bahadır YILDIZ 59

Fiziksel Tasarım • Sınırlılıklar – Ergonomi : küçük ya da yakın düğmeler – Fiziksel : Olması gereken boyutlar (yüksek voltaj düğmeleri küçük olamıyor. ) – Yasal ve güvenlik: fırın düğmelerinin sıcak yüzeyden uzak olması – Bağlam ve çevre: kolay temizlenebilir olması – Estetik: güzel görünüyor olması – Ekonomi: çok pahalı olmaması 1/26/2022 Bahadır YILDIZ 60

Trade-off (Bir şey için başka şeyden ödün verme) • Örn: fırın için – düğmelerin ön panelde olması yetişkinler için iyi ve güvenli iken, – Arka panelde olması çocuklar için daha güvenlidir. 1/26/2022 Bahadır YILDIZ 61

Akıcılık • Bir aygıtın fiziksel yapısının, mantıksal yapısnı desteklemesi durumudur. • Örn: aç/kapat düğmeleri 1/26/2022 Bahadır YILDIZ 62

Değer Yönetimi • Bir kişiden bir aygıtı kullanmasını istiyorsak, o kişinin kişisel değerlerini anlamamız gereklidir. – Neden kullanmak istesin? – Kullanınca ne kazanacak? • Burada kazanılacak şey para dışındaki şeyleri de içermektedir; örn: başarılı bir kariyer ya da ekoloji dostu olması gibi… 1/26/2022 Bahadır YILDIZ 63

Değer Yönetimi • Kısaca insanlar bir şey kullanacaklarsa önce değerini fark etmelidir • Ve • Bu değer maliyetinden yüksek olmalıdır. 1/26/2022 Bahadır YILDIZ 64

Teşekkürler… 1/26/2022 Bahadır YILDIZ 65