BAB - IIIINTERAKSIBy. Alan Dix, Janet By. Alan Dix, Janet

Finlay, Gregory D. Abowd, Finlay, Gregory D. Abowd, Russell BealeRussell Beale

3.1.3.1.PendahuluanPendahuluan

• Model interaksi – 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.3.2.Model Model

InteraksiInteraksi

• 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.3.2.1.SyaratSyarat--syarat syarat

InteraksiInteraksi

• 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.3.2.2.Pelaksanaan Pelaksanaan

Siklus InteraksiSiklus Interaksi

• Siklus interaktif dapat dibagi menjadi dua fase utama: pelaksanaan dan evaluasi.

• Tahapan model Norman : 1. Menetapkan tujuan. 2. Membentuk rencana/niat. 3. Menentukan urutan aksi. 4. Eksekusi aksi. 5. Memahami keadaan sistem 6. Menginterpretasikan keadaan sistem7. Mengevaluasi keadaan sistem, yang

dihubungkan ke tujuan dan rencana

3.2.1.3.2.1.SyaratSyarat--syarat syarat

InteraksiInteraksi

• 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.3.2.2.Kerangka Kerangka InteraksiInteraksi

• Ada empat komponen utama dalam sistem Interaktif1. Sistem2. Pengguna3. Input4. Output

3.2.2.3.2.2.Kerangka Kerangka InteraksiInteraksi

Kerangka Interaksi secara umum

Hubungan diantara komponen

3.3.3.3.Kerangka Kerja Kerangka Kerja

dan HCIdan HCIInterface dibentuk dari gabungan

antara input dan output.

3.43.4ErgonomiErgonomi

• 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. Penyusunan kontrol dan tampilan2. Lingkungan fisik dari interaksi3. Masalah kesehatan4. Penggunaan warna

3.4.1.3.4.1.Penyusunan Penyusunan Kontrol dan Kontrol dan

TampilanTampilan

• Dalam penyusunan kontrol dan tampilan dapat dikelompokkan menjadi:– Fungsi kontrol dan display

• Diatur sehingga orang-orang yang secara fungsional terkait ditempatkan bersama-sama,

– 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.3.4.2.Lingkungan Lingkungan

Fisik Dari Fisik Dari InteraksiInteraksi

• 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.3.4.3.Masalah Masalah

KesehatanKesehatan

• Faktor-faktor dalam lingkungan fisik yang secara langsung mempengaruhi kualitas interaksi dan kinerja user1. Posisi fisik2. Suhu3. Pencahayaan4. Gangguan suara5. Waktu

3.4.4.3.4.4.Penggunaan Penggunaan

WarnaWarna

• 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

Macam-macam model/bentuk interface

Interaksi1. Command line interface2. Menu3. Natural language4. Question/answer & query dialog5. Form-fills & spreadsheet6. WIMP7. Point & click8. Three-dimensional interface

3.5.3.5.Gaya/Model Gaya/Model

InteraksiInteraksi

• 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.1.3.5.1.Command Line Command Line

InterfaceInterface

• 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.2.3.5.2.MenuMenu

• Merupakan komunikasi yang interaktif dengan komputer

• Pengguna dapat mengingat perintah yang telah dilakukan dengan menu hirarki

3.5.3.3.5.3.Natural Natural

LanguageLanguage

• 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.4.3.5.4.Question/ Question/ Answer & Answer &

Query DialogQuery Dialog

• Merupakan komunikasi dengan inputannya berbentuk formulir pengisian

• Selain itu dapat berkomunikasi dengan inputannya berbentuk spreadsheet

3.5.5.3.5.5.FormForm--Fills & Fills & SpreadsheetSpreadsheet

• Merupakan komunikasi dengan menggunakan berbagai macam diantaranya yang berbentuk window, icon, menu dan pointer

3.5.6.3.5.6.WIMPWIMP

• 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.7.3.5.7.Point & Click Point & Click

InterfaceInterface

• Merupakan teknik 3D• Contoh : Vista / linux

3.5.8.3.5.8.ThreeThree--

Dimensional Dimensional InterfaceInterface

1. Window2. Icon3. Pointer4. Menu5. Button6. Toolbar7. Palettes8. Dialog Box/Kotak Dialog

3.6.3.6.Elemen Pada Elemen Pada

Interface Interface WIMPWIMP

• Merupakah daerah layar yang berperilaku seolah-olah independen terhadap terminal.

• Sebuah windows biasanya berisi teks atau grafik, dan dapat dipindahkan atau diubah ukurannya

3.6.1.3.6.1.WindowWindow

• Ikon/icon dapat digunakan untuk mewakili aspek-aspek lain dari sistem.

– Seperti keranjang sampah untuk membuang file yang tidak diinginkan

• Ikon/icon dapat berupa sembarang simbol.

3.6.2.3.6.2.IconIcon

• Pointer adalah komponen penting dari wimp interface

• Mouse menyediakan perangkat input yang mampu menjalankan tugas-tugas

3.6.3.3.6.3.PointerPointer

• 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.4.3.6.4.MenuMenu

• 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.5.3.6.5.ButtonButton

• 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.6.3.6.6.ToolbarToolbar

• 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.7.3.6.7.PalettePalette

• 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

3.6.83.6.8Kotak Dialog/ Kotak Dialog/

Dialog BoxDialog Box

• 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.

– Jika pengguna/user dapat mendeteksi kesalahan maka user/pengguna dapat memperbaikinya.

3.7.3.7.InteraktivitasInteraktivitas

• 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.3.8.Konteks dari Konteks dari

InteraksiInteraksi

• 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.8.3.8.Konteks dari Konteks dari

InteraksiInteraksi

• Ada beberapa aspek-aspek pengalaman interaksi

1. Memahami pengalaman2. Merancang pengalaman3. Desain Fisik dan Keterlibatan4. Mengelola Nilai

3.9.3.9.Pengalaman, Pengalaman, Keterlibatan Keterlibatan

dan dan KegembiraanKegembiraan

• 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.1.3.9.1.Memahami Memahami PengalamanPengalaman

• 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.2.3.9.2.Merancang Merancang PengalamanPengalaman

• Kontrol fisik antarmuka sangat cocok untuk mirocowave dan tombol multi fungsi pada mini disk

• Kendala yang sering dihadapi oleh perancang sistem :

1. Ergonomis2. Ukuran Fisik3. Hukum dan Keamanan4. Estetika5. Ekonomi

3.9.3.3.9.3.Desain Fisik Desain Fisik

dan dan KeterlibatanKeterlibatan

• 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

3.9.4.3.9.4.Mengelola Mengelola

NilaiNilai