Interaksi Manusia dan Komputer

DESAIN DAN NOTASI DIALOG

Dialog dapat dinotasikan dalam bentuk diagram maupun dalam bentuk tekstual. Dialog terkait dengan semantik atau apa yang dikerjakan oleh sistem dan presentasi atau bagaimana sitem ditampilkan.

Pengertian dialog adalah sebagai berikut :1. Umum

Dialog adalah proses komunikasi antara dua atau lebih agen. Dalam dialog, makna harus dipertimbangkan agar memenuhi kaidah semantis dan pragmatis

2. IMKDialog adalah pertukaran instruksi dan informasi yang mengambil tempat antara user dan sistem komputer

Notasi dialog pada IMK terdiri dari :1. Diagramatik

Dengan menggunakan teknik State Transtition Network (jaringan transisi kondisi dan status), flowchart (diagram alir) dan diagram JSD (Jackson Structured Design)

2. TekstualDengan menggunakan teknik Formal Grammar (tata bahasa formal), Production Rules (aturan produksi) dan CSP

Pada dasarnya gaya interaksi dan dialog menggunakan menggunakan sistem tanya jawab. Sistem memerlukan input dari user dan sistem akan menjawabapa kebutuhan dari user. Agar user mengerti cara berkomunikasi maka user perlu memahami bahasa komputer.

Bahasa komputer mempunyai tingkatan sebagai berikut :1. Leksikal

Merupakan tingkat yang paling rendah, misalnya bentuk ikon pada layar atau tombol ditekan. Pada bahasa manusia ekuivalen dengan bunyi atau ejaan suatu kata

2. SintaktikUrutan dan struktur input output. Pada bahasa manusia ekuivalen dengan tatabahasa dari suatu kalimat

3. SemantikMakna dari percakapan yang berhubungan dengan pengaruhnya pada struktur data internal komputer. Kondisi internal berasal dari dialog user dan sistem.

STRUKTUR DIALOG MANUSIADialog antara manusia dan komputer bersifat terstruktur sedangkan dialog manusia dengan manusia tidak terstruktur tetapi formal, misal :

Dosen : Apakah matakuliah kalkulus itu sulit ?Mahasiswa : Ya, pak !Dosen : Apakah matakuliah Interaksi Manusia dan Komputer itu sulit ?Mahasiswa : Ya, pak !Dosen : Apa pelajaran yang tidak sulit bagi kalian ? (mulai kesal)Mahasiswa : Semuanya sulit, pak !Dosen : Semuanya keluarkan kertas, kita ulangan… (dengan nada kesal)

Pelajaran dari dialog di atas :1. Kuliah adalah suatu pelayanan2. Skrip dibagi menjadi tiga bagian 3. Pembahasan tentang kesulitan4. Beberapa kontribusi tetap – Ya, pak !

1

Interaksi Manusia dan Komputer

5. Variabel lain – siapa yang selalu mengatakan Iya6. Instruksi – Keluarkan kertas

Jika ada yang mengatakan Tidak, pak maka akan timbul dialog alternatif seperti :

Dosen : Apakah matakuliah kalkulus itu sulit ?Mahasiswa : Ya, pak !Dosen : Apakah matakuliah Interaksi Manusia dan Komputer itu sulit ?Mahasiswa : Tidak, pak !Dosen : Apakah cuma kalkulus yang sulit ?Mahasiswa : Ya, pak !Dosen : Baik. Sekarang kita lanjutkan pelajaran

Struktur dialog manusia kadang dipengaruhi oleh emosi, situasi serta berbagai faktor lain. Oleh karena itu struktur dialog manusia mengandung ketidak konsistenan. Dialog dengan komputer biasanya terstruktur dan terbatas.

Beberapa karakteristik yang ditemukan pada sebuah dialog manusia dengan komputer diantaranya adalah :1. Partisipan harus menyebutkan dialognya dalam urutan tertentu2. Beberapa dialog diantaranya telah ditetapkan sebelumnya3. Beberapa bagian tertentu dari dialog dilakukan secara bersamaan (concurrently)4. Dialog berikutnya pada umumnya tergantung tergantung pada respon dari partisipan5. Dialog dengan komputer mungkin saja tidak mengakomodasi semua kejadian yang mungkin6. Deskripsi dialog biasanya tidak langsung menuju pada arti kata-katanya (semantik) tetapi

pada level sintaksis

Ada beberapa hal yang perlu diperhatikan dalam perancangan dialog, yaitu :1. Rangkaian dialog menggambarkan struktur tugas2. Beberapa rangkaian dialog tambahan digunakan untuk user support misal help system atau

tutorial sub-system3. Rangkaian dialog diurutkan sesuai struktur tugas

Prinsip yang digunakan dalam desain dialog adalah membagi sistem menjadi beberapa bagian yang disebut dengan modul, misalnya pembagian modul dalam sebuah sistem pemesanan buku di perpustakaan seperti gambar berikut :

Ada empat alasan utama penggunaan deskripsi pemisahan dialog, yaitu :1. Mudah dianalisis2. Pemisahan elemen interface dari semantik3. Dapat dilakukan sebelum program ditulis dan memberi dampak pada desain program4. Kadang menggunakan prototipe tool

2

Interaksi Manusia dan Komputer

Kondisi merupakan sesuatu pada saat sekarang yang berhubungan dengan masa lalu dan mempengaruhi masa yang akan datang.

Ada dua masalah pada kondisi, yaitu :1. Terlalu sedikit kondisi

Ada beberapa elemen yang hilang dari spesifikasi sehingga perlu diwaspadai, misal dialog pada tingkat spekulasi

2. Terlalu banyak state (keadaan)Bila state terlalu kompleks mungkin akan terjadi redudansi dan ekstensibilitas

NOTASI DIAGRAMATIKMerupakan bentuk yang sering digunakan dalam notasi dialog. Kelebihannya adalah memungkinkan desainer untuk melihat secara sekilas struktur dialog. Kelemahannya adalah sulit untuk menjelaskan struktur dialog yang lebih luas dan kompleks.

Metode yang digunakan dalam notasi ini adalah :1. State Transition Network (STN)2. Petri Net3. Heral’s State Chart4. Flowchart5. Jackson Structured Design (JSD) Diagram

STATE TRANSITION NETWORK (STN)STN atau kondisi transisi jaringan digunakan sejak tahun 1940-an. Metode ini menggunakan circle atau state yang dihubungkan satu dengan yang lain dengan anak panah yang menandakan suatu aksi atau kejadian.

Aturan dalan STN adalah :1. Dimulai dari START state2. State tengan berhubungan dengan arah panah3. State kadang berputar (iterasi)4. State mungkin meliputi pilihan user5. Diakhiri dengan FINISH state

Contoh :

3

Interaksi Manusia dan Komputer

Dari gambar di atas dapat disimpulkan bahwa STN dapat merepresentasikan beberapa hal yang terkait dengan dialog, yaitu :1. Urutan (sequence) dari aksi yang dilakukan user dan respon yang diberikan oleh sistem2. Pilihan bagi user (choice)

Dari kondisi menu, user dapat memilih circle sehingga sistem berpindah ke circle-1 dan pilihan circle pada menu di-highlight. Alternatif lain, user dapat memilih line sehingga sistem berpindah ke kondisi line-1

3. Iterasi (iteration)Pada kondisi line-2, transisi dapat kembali ke line-2 jika user menambahkan titik baru pada polyline dan akan berpindah ke kondisi finish hingga user melakukan double-click

Setiap lingkaran menandakan kondisi dari sistem, misalnya menu adalah kondisi sistem yang menunggu user untuk memilih circle atau line. Circle-2 adalah kondisi setelah user memilih sebuah titik sebagai pusat lingkaran dan menunggu user menentukan titik akhir lingkaran. Diantara kondisi tersebut terdapat tanda panah yang disebut transisi. Tanda panah diberi label yang menjelaskan tentang tindakan user yag menyebabkan transisi perpindahan kondisi dan respon dari sistem.

Kondisi circle-1 adalah kondisi sistem menunggu user untuk memilih pusat lingkaran. Jika user telah meng-klik pusat lingkaran maka kondisi sistem akan berpindah ke circle-2 dan direspon oleh sistem dengan menggambar rubber band.

Pada hirarki STN, pengaturan dialog yang lebih kompleks dan penamaan sub dialog adalah seperti contoh berikut :

Struktur hirarki STN dapat digunakan untuk sistem yang besar dan memiliki tambahan berupa gabungan kondisi (composite state) yang digambarkan persegi panjang dengan gambar struktur STN berukuran kecil didalamnya. Masing-masing persegi panjang ini menggambarkan submenu yang berkaitan.

STN sangat baik untuk merepresentasikan percontohan, pilihan dan bagian alternatif dari suatu desain namun sangat buruk dalam menangani dialog yang terdiri dari bagian yang sama, misalnya bentuk teks bold, underline, italic dan kombinasi lainnya.

Masalah yang timbul terjadi pada interface manipulasi langsung (direct manipulation interface) misalnya :

4

Interaksi Manusia dan Komputer

Dialog berbarengan 1 : Dialog sederhana dengan tiga penukar kondisi (toggle)

Dialog berbarengan 2 : STN individual untuk bold, italic dan underline

Dialog berbarengan 3 : STN kombinasi untuk bold dan italic

Dialog berbarengan 4 : STN kombinasi untuk bold, italic dan underline. Disebut juga dengan ledakan kombinatorial yang terdiri dari N toggle dan 2n state.

Tombol ESC pada keyboard berfungsi sebagai tombol pembatalan (cancelling key) atau dalam lingkungan web sering menggunakan back. Usahakan menghindari pemisahan panah ESC di setiap submenu.

5

Interaksi Manusia dan Komputer

Tombol ESC mempunyai persamaan dengan menu HELP yang merupakan suatu subdialog ekstra pada STN.

PETRI NETMerupakan salah satu formulasi lama pada ilmu komputer yang menggambarkan suatu penalaran tentang kesamaan aktivitas. Sistem dapat mempunyai lebih dari satu kondisi pada waktu yang sama dan sering digunakan untuk menggambarkan interaksi berbasis web client.

Petri Net menggambarkan suatu interaksi dengan diagram alir yang berhubungan dengan :1. Place : suatu bit seperti state STN2. Transition : suatu bit seperti panah STN3. Counter : berada pada place dan dapat berbarengan pada state dialog

6

Interaksi Manusia dan Komputer

HERAL’S STATE CHARTDiagram dibangun untuk menspesifikasikan secara visual, sistem reaktif yang komplek dan mampu mengakomodasi masalah seperti concurrency dan escape. Diagram ini memiliki struktur hirarki dengan karakter diagram tunggal dan membagi elemen yang merepresentasikan kondisi alternatif serta aktivitas konkuren.

Gambar di atas merupakan diagram kondisi dari panel kendali televisi yang terdiri dari lima tombol ON, OFF, MUTE, SEL dan RESET. Televisi tersebut hanya berada pada kondisi ON atau standby. Misal kita mulai dengan posisi standby, menekan tombol ON atau RESET akan menyebabkan TV menyala dan tombol OFF akan menyebabkan TV kembali ke posisi standby.

Pada saat TV menyala, user dapat mengendalikan suara dengan tombol MUTE yang mengatur suara menjadi ON atau OFF dan saluran TV (channel) dengan tombol SEL untuk memilih salah satu dari empat saluran yang ada.

Garis putus-putus dan AND menyatakan bahwa kedua subdialog dapat dijalankan bersama-sama dalam urutan bebas. Subdialog SOUND mempunyai lingkaran kecil hitam dengan garis lengkung yang menunjukkan kondisi awal dan nilai default yaitu ON.

Subdialog CHANNEL mempunyai tanda H (history) yang mengindikasikan akan mengingat posisi channel terakhir yang diaktifkan user dan pada saat TV dihidupkan akan dimulai pada channel 1. RESET akan mengembalikan kondisi ke default awal dan tombol OFF berfungsi sebagai escape.

FLOWCHARTDiagram alir sangat baik untuk menjelaskan dialog yang sederhana dan menggunakan berbagai jenis kotak untuk merepresentasikan berbagai jenis aktivitas yang berbeda, namun lebih merefleksikan sudut pandang pemrogram dibanding user.

7

Interaksi Manusia dan Komputer

Pada umumnya flowchart sangat akrab dengan pemrograman dan digunakan untuk dialog tetapi tidak untuk algoritma internal, misalnya untuk suatu proses penghapusan entitas dalam database dapat dibuat flowchart sebagai berikut :

Perbedaan utama antara menggunakan flowchart untuk perancangan dialog dengan pemrograman adalah tingkat detail pada sisi program.

JACKSON STRUCTURED DESIGN (JSD)Digunakan untuk berbagai aspek dari analisis tugas dan notasi dialog, misal :

Diagram JSD di atas terbagi menjadi tiga bagian yaitu LOGIN, TRANSACTION dan LOGOUT. Urutan pengoperasiannya berjalan dari kiri ke kanan. Tanda asterik (*) merepresentasikan iterasi atau pengulangan. Tanda (o) merepresentasikan pilihan atau opsional.

NOTASI TEKSTUALPada notasi tekstual terdapat tiga metode yang menjelaskan suatu dialog, yaitu :1. Grammars (tata bahasa)2. Production Rules (aturan produksi)3. CSP (Communicating Sequential Processes) dan proses aljabar

TATA BAHASA (GRAMMAR)Mempunyai arti sebagai aturan dalam menggunakan suatu bahasa. Pada IMK, tata bahasa merupakan suatu ekspresi reguler yang menjelaskan suatu maksud dari suatu kalimat. Salah satu bentuk formal yang sering digunakan untuk notasi dialog tekstual adalah BNF (Backus Naur Form) dan ekspresi reguler.

8

Interaksi Manusia dan Komputer

BNF dan ekspresi reguler berfokus pada aksi yang dilakukan user dimana ekspresi reguler lebih sering digunakan untuk mendeskripsikan kriteria pencarian tekstual yang lebih komplek dan analisis leksikal bahasa pemrograman.

BNF diperluas untuk dialog desain yang meliputi urutan seperti pembuatan polyline pada STN yang direpresentasikan dengan SELECT-LINE CLICK CLICK* DOUBLE-CLICK. BNF tidak baik untuk menangani interface berbasis grafik dan tidak bisa menangani dialog berbarengan atau escape

ATURAN PRODUKSIAturan ini menggunakan kondisi IF kondisi THEN aksi. Bila semua aturan aktif dan sistem cocok dengan bagian dari kondisi maka kondisi selanjutnya tidak akan diperiksa. Atruran produksi sangat baik digunakan untuk tugas yang berbarengan tetapi tidak baik digunakan untuk tugas berurutan.

Atruran produksi memiliki dua tipe, yaitu :1. Event-oriented Rule

Pada event ini terdapat tiga tipe yaitu USER EVENT (begin in upper case), INTERNAL EVENT (begin in lower case) dan system response event (shown in angle brackets), contoh :

2. State-oriented RuleMerupakan aturan yang hanya berorientasi pada setiap kondisi. Misalnya :

CSP dan PROSES ALJABARBaik digunakan untuk dialog berurut, contoh :

9

Interaksi Manusia dan Komputer

Pada deskripsi di atas digunakan beberapa simbol operator, seperti : Simbol ? adalah event yang berupa aksi mouse yang dilakukan user. Event lain yang tidak

diberi simbol merupakan even internal sistem. Simbol = digunakan untuk membangun deskripsi yang berarti “didefinisikan sebagai” Simbol → berarti urutan (sequence) Simbol ; menunjukkan urutan proses Simbol [ ] untuk menunjukkan pilihan Semua nama event pada dialog ditulis dalam huruf kecil, sedangkan nama proses dengan

huruf besar Selain itu terdapat operator | | yang mengindikasikan kondisi paralel dan dapat dijalankan

bergantian

DIALOG SEMANTIKPada dialog semantik terdapat dua aspek dialog, yaitu aplikasi dan user. Pendekatan yang dilakukan untuk menghubungkan dialog semantik adalah :1. Spesifikasi notasi semantik merupakan bentuk semantik dengan tujuan khusus yang didesain

sebagai bagian dari notasi dialog2. Berhubungan dengan bahasa pemrograman dengan menyertakan sebagian pengkodean

bahasa pemrograman ke dalam notasi dialog3. Berhubungan dengan spesifikasi notasi formal

Dialog semantik mempunyai bentuk sebagai berikut :1. Spesifikasi Notasi Semantik

Bentuk ini didesain sebagai bagian dari notasi dialog, misalnya adalah Augmented Transmission Networks (ATN), contoh :

2. Berhubungan dengan Bahasa PemrogramanNotasi dialog sering melampirkan bahasa pemrograman konvensional. Input tool merupakan suatu ekspresi berbasis notasi yang menggunakan bahasa C dalam mengekspresikan dialog semantik. Penandaan dengan menggunakan notasi ; , pilihan menggunakan notasi + dan kondisi dengan notasi :|, contoh :

10

Interaksi Manusia dan Komputer

3. Berhubungan dengan Spesifikasi Notasi Normal SPI (Specifying and Prototyping Interactioni) dibagi menjadi dua bagian :a. EventCSP yang merupakan suatu urutan dialog murni, contoh :

b. EventISL yang merupakan suatu semantik bebas target, contoh :

DESAIN DAN ANALISIS DIALOGTerdapat tiga isu yang berkaitan dengan analisis properti dialog, yaitu :1. Berfokus pada aksi yang dilakukan oleh user, apakah dispesifikasikan dengan cukup

konsisten2. Memperhatikan kondisi dialog, menyangkut kondisi yang diinginkan dan yag ingin dihilangkan3. Isu presentasi dan leksikal, bagaimana tampilan dan fungsi sebuah tombol

PROPERTI AKSIAda tiga aksi dasar yaitu :1. Select from menu2. Click on a point3. Double-click on a point

Ada tiga karakteristik dialog yang berhubungan dengan properti aksi yaitu :1. Kelengkapan

Berupa antisipasi bagaimana perilaku sistem pada kondisi yang tidak diperkirakan atau pada setiap kondisi khusus, misal dengan peringatan atau pembatalan proses yang sedang dilakukan

2. DeterminasiAturan dasar untuk mengatasi dua aturan yang diaktifkan oleh sebuah kejadian.

3. KonsistensiAksi yang sama pada situasi yang berbeda akan melakukan hal yang sama pula.

11

Interaksi Manusia dan Komputer

PRESENTASI DAN PROPERTI LEKSIKALPerancangan dialog harus terpisah (independent) dari perancangan detail dari presentasi dan interface leksikal. Seorang desainer harus menentukan fungsi sistem terlebih dulu baru kemudian menggunakan model kognitif. Desain dialog harus tidak terikat pada detail presentasi dialog, oleh karena itu perlu dihindari :1. "Tekanan" (suara atau pesan) keran menyalahkan user2. Pesan terlalu generik, misalnya WHAT? Atau SYNTAX ERROR3. Pesan yang sulit dimengerti, misal FAC RJCT 004004400400

Kesalahan diklasifikasikan sebagai berikut :1. Mistakes

Merupakan suatu aksi yang diambil berdasarkan keputusan yang salah, misal menggeser icon harddisk ke recycle bin yang berarti menghapus semua file dari harddisk

2. SlipsSuatu kesalahan yangtidak disengaja

3. Capture errorKesalahan karena terlalu sering atau kebiasaan, misal pada editor vi, perintah save (w) menjadi save&quit (wq)

4. Description errorKesalahan dalam melakukan aksi pada objek yang salah, misal klik tanda x untuk menutup editor tetapi yang di-klik adalah jendela aplikasi

5. Data-driven errorKesalahan karena pengaruh data dari area edit, misal menyimpan file dengan sesuatu yang terbaca di sekitar window bukan yang diinginkan

6. Assosiative-activation errorKesalahan karena pengaruh data yang ada di dalam pikiran user saat itu, misal misal menyimpan file dengan sesuatu yang ada di pikiran kita saat itu

7. Loss-of-activation errorKesalahan karena lupa apa yang harus dilakukan, misal lupa apa yang ingin di-search

8. Mode errorKesalahan akibat lupa ada di ‘dunia’ mana, misal mengetik perintah padahal sedang berada di dalam ruang pengeditan teks

9. KeliruAksi salah diambil berdasarkan keputusan yang salah

DESAIN NON ANTROPOMORFIKMerupakan suatu dialog singkat dan praktis yang digunakan pada interface untuk mempertimbangkan hal-hal sebagai berikut :1. Atribut ‘bebas’ dapat membingungkan atau ‘menyesatkan’ user2. Pentingnya perbedaan yang jelas antara orang dan komputer3. Walaupun menarik bagi beberapa orang, suatu interface antropomorfik dapat menimbulkan

keragu-raguan

Antropomorfik artinya memanusiakan mesin, misalnya pesan “Saya akan menunggu Anda memasukkan input” berubah menjadi “Masukkan input!”

12

Interaksi Manusia dan Komputer

LATIHAN1. Buat dialog yang terjadi antara Mesin ATM dengan penggunanya2. Buat Diagram STN dan Petri Net dari menu berikut :

3. Buat diagram heral’s untuk menggambarkan sebuah DVD player4. Buat CSP dari menu pilihan berikut :

13