Teori , Prinsip, dan Pedoman Interaksi Manusia dan Komputer Pertemuan 2
Learning Outcomes Mahasiswa dapat merumuskan rancangan yang terbaik berdasarkan teori, prinsip, dan pedoman dalam perancangan antarmuka.
Topik Bahasan Pendahuluan Teori Tingkat Tinggi Prinsip Pedoman Four Level Approach GOMS Object-Action Interface (OAI) Model Prinsip Pedoman 3
Pendahuluan Panduan bagi perancang tersedia dalam bentuk: Teori-teori tingkat tinggi sebagai kerangka kerja atau bahasa untuk membahas hal-hal tak tergantung aplikasi; Prinsip-prinsip tingkat menengah yang berguna dalam membuat dan membandingkan alternatif desain; Pedoman-pedoman spesifik dan praktis yang memberikan pengingat tentang aturan-aturan berguna yang telah disingkapkan oleh perancang. 4
Teori-teori Tingkat Tinggi Explanatory theory: membantu dalam mengamati kelakuan, menggambarkan kegiatan, menghasilkan desain, membandingkan konsep tingkat tinggi beberapa perancangan, pelatihan. Predictive theory: memungkinkan desainer membandingkan waktu eksekusi atau tingkat kesalahan dalam desain yang diusulkan. 5
Teori-teori Tingkat Tinggi (Lanj.) Predictive theory: Perceptual or cognitive subtasks theory: memperkirakan waktu perseptual atau kognitif: mencari item pada tampilan, perencanaan konversi huruf tebal menjadi miring. Motor-task performance times theory: memperkirakan waktu kinerja seperti penekanan tombol atau pergerakan mouse. Motor (pointing with a mouse), perceptual (finding an item on display), or cognitive (planning the sequence of steps needed to pay a bill) skills. Motor skill performance predicitions are well established and accurate for predicting keystroking or pointing times. 6
Sekilas Beberapa Teori IMK Four-Level Approach (Foley & van Dam) Top-down, descriptive theory yg membagi sistem interaktif menjadi beberapa tingkatan: Konseptual: model mental pemakai tentang sistem interaktif. Semantik: arti yang disampaikan oleh komputer I/O. Sintaktik: pembentukan satuan yang menyampaikan semantik. Leksikal: ketergantungan terhadap piranti dan mekanisme presisi. Sesuai dengan arsitektur software. Memungkinkan modularitas. Page 99-100 7
Sekilas Beberapa Teori IMK (Lanj.) GOMS (Goals, Operators, Methods, and Selection Rules) dan keystroke level model (Card, Moran, dan Newell): Pemakai memformulasikan tujuan (goal) yang dicapai dengan metode (methods) yang terdiri dari eksekusi operators, yang dipilih melalui selection rules. Keystroke-level model memperkirakan waktu kinerja untuk pelaksanaan tugas bebas kesalahan oleh pakar. 8
Variable depending on the length of line Keystroke-level model Operator Name Description Time K Pressing a single key or button Skilled typist (55 wpm) Average typist (40 wpm) User unfamiliar with the keyboard Pressing shift or control key 0.35 (average) 0.22 0.28 1.20 0.08 P P1 Pointing with a mouse or other device to a target on a display Clicking the mouse or similar device 1.10 0.20 H Homing hands on the keyboard or other device 0.40 D Draw a line using a mouse Variable depending on the length of line M Mentally prepare to do something (e.g. make a decision) 1.35 R (t) System response time – counted only if it causes the user to wait when carrying out their task t
Model Antarmuka Objek-Aksi Object-Action Interface (OAI) Model Model sintaktik-semantik dari kelakuan manusia Digunakan untuk menggambarkan pemrograman, manipulasi database, dan manipulasi langsung. Konsep semantik: Diperoleh secara berarti Tersusun rapi Stabil di memori Rincian sintaktik: Dihafal Tidak punya aturan jelas Harus sering diperbarui 10
Model Antarmuka Objek-Aksi (Lanj.) Dengan GUI menggantikan bahasa perintah, fokus pada manipulasi langsung objek dan aksi. Aspek sintaktik tidak dihapuskan, tetapi diminimasi. 11
Hierarki antarmuka objek dan aksi Contoh: penyimpanan informasi pada komputer Objek antarmuka: Konsep tingkat tinggi: Komputer menyimpan informasi Direktori: nama, tanggal penciptaan, pemilik, kontrol akses, dll. File: baris, field, karakter, font, bilangan biner, dsb. Aksi antarmuka: Konsep tingkat tinggi: Mengedit file data teks: buka file, masukkan data, simpan. Simpan: Simpan file, backup, penerapan kontrol akses, menimpa versi sebelumnya, mengganti nama, dsb. 12
Hilangnya Sintaksis Di masa lalu pemakai harus mengingat banyak sekali rincian tergantung piranti. Mempelajari, menggunakan, dan mengingat pengetahuan ini terhambat dua masalah: Rinciannya berbeda di antara sistem dengan cara yang tak dapat diperkirakan. Ketakberaturannya sangat mengurangi keefektifan paired-associate learning. 13
Hilangnya Sintaksis (Lanj.) Mengurangi beban sintaktik: Manipulasi langsung modern Objek dan aksi yang dikenal Modern development tools Widget standar 14
Prinsip-prinsip Prinsip 1: Kenali Perbedaan Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Prinsip 3: Mencegah Kesalahan 15
Prinsip 1: Kenali Perbedaan Jenis-jenis pemakai: Novice (first-time users) Knowledgeable intermittent users Expert frequent users 16
Jenis-jenis pemakai Novice (first-time users) Novice users adalah profesional yang mengerti konsep tentang tugasnya tetapi memiliki konsep pengetahuan antarmuka yang dangkal. Perancangan yang cocok adalah dengan membatasi jumlah pilihan, umpan balik yang informatif, user manual dan tutorial online yang efektif. Knowledgeable intermittent users Adalah profesional yang telah memiliki konsep tugas yang stabil dan konsep antarmuka yang luas namun sulit mengingat atau menguasai struktur menu atau lokasi-lokasi fitur yang tersedia. Perancangan yang cocok adalah dengan menyediakan struktur menu yang rapi, konsisten, kejelasan antarmuka, perlindungan dari bahaya karena eksplorasi fitur. Expert frequent users Adalah profesional yang terbiasa dengan konsep tugas dan antarmuka. Mereka ingin menyelesaikan pekerjaannya dengan cepat. Perancangan yang cocok adalah dengan menyediakan makro, shortcuts, singkatan dan lain sebagainya.
Novice (First-time Users) Konsep tugas dan antarmuka dangkal. Perancangan: Batasi jumlah pilihan Umpan balik yang informatif Manual dan tutorial online yang efekftif. 18
Knowledgeable Intermittent Users Konsep tugas stabil. Konsep antarmuka luas namun sulit mengingat sintaktik. Perancangan: Struktur menu yang rapi Konsistensi Kejelasan antarmuka yang jelas Perlindungan dari bahaya karena eskplorasi fitur. 19
Expert Frequent Users Terbiasa dengan konsep tugas dan antarmuka. Ingin pekerjaan cepat selesai. Perancangan: Makro Shortcuts Singkatan, dsb. 20
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Memberikan pencegahan kesalahan dan penanganan kesalahan yang sederhana. Memungkinkan pembalikan aksi yang mudah. Mendukung pusat kendali internal (internal locus of control). Mengurangi beban ingatan jangka pendek. Berusaha untuk konsisten. Menyediakan usability universal. Memberikan umpan balik yang informatif. Merancang dialog yang memberikan penutupan (keadaan akhir). 21
Eight golden rules of interface design (delapan aturan emas perancangan user interface) menurut Ben Shneiderman dan Catherine Plaisant (2005) : Strive for consistency (berusaha untuk konsisten). Cater to universal usability (memungkinkan frequent users menggunakan shortcuts). Offer informative feedback (memberikan umpan balik yang informatif). Design dialogs to yield closure (merancang dialog yang memberikan penutupan (keadaan akhir)). Prevent errors (memberikan pencegahan kesalahan dan penanganan kesalahan yang sederhana). Permit easy reversal of actions (memungkinkan pembalikan aksi yang mudah). Support internal locus of control (mendukung pusat kendali internal). Reduce short-term memory load (mengurangi beban ingatan jangka pendek).
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Berusaha untuk konsisten. Strive for consistency. Consistent sequences of actions should be required in similar situations; identical terminology should be used in prompts, menus, and help screens; and consistent colors, layout, capitalization, fonts, and so on should be employed throughout. Exceptions, such as required confirmation of the delete command or no echoing of passwords, should be comprehensible and limited in number. 23
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Menyediakan usability universal. Cater to universal usability. Recognize the needs of diverse users and design for plasticity, facilitating transformation of content. Novice to expert differences, age ranges, disabilities, and technological diversity each enrich the spectrum of requirements that guides design. Adding features for novices, such as explanations, and features for experts, such as shortcuts and faster pacing, can enrich the interface design and improve perceived system quality. 24
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Memberikan umpan balik yang informatif. Offer informative feedback. For every user action, there should be system feed-back. For frequent and minor actions, the response can be modest, whereas for infrequent and major actions, the response should be more substantial. Visual presentation of the objects of interest provides a convenient environment for showing changes explicity. 25
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Merancang dialog yang memberikan penutupan (keadaan akhir). Design dialogs to yield closure. Sequences of actions should be organized into groups with a beginning, middle, and end. Informative feedback at the completion of a group of actions gives operators the satisfaction of accomplishment, a sense of relief, a signal to drop contingency plans from their minds, and an indicator to prepare for the next group of actions. For example, e-commerce web sites move users from selecting products to the checkout, ending with a clear confirmation page that completes the transaction. 26
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Memberikan pencegahan kesalahan dan penanganan kesalahan yang sederhana. Prevent errors. As much as possible, design the system such that users cannot make serious errors; for example, gray out menu items that are not appropriate and do not allow alphabetic characters in numeric entry fields. If a user makes an error, the interface should detect the error and offer simple, constructive, and specific instructions for recovery. For example, users should not have to retype an entire name-address form if they enter an invalid zip code, but rather should be guided to repair only the faulty part. Erroneous actions should leave the system state unchanged, or the interface should give instructions about restoring the state. 27
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Memungkinkan pembalikan aksi yang mudah. Permit easy reversal of actions. As much as possible, actions should be reversible. This feature relieves anxiety, since the user knows that errors can be undone, and encourages exploration of unfamiliar options. The units of reversibility may be a single action, a data-entry task, or a complete group of actions, such as entry of a name-address block. 28
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Mendukung pusat kendali internal. Support internal locus of control. Experienced users strongly desire the sense that they are in charge of the interface and that the interface responds to their actions. They don’t want surprises or changes in familiar behavior, and they are annoyed by tedious data-entry sequences, difficulty in obtaining necessary information, and inability to produce their desired result. 29
Prinsip 2: Gunakan Delapan Aturan Emas Perancangan Antarmuka Pemakai Mengurangi beban ingatan jangka pendek. Reduce short-term memory load. Humans’ limited capacity for information processing in short-term memory (the rule of thumb is that we can remember “seven plus or minus two chunks” of information) requires that designers avoid interfaces in which users must remember information from one screen and then use that information on another screen. It means that cell phones should not require re-entry of phone numbers, web-site locations should remain visible, multiple-page displays should be consolidated, and sufficient training time should be allotted for complex sequences of actions. 30
Prinsip 3: Mencegah Kesalahan Membetulkan perintah Mengenali kekurangan perintah dan melengkapinya. Memberikan pilihan sebagai ganti mengetik. Membatasi pilihan Melengkapi urutan aksi Memungkinkan penggabungkan aksi-aksi menjadi suatu aksi baru dengan makro atau sejenisnya. Melakukan aksi-aksi yang tergantung aksi lain secara automatis. Membetulkan pasangan yang bersesuaian Menempatkan tanda pembuka dan penutup dalam satu aksi. Mengingatkan pemakai bahwa tanda penutup belum dipasang. 31
Pedoman Perbedaan antara prinsip dasar dan pedoman yang lebih informal tidaklah tegas. Beberapa contoh pedoman: Pedoman data display Pedoman utk mengarahkan perhatian pengguna Pedoman data entry 32
Konsistensi tampilan data. Smith and Mosier (1986) offer five high-level goals as part of their guidelines for data display (Tujuan Tingkat Tinggi Data Display) Konsistensi tampilan data. Asimilasi informasi yang efisien oleh pemakai. Beban ingatan pemakai yang minimal. Kompatibilitas tampilan data dengan pemasukan data. Fleksibilitas kendali pemakai. 33
Tujuan Tingkat Tinggi Data Display (Smith and Mosier) Konsistensi tampilan data. Consistency of data display. During the design process, the terminolgy, abbreviations, formats, colors, capitalization, and so on should all be standardized and controlled by use of a dictionary of theses items. 34
Tujuan Tingkat Tinggi Data Display (Smith and Mosier) Asimilasi informasi yang efisien oleh pemakai. Efficient information assimilation by the user. The format should be familiar to the operator and should be related to the tasks required to be performed with the data. This objective is served by rules for neat coloumns of data, left justification for alphanumeric data, right justification of integers, lining up of decimal points, proper spacing, use or comprehensible labels, and appropriate measurement units and numbers of decimal digits. 35
Tujuan Tingkat Tinggi Data Display (Smith and Mosier) Beban ingatan pemakai yang minimal. Minimal memory load on the user. Users should not be required to remember information from one screen for use on another screen. Tasks should be arranged such that completion occurs with few actions, minimizing the chance of forgetting to perform a step. Labels and common formats should be provided for novice or intermittent users. 36
Tujuan Tingkat Tinggi Data Display (Smith and Mosier) Kompatibilitas tampilan data dengan pemasukan data. Compatibility of data display with data entry. The format of displayed information should be linked clearly to the format of the data entry. Where possible and appropriate, the output fields should also act as editable input fields. 37
Tujuan Tingkat Tinggi Data Display (Smith and Mosier) Fleksibilitas kendali pemakai. Flexibility for user control of data display. Users should be able to get the information from the display in the form most convenient for the task on which they are working. For example, the order of columns and sorting of rows should be easily changeable by the users. 38
Getting the user’s attention Pedoman utk mengarahkan perhatian pengguna (Wickens and Holland, 2000) Intensitas. (Intensity) Gunakan dua tingkatan, dgn penggunaan intensitas tinggi hanya utk menarik perhatian Penandaan. (Marking) Gunakan garis bawah, dll Ukuran. (Size) Gunakan maksimal 4 ukuran, ukuran yang lebih besar lebih menarik perhatian Pilihan font. (Choice of fonts) Gunakan maks. 3 jenis fonts Inverse Video Gunakan pembalikan warna Blinking. (Blinking) Gunakan secara terbatas Warna. (Color) Gunakan maksimal 4 warna standar. Audio. (Audio) Gunakan nada lembut utk feedback biasa dan nada keras utk kondisi darurat. 39
Konsistensi transaksi pemasukan data. Smith and Mosier (1986) offer five high-level objectives as part of their guidelines for data entry (Tujuan Tingkat Tinggi Data Entry) Konsistensi transaksi pemasukan data. Aksi pemasukan yang minimal oleh pemakai. Beban ingatan pemakai yang minimal. Kompatibilitas pemasukan data dengan tampilan data. Fleksibilitas kendali pemakai. 40
Tujuan Tingkat Tinggi Data Entry (Smith and Mosier, 1986) Konsistensi transaksi pemasukan data. Aksi pemasukan yang minimal oleh pemakai. Beban ingatan pemakai yang minimal. Kompatibilitas pemasukan data dengan tampilan data. Fleksibilitas kendali pemakai. 41
Tujuan Tingkat Tinggi Data Entry (Smith and Mosier, 1986) Konsistensi transaksi pemasukan data. Consistency of data-entry transaction. Similar sequences of actions should be used under all conditions; similar delimiters, abbreviations, and so on should be used. 42
Tujuan Tingkat Tinggi Data Entry (Smith and Mosier, 1986) Aksi pemasukan yang minimal oleh pemakai. Minimal input actions by user. Fewer input actions mean greater operator productivity and – usually – fewer chances for error. Making a choice by a single keystroke, mouse selection, or finger press, rather than by typing in a lengthy string of characters, is potentially advantageous. Selecting from a list of choices eliminates the need for memorization, structures the decision-making task, and eliminates the possibility of typographic errors. However, if users must move their hands from a keyboard to a separate input device, the advantage is negated, because home-row position is lost. Expert users often prefer to type six to eight characters instead of moving to a mouse, joystick, or other selection device. A second aspect of this guideline is that redundant data entry should be avoided. It is annoying for users to enter the same information in two locations, since the double entry is perceived as a waste of effort and an opportunity for error. When the some information is required in two places, the system should copy the information for the user, who should still have the option of overriding it by retyping. 43
Tujuan Tingkat Tinggi Data Entry (Smith and Mosier, 1986) Beban ingatan pemakai yang minimal. Minimal memory load on users. When doing data entry, users should not be required to remember lengthy lists of codes and complex syntactic command strings. 44
Tujuan Tingkat Tinggi Data Entry (Smith and Mosier, 1986) Kompatibilitas pemasukan data dengan tampilan data. Compatibility of data entry with data display. The format of data-entry information should be linked closely to the format of displayed information. 45
Tujuan Tingkat Tinggi Data Entry (Smith and Mosier, 1986) Fleksibilitas kendali pemakai. Flexibility for user control of data entry. Experienced data-entry operators may prefer to enter information in a sequence that they can control. For example, on some occasions in an air-traffic-control environment, the arrival time is the prime field in the controller’s mind; on other occasions, the altitude is the prime field. However, flexibility should be used cautiously, since it goes against the consistency principle. 46
Identify the tasks Task Analysis usually involve long hours observing and interviewing users Decomposition of high level tasks Relative task frequencies 2-47