5. DEFINITION OF HCI
• Human-computer interaction is a discipline
concerned with the design, evaluation and
implementation of interactive computing
systems for human use and with the study
of major phenomena surrounding them.
6. PENGERTIAN
Interaksi manusia dan komputer
• Adalah disiplin ilmu yang berhubungan
dengan perancangan, evaluasi, dan
implementasi sistem komputer interaktif untuk
digunakan oleh manusia, serta studi
fenomena-fenomena besar yang
berhubungan dengannya
7. • Titik berat
• Perancangan dan evaluasi antarmuka pemakai (user
interface)
• Fungsi dari IMK
• Mengoptimasikan performansi antara manusia dengan
komputer sebagai suatu sistem
Evaluasi
desain
Desain
Implementasi
8. AKAR IMK
IMK adalah bagian dari ilmu komputer
Ilmu-ilmu lain yang mendasari IMK :
• Desain grafis
• Teknik industri
• Psikologi kognitif
• Antropometri
• Ergonomi (human engineering)
10. PENGERTIAN USER-INTERFACE
Antarmuka pemakai :
bagian sistem komputer
yang memungkinkan
manusia berinteraksi dengan
komputer
Tujuan antarmuka pemakai :
• Agar sistem komputer dapat
digunakan oleh pemakai
Human
User Interface
Computer
System
11. PEMETAAN TUJUAN, AKSI DAN HASIL
Tujuan
pemakai
antarmuka
Aksi
Pemakai
Fungsi
Sistem
Umpan Balik
Pemetaan dilakukan untuk menghasilkan
suatu sistem dgn user interface yang baik
Hasil
13. TUJUAN REKAYASA SISTEM IMK
Fungsionalitas yang sesuai
(Proper Functionality)
• Tugas-tugas apa saja yang diperlukan?
• Sistem dengan fungsionalitas yang kurang memadai
mengecewakan pemakai dan sering ditolak atau tidak
digunakan
• Sistem dengan fungsionalitas berlebihan berbahaya :
implementasi, pemeliharaan, proses belajar, dan
penggunaan sulit
14. Kehandalan, ketersediaan,
keamanan, dan integritas data
• Kehandalan (reliability): berfungsi seperti yang
diinginkan, tampilan akurat
• Ketersediaan (availability): tersedia ketika hendak
digunakan, jarang mengalami masalah
15. • Keamanan (security) : terlindung dari akses yang tidak
diinginkan dan kerusakan yang disengaja
• Integritas data (data integrity): keutuhan data terjamin,
tidak mudah dirusak atau diubah oleh orang yang tidak
berhak
16. Standarisasi, integrasi, konsistensi,
dan portabilitas
• Standarisasi : keseragaman sifat-sifat antarmuka
pemakai pada aplikasi yang berbeda
• Integrasi : kesatuan dari berbagai paket aplikasi dan
software tools
17. • Konsistensi : keseragaman dalam suatu
program aplikasi : urutan perintah, istilah,
satuan, warna, tipografi, dsb
• Portabilitas : dimungkinkannya data
dikonversi dan dipindahkan, dan
dimungkinkannya antarmuka pemakai
dipakai di berbagai lingkungan perangkat
lunak dan perangkat keras
18. PENJADWALAN DAN ANGGARAN
• Sistem perlu siap tepat pada waktunya
• Sistem yang mahal sulit diterima
• Adanya persaingan dengan vendor lain
20. MOTIVASI BAGI FAKTOR MANUSIA
DALAM PERANCANGAN
• Sistem yang kritis bagi kehidupan
• Pemakaian industri dan komersial
• Aplikasi kantor, rumah dan hiburan
• Sistem eksplorasi, kreatif dan kerjasama
21. MOTIVASI BAGI FAKTOR
MANUSIA DALAM
PERANCANGAN
• Sistem yang kritis bagi kehidupan
( Life Critical Systems )
• Biaya tinggi tidak masalah,asalkan
kehandalan dan keefektifan tinggi
• Waktu pelatihan lama tidak masalah,
asalkan bebas kesalahan
• Retensi diperoleh dari seringnya latihan
dan penggunaan
• Contoh :
22. • Pemakaian industri dan komersial
(Industrial and Commercial Uses)
• Biaya rendah lebih disukai, meskipun
kehandalan dikorbankan
• Proses dan kemudahan belajar penting
• Retensi dari seringnya penggunaan
• Kepuasan subjektif diutamakan
• Contoh :
23. • Aplikasi kantor, rumah dan hiburan
(office, home and entertainment
applications)
• Kemudahan belajar, tingkat kesalahan
rendah dan kepuasan subjektif
diutamakan
• Pembelajaran berlapis (berevolusi)
• Biaya rendah penting karena
persaingan
• Retensi mungkin kurang, perlu online
help
• Contoh :word processor, video game,
program pendidikan, e-mail
24. • Sistem eksplorasi, kreatif dan kerjasama
(exploratory, creative, and cooperative systems)
• Motivasi dan ekspektasi pemakai tinggi
• Perancangan sistem sulit
• Pengukuran faktor manusia sulit
• Contoh : Encyclopedias, databases,
graphical presentation, design systems, music
composing system, medical diagnostic
26. INDUSTRIAL AND
COMMERCIAL USES
• Banking, insurances, airline and hotel reservations, car
rentals, credit card management
• Overall cost over lifetime will judge the decision
27. OFFICE, HOME AND
ENTERTAINMENT
APPLICATIONS
• Ease of learning, low error rates, subjective satisfaction
• Online assistance because of non frequent use
• Very wide user spectrum
• Price must be low, but amortization by large number of
users
28. EXPLORATORY, CREATIVE,
AND COOPERATIVE SYSTEMS
• Encyclopedias, databases, graphical presentation,
design systems, music composing system, medical
diagnostic
29. TUJUAN PENELITIAN IMK
• Mempengaruhi peneliti akademis dan industri
• Kerangka reductionist scientific
method
• Sumbangan pemikiran terhadap studi
IMK dari disiplin-disiplin yang
berhubungan
• Memberikan tools, teknik, dan pengetahuan untuk
implementor sistem
• Meningkatkan kesadaran akan komputer kepada
masyarakat awam
31. TEORI-TEORI ARAS TINGGI
Pendekatan empat aras (four-level
approach) atau language model
dari Foley dan Van Dam :
• Conceptual level
• Semantic level
• Syntactic level
• Lexical level
32. • Conceptual level
• Pembelajaran secara konsep
thp sistem
• Semantic level
• Menggambarkan arti yang
disampaikan oleh perintah
masukan pemakai dan keluaran
komputer
33. • Syntactic level
• Mendefinisikan bagaimana satuan
(kata-kata) yang menyampaikan
semantik dirakit menjadi kalimat
lengkap yang memerintahkan
komputer melakukan tugas tertentu
• Lexical level
• Berhubungan dengan
ketergantungan terhadap piranti dan
dengan mekanisme presisi yang
digunakan untuk menyebutkan
sintaksis
34. • Conceptual level : pemakai
menciptakan, menghapus dan
mengubah bangun geometrik
pada kertas menggunakan
bantuan kisi-kisi (grids) dan
penggaris (rulers)
• Semantic level : uraian rinci objekobjek dan operasinya. Misalnya,
persegipanjang dapat dibuat,
diubah, dan dihapus
35. • Syntactic level : bentuk interaksi. Misalnya :
untuk menghapus persegi panjang yang ada
di layar, pemakai perlu memilihnya terlebih
dahulu kemudian memilih salah satu cara
untuk menghapus
• Lexical level : menghapus persegipanjang
yang ada di layar dilakukan dengan mengklik
persegipanjang kemudian men-drag-nya ke
tempat sampah atau memilih “Delete” dari
menu “Edit” atau dengan menekan tombol
Delete
36. GOMS MODEL DAN KEYSTROKELEVEL MODEL
• Goals, Operators, Methods, and
Selection Rules
• Model diusulkan oleh Card, Moran dan
Newell(1980, 1983)
• Postulat
• Keystroke level Model
37. POSTULAT
Pemakai memformulasikan goals (edit
document) dan subgoals (insert word)
yang
mereka
peroleh
dengan
menggunakan metode atau prosedur
untuk
melaksanakan
setiap
goal
(pindahkan kursor ke lokasi yang
diinginkan menggunakan serentetan
penekanan tombol panah)
38. Operator : “perseptual dasar, motor,
kegiatan
kognitif,
yang
pelaksanaannya
diperlukan
untuk
mengubah aspek keadaan mental
pemakai atau untuk mempengaruhi
lingkungan tugas” (tekan tombol
panah atas, pindahkan tangan ke
mouse, ingat nama file, pastikan kursor
ada di akhir baris)
39. Selection rules : struktur kontrol untuk
memilih salah satu dari metode
(methods)
yang
tersedia
untuk
mencapai goal (menghapus dengan
menekan tombol backspace berkalikali vs memblok dengan menentukan
posisi awal dan akhir lalu menekan
tombol delete)
40. CONTOH : GOMS
• Goals
goal edit dokumen, subgoal insert word
• Operators
Tekan tombol panah atas
Pindahkan tangan ke mouse
Ingat nama file
Pastikan kursor ada di akhir baris
• Method
Pindahkan kursor ke lokasi yg diinginkan dgn
serentetan penekanan tombol panah
• Selection Rules
Menghapus dengan backspace berkali-kali vs.
memblok dan menekan tombol delete
41. GOMS
• Goals
• User formulates goals(edit document) and
subgoals(insert word)
• Operators
• Elementary, motor or cognitive acts whose execution is
necessary to change any aspect of the user’s mental
state or to affect the task environment”
• (press key, move hand, recall filename, verify cursor
position)
42. • Methods
• Used to achieve the goals(moving cursor by repeated
keystroking)
• Selection
• Among different methods to accomplish the goal
• Production rules to describe conditions and actions in
interactive text editing
• Transition diagrams to model interactive systems
43. Keystroke –Level Model
• Usaha untuk memperkirakan waktu
kinerja bagi pelaksanaan tugas oleh
ahli yang bebas kesalahan dengan
menjumlahkan waktu penekanan
tombol, menunjuk, menempatkan
tangan di keyboard, menggambar,
berfikir, dan menunggu sistem
merespon.
44. • Berkonsentrasi pada pemakai ahli dan
kinerja bebas kesalahan
• Kurang penekanan pada belajar,
pemecahan masalah, penanganan
kesalahan, kepuasan subjektif, dan
retensi
45. TRANSITION DIAGRAM
• Diperkenalkan oleh Kieras dan Polson (1985) didasari
pada pendekatan GOMS
• Contoh : Generalized Transition Network untuk
Displaywriter
• Gambar !!
46. END
POP
GAMBAR TRANSITION DIAGRAM
SAVE DOC
CANCEL
CC KEY
MOVE
CURSOR
POP
BKSP KEY
REMOVE CHAR
POP
CURSOR
CONTROL
“ILEGAL ACTION”
(CURSOR-CONTROL)
(DELETE)
EDIT
(KEY-WAIT)
BACKSPACE
(FIND)
(MOVE)
ENTRY
ADD CHAR
POP
(BACKSPACE)
(ENTRY)
OTHER
“ILLEGAL ACTION”
INPUT = CANCEL
FIND
FIND KEY
“FIND WHAT?”
(INPUT)
INPUT IS NULL
MOVE TO OLD PATTERN
NON-NULL INPUT
PATTERN <- INPUT
MOVE TO PATTERN
POP
47. SEVEN STAGES OF ACTION (NORMAN
1988):
• Membentuk goal
• Membentuk maksud
• Menyebutkan aksi
• Melaksanakan aksi
• Memahami keadaan sistem
• Menginterpretasikan keadaan sistem
• Mengevaluasi keluarannya
48. CONSISTENCY THROUGH GRAMMAR
• Goal yang penting bagi desainer adalah antarmuka
pemakai yang konsisten
• Konsistensi sulit dicapai
• Kadang-kadang tidak konsisten ada gunanya, misalnya
untuk menarik perhatian terhadap operasi yang
berbahaya
• Untuk menggambarkan antarmuka, digunakan action
grammar
50. SYNTACTIC KNOWLEDGE
• Pengetahuan rincian device-dependent ketika
menggunakan sistem komputer
• Contoh :
• Aksi untuk menghapus karakter : tombol
delete, backspace, control + H, klik tombol
tanda silang
• Aksi untuk menyisipkan baris : tombol enter
di akhir baris, control + M
51. SIFAT-SIFAT SYNTACTIC
KNOWLEDGE :
• Berkaitan dengan hal-hal device-dependent
• Diperoleh dari penghafalan berulang-ulang
• Mudah dilupakan
• Tidak tentu, tidak dapat diramalkan, berbeda
diantara sistem
• Masalah dikurangi dengan menggunakan
menu, mnemonik, konsistensi
52. • Semantic knowledge
• pengetahuan mengenai konsep
komputer (computer concepts) dan tugas
(task concepts)
53. • Sifat-sifat semantic knowledge :
• Diperoleh dari pelajaran yang berarti
• Stabil dalam memori
• Lebih teratur, lebih logis, bertumpu pada
konsep-konsep yang sudah dikenal
• Dapat ditransfer di antara sistem
55. CONTOH TASK CONCEPTS :
• Task objects :
• High-level : surat
• Lower-level : alamat, nama, tanggal,
badan surat, tanda tangan
• Task actions :
• High-level : menulis surat
• Lower-level : menulis bagian surat, misalnya
menyusun badan surat. Perlu mengetahui
ejaan yang benar
56. SEMANTIC KNOWLEDGE DIBEDAKAN
MENJADI :
1.
Computer concepts
Computer Objects
High level : Storage information
Lower Level : File Directory
Computer Actions
High Level : file text edit
Lower Level : open file, input
text, save file
57. 2. Task
Concepts
Task Objects :
High Level : mail
Lower Lever : date, address, signature
Task Actions :
High Level : writing mail
Lower Level : Spelling
58. PRINSIP-PRINSIP ARAS TENGAH
• Kenali keanekaragaman pemakai dan
situasi
• Tidak ada satu pun desain yang dapat
memuaskan semua pemakai dan
situasi
• Sebelum memulai desain, harus
dilakukan pemahaman terhadap
pemakai dan situasi seteliti dan
selengkap mungkin
59. USER PROFILE
• Novice user
• No syntactic knowledge
• Little semantic knowledge of computer
• Small knowledge about the task
• Knowledgable Intermittent User
• Problems in syntactic knowledge
• Semantic knowledge will be maintained
• Expert frequent user
• No problem in semantic and syntactic knowledge
• Inpatient, lazy for activities necessary to carry out
an action
60. TIGA JENIS PEMAKAI
• Novice atau first-time users (pemula)
• Knowledgeable intermittent users
• Expert frequent users ( mahir)
61. NOVICE ATAU FIRST-TIME USERS
(PEMULA)
• Tidak punya syntactic knowledge
• Semantic knowledge atas computer
concepts sedikit atau dangkal
• Desain menjaga sedikit kemungkinan
• Memungkinkan pemakai melakukan sedikit
task sederhana agar percaya diri
• Umpan balik harus informatif
• Pesan kesalahan harus membangun dan
spesifik
62. KNOWLEDGEABLE INTERMITTENT
USERS
• Memilki semantic knowledge atas task
concepts dan computer concepts
• Kesulitan dengan syntactic knowledge
• Desain harus sederhana dan konsisten
• Perlu sering ditanya dan diberi pesan-pesan
yang berarti
• Perlu dilindungi dari kemungkinan kesalahan
karena coba-coba menjelajah
63. EXPERT FREQUENT USERS ( MAHIR)
• Mengenal betul aspek sintaktik dan semantik dari sistem
• Ingin pekerjaan cepat selesai
• Ingin umpan balik yang singkat
• Desain perlu menyediakan shortcuts
64. Delapan aturan emas perancangan dialog
(the eight golden rule of dialog design)
1. Berusaha keras u/ konsisten
2. Memungkinkan frequent user
menggunakan shortcut
3. Umpan balik informatif
4. Merancang dialog u/ menghasilkan
keadaan akhir (sukses, selesai)
5. Penanganan kesalahan sederhana
6. Mengizinkan pembalikan aksi (undo)
7. Mendukung internal locus of control
8. Mengurangi beban ingatan jangka
pendek
65. DELAPAN ATURAN EMAS PERANCANGAN
DIALOG
(THE EIGHT GOLDEN RULE OF DIALOG DESIGN)
• Berusaha keras untuk konsisten
• Memungkinkan frequent users menggunakan shortcuts
• Memberikan umpan balik yang informatif
• Merancang dialog untuk menghasilkan keadaan akhir
(sukses, selesai)
66. • Memberikan penanganan kesalahan yang
sederhana
• Mengizinkan pembalikan aksi (undo) dengan
mudah
• Mendukung internal locus of control
( pemakai menguasai sistem atau inisiator,
bukan responden)
• Mengurangi beban ingatan jangka
pendek(rule of thumb: manusia mengingat 7
± 2 satuan informasi)
67. MENCEGAH KESALAHAN
• Correct matching pairs (membetulkan
pasangan yang bersesuaian ) :
• Menempatkan kedua pasangan tanda pembuka
dan penutup dalam satu aksi
• Jika satu dari karakter berpasangan dihapus maka
pasangannya juga terhapus
• Memberi tanda khusus
• Menghilangkan keharusan tanda penutup
• Contoh :
68. • Correct commands (membetulkan
perintah) :
• Menggabungkan urutan aksi sebagai
satu aksi
• Mengubah objek-objek sejenis secara
automatis
• Contoh : autocorrect pada Ms.Word
komputer computer
sistem system
69. • Complete sequences
(melengkapi urutan aksi) :
• Mengenali kekurangan dan melengkapi
sendiri
• Memungkinkan pemakai memilih perintah
atau pilihan lainnya dan menghindari
mengetik
• contoh : autocomplete pada MSIE
70. PEDOMAN PRAKTIS
Tujuan aras tinggi bagi tampilan data :
• Konsistensi tampilan data
• peristilahan, singkatan, format, dsb harus standar
• Asimilasi informasi secara efisien oleh
pemakai
• format harus dikenal operator dan harus berhubungan
dengan tasks yang perlu dilakukan dengan data
71. • Beban ingatan yang sedikit mungkin bagi
pamakai
• pemakai tidak perlu mengingat
informasi dari layar yang satu ke
layar yang lain
• Kompatibilitas tampilan data dengan
pemasukan data
• format tampilan informasi perlu
berhubungan erat dengan tampilan
pemasukan data
72. • Fleksibilitas kendali pemakai terhadap
tampilan data
• pemakai harus dapat memperoleh
informasi dari tampilan dalam
bentuk yang paling memudahkan
73. ADAPTIVE AGENTS AND USER MODELS VS CONTROL
PANELS
• Adaptive agents :
• Mencari apa yang dibutuhkan pemakai
• Mengetahui apa yang disukai dan tidak
• Membuat inferensi yang cocok
• Bekerja kompeten dengan sedikit petunjuk
74. • User models :
• Membuat adaptasi secara automatis
tergantung dari pola kerja pamakai
• Control panels
• Digunakan untuk mengatur berbagai hal
dalam sistem komputer
• Menyampaikan sense of control
75. LEGAL ISSUES
• Empat hal yang perlu diperhatikan :
• Privasi (kerahasiaan pribadi)
• Keamanan dan kehandalan
• Perlindungan hak cipta atas perangkat
lunak dan informasi
• Kebebasan berbicara pada lingkungan
elektronik
76. KONTROVERSI DALAM
HAL INI :
• Materi apa yang sesuai untuk hak cipta?
• Ide (gagasan) tidak dapat dilindungi
hak cipta, sementara ekspresi dapat
dilindungi hak cipta kecuali jika hanya
satu cara
77. APAKAH HAK CIPTA ATAU PATEN
LEBIH COCOK BAGI
ANTARMUKA PEMAKAI?
• Hak cipta mudah diperoleh, cepat, dan
tidak diperiksa. Paten lebih rumit, lambat,
mahal, dan harus diperiksa terlebih dahulu
• Hak cipta berlaku 75 tahun untuk
perusahaan dan masa hidup + 50 tahun
untuk individu.
• Sedangkan hak paten berlaku 17 tahun
tetapi lebih kuat hukumnya
78. APA YANG MERUPAKAN
PELANGGARAN HAK CIPTA ?
• Jika pengembang lain menyalin antarmuka pemakai
kita dengan tepat sama, itu merupakan pelanggaran
• Jika antarmuka pemakai dapat dinyatakan “serupa
secara mendasar” dengan milik kita, itu merupakan
pelanggaran
79. HARUSKAH ANTARMUKA
PEMAKAI DILINDUNGI HAK
CIPTA?
• Beberapa pakar menganggap tidak perlu, karena :
• Beberapa pakar menganggap perlu, karena :
• Sehingga
• Beberapa ekspresi perlu dilisensi dari pembuatnya
sementara beberapa lagi tidak
80. FAKTOR PRO (PENDUKUNG)
• Hak cipta menghargai prestasi kreatif
• Hak cipta mendorong adanya inovasi
• Hak cipta memastikan desainer memperoleh
imbalan berupa royalti
Faktor kontra (penentang)
• Hak cipta berkaitan dengan kebutuhan
banyak orang
• Hak cipta menghalangi kemajuan
• Hak cipta menghambat standarisasi
