BAB - III INTERAKSI By. Alan Dix, Janet Finlay, Gregory D. Abowd, Russell Beale
• Model interaksi 3.1. Pendahuluan
– Memahami apa yang terjadi di dalam interaksi antara pengguna dan sistem.
• Ergonomi – Merupakan karakteristik fisik interaksi dan bagaimana ini mempengaruhi efektivitas dari kerja sistem
• Gaya interaksi – Dialog antara pengguna dan sistem dipengaruhi oleh gaya antarmuka.
• Konteks – Interaksi terjadi dalam konteks sosial, organisasi yang mempengaruhi baik pengguna dan sistem
3.2. Model Interaksi
• Interaksi melibatkan setidaknya dua peserta: user dan sistem. – Keduanya sangat kompleks, seperti telah kita lihat, dan sangat berbeda satu sama lain – User dan sistem berkomunikasi dengan melihat domain dan tugas/task
• Model yang paling berpengaruh di interaksi, siklus evaluasi (Norman) dan pelaksanaan • Kedua model ini menggambarkan interaksi dalam hal tujuan dan tindakan dari pengguna.
3.2.1. Syarat--syarat Syarat Interaksi
• Domain – Merupakan keahlihan dan pengetahuan dalam beberapa kegiatan – Terdiri dari konsep-konsep yang menyoroti aspek-aspek penting
• Tujuan – Output yang diinginkan dari sebuah tugas yang akan dilaksanakan
• Rencana/niat – Aksi khusus untuk memenuhi tujuan
• Tugas/task – Operasi untuk memanipulasi konsep domain
3.2.2. Pelaksanaan Siklus Interaksi
• Siklus interaktif dapat dibagi menjadi dua fase utama: pelaksanaan dan evaluasi. • Tahapan model Norman : 1. 2. 3. 4. 5. 6. 7.
Menetapkan tujuan. Membentuk rencana/niat. Menentukan urutan aksi. Eksekusi aksi. Memahami keadaan sistem Menginterpretasikan keadaan sistem Mengevaluasi keadaan sistem, yang dihubungkan ke tujuan dan rencana
3.2.1. Syarat--syarat Syarat Interaksi
• Human Error – Slip • Sengaja menekan tombol mouse pada waktu yang salah • Anda melakukan tindakan yang tepat, tetapi gagal untuk melaksanakannya • Dapat dikoreksi (misnya desain layar yang lebih baik) • Melakukan tindakan yang salah
– Mistake/kesalahan • Anda mungkin berpikir bahwa ikon kaca pembesar adalah suatu fungsi, tetapi sebenarnya itu adalah untuk memperbesar teks • Pengguna harus memiliki pemahaman yang lebih baik tentang sistem
3.2.2. Kerangka Interaksi
• Ada empat komponen utama dalam sistem Interaktif 1. 2. 3. 4.
Sistem Pengguna Input Output
3.2.2. Kerangka Interaksi
Kerangka Interaksi secara umum
Hubungan diantara komponen
3.3. Kerangka Kerja dan HCI
Interface dibentuk dari gabungan antara input dan output.
3.4 Ergonomi
• Ergonomi (faktor manusia) merupakan studi tentang karakteristik fisik dari interaksi • bagaimana kontrol didesain, lingkungan fisik di mana interaksi berlangsung, dan tata letak dan kualitas fisik layar • Dalam pembahasan ergonomi, terdiri dari : 1. 2. 3. 4.
Penyusunan kontrol dan tampilan Lingkungan fisik dari interaksi Masalah kesehatan Penggunaan warna
3.4.1. Penyusunan Kontrol dan Tampilan
• Dalam penyusunan kontrol dan tampilan dapat dikelompokkan menjadi: – Fungsi kontrol dan display • Diatur sehingga orang-orang yang secara fungsional terkait ditempatkan bersamasama,
– Sekuensial kontrol dan display • Mencerminkan urutan penggunaannya dalam interaksi yang khas (mungkin ini sangat tepat dalam domain di mana khususnya diberlakukan urutan tugas
– Frekuensi kontrol • Seberapa sering penggunaan dan yang paling mudah diakses
3.4.2. Lingkungan Fisik Dari Interaksi
• Menangani masalah-masalah fisik dalam tata letak dan pengaturan antarmuka • Pengguna/user harus nyaman pabila melihat display/tampilan • Untuk penggunaan waktu yang lama, pengguna harus duduk dengan nyaman • Pengguna harus memiliki ruang gerak untuk menjangkau semua control yang disediakan oleh sistem
3.4.3. Masalah Kesehatan
• Faktor-faktor dalam lingkungan fisik yang secara langsung mempengaruhi kualitas interaksi dan kinerja user 1. 2. 3. 4. 5.
Posisi fisik Suhu Pencahayaan Gangguan suara Waktu
3.4.4. Penggunaan Warna
• Jika warna digunakan sebagai indikator maka tidak diperkenankan menjadi satu-satunya petunjuk • Warna-warna yang digunakan juga harus sesuai dengan konvensi dan penggunaannya. – Merah, hijau dan kuning adalah warna yang sering diasosiasikan dengan berhenti, pergi dan berhati - hati. – Oleh karena itu, merah dapat digunakan untuk mengindikasikan darurat dan alarm; – hijau, aktivitas normal dan – kuning siaga
• Konvensi warna ditentukan secara kultural. – merah diasosiasikan dengan bahaya dan peringatan dalam kebanyakan budaya barat, – tetapi di Cina melambangkan kebahagiaan dan nasib baik.
• Kesadaran asosiasi budaya warna sangat penting dalam merancang sistem dan website untuk pasar global
3.5. Gaya/Model Interaksi
1. 2. 3. 4. 5. 6. 7. 8.
Macam-macam model/bentuk interface Interaksi
Command line interface Menu Natural language Question/answer & query dialog Form-fills & spreadsheet WIMP Point & click Three-dimensional interface
3.5.1. Command Line Interface
• •
•
Merupakan perintah secara langsung pada fungsi sistem Perintahnya lebih fleksibel tetapi susah digunakan dan dipelajari, karena menggunakan perintah sistem Merupakan perintah yang menggunakan bahasa dan teknik tersendiri
3.5.2. Menu
•
•
Pengguna dapat melihat monitor dan menggoperasikannya menggunakan mouse/angka / alpabetic keys Menu terbagi menjadi 3 bagian : – Menu Pulldown – Menu Bar – Pop-Up Menu/shortcut menu
•
Hanya sebagian dari sistem WIMP
3.5.3. Natural Language
• Merupakan komunikasi yang interaktif dengan komputer • Pengguna dapat mengingat perintah yang telah dilakukan dengan menu hirarki
3.5.4. Question/ Answer & Query Dialog
•
•
•
Merupakan komunikasi dengan input pertanyaan yang hendak tahu jawabannya, dan komputer akan merespon pertanyaan tersebut Selain itu dapat berkomunikasi dengan bahasa query yang informasinya berasal dari database contoh : pada web dalam bentuk kuesioner. Interface ini mudah dipelajari dan digunakan, tetapi terbatas pada fungsinya
3.5.5. Form--Fills & Form Spreadsheet
• Merupakan komunikasi dengan inputannya berbentuk formulir pengisian • Selain itu dapat berkomunikasi dengan inputannya berbentuk spreadsheet
3.5.6. WIMP
• Merupakan komunikasi dengan menggunakan berbagai macam diantaranya yang berbentuk window, icon, menu dan pointer
3.5.7. Point & Click Interface
• Merupakan komunikasi dengan menggunakan tombol pointer dan klik • Contoh : hypertext • Point & click ini sangat populer pada WWW – World Wide Web Pages • Tipe navigasi yang digunakan adalah Highlighted words, maps dan iconic buttons
3.5.8. Three-Three Dimensional Interface
• Merupakan teknik 3D • Contoh : Vista / linux
3.6. Elemen Pada Interface WIMP
1. 2. 3. 4. 5. 6. 7. 8.
Window Icon Pointer Menu Button Toolbar Palettes Dialog Box/Kotak Dialog
• 3.6.1. Window
•
Merupakah daerah layar yang berperilaku seolah-olah independen terhadap terminal. Sebuah windows biasanya berisi teks atau grafik, dan dapat dipindahkan atau diubah ukurannya
Ikon/icon dapat digunakan untuk mewakili aspek-aspek lain dari sistem.
• 3.6.2. Icon
–
•
Seperti keranjang sampah untuk membuang file yang tidak diinginkan
Ikon/icon dapat berupa sembarang simbol.
3.6.3. Pointer
• Pointer adalah komponen penting dari wimp interface • Mouse menyediakan perangkat input yang mampu menjalankan tugas-tugas
• 3.6.4. Menu
•
•
Menu menyajikan pilihan operasi atau layanan yang dapat dilakukan oleh sistem pada waktu tertentu Menu utama dapat terlihat oleh pengguna setiap saat, sebagai menu bar dan submenu dapat ditarik ke bawah Menu bar sering ditempatkan di bagian atas layar
• 3.6.5. Button
•
•
Buttons/tombol dapat dipilih oleh pengguna untuk melakukan suatu aksi/tugas Button/tombol dapat juga digunakan untuk menampilkan informasi status seperti : font yang akan dicetak miring atau tidak dalam pengolah kata. Button/tombol dapat digunakan untuk mengindikasikan tombol on / off status Pilihan.
3.6.6. Toolbar
•
•
Memiliki kumpulan tombol kecil, masing-masing dengan ikon, ditempatkan di bagian atas dan menggunakan fungsi yang umum digunakan. Fungsi toolbar ini mirip dengan menu bar.
3.6.7. Palette
• Palet adalah mekanisme untuk membuat himpunan kemungkinan modus dan modus yang aktif dapat dilihat oleh pengguna. • Sebuah palet merupakan kumpulan ikon dari berbagai modus. – Contoh: Dalam aplikasi paint brush, ada koleksi ikon yang menunjukkan piksel warna atau pola yang digunakan untuk mengisi objek, seperti palet pelukis untuk melukis.
• Beberapa sistem ada yang menggunakan palet dari menu atau toolbar.
• 3.6.8 Kotak Dialog/ Dialog Box
Kotak dialog jendela informasi yang digunakan oleh sistem lebih pada menampilkan informasi penting •
•
Misalnya : menampilkan peringatan yang digunakan untuk mencegah sebuah kemungkinan kesalahan.
Atau digunakan untuk menampilkan subdialog antara pengguna dan sistem dalam melakukan task yang lebih spesifik •
Contoh : ketika pengguna/sistem ingin menyelamatkan file, kotak dialog dapat digunakan untuk menunjukkan di mana harus ditempatkan file ke dalam sistem pengarsipan. Ketika menyimpan subdialog selesai, kotak dialog akan menghilang
Interaktivitas merupakan ciri sistem interaktif Pengguna/user dapat berinteraksi dengan visualisasi secara real time, mengubah parameter dan melihat efek Memastikan bahwa pengguna atau sistem dapat mengetahui bahwa kesalahan telah terjadi.
• 3.7. Interaktivitas
•
•
–
Jika pengguna/user dapat mendeteksi kesalahan maka user/pengguna dapat memperbaikinya.
3.8. Konteks dari Interaksi
• • • •
•
Interaksi pengguna dengan sistem dipengaruhi desain antarmuka. Orang bekerja dipengaruhi oleh apa yang dikerjakannya Jika sistem menyulitkan pengguna, maka kinerjanya akan berkurang Sistem sering dipilih dan diproduksi oleh para manajer daripada pengguna sendiri. Dalam beberapa kasus, persepsi manajer didasarkan pada hasil pengamatan dan bukan pada aktivitas aktual.
3.8. Konteks dari Interaksi
Sistem yang diperkenalkan membuat cara kerja yang tidak menyenangkan kepada pengguna. Jika hal ini terjadi mungkin ada tiga hasil:
•
• – – –
•
sistem ini akan ditolak, pengguna akan marah dan tidak termotivasi, pengguna akan menyesuaikan untuk kebutuhan sendiri.
Hal ini menunjukkan pentingnya aktual yang melibatkan pengguna dalam proses desain
3.9. Pengalaman, Keterlibatan dan Kegembiraan
• Ada beberapa aspek-aspek pengalaman interaksi 1. 2. 3. 4.
Memahami pengalaman Merancang pengalaman Desain Fisik dan Keterlibatan Mengelola Nilai
3.9.1. Memahami Pengalaman
• Belanja secara onLine merupakan hal yang menarik dan memungkin untuk membeli sesuatu • Belanja bukan tentang transaksi keuangan yang efisien. • Tetapi merupakan pengalaman yang sulit untuk dijabarkan
3.9.2. Merancang Pengalaman
• Beberapa pengguna/user sering mengirimkan kartu ucapan secara elektronik • Pengguna biasanya belajar, bagaimana memproses kartu ucapan tersebut agar terlihat unik ketika dibaca oleh si penerima (dapat dengan cara menambahkan gambar/kata kata bijak)
3.9.3. Desain Fisik dan Keterlibatan
•
•
Kontrol fisik antarmuka sangat cocok untuk mirocowave dan tombol multi fungsi pada mini disk Kendala yang sering dihadapi oleh perancang sistem : 1. 2. 3. 4. 5.
Ergonomis Ukuran Fisik Hukum dan Keamanan Estetika Ekonomi
3.9.4. Mengelola Nilai
•
•
•
Jika kita ingin orang menggunakan aplikasi, hendaknya kita memahami pribadi si pengguna Apa yang ingin digunakan dan apa yang mereka dapatkan dari aplikasi ini? Jika kita meminta seseorang untuk melakukan sesuatu atau menggunakan sesuatu, maka nilai manfaat yang didapat oleh user/pengguna melebihi biaya yang dikeluarkan