Ragam Dialog PENDAHULUAN RAGAM DIALOG DIALOQUE STYLE adalah

  • Slides: 46
Download presentation
Ragam Dialog

Ragam Dialog

PENDAHULUAN �RAGAM DIALOG (DIALOQUE STYLE) adalah cara pengorganisasian berbagai teknik dialog interaktif yang memungkinkan

PENDAHULUAN �RAGAM DIALOG (DIALOQUE STYLE) adalah cara pengorganisasian berbagai teknik dialog interaktif yang memungkinkan terjadinya komunikasi antara manusia dengan komputer. �Tujuan perancangan antarmuka dengan berbagai dialog pada dasarnya adalah untuk mendapatkan satu kriteria yang sangat penting dalam pengoperasian sebuah program aplikasi, yakni aspek ramah dengan pengguna (user friendly).

Beberapa sifat penting ragam dialog �Inisiatif �Keluwesan �Kompleksitas �Kekuatan �Beban informasi �Konsistensi �Umpan balik

Beberapa sifat penting ragam dialog �Inisiatif �Keluwesan �Kompleksitas �Kekuatan �Beban informasi �Konsistensi �Umpan balik �Observabilitas �Kontrolabilitas �Efisiensi �Keseimbangan

Beberapa sifat (cont…) �Inisiatif, dpt menentukan tipe-tipe pengguna yg dituju oleh sistem yg dibangun.

Beberapa sifat (cont…) �Inisiatif, dpt menentukan tipe-tipe pengguna yg dituju oleh sistem yg dibangun. Ada 2 : - inisiatif oleh komputer, pengguna memberikan tanggapan atas prompt yg diberikan komputer - inisiatif oleh pengguna, pengguna diharapkan memahami sekumpulan perintah dgn sintaks tertentu �Keluwesan, sistem hrs menyesuaikan diri dgn keinginan pengguna. Keluwesan juga memberi kesempatan pada pengguna utk costumizing sistem

Beberapa sifat (cont…) �Kompleksitas, kita tdk perlu menggunakan atau membuat antarmuka lebih dari apa

Beberapa sifat (cont…) �Kompleksitas, kita tdk perlu menggunakan atau membuat antarmuka lebih dari apa yg diperlukan. �Kekuatan, jml kerja yg dpt dilakukan oleh sistem utk setiap perintah yg diberikan pengguna. misal : pengguna ahli memberikan respon positif thd perintah 2 yg powerful �Beban informasi, penyajian informasi hrs disesuaikan dgn aras pengguna.

Beberapa sifat (cont…) �Konsistensi, perintah hrs mempunyai sintaksis yg terstandarisasi dan urutan parameter hrs

Beberapa sifat (cont…) �Konsistensi, perintah hrs mempunyai sintaksis yg terstandarisasi dan urutan parameter hrs mempunyai tata letak yg konsisten, format pemasukan data hrs kompatibel. Konsistensi bukan berarti semua interface harus terlihat sama

Konsistensi (cont. . ) � Layout � Konsisten menggunakan tampilan sehingga user tahu dimana

Konsistensi (cont. . ) � Layout � Konsisten menggunakan tampilan sehingga user tahu dimana harus melihat instruksi, pesan error dan status suatu informasi. � Information coding � warna � highlighting � Commands � Penggunaan nama perintah/instruksi � standard key bindings e. g. ESC selalu dipakai untuk cancel F 1 selalu dipakai untuk menampilkan help � syntax � Format data entry

Beberapa sifat (cont…) �Umpan Balik, Setiap aksi dari user harus menghasilkan suatu respon yang

Beberapa sifat (cont…) �Umpan Balik, Setiap aksi dari user harus menghasilkan suatu respon yang dapat diterima dengan baik oleh user. Tujuannya adalah untuk mengurangi ketidakpastian /keraguan user bahwa sistem: �menerima input yang terakhir, �sedang mengerjakan sesuatu yang diinginkan user, �sedang menunggu input berikutnya. �Instruksi atau perintah harus menghasilkan suatu perubahan yang nampak pada interface �Misal: ‘mail has been sent’ saat merespon ‘Send’ �Menunjukkan suatu perubahan status objek yang merupakan refleksi perintah user �Informasi yang tepat sebagai feedback mutlak diperlukan

Beberapa sifat (cont…) �Observabilitas, berfungsi secara benar dan nampak sederhana meskipun sebenarnya pengolahan internalnya

Beberapa sifat (cont…) �Observabilitas, berfungsi secara benar dan nampak sederhana meskipun sebenarnya pengolahan internalnya sangat rumit �Kontrolabilitas, sistem selalu berada di bawah kontrol pengguna. �Efisiensi, sangat penting jika berpengaruh pada waktu tanggap atau laju penampilan sistem, seringkali dgn menggunakan hasil teknologi baru.

Beberapa sifat (cont…) �Keseimbangan, perbedaan antara manusia dan komputer : - manusia ; dpt

Beberapa sifat (cont…) �Keseimbangan, perbedaan antara manusia dan komputer : - manusia ; dpt menangani berbagai persoalan yg berurusan dgn perubahan lingkungan, pengetahuan tdk pasti dan tdk lengkap. - komputer dpt melakukan pekerjaan yg berulang dan rutin, penyimpanan dan pencarian data yg handal dan memberikan hasil komputasi yg sangat akurat

RAGAM DIALOG INTERAKTIF �Dialog Berbasis Perintah Tunggal �Dialog Berbasis Bahasa Pemrograman �Antarmuka Berbasis Bahasa

RAGAM DIALOG INTERAKTIF �Dialog Berbasis Perintah Tunggal �Dialog Berbasis Bahasa Pemrograman �Antarmuka Berbasis Bahasa Alami �Sistem Menu �Dialog Berbasis Pengisian Borang �Antarmuka Berbasis Ikon �Sistem Windows �Manipulasi Langsung �Antarmuka Berbasis Interaksi Grafis

Karakteristik Ragam Dialog yg Baik (Neilsen) �Menggunakan urutan dialog yang simple dan alami �Menggunakan

Karakteristik Ragam Dialog yg Baik (Neilsen) �Menggunakan urutan dialog yang simple dan alami �Menggunakan bahasa user �Meminimalkan user memory load �Konsisten �Menyediakan Feedback �Menyediakan shortcuts �Menyediakan pesan error yang baik �Mencegah errors

DIALOG BERBASIS PERINTAH TUNGGAL �Perintah-perintah tunggal yang dapat dioperasikan biasanya tergantung dari sistem komputer

DIALOG BERBASIS PERINTAH TUNGGAL �Perintah-perintah tunggal yang dapat dioperasikan biasanya tergantung dari sistem komputer yang dipakai, dan berada dalam domain yang disebut bahasa perintah (command language) �Bahasa perintah harus dirancang sedemikian rupa shg mudah dipelajari dan diingat oleh kebanyakan pengguna �Contoh : Perintah-perintah yang dimiliki oleh DOS dan UNIX

DOS �Perintah DOS dibagi 2 : 1. Internal Command (tidak memerlukan berkas. EXE dan.

DOS �Perintah DOS dibagi 2 : 1. Internal Command (tidak memerlukan berkas. EXE dan. COM) CONTOH : C : >DIR menampilkan nama berkas yang terdapat pada hardisk C : >COPY *. DOC A: NASKAH perintah membuat salinan semua berkas berpengenal. DOC dari hardisk C ke disket pada pemutar A dan ditempatkan dalam direktori NASKAH.

2. External Command (memerlukan berkas. EXE dan. COM) CONTOH : C : DOS>FORMAT A:

2. External Command (memerlukan berkas. EXE dan. COM) CONTOH : C : DOS>FORMAT A: /S perintah untuk memformat disket pada pemutar A sekaligus menyalin sistem ke dalam disket tsb. Perintah ini memerlukan berkas FORMAT. COM C : DOS>DELTREE C : NASKAHSOAL perintah yang digunakan untuk menghapus direktori SOAL yang berada di dalam direktori NASKAH di dalam hardisk C Perintah ini memerlukan berkas DELTREE. EXE

Contoh

Contoh

KEUNTUNGAN DAN KERUGIAN PENGGUNAAN DIALOG BERBASIS PERINTAH TUNGGAL Keuntungan § cepat § akurat §

KEUNTUNGAN DAN KERUGIAN PENGGUNAAN DIALOG BERBASIS PERINTAH TUNGGAL Keuntungan § cepat § akurat § efisien § ringkas § luwes § inisiatif oleh pengguna Kerugian § memerlukan pelatihan yang lama § membutuhkan penggunaan yang teratur § beban ingatan yang tinggi § Jelek dalam menangani kesalahan

Beberapa saran perlu dipertimbangkan u/ meminimalkan beban ingatan dan kesalahan pengetikan, antara lain adalah

Beberapa saran perlu dipertimbangkan u/ meminimalkan beban ingatan dan kesalahan pengetikan, antara lain adalah : �Pilihlah kata kunci yang mudah diingat �Gunakan format perintah yang konsisten �Gunakan untaian kata yang pendek �Tambahkan fasilitas (help) �Gunakan nilai-nilai default untuk mengurangi kesalahan ketik �Sediakan pesan-pesan yang jelas, dan jika masih banyak kesalahan yang muncul �Gunakan ragam inisiatif oleh komputer

DIALOG BERBASIS BAHASA PEMROGRAMAN �Merupakan ragam dialog yang memungkinkan pengguna untuk mengemas sejumlah perintah

DIALOG BERBASIS BAHASA PEMROGRAMAN �Merupakan ragam dialog yang memungkinkan pengguna untuk mengemas sejumlah perintah kedalam suatu berkas yang sering disebut batch file. �Perintah yang dituliskan tidak harus menggunakan salah satu bhs pemrograman baik aras rendah maupun aras tinggi seperti assembler, Pascal, C, FORTRAN atau BASIC, tetapi tetap harus mengikuti aturan-aturan tertentu.

DIALOG BERBASIS ALAMI �Pada dialog berbasis bahasa alami pengguna menggunakan instruksi-instruksi dalam bahasa alami

DIALOG BERBASIS ALAMI �Pada dialog berbasis bahasa alami pengguna menggunakan instruksi-instruksi dalam bahasa alami yang lebih umum sifatnya, pengguna dapat secara bebas memberikan instruksinya dengan kalimat yang lebih “manusiawi”. �Contoh instruksi bahasa alami : Cetak daftar semua mahasiswa yang mempunyai IP semester lebih besar dari 3, 0

�Bahasa diatas kemudian diterjemahkan ke dalam instruksi yang ekuivalen dengan dbase atau foxpro, sebagai

�Bahasa diatas kemudian diterjemahkan ke dalam instruksi yang ekuivalen dengan dbase atau foxpro, sebagai : �DISPLAY ALL FOR IPSEM > 3. 0 �Atau dalam dialek Turbo Pascal while not eof (T) do begin readln(T, S) ; if S. Ip. Sem > 3. 0 then writeln(S. Nama. Mahasiswa); end;

Keuntungan dan kerugian penggunaan antarmuka berbasis bahasa alami Keuntungan § tidak memerlukan sintaksis khusus

Keuntungan dan kerugian penggunaan antarmuka berbasis bahasa alami Keuntungan § tidak memerlukan sintaksis khusus § luwes dan powerful § alamiah § merupakan inisiatif campuran Kerugian § mempunyai dualisme § bertele-tele § opaque (tidak jelas) § perancangan perangkat lunak yang rumit § tidak efisien

SISTEM MENU �Menu adalah daftar sejumlh pilihan dlm jml terbatas. �Berdasarkan teknik penampilan pilihan-pilihan,

SISTEM MENU �Menu adalah daftar sejumlh pilihan dlm jml terbatas. �Berdasarkan teknik penampilan pilihan-pilihan, dikenal 2 sistem menu : Menu datar dan Menu tarik (pulldown). �Sistem menu datar adalah sistem menu yang menampilkan semua pilihan secara lengkap. �Sistem menu tarik adalah sistem menu yang akan menampilkan pilihan dalam kelompok-kelompok tertentu.

Sistem Menu (cont. . ) �ragam interaksi pada sistem menu datar dapat berupa: �Selektor

Sistem Menu (cont. . ) �ragam interaksi pada sistem menu datar dapat berupa: �Selektor pilihan, dpt berupa angka, huruf atau campuran angka dan huruf. �Penggunaan tanda terang, dgn bantuan tombol khusus ; , , atau bantuan mouse �Kombinasi dari kedua ragam di atas.

Sistem Menu (cont. . ) Utk menu yg mempunyai banyak pilihan, biasanya menggunakan menu

Sistem Menu (cont. . ) Utk menu yg mempunyai banyak pilihan, biasanya menggunakan menu tarik. Beberapa pilihan menu tarik : - Status - Shortcut, kombinasi tombol 2 khusus misal : Ctrl + N

Struktur Pohon Sistem Menu Tarik Menu utama File Edit Draw table Table Insert Column

Struktur Pohon Sistem Menu Tarik Menu utama File Edit Draw table Table Insert Column to right Delete Column to left

Contoh :

Contoh :

Keuntungan dan kerugian sistem menu �Keuntungan : - Memerlukan sedikit pengetikan - Beban memori

Keuntungan dan kerugian sistem menu �Keuntungan : - Memerlukan sedikit pengetikan - Beban memori rendah - Struktur terdefinisi dengan baik - Perancangan yang mudah �Kerugian - Seringkali lambat - Memakan ruang layar - Tidak cocok untuk aktifitas Pemasukan data - Tidak cocok untuk dialog terinisasi pengguna - Tidak cocok untuk dialog terinisasi campuran

DIALOG BERBASIS PENGISIAN BORANG �Teknik dialog berbasis pengisian borang (form filling dialogue) merupakan suatu

DIALOG BERBASIS PENGISIAN BORANG �Teknik dialog berbasis pengisian borang (form filling dialogue) merupakan suatu penerapan langsung dari aktifitas pengisian borang dalam kehidupan sehari-hari dimana pengguna akan dihadapkan suatu bentuk borang yang ada di layar komputer yang mereka gunakan. �Kualitas antarmuka berbasis pengisian borang tergantung pada tiga aspek: � Tampilan pada layar monitor yang mencerminkan struktur data masukan yang diperlukan oleh sistem. � Kejelasan perancangan dan penyajiannya secara visual pada layar monitor. � Derajat kebenaran dan kehandalan penerimaan data masukan oleh program lewat berbagai fasilitas pemasukan data yang ada di dalam borang tersebut.

Hal yg perlu diperhatikan dalam perancangan tampilan 1. Proteksi tampilan, pembatasan tampilan yg tidak

Hal yg perlu diperhatikan dalam perancangan tampilan 1. Proteksi tampilan, pembatasan tampilan yg tidak dapat diakses pengguna. 2. Batasan medan tampilan, penentuan panjang yang tetap atau berubah, menggunakan format bebas atau tertentu. 3. Isi medan, petunjuk pengisian tampilan. 4. Medan opsional, dinyatakan secara tekstual atau menggunakan aturan tertentu, seperti penggunaan warna berintensitas rendah, warna tampilan yang berbeda, dan lain-lain.

Hal yg perlu diperhatikan (cont. . ) �Default. tentukan tempatnya, apakah pada bagian yang

Hal yg perlu diperhatikan (cont. . ) �Default. tentukan tempatnya, apakah pada bagian yang tidak dapat diakses pengguna ataukah pada bagian pemasukan data. �Bantuan, bantuan (help) cara pengisian borang. �Medan penghentian. Masukan data dapat diakhiri dengan menekan tombol Enter atau Return atau mengisi karakter terakhir dengan karakter tertentu atau dengan cara berpindah ke medan lain. �Navigasi. menggunakan tombol Tab untuk urutan yang tetap, atau dapat pula digerakkan secara bebas menggunakan mouse.

Hal yg perlu diperhatikan (cont. . ) � Pembetulan kesalahan. menggunakan tombol Back. Space

Hal yg perlu diperhatikan (cont. . ) � Pembetulan kesalahan. menggunakan tombol Back. Space dengan menindihi (overwrite) isian lama, dengan jalan membersihkan dan mengisi kembali medan tersebut, dan lain-lain. � Penyelesaian. memberitahu pengguna bahwa seluruh proses pengisian telah selesai.

Keuntungan dan kerugian Dialog Berbasis Pengisian Borang Keuntungan Kerugian § pengguna sudah terbiasa §

Keuntungan dan kerugian Dialog Berbasis Pengisian Borang Keuntungan Kerugian § pengguna sudah terbiasa § seringkali lambat dengan pengisian borang § memakan ruang layar § isian data yang (khususnya untuk menu disederhanakan § diperlukan sedikit pelatihan § beban memori rendah § strukturnya jelas § perancangan mudah § tersedia berbagai piranti bantu perancangan tampilan datar) § tidak cocok untuk pemilihan perintah/instruksi § memerlukan pengontrol kursor § mekanisme navigasinya tidak terlihat secara eksplisit § memerlukan suatu bentuk pelatihan

DIALOG BERBASIS IKON (icon-based user interface) �Adalah ragam dialog yang banyak menggunakan simbol-simbol dan

DIALOG BERBASIS IKON (icon-based user interface) �Adalah ragam dialog yang banyak menggunakan simbol-simbol dan tanda-tanda untuk menunjukkan suatu aktifitas tertentu. �Keuntungannya gambar bersifat umum, mudah diingat, mudah dipelajari shg mempertinggi kinerja pengguna, tidak bergantung pada suatu bahasa. �Kerugian : cenderung membingungkan, boros tempat, dan sangat tidak efektif, tidak adanya standarisasi bentuk-bentuk ikon seringkali menimbulkan persoalan tersendiri.

Contoh :

Contoh :

SISTEM PENJENDELAAN �Jendela (window) adalah bagian dari layar yang digunakan untuk menampilkan informasi. �Sistem

SISTEM PENJENDELAAN �Jendela (window) adalah bagian dari layar yang digunakan untuk menampilkan informasi. �Sistem penjendelaan adalah sistem antarmuka yang memungkinkan pengguna untuk menampilkan berbagai informasi baik sendiri maupun secara bersama-sama ke dalam bagian-bagian layar yang tidak saling mempengaruhi. �Jenis-jenis jendela Ø Jendela TTY Ø Time-Multiplexed Windows Ø Space-Multiplexed Windows Ø Jendela non Homogen

�Jendela TTY : jendela paling sederhana, contohnya adalah ketika anda berada pada dot prompt.

�Jendela TTY : jendela paling sederhana, contohnya adalah ketika anda berada pada dot prompt. �Time-Multiplexed Windows : jendela yang dapat digeser (scrollable windows), dan frame-at-a-time windows. Contoh : text editor atau menu tarik �Space-Multiplexed Windows : lebar layar dibagi menjadi beberapa jendela dengan ukuran yang bervariasi. Contoh : Microsoft Windows XP �Jendela non Homogen : jenis jendela yang tidak dapat dikelompokkan dalam jendela-jendela diatas. Contoh : ikon dan zooming window

Pemanfaatan Sistem Penjendelaan �Penampilan lebih banyak informasi �Pengaksesan lebih banyak sumber informasi �Pengkombinasian berbagai

Pemanfaatan Sistem Penjendelaan �Penampilan lebih banyak informasi �Pengaksesan lebih banyak sumber informasi �Pengkombinasian berbagai sumber informasi �Pengontrolan bebas atas sejumlah program �Pengingatan �Command context/active form �Penyajian jamak

MANIPULASI LANGSUNG �Ragam dialog yang menyajikan langsung suatu aktifitas oleh sistem kepada pengguna sehingga

MANIPULASI LANGSUNG �Ragam dialog yang menyajikan langsung suatu aktifitas oleh sistem kepada pengguna sehingga aktifitas itu akan dikerjakan oleh sistem komputer ketika pengguna memberikan langsung instruksi lewat manipulasi langsung dari semacam kenyataan maya (virtual reality) yang terpampang lewat tampilan yang muncul di layar. �Penerapan manipulasi langsung : - kontrol proses contoh : sistem pembangkitan dan penyaluran listrik yang terhubung dengan sistem secara online - Simulator Adalah sistem miniatur yang mencoba menirukan kerja suatu sistem yang berskala sangat besar atau sangat kecil jika dilihat dari kacamata orang awam. contoh : Simulator penerbangan

- Kontrol lalu lintas penerbangan Dunia 3 dimensi tempat sebuah pesawat sedang menjelajahi dunia

- Kontrol lalu lintas penerbangan Dunia 3 dimensi tempat sebuah pesawat sedang menjelajahi dunia akan diterjemahkan ke dalam layar 2 dimensi yang ada di hadapan seorang operator. Lewat tampilan 2 dimensi yang merefleksikan dunia 3 dimensi itulah seorang operator dapat mengontrol lalu lintas penerbangan - Perancangan berbantuan komputer Atau (Computer Aided Design) contoh : penggunaan program Auto. CAD,

Keuntungan dan kerugian Penggunaan Dialog Berbasis Manipulasi Langsung Keuntungan Kerugian § mempunyai analogi yang

Keuntungan dan kerugian Penggunaan Dialog Berbasis Manipulasi Langsung Keuntungan Kerugian § mempunyai analogi yang jelas § memerlukan program yang dengan suatu pekerjaan nyata § mengurangi waktu pembelajaran § memberikan tantangan untuk eksplorasi pekerjaan yang nyata § penampilan visual yang bagus § mudah dioperasikan § tersedianya berbagai perangkat bantu u/ merancang ragam dialog manipulasi langsung rumit dan berukuran besar § memerlukan tampilan grafis berkinerja tinggi § memerlukan piranti masukan seperti mouse, trackball § memerlukan perancangan tampilan dengan kualifikasi tertentu

DIALOG BERBASIS INTERAKSI GRAFIS Agak susah dibedakan dengan antarmuka berbasis manipulasi langsung. Secara umum,

DIALOG BERBASIS INTERAKSI GRAFIS Agak susah dibedakan dengan antarmuka berbasis manipulasi langsung. Secara umum, keuntungan dan kerugian teknik antarmuka berbasis interaksi grafis sama dengan keuntungan dan kerugian menggunakan manipulasi langsung Contoh : Pada Microsoft Word ketika kursor mendekati suatu ikon akan muncul pesan yang menunjukkan arti ikon tsb.

TUGAS Cari contoh studi kasus di dunia nyata! Buat interface untuk studi kasus tersebut!

TUGAS Cari contoh studi kasus di dunia nyata! Buat interface untuk studi kasus tersebut! Keterangan : Dialog Berbasis Bahasa Pemrograman Dialog Berbasis Pengisian Borang Manipulasi Langsung

Contoh : Ragam dialog pengisian borang Keterangan : Dialog ini digunakan untuk memasukkan data

Contoh : Ragam dialog pengisian borang Keterangan : Dialog ini digunakan untuk memasukkan data pemohon beasiswa di universitas trunojoyo.

REFERENSI Andy Downtown, Graham Leedham, “Human Aspect of Human Computer Interaction” in Engineering the

REFERENSI Andy Downtown, Graham Leedham, “Human Aspect of Human Computer Interaction” in Engineering the Human Computer Interface, Mc Graw Hill International Edition, 2003 Shneiderman, Ben, “Designing the user interface : strategies for effective human-compver interaction, third edition”, Addison Wesley, 1996 Santosa, Insap Interaksi Manusia dan Komputer, Teori & Praktek, Andi Yogyakarta Surbakti, Irfan; Santosa, Insap; Interaksi Manusia Dan Komputer, Edisi Jurusan Teknik Informatika-ITS, 2006 Modul interaksi manusia dan komputer