D ialogue N otations A nd De sign

1. DialogueNotationsAndDesign Cem Ali Can -2009639014 Ramazan Polat-2009639504

2. Diyalog Gösterimleri • Şematik(Diyagramsal) • Statetransitionnetworks(STN)-Durum geçiş ağları • JSD şemaları • Akış Çizelgeleri • Metinsel • Formal Gramerler-Biçimsel Dilbilgisi • Üretim Kuralları • CSP

3. Diyalog Baglantısı • Sistemin mantığı – Bu ne? Ne iş yapar? • Sistemin tanıtımı –Nasıl görünüyor. • Biçimsel açıklamaları ile analiz edilebilir. • Uyuşmayaneylemler • Geri dönüşüzoreylemler • Eksikeylemler • Potansiyelhatalar

4. Diyalog Nedir? • İki veya daha fazla taraf arasında görüşme.. • Genellikle kooperatiftir. • Kullanıcı arayüzünde • Etkileşim yapısını ifade eder.. • İnsan-bilgisayar arasındaki konuşma ve sözdizimsel düzeyde • Kademeler • Sözcüksel – İkonşekilleri, basılantuşlar • Sözdizimsel – girişveyaçıkışsıralamaları • Anlamsal – Uygulama ve veri üzerindeki etkisi

5. Yapılandırılmış insan diyalogları • İnsan-Bilgisayardiyaloğuçok kısıtlıdır. Memur: Sen «adamınadı» karınolarakkabul … Adam: Evet Memur: Sen«kadınınadı» kocanolarakkabul… Kadın: Evet Adam: Bu yüzükle(Kadınayüzüğütakar) Kadın: Bu yüzükle(Adamayüzüğütakar) Memur: Bu yüzüklerlesizikarıkocailanediyorum

6. DiyalogDersleri • EvlenmeServisi • 3 kişiliksenaryoşeklinde • Belirlisıravar • Bazısözcüklersabit – “Evet” • Bazılarıdeğişken – “Sen«adamınadı»…” • Yüzüktakıldığında «buyüzükle…» şeklindedevamedentalimatlar var. • Bu sözcüklerisöyleyinceevlenmişsayılırmısınız ? • Sadecedoğruyerde ise… • Anlamsaldeğil, sözdizimsel

7. … ve Devamı • Pekikadın “Hayır” derse ? • Gerçekdiyaloglargenelliklealternatiflidir: • Mahkemekararısanığınvereceğiyanıtlarabağlıdır. Hakim: Suçluolduğunuveyaolmadığınınasılsavunursun? Sanık: Suçluveyasuçludeğil

8. Diyalog Gösterim Tasarımı • Diyalogprogramagömülür • Büyükbirsistemdeşunlaryapılabilir: • Diyaloganalizi: • Kullanıcıalışverişsepetini her zamangörebilmeli • Değişikplatformlar (Örn. Windows/Mac) • Diyaloggösterimleri şunlardayardımcıolur: • Sistemanalizi • Sözcükleri Anlamsal ayırtetmede • … vesistemyapılmadanönce • Gösterimler bize önerilen tasarımları anlamamızısağlar.

9. Grafiksel Gösterimler • Durum geçişağları(STN) • Petri nets, • StateCharts - durum çizelgesi • FlowCharts - akışşeması • JSD diyagramları

10. Durum geçişağları(STN) • Daireler - Durumlar • Oklar - Eylemler/Olaylar

11. Durum geçişağları- olaylar • Ok etiketleri biraz sıkışık çünkü • Gösterimde (Notasyon) “durum agır” • Ve olaylar detay gerektirir.

12. Durum geçişağları- durumlar • Dairelerdekietiketlerazbilgiiçerir: • Durumlarıadlandırmakzordur • Amagörselolarakdahakolay

13. GrafikAltmenu Metin Altmenu Resim Altmenu select ‘graphics’ Ana Menu select ‘text’ select ‘paint’ Hiyeraşik Durum GeçişAğları • Karışıkdiyaloglarıyönetmek • Alt-Diyaloglarıadlandırmak

14. Text Style bold italic example underline Eşzamanlı Diyaloglar IBasitdiyalogkutusu

15. bold italic NO bold NO italic NO u’line click on ‘underline’ click on ‘italic’ click on ‘bold’ bold italic u’line underline Eşzamanlı Diyaloglar IIÜçAnahtar – Bağımsız Durum Geçişleri

16. Text Style bold example italic underline italic only bold italic click on ‘bold’ Eşzamanlı Diyaloglar - III Kalınveİtalikkombinasyonu NO style bold only click on ‘bold’ click on ‘italic’ click on ‘italic’

17. NO style bold only ‘bold’ Text Style u’line only bold u’line ‘bold’ bold ‘underline’ ‘underline’ italic example ‘italic’ ‘italic’ underline italic u’line italic only bold italic u’line bold italic ‘bold’ ‘bold’ ‘italic’ ‘italic’ ‘underline’ ‘underline’ Eşzamanlı Diyaloglar - IV Hepsibirlikte –

18. GrafikAltmenu Text Submenu Paint Submenu ESC select ‘graphics’ normal finish ESC Ana Menu select ‘text’ normal finish ESC normal select ‘paint’ finish Escapes • Web’de ‘geri’, çıkış/iptaltuşları • Her yerdebenzerdavranış gösterir. • BundankaçınınYüksekseviyelidiyagramda • Her alt menüiçin‘normal’ çıkış • Alt menünün ‘heryerinde’ • kullanılabilecekçıkış

19. Help Subsystem Help Subsystem Circle 1 Circle 2 Finish click on centre click on circumference from Menu rubber band draw circle press HELPbutton press HELPbutton YardımMenüleri • BenzerProblemler • Neredeyse her yerdeaynı • Amadiyalogdaaynınoktayadönüyor • Durum geçişAğlarıiletanımlanabilir… amaçokkarmaşık

20. Petri nets • Bilgisayar bilimlerinde özellikle birbiri ile eş zamanda çalışan işlerin (concurrentjobs) modellenmesi ve çözülmesinde kullanılan özel grafiklerdir. Bu graflara Yer / Geçiş Ağları (Place / Transition Networks veya P/T Nets) ismi de verilir. • Bilgisayarlardaki en eskiişaretlemelerdenbiri. • Akışgrafiği: • Yerler – STN’dedurumlar’abenzer • Geçişler – STN’deoklarabenzer • Sayaçlar – Durulanyerler (mevcut durum) • Birkaçsayaçkullanılabilir • Eşzamanlıdiyalogdurumları • KullanıcıArabirimibelirtmede • Araçdesteği – Petshop

21. Dairesel Petri Ağları • Paralel Petri Ağları • Koşullu Petri Ağları Örneğin yandaki petriağında 1′den 4′e kadar olan daireler mevsimleri (yaz, bahar, kış, güz) ve a-d arasındaki harflerde mevsim dönüşlerini (ekinoks) göstermektedir. Yukarıdaki şekilde bir döngü halinde mevsim dönüşü görülmektedir. Dairesel Petri Ağları

22. Kalın Açık İtalik Açık Kullanıcı ‘kalın’atıklar Kullanıcı ‘italik’e tıklar T1 T2 T4 T3 Italik Kapalı Kalın Kapalı Kullanıcıdavranışı sayacaaktarılır Tümgirişyerlerinde sayaçvarsa geçiş 'çalıştırılır'

23. Standby AÇIK KAPALI RESET Kanal Ses 1 H On SEL 2 SESSİZ SEL SEL Off 3 SEL 4 Durum Çizelgeleri • UML’dekullanılır • Durum geçişağlarınınuzantısı • Hiyeraşik • Eşzamanlı alt ağlar • Çıkışlar • KAPALI hepaktif • Geçmiş • H ilebelirtilmişbağlantıalt diyaloğagirilen son durumagelir.

24. C1 Kaydı oku diğer E H Bitir C3 C2 Kaydı sil cevap? Sil D2 Sil D3 Sil D1 İsim: Alan Dix Bölüm: Computing Silinsin mi? (Y/N): _ Lütfen E veya H ‘ye basın İsim: Alan Dix Bölüm: Computing Silinsin mi? (E/H): _ Çalışan no. giriniz: ____ Bitir AkışŞemaları • Programcılariçintanıdıktır. • Kutular- İşlem ve olayıgösterir ,Durumlarıdeğil • Diyalogiçinkullanım(içalgoritmadeğil)

25. Çalışması • formal notations – too much work? • COBOL transaction processing • Olay - akış– web arabirimigibi • program yapısı,diyalogyapısı gibi degildir. • DiyalogAkışŞemasıŞunlardaKullanılır • Müşteriilekararlaştırma • KodaÇevirmek • Sistematik Test • 1000% ÜretimKazancı! • formalism saves time!!

26. Çalışan Kaydını Sil PersonelKayıt Sistemi Giriş İşlem * Çıkış Çalışan Kaydı Ekle Çalışan Kaydını Değiştir Çalışan Kaydını Göster JSD Diyagramları • Ağaçyapılıdiyaloglariçin kullanılır. • Dahaucuz • Dahatemiz, anlaşılabilir

27. MetinselGösterimler GramerlerÜretimKuralları CSP veolaycebirleri

28. Metinsel – Gramerler • Sıradan ifadeler sel-line click click* dble-click • JSD ile karşılaştırma • Aynı hesaplama modeli • Farklı gösterim(notasyon) • BNF expr ::= empty | atom expr | '(' expr ')' expr • Sıradan ifadelerden ve STNlerden daha güçlü • Hala eşzamanlı diyalog YOK

29. Üretim Kuralları • SırasızKurallarListesi: • Kurallar listesinde sıra önemli degildir. • if condition then action • Koşul, durum veya bekleyen olaylara dayanmaktadır • Her kural her zaman potansiyel olarak aktif • Eşzamanlılık için iyi • Sıralı için kötü

30. Olay Tabanlı Üretim Kuralları Sel-line first C-point first  rest C-point rest  rest D-point rest  < draw line < • Not: • Olaylar bekleyen olaylar listesine eklenir • ‘first’ ve ‘rest’ içerde oluşturulan olaylar • Durum kısmında kötü!

31. Önkonumlandırmalı Üretim Sistemi • Durum Tabanlı • Özellikleri: • Mouse: { mouse-off, select-line, click-point, double-click } • Line-state: { menu, first, rest } • Kurallar (Geribeslemegösterilmiyor): • select-line -> mouse-off first • click-point first -> mouse-off rest • click-point rest -> mouse-off • double-click rest -> mouse-off menu • Olay kısmında kötü!

32. CSP ve İşlem Cebri • Alexander SPI’ındave agent gösteriminde kullanılır • Sıralı diyaloglar için iyi Bold-tog = select-bold? -> bold-on -> select-bold? ->bold-off ->Bold-tog Italic-tog = . . . Under-tog = . . . • Ve eşzamanlı diyaloglar Dialogue-box = Bold-tog || Italic-tog || Under-tog • Ama nedensellik net değil

33. Diyalog Gösterim- Özet • Diyagramatik • STN, JSD, AkışŞemaları • Metinsel • Gramerler, ÜretimKuralları, CSP • Sonuçlar • Olay Tabanlı vs. Durum Tabanlı • Güç vs. Netlik • Model vs. İşaretleme • Sıralı vs. Eşzamanlı

34. Alexander SPI Anlamsalları (i) • İkiye ayrılır.: • EventCSP – saf diyaloglar için • EventISL - hedef bağımlı diyaloglar için • Diyalog tanımlaması - Merkezi • Sözdizimsel/Anlamsaltakas-yok • tolere edilebilir

35. Alexander SPI Anlamsalları(ii) • EventCSP Login = login-mess -< get-name -< Passwd Passwd = passwd-mess -< (invalid -< Login [] valid -< Session) • EventISL event: login-mess prompt: true out: “Login:” event: get-name uses: input set: user-id = input event: valid uses: input, user-id, passwd-db wgen: passwd-id = passwd-db(user-id)

36. Anlamsallar – Ham Kod switch ( ev.type ) { case button_down: if ( in_text ( ev.pos ) ) { mode = selecting; mark_selection_start(ev.pos); } ... case button_up: if ( in_text ( ev.pos ) && mode == selecting ) { mode = normal; mark_selection_end(ev.pos); } ... case mouse_move: if (mode == selecting ) { extend_selection(ev.pos); } ... } /* end of switch */ • Kelime işlemci için olay döngüsü • Diyalog tanımlaması - Çok dağınık • Sözdizimsel/Anlamsal takas - berbat!

37. Eylem Özellikleri • Bütünlük • Olmayanoklar • Öngörülemeyendurumlar • Belirleme • Tek eylem için birden fazla yönlendirme • Planlama: Uygulama kararı • Accident(Kaza): Üretim kuralları • Yuvalanmış çıkışlar • Tutarlılığı • Aynı eylem, aynı etkiyi mi yapıyor? • Modlar ve görünülebilirlik

38. Özellik Kontrolleri (i) • Bütünlük • Durumaçifttıklanırsa ne olur? ? double click

39. ÖzellikKontrolleri (ii) • Geri dönülebilirlik: • ‘line’ dan geri dönmek için

40. ÖzellikKontrolleri (ii) • Geri dönülebilirlik: • ‘line’ dan geri dönmek için • tıkla

41. ÖzellikKontrolleri (ii) • Geri dönülebilirlik: • ‘line’ dan geri dönmek için • Tıkla- Çift Tıkla

42. ÖzellikKontrolleri (ii) • Geri dönülebilirlik: • ‘line’ dan geri dönmek için • Tıkla- Çift Tıkla- `grafikler‘ i seç • (3 Eylem) • Geri alma • Eylem değil

43. Durum Özellikleri • Ulaşılabilirlik • Her yerden, her yeregidilebiliyor mu ? • Ve ne kadarkolay ? • Geri Dönülebilirlik • Öncekidurumageridönülebiliyor mu? • Ama 'geri al' şeklindedeğil • TehlikeliDurumlar • Bazıgidilmesiistenmeyendurumlar

44. Esc düzenle menu çıkış F1 F2 TehlikeliDurumlar • Kelimeİşlemci: İki mod veçıkış • F1 - Modu değiştirir • F2 - Çıkış (vekaydet) • Esc - Modudeğişimi yok. • ama ... Esc otomatikkaydısıfırlıyor

45. edit menu exit F1 F2 anyupdate Esc edit menu exit F1 F2 Esc TehlikeliDurumlar (ii) • Kaydederek/kaydetmedençıkış->tehlikeli durum • Durumların çoğaltılması- anlamsal ayrım • F1-F2 – Kaydederek Çık • F1-Esc-F2 – Kaydetmeden Çık Save No Save

46. Sözcüksel Sorunlar • Görünebilirlik • Farklılaşmış mod ve durumlar • Diyaloglara ek açıklamalar • Stil • Komut – fiil isim • Mouse tabanlı – isim fiil • Düzen • Sadecegörünüşdeğil...

47. düzenle menu çıkış F1 F2 Esc 1 ... tab F1 F2 ... Esc F3 F4 ... ... Yerleşimin Önemi • Kelime işlemci- tehlikeli durumlar • Eski klavye - OK

48. ... Esc F1 F2 F3 düzenle menu çıkış F1 F2 Esc Yerleşimin Önemi • Yeni klavye yerleşimi F1-F2 ile kayıt yaptığımızı düşünelim Parmağımız Esc’ye değebilir • F1-Esc-F2 – Teklikeli durum! • kaydetmeden çıkar

49. Diyalog Analizi - Sonuç • Anlamsallar ve diyalog • Anlamsalları bağlama vardır. • Yaygın/merkezi diyalog tanımlaması yapılır. • Sözdizimsel tanımlama: maximum düzeydedir. • Diyalog özellikleri • Eylem özellikleri: bütünlük, belirleme, oluşum • Durum özellikleri: ulaşılabilirlik, geri dönülebilirlik, tehlikeli durumlar • Sunum ve sözcüksel çıkarımlar • Görünülebilirlik, stil, yerleşim • Diyalogdan bağımsız değildir.

50. DijitalSaat–KullanıcıTalimatları • İki ana mod • Kısıtlı arayüz - 3 tuşlu • A tuşudurum değiştirir