Materi 6 Ragam Dialog Update

(1)

INTERAKSI MANUSIA DAN MESIN

(2)

 _Dialog_{dalam arti umum adalah} _Percakapan _{antara dua} kelompok atau lebih

 _Dialog_{dalam konteks perancangan user interface adalah}

Struktur dari percakapan antara user dan sistem komputer

 _{Ragam dialog (}_{Dialoque Style}₎_{adalah “Cara yang digunakan}

untuk mengorganisasikan berbagai teknik dialog”

(3)

Sifat Ragam Dialog

1. Inisiatif

2. Luwes

3. Kompleks

4. Kekuatan

(4)

a)

Inisiatif

Pengguna memberikan tanggapan atas prompt yang

diberikan oleh komputer untuk memasukkan perintah

atau parameter perintah

Contoh :

biasanya berupa serangkaian pilihan yang harus

dipilih (

pilihan menu

), atau sejumlah kotak yang dapat

diisi dengan suatu nilai parameter (

password

), atau

suatu pertanyaan yang jawabannya harus dinyatakan

dengan cara tertentu (

ya/tidak

)

(5)

b)

Keluwesan

Pengguna

mempunyai

kesempatan

melakukan

customizing dan memperluas antarmuka dari sebuah

sistem untuk memenuhi kebutuhan.

luwes

atau

fleksibel

adalah sistem yang mempunyai kemampuan

untuk mencapai suatu tujuan lewat sejumlah cara yang berbeda.

sistem

harus dapat

menyesuaikan diri

dengan

keinginan pengguna.

5

(6)

c)

Kekuatan

Kekuatan didefinisikan sebagai jumlah kerja yang

dapat dilakukan oleh sistem untuk setiap perintah

yang diberikan oleh pengguna.

(7)

d)

Kompleksitas

Pengelompokan dalam menerapkan model yang

diinginkan pengguna ke dalam sistem, dan hal ini

dapat diperoleh dengan menggunakan hirarkhi atau

ortogonalitas atau keduanya.

Seorang perancang sistem tidak perlu membuat atau menggunakan

antarmuka lebih dari apa yang diperlukan

, karena tidak ada

keuntungan yang dapat diperoleh, malahan akan menjadikan

implementasinya menjadi lebih sukar.

7

(8)

e)

Beban Informasi

Dalam hal ini menitik beratkan pada penyajian

informasi yang dihasilkan komputer kepada pengguna.

Agar penyampaian informasi itu dapat berdaya guna

dan beban informasi yang terkandung di dalam suatu

ragam dialog

seharusnya disesuaikan dengan

tingkat

pengguna

.

(9)

1) Konsistensi

Sistem yang konsisten akan mendorong pengembangan mentalitas dengan memberikan petunjuk kepada pengguna

untuk mengekstrapolasi pengetahuan yang ia miliki untuk memahami perintah yang baru lengkap dengan pilihan yang ada.

2) Umpan Balik

Pada ragam dialog jika pengguna melakukan kesalahan komputasi, maka program akan menampilkan suatu pesan kesalahan.

9

(10)

3) Observabilitas

Sistem dikatakan mempunyai sifat observabilitas apabila sistem itu berfungsi secara benar dan nampak sederhana bagi pengguna, meskipun sesungguhnya pengolahan secara internalnya sangat rumit.

4) Kontrolabilitas

Kontrolabilitas merupakan kebalikan dari observabilitas, dan hal ini berimplikasi bahwa sistem selalu berada di bawah kontrol pengguna. Agar hal ini tidak tercapai, antarmukanya harus mempunyai sarana yang memungkinkan pengguna

untuk dapat melakukan kendali. 10

(11)

5) Efisiensi

Efisiensi melibatkan unjuk kerja manusia dan komputer secara bersama-sama adalah throughput yang diperoleh dari kerjasama tersebut.

6) Keseimbangan

Strategi yang diambil dalam perancangan sistem manusia-komputer haruslah dapat membagi-bagi pekerjaan antara manusia dan komputer seoptimal mungkin.

11

(12)

1. Dialog berbasis perintah tunggal (Command line dialogue).

“Perintah-perintah tunggal yang dioperasikan tergantung dengan sistem operasi komputer yang dipakai “.

contoh :

DOS (dir, delete, format, copy, dll) Unix / Linux (ls, vi, who, passwd, dll)

(13)

2. Dialog berbasis bahasa pemrograman (Programming language dialogue).

“Dialog yang dikemas sejumlah perintah ke dalam suatu bentuk berkas (file) berupa batch file”.

3. Antarmuka berbasis bahasa alami (Natural language interface).

“Dialog yang berisikan instruksi-instruksi dalam bahasa alami

(manusia) yang diterjemahkan oleh sistem penterjemah“.

13

(14)

4. Sistem Menu

“ Dialog yang menampilkan daftar sejumlah pilihan dalam jumlah terbatas ”

Sistem Menu terbagi menjadi 2 yaitu : a. Sistem Menu Datar

- Selektor pilihan

- Penggunaan Tanda terang (highlight marker) b. Sistem Menu Tarik (Pulldown)

(15)

• _{Sistem menu datar}

(16)

5. Dialog berbasis pengisian formulir (Form filling dialogue).

“Dialog dimana pengguna (user) dihadapkan ke suatu bentuk formulir dilayar komputer yang berisi sejumlah pengisian data dan opsi (option) yang telah ditentukan ”.

(17)

6. Antarmuka berbasis ikon (icon)

“Dialog yang menggunakan simbol atau tanda untuk menunjukan suatu pilihan aktifitas tertentu”.

17

(18)

7. Sistem Penjendelaan

“Sistem antarmuka yang memungkinkan pengguna untuk menampilkan berbagai informasi pada satu atau lebih jendela (window) “.

(19)

8. Manipulasi Langsung.

“Penyajian langsung aktifitas kepada pengguna (user) sehingga aktifitas akan dikerjakan oleh komputer ketika pengguna memberikan instruksi langsung yang ada pada layar komputer“.

19

(20)

9. Antarmuka Berbasis Interaksi Grafis.

“Dialog berbentuk pesan atau informasi pada suatu gambar atau link yang tampil ketika pengguna melakukan suatu

aktifitas“.

(21)

Ada beberapa fungsi yang dapat dimanfaatkan oleh

dengan adanya dialog berbasis jendela ini, yaitu :

a. Lebih banyak informasi yang bisa ditampilkan.

b. Kemungkinan memasukkan lebih dari sebuah sumber informasi

c. mengkombinasikan sejumlah sumber informasi yang berbeda

d. Pengendalian secara bebas dari setiap program yang ada

e. Sebagai saran untuk mengingatkan, bisa digunakan sebagai sarana untuk penyajian berganda.

21

(22)

a)

Jendela TTY (TeleTYpe atau TeleTYpewriter

)

b)

Time-Multiplexed Windows

c)

Space multiplex window

(23)

 _{Jendela TTY merupakan jenis jendela yang paling sederhana.}  _{Secara sekilas jenis jendela ini mirip dengan tampilan apa}

adanya karena jendela TTY hanya terdiri atas sebuah jendela yang mempunyai fasilitas pemindahan halaman (scrolling) secara otomatis pada satu arah.

 _{Contoh sederhana dari jendela TTY adalah jendela (tampilan)}

pada saat Anda berada pada dot prompt.

23

(24)



_Pemikiran

_yang

_mendasari

digunakannya

istilah

time-multiplexed

windows

adalah

bahwa layar tampilan merupakan

sumber

daya

yang

bisa

digunakan secara bergantian oleh

sejumlah jendela pada waktu

yang berlainan

.



_Jenis

_jendela

_ini

_banyak

diterapkan pada

editor teks

(25)



_Dalam

_{space-multiplexed windows,}

_{lebar layar dibagi bagi}

menjadi beberapa jendela dengan ukuran yang bervariasi

,

dan jenis jendelanya dapat ditentukan berdasarkan

ketergantungan antara satu bisa diletakkan “diatas”

jendela yang lain, dan apakah masing-masing jendela bisa

diubah ukurannya.



_{Contoh sistem jendela pada perangkat lunak Bravo, pada}

pengolah kata Word Perfect versi DOS misalnya Word

Perfect versi 5.0 atau5.1, pada Lotus 123 versi DOS

25

(26)

(27)

1) Leksikal

• _{Merupakan tingkat yang}_{paling rendah} • _{Yaitu bentuk}_{icon pada layar}

• _{Pada bahasa manusia, ekuivalen dengan bunyi dan ejaan suatu kata}

2) Sintaksis

• _{Yaitu urutan dan struktur dari input dan output}

• _{Pada bahasa manusia, ekuivalen dengan grammar suatu kalimat}

3) Semantik

• _{Yaitu arti dari percakapan yang berkaitan dengan pengaruhnya pada}

struktur data internal komputer dan/atau dunia eksternal.

• _{Pada bahasa manusia, ekuivalen dengan arti yang berasal dari para}

partisipan dalam percakapan

27

(28)

 _{Berbeda dengan dialog antar manusia pada umumnya, dialog dengan}

komputer biasanya terstruktur dan terbatas

 _{Beberapa ciri-ciri dari dialog terstruktur yang nantinya ditemukan dalam}

dialog komputer:

• _{menyebutkan beberapa hal tertentu secara berurutan}

• _{beberapa bagian dari dialog dilakukan secara bersamaan (concurrently)} • _{dialog berikutnya tergantung pada respons dari partisipan}

• _{dialog terstruktur biasanya tidak langsung menuju pada arti}

kata-katanya / semantik tapi pada level sintaksis

(29)

a)

Rangkaian Dialog menggambarkan struktur tugas,

misalnya :

1 rangkaian dialog untuk mencapai 1 goal

b)

Beberapa rangkaian dialog tambahan digunakan untuk

user support, mis. help system, tutorial sub-sytem

(30)

• Prinsip

yang

digunakan

dalam desain dialog adalah

membagi sistem menjadi

beberapa

bagian

yang

disebut module

• Contoh : Sistem pemesanan

buku di perpustakaan

(31)



_{Dalam mendesain dialog, diperlukan deskripsi yang terpisah}

dari program secara keseluruhan.



_{Notasi deskripsi dialog yang terpisah bertujuan :}

• _{Agar mudah dianalisa}

• _{Pemisahan elemen-elemen interface dari logika program}

(semantik)

• _{Apabila notasi dialog ditulis sebelum program dibuat, maka}

notasi tersebut bisa membantu desainer untuk menganalisa struktur yang diajukan.

(32)

NOTASI DIAGRAMATIK

 _{Notasi diagramatik paling sering digunakan dalam desain dialog}  _Kelebihan:

Memungkinkan desainer untuk melihat secara sekilas struktur dialog

 _Kekurangan:

Sulit untuk menjelaskan struktur dialog yang lebih luas dan kompleks

 _{Contoh notasi diagramatik adalah : State transition networks}

(33)

STATE TRANSITION NETWORKS

(STN)

• _{circles - states}

• _{arcs - actions/events}

Start Menu

Circle 1 Circle 2 Finish

Line 1 Line 2 Finish

select 'circle'

select 'line'

click on centre _{circumference}click on

draw circle rubber band

rubber band draw last

line click on

first point double click

(34)

FLOWCHARTS

 _{use for dialogue}

(not internal algorithm) Please enter Y or N

(35)

(36)

 _{Ekspresi umum}

sel-line click click* dble-click

 _{Dibandingkan dengan JSD}

• Model komputasi sama

• Berbeda notasi

 _{BNF (}_{Backus–Naur Form}₎

expr ::= empty

| atom expr

| '(' expr ')' expr

 _{Lebih powerful daripada STN}

(37)

PRODUCTION RULES

 _{Unordered list of rules:}

if

condition

then

action

• _{condition based on state or pending events} • _{every rule always potentially active}

(38)

Sel-line  first

C-point first  rest C-point rest  rest

D-point rest  < draw line >

 _Note:

 _{events added to list of pending events}

 _{‘first’ and ‘rest’ are internally generated events}

 _{Bad at state!}

(39)

• _{State based} • _Attributes:

Mouse: { mouse-off, select-line, click-point, double-click } Line-state: { menu, first, rest }

• _{Rules (feedback not shown):}

select-line  mouse-off first

click-point first  mouse-off rest click-point rest  mouse-off

double-click rest  mouse-off menu

• _{Bad at events!}

(40)

CSP AND PROCESS ALGEBRAS

 _{used in Alexander's SPI, and Agent notation}  _{good for sequential dialogues}

Bold-tog = select-bold?  bold-on  select-bold? 

bold-off  Bold-tog Italic-tog = . . .

Under-tog = . . .

 _{and concurrent dialogue}

Dialogue-box = Bold-tog || Italic-tog || Under-tog

(41)

Tugas Kategori Ragam Dialog

1. Dialog berbasis perintah tunggal (Command line dialogue).

2. Dialog berbasis bahasa pemrograman (Programming language dialogue). 3. Antarmuka berbasis bahasa alami (Natural language interface).

4. Sistem Menu

5. Dialog berbasis pengisian formulir (Form filling dialogue). 6. Antarmuka berbasis ikon (icon)

7. Sistem Penjendelaan 8. Manipulasi Langsung