EVALUASI

TINJAUAN
 Mengevaluasi Pengujian Kegunaan dan Fungsi dari Sistem Interaktif

 Evaluasi dapat dilakukan pada :
o Laboratorium
o Lapangan Pekerjaan
o Kerja Sama dengan User

 Beberapa Pendekatan Perancangan Evaluasi :

o Metode Analitik
o Metode Review
o Metode Model Dasar

 Beberapa Pendekatan Evaluasi yang Telah diterapkan :

o Metode Experimental
o Metode Observasi
o Metode Query

 Metode Evaluasi Yang Dipilih Secara Cermat Dan Harus Cocok

Dengan Pekerjaan

EVALUASI
 Evaluasi digunakan untuk melihat apakah hasil rancangan dengan
proses uji coba sistem yang telah dibuat sesuai dengan permintaan
user

 Proses ini tidak dikerjakan dalam satu fase proses perancangan
tetapi melalui perancangan dengan prinsip life cycle.

Tujuan Evaluasi

Ada 3 tujuan utama evaluasi :


 Menilai seberapa jauh sistem berfungsi.
Desain sistem memungkinkan user melakukan tugas yang dibutuhkan
dengan lebih mudah. Ini tidak hanya membuat fungsionalitas yang

IMK – Evaluasi 1/13

 sesuai ada di sistem, tetapi membuat mudah dicapai oleh user, user
dapat melakukan aksi untuk melaksanakan tugas. Juga mencakup
kesesuaian penggunaan sistem terhadap harapan user pada tugas
tertentu. Evaluasi pada tahap ini meliputi pengukuran unjuk kerja dari
user pada sistem, untuk melihat keefektifan sistem dalam mendukung
tugas.


 Menilai efek (pengaruh) interface bagi user
Hal ini mencakup pertimbangan aspek dari kemudahan sistem
dipelajari, usability, dan perilaku user. Penting juga untuk
mengidentifikasikan area desain yang berlebih dari user dengan
menggunakan sejumlah informasi yang berlebih.


 Mengidentifikasi masalah khusus yang terjadi pada sistem
Ketika menggunakan konteks yang diinginkan menyebabkan hasil yang
tidak diinginkan, atau terjadi kekacauan diantara user. Ini tentunya
berhubungan dengan usability dan fungsionalitas dari desain
(bergantung pada sebab masalah). Tujuan ini merupakan aspek negatif
dari desain.

Jenis- Jenis Evaluasi

Ada 2 jenis utama dari evaluasi, yaitu yang dilaksanakan pada kondisi
laboratorium dan yang dilaksanakan pada lingkungan kerja atau ’lapangan’
 Dalam kondisi percobaan (Laboratory)
 Dalam kondisi lokasi kerja sebenarnya
 Participatory Design

Pada Kondisi Percobaan (Laboratory)

Penggunaan pengujian sistem ini pada ruang percobaan mempunyai
beberapa kondisi diantaranya :
o Laboratorium yang bagus biasanya memiliki fasilitas perekaman
audio/visual yang baik, komputer beserta perlengkapannya yang
mungkin tidak ada pada lokasi kerja sebenarnya.
o Operator bebas dari gangguan yang menghambat pekerjaan.
o Beberapa situasi hanya dapat dilakukan di lab, seperti sistem yang
akan digunakan ditempatkan pada lokasi yang berbahaya atau lokasi
yang terpencil, contoh stasiun ruang angkasa.

IMK – Evaluasi 2/13

 o Dapat memanipulasi situasi untuk memecahkan masalah dan melihat
sedikit penggunaan prosedur atau membandingkan beberapa
alternatif perancangan dengan situasi yang sebenarnya.
o Situasi pada laboratorium tidak dapat menggambarkan situasi ruang
kerja sebenarnya dan terdapat beberapa orang yang tidak bisa
bekerja pada kondisi di laboratorium

Pada Kondisi Lokasi Kerja Sebenarnya

Penggunaan pengujian sistem ini pada lokasi kerja sebenarnya
mempunyai beberapa kondisi diantaranya :
o Tingkat gangguan yang melebihi ambang batas, tingkat-tingkat
pergerakan yang besar dan interupsi yang tetap, seperti panggilan
telepon menyebabkan observasi ini sulit dilakukan.
o Situasi yang lebih “terbuka” antara sistem dan pengguna, dimana
kondisi ini tidak ditemukan pada kondisi di laboratorium
o Observasi pada lokasi kerja sebenarnya lebih baik dilakukan
daripada di laboratorium dan gangguan-gangguan yang terjadi pada
lokasi ini digunakan sebagai situasi yang mewakili situasi sebenarnya
dan digunakan untuk proses penyimpanan dan pengambilan selama
tugas.

Participatory Design
o Adalah suatu pemikiran yang melibatkan keseluruhan alur
perancangan dan tidak hanya proses evaluasi saja.
o Perancangan ini dilakukan pada ruang kerja yang melibatkan
pengguna yang tidak hanya digunakan sebagai subyek percobaan
tetapi juga sebagai anggota yang aktif dalam team perancangan.

Mempunyai tiga karakteristik :

o Meningkatkan lingkungan kerja dan tugas
o Mempunyai sifat kerja sama, yakni pengguna dilibatkan dalam
anggota team dan mempunyai kontribusi pada setiap tingkat
perancangan.
o Mempunyai pendekatan iterative, perancangan adalah suatu subyek
untuk evaluasi dan revisi pada setiap tingkatan.

IMK – Evaluasi 3/13

Beberapa metode untuk membantu mengkomunikasikan informasi antara
pengguna dan perancang :
o Brainstorming
o Storyboarding
o Workshops
o Pensil dan kertas percobaan

Metode-metode di atas tidak semuanya digunakan secara eksekutif dalam

participatory design. Metode ini digunakan untuk memberikan pemahaman
antara perancang dan user.

Mengevaluasi Perancangan
Evaluasi terjadi setelah proses perancangan. Evaluasi pertama sistem
idealnya dilakukan sebelum implementasi dimulai. Jika perancangan
dievaluasi, kesalahan dapat dihindari karena perancangan
diubah/diperbaiki sebelumnya. Sejumlah metode dibuat untuk
mengevaluasi perancangan sebelum implementasinya, yaitu :

 Cognitive Walkthrough
 Heuristic Evaluation

Cognitive Walkthrough
Suatu usaha yang dilakukan untuk mengenalkan teori psikologi ke dalam
bentuk informal dan subyektif atau dengan kata lain mempunyai tujuan
untuk mengevaluasi perancangan dengan melihat seberapa besar
dukungan yang diberikan ke pengguna untuk mempelajari beberapa tugas
yang diberikan. Pendekatan ini dikemukakan oleh Polson.

Dalam pendekatan ini terdapat beberapa issue yang timbul seperti :

o Pengaruh apa yang timbul setelah tugas ini diberikan ke pengguna?
o Proses cognitive apa yang tersedia?
o Masalah pembelajaran apa yang seharusnya timbul?

Untuk melakukan Cognitive Walkthrough harus mempunyai informasi yang

dibutuhkan :
o Deskripsi dari suatu interface yang dibutuhkan itu sendiri
o Deskripsi dari tugas termasuk usaha yang benar untuk
melakukannya dan struktur tujuan untuk mendukungnya

IMK – Evaluasi 4/13

Dengan Informasi ini maka Evaluator dapat melakukan langkah dari
walkthrough :
o Memilih Tugas
o Mendiskrpsikan tujuan dari user
o Melakukan kegiatan / aksi yang tepat
o Menganalisa proses keputusan untuk setiap kegiatan

Contoh Cognitive Walkthrough :

Memprogram video dengan Remote Control. Misalkan akan memprogram
video ke waktu dimulai dari jam 18.00 dan berakhir jam 19.15 pada
channel 4 pada tanggal 4. Maka tugas tersebut akan meliputi :
- Set waktu awal
- Set waktu akhir
- Set channel
- Set tanggal

Ini adalah tujuan dari user, memasukkan pengalaman dan pengetahuan

sebelumnya. Ekspresi di atas adalah pada tingkat tinggi, tidak diberikan
detail pada level interface. Dengan melihat tujuan user yang diidentifikasi,
setiap aksi digambarkan dengan tugas yang lengkap dan menentukan
apakah interface mendukung pembangkitan struktur tujuan yang
dibutuhkan untuk aksi yang lengkap. Setiap aksi dianalisa pada formulir
walkthroug. Formulir menampilkan sejumlah pertanyaan bagi evaluator
sebagai pertimbangan .

Dari contoh di atas hal pertama yang dilakukan adalah melakukan penekan
tombol ”Timed Recording” .
Aksi #1
Deskripsi : tekan tombol ”Timed Recording”
.................
.................
Langkah selanjutnya adalah membandingkan struktur tujuan yang tersedia
dengan struktur tujuan pada langkah awal. Hal ini dilakukan dengan empat
pertanyaan:
o Akankah user gagal untuk menambah tujuan yang diperlukan ?
o Akankah user gagal untuk memindahkan tujuan yang tidak
diinginkan ?
o Akankah user mengadopsi beberapa dasar tujuan yang palsu dari
interface ?
o Akankah user membatalkan tujuan yang masih dibutuhkan ?

IMK – Evaluasi 5/13

Heuristic Evaluation
Hampir sama dengan Cognitive Walkthrough tetapi sedikit terstruktur dan
sedikit terarah. Dalam sistem ini terdapat beberapa kriteria :
o Perilaku Sistem dapat dipastikan.
o Perilaku Sistem konsisten
o Kemampuan memori user tidak melebihi batas
o Dialog merupakan orientasi tugas

Tujuan dari Heuristic Evaluation adalah untuk memperbaiki perancangan

secara efektif. Orang yang melakukan evaluasi melalui kinerja dari
serangkaian tugas dengan perancangan dan penilaiannya sesuai dengan
kriteria setiap tingkatan. Jika ada kesalahan terdeteksi maka perancangan
dapat ditinjau ulang untuk memperbaiki masalah ini sebelum pada
tingkatan implementasi.

Mengevaluasi Implementasi (model yang telah diterapkan)

Perbedaan yang besar dengan evaluasi perancangan adalah keberadaan
implementasi sistem yang ada dalam berbagai bentuk. Hal ini dapat
dimulai dari simulasi kemampuan interaktif dari suatu sistem, sebagai
contoh Wizard of Oz, melalui fungsi prototipe dasar sampai dengan sistem
yang telah diimplementasi secara keseluruhan.

Metode Empirik : Evaluasi Eksperimen

Suatu metode yang sangat kuat dalam mengevaluasi perancangan atau
aspek dari perancangan adalah menggunakan eksperimen yang terkontrol.
Ini menyediakan kenyataan empiris untuk mendukung klaim umum atau
hipotesis.

Setiap eksperimen memiliki dasar yang sama. Evaluator memiliki hipotesa

untuk diuji yang dapat ditentukan dengan mengukur beberapa atribut dari
perilaku subyek. Sejumlah kondisi eksperimen ditentukan yang berbeda
dalam hal nilai dari variabel tetap yang terkontrol. Setiap perubahan dalam
pengukuran perilaku diatributkan ke kondisi yang berbeda. Dalam bentuk
dasar ada sejumlah faktor penting terhadap keseluruhan kehandalan
eksperimen yang harus dipertimbangkan dalam perancangan eksperimen.

IMK – Evaluasi 6/13

Faktor-faktornya adalah :
 Subyek
o Pemilihan subyek sangat penting dalam beberapa eksperimen.
o Harus setepat mungkin dengan keinginan user.
o Jika subyek bukan user sebenarnya maka subyek yang dipilih
harus sama usia dan tingkatan pendidikan serta pengalaman
menggunakan komputer secara umum dan keterhubungan sistem
yang sedang dalam pengujian
 Variabel
o Independent Variabel
Karakteristik suatu eksperimen yang memanipulasi untuk
menghasilkan kondisi yang berbeda untuk perbandingan.
o Dependent Variabel
Variabel yang dapat diukur dalam eksperimen.
 Hypothesis
o Merupakan prediksi yang dihasilkan dalam eksperimen.
o Masih menggunakan variabel independent dan dependent,
dimana variasi di dalam independent variable akan menyebabkan
perbedaan pada dependent variable.
o Tujuan dari eksperimen adalah untuk menunjukkan bahwa
perkiraan benar dengan menyangkal adanya null hyphotesis, yang
menyatakan bahwa tidak ada perbedaan dalam dependent
variable diantara tingkatan dari suatu independent variable.

Perancangan Eksperimen
o Between-Groups (Randomized)
 Masing-masing subyek diberikan kondisi yang berbeda yakni
 kondisi eksperimen dan control.
 Keuntungan perancangan ini adalah setiap user menghasilkan
 satu kondisi
 Kerugiannya adalah dengan semakin banyak jumlah subyek yang
tersedia akan menyebabkan hasilnya akan berkurang dan
perbedaan antar setiap individu akan membuat bias hasil. Hal ini
dapat diatasi dengan memilih dengan hati-hati subyek yang dipilih
 dan menjamin setiap kelompok di masyarakat terwakili.
o Within-Groups
 Setiap user akan menampilkan kondisi yang berbeda
 Jumlah user yang tersedia lebih sedikit
 Pengaruh dari subyek lebih sedikit

IMK – Evaluasi 7/13

 Pengukuran Statistik
o Dua aturan dalam analisa dengan statistik yakni : melihat dan
menyimpan data
o Variabel yang digunakan :
  Discrete Variables
o Menggunakan jumlah yang terbatas dari suatu nilai atau tingkatan
Contoh: Warna layar monitor yakni : red, green atau blue.
o Merupakan suatu independent variable

 Continous Variable
 o Menggunakan jumlah berapapun
Contoh : Ketinggian seseorang atau waktu yang diperlukan untuk
 menyelesaikan pekerjaan.
o Merupakan suatu dependent variable

Independent Dependent
Variable Variable
Parametric
2 valued Normal Student’s test on difference of
means
Discrete Normal ANOVA (Analysis Of Variance)
Continous Normal Linear (or non-linear) regression
factor analys
Non-parametric
2 valued Continous Wilcoxon(orMann-Whitney)
rank-sum test
Discrete Continous Rank-sum version of ANOVA
Continous Continous Spearman’s rank correlation
Contingency test
2 valued Discrete No special test, see next entry
Discrete Discrete Contingency tableandX
squared test
Continous Discrete (rare) group independent
variable and then as above

IMK – Evaluasi 8/13

Contoh parametric test

Contoh non-parametric statistik

Kondisi A : 33,42,25,79,52
Kondisi B : 87,65,92,93,91,55

Setelah diurut mulai 25,33,42,…,92,93 kemudian setelah di ranking maka

25 jadi 1, 33 jadi 2 dan seterusnya.

Kondisi A : 2,3,1,7,4
Kondisi B : 8,6,10,11,9,5
Dengan Wilcoxon test, setiap kondisi dijumlah rankingnya kemudian
dikurangkan dengan nilai terkecilnya sehingga didapatkan nilai statistic U
nya.

Kondisi A : 1+2+3+4+5 = 15
Kondisi B : 1+2+3+4+5+6 = 21

Rank sum smallest U

Kondisi A : (2+3+1+7+4) - 15 =2
Kondisi B : (8+6+10+11+9+5) - 21 = 28

Ternyata jumlah dari kedua statistik U tersebut 2 + 28 = 30 merupakan

perkalian dari jumlah nilai data dari masing-masing kondisi 5 x 6.

IMK – Evaluasi 9/13

Contoh mengevaluasi perancangan icon

Dimisalkan kita akan membuat paket pengolahan kata baru yang

menggunakan icon untuk presentasinya. Ada 2 jenis perancangan icon
akan digunakan yang paling mudah bagi user. Jenis pertama
menggunakan gambar natural (berdasarkan metapora dari dokumen
kertas), jenis yang lain menggunakan gambar abstrak seperti terlihat pada
gambar di atas.

Yang pertama harus dilakukan adalah membentuk hipotesis : tampilan

yang seperti apa yang diinginkan? Pada kasus ini kebanyakan user akan
mengambil gambar natural sebagai icon yang lebih mudah dalam
pemanggilan, karena lebih familiar bagi user. Hipotesis ini
mengidentifikasikan variabel independent untuk eksperimen, natural dan
abstrak. Pada pertimbangan variabel dependent, pengukuran ”lebih
mudah” dilihat dari jumlah kesalahan dalam memilih dan waktu yang
digunakan untuk memilih sebuah icon. Kontrol ekperimen dilakukan
dengan membuat interface yang identik dengan perancangan icon dan
tugas pemilihan dibuat yang dapat diulang untuk setiap kondisi. Kemudian
metode eksperimen dilakukan dengan menggunakan kelompok user yang
dimaksud. Mengingat pembelajaran terlibat dalam eksperimen ini, maka
perancangan within-groups digunakan dimana setiap user menggunakan
kedua set icon tersebut. Kemudian hasil eksperimen secara detail
dianalisis.

Teknik Observasi
 Think aloud

Cara yang popular dalam mengumpulkan informasi dengan melihat
interkasi user.

IMK – Evaluasi 10/13

 Evaluator melihat dan merekam aksi user (dengan berbagai teknik).
Konsekuensinya user ditanyai untuk mengelaborasikan aksinya dengan
”thinking aloud”, yaitu menjelaskan : apa yang mereka percaya terjadi,
mengapa mereka mengambil tindakan, apa yang mereka coba kerjakan.

Think aloud mempunyai keuntungan yakni sederhana, membutuhkan

sedikit pengetahuan untuk menampilkannya dan menyediakan
pengertian yang berguna dengan interface juga dapat digunakan untuk
mengobservasi bagaimana sistem digunakan.

Variasi lain adalah cooperative evaluation dimana:

 Proses mempunyai hambatan yang sedikit sehingga lebih mudah
 dipelajari oleh orang yang melakukan evaluasi.
  User mempunyai dorongan untuk menguji sistem
 Orang yang melakukan evaluasi dapat menjelaskan kekacauan
yang terjadi dan memaksimalkan pendekatan yang efektif untuk
mengenali masalah


 Analisa Protokol
Terdapat beberapa metode untuk merekam kegiatan user :
 o Paper and pencil
o Audio recording
o Video recording
o Computer logging
o User notebook

 Automatic protocol analysis tools
 o EVA (Experimental Video Annotator)
Sistem prototipe yang berjalan pada multi-media workstation yang
 dihubungkan langsung ke video recorder
o Contoh : Workplace project pada Xerox PARC


 Post-task walkthroughs
Terdapat beberapa keadaan yang menyebabkan subyek tidak dapat
berbicara selama observasi sebenarnya seperti subyek sedang
mengerjakan tugas yang sangat penting dan banyak. Pada keadaan ini
post-task walkthroughs dapat melihat secara subyektif perilaku user.

IMK – Evaluasi 11/13

Teknik Query

 Interview
Menginterview user tentang pengalaman mereka dengan sistem
interaktif yang menyediakan informasi secara langsung dan terstruktur.


 Questionnaire
Metode alternatif yang agak kurang fleksibel dibandingkan dengan
interview tetapi dapat meraih subyek yang banyak dan membutuhkan
 waktu yang tidak lama.
Terdapat beberapa jenis questionnaire :
 o General
o Open-ended
 o Scalar
o Multi-choice
o Ranked

Memilih Metode Evaluasi

Faktor yang membedakan teknik evaluasi :

Ada 8 faktor yang membedakan teknik evaluasi yang berbeda yang
membantu kita dalam memilih teknik yang sesuai, yaitu :
 Tingkat siklus
 Jenis evaluasi
 Tingkat obyektivitas dan subyektivitas
 Jenis ukuran yang tersedia
 Informasi yang tersedia
 Kesiapan dari suatu respon
 Tingkat gangguan yang tidak secara langsung
 Sumber yang tersedia

Design VS. Implementation

Evaluasi pada tingkatan perancangan hanya membutuhkan ahlinya dan
akan dianalisa sedangkan evaluasi pada tingkat implementasi membawa
user sebagai subyek dari eksperimen.

Laboratory VS. Field studies

Secara ideal proses perancangan mencakup dua jenis evaluasi ini dimana
pada laboratorium merupakan awal tingkatan sedangkan field studies
ditempatkan pada tingkatan implementasi.

IMK – Evaluasi 12/13

Subyektif VS. Obyektif
Pada teknik yang subyektif seperti pada cognitive walkthrough maupun
think aloud mempercayakan pada evaluator atau orang yang melakukan
evaluasi. Hal ini dapat menyebabkan penilaian evaluator menjadi bias
sehingga diperlukan lebih dari satu orang evaluator. Sedangkan teknik
obyektif seharusnya menghasilkan hasil yang berulang yang tidak
tergantung pada evaluator. Eksperimen yang terkontrol merupakan contoh
pengukuran obyektif. Secara ideal pengukuran secara subyektif dan
obyektif seharusnya digunakan keduanya.

Qualitative VS Quantitative measures

Pengukuran menggunakan numerik lebih mudah digunakan teknik statistik
sedangkan non-numerik lebih sulit dilakukan akan tetapi menghasilkan
sesuatu yang penting secara lengkap yang tidak dapat dilakukan secara
numerik.

Informasi yang tersedia

Tingkatan informasi yang tersedia untuk evaluator pada setiap tingkat
proses perancangan dimulai pada informasi yang rendah sampai dengan
tingkatan yang tinggi.

Kesiapan suatu tindakan

Faktor lain yang membedakan teknik evaluasi adalah kesiapan mengambil
tindakan yang tersedia. Seperti metode think aloud yang merekam perilaku
user pada waktu interaksi. Sedangkan post task walkthrough
mempercayakan pada pengumpulan kembali kegiatan user.

Intrusiveness
Merupakan teknik yang menghasilkan pengukuran segera yang dihasilkan
user selama interaksi dan mempunyai resiko mempengaruhi perilaku user.
Evaluator harus sensitif untuk mengurangi masalah ini tetapi tidak dapat
megubah semuanya.

Sumber-sumber
Hal terakhir yang perlu diperhatikan dalam memilih teknik evaluasi yakni :
peralatan, waktu, biaya, subyek serta evaluator yang ahli.

IMK – Evaluasi 13/13

 Interaksi Manusia dan Komputer

PENDAHULUAN
Ruang Lingkup
Mengapa dan Apa
Siapa Saja yang Terlibat
Konsep dan Dasar
Sejarah dan Paradigma IMK
 Interaksi Manusia dan Komputer

Course Overview

• Human abilities
• Evaluation (without users)
• Design
• Dialog & interaction
• Evaluation (with users)
• Special topics
− CSCW, InfoVis, Ubicomp, Agents
Pendahuluan 2/26
 Interaksi Manusia dan Komputer

HCI = Interaksi Manusia & Komputer

• What is it?
− Can you define/describe it?
− Human Computer Interaction (HCI = IMK)
merupakan studi tentang interaksi antara
manusia, komputer dan tugas/ task.
− Bagaimana manusia dan komputer secara
interaktif melaksanakan dan menyelesaikan
tugas/ task dan bagaimana sistem yang
interaktif itu dibuat.

Pendahuluan 3/26
 Interaksi Manusia dan Komputer

Why We Are Here

• Look at human factors that affect software design and development
• Central Topic: User interface design
− Not just a software interface on a desktop monitor!

• IMK berasal dari berbagai disiplin bidang ilmu, teknik dan kesenian.

Lingustik philosofi antropologi seni

Ilmu komputer matematika

Psikologi IMK seni grafik
sosiologi
AI

Pendahuluan 4/26
 Interaksi Manusia dan Komputer

Yang Terlibat Dalam IMK

• Psikologi dan ilmu kognitif : persepsi user,

kognitif, kemampuan memecahkan masalah
• Ergonomi : kemampuan fisik user
• Sosiologi : kemampuan memahami konsep
interaksi
• Ilmu komputer dan teknik : membuat teknologi
• Bisnis : pemasaran
• Desain grafis : presentasi interface
• Dan lain-lain.
Pendahuluan 5/26
 Interaksi Manusia dan Komputer

HCI
• What happens when a human and a computer
get together to perform a task
− task - write document, calculate budget, solve
equation, learn about Bosnia, drive home,...
Why Is This Important ?
• 1. Computers (in one way or another) now
affect every person in society
− Increasing % utilize computers in work
• 2. Product success may depend on ease of use,
not necessarily power
Pendahuluan 6/26
 Interaksi Manusia dan Komputer

Apa Interaksi Manusia dan Komputer (Human

Computer Interaction) ?

• IMK meliputi ergonomi dan faktor manusia.

Ergonomi UK =
Faktor manusia USA

• Secara tradisional, ergonomi memfokuskan pada karakteristik fisik

mesin dan sistem dan melihat unjuk kerja (performance) dari user.

• Faktor manusia merupakan studi tentang manusia dan tingkah

lakunya dalam menggunakan mesin, alat-alat teknologi dalam
menyelesaikan tugas.

• Interaksi + informasi dan = interaksi manusia

manusia – mesin teknologi dan komputer

Pendahuluan 7/26
 Interaksi Manusia dan Komputer

Course Aims and Goals

• 1. Consciousness raising
− Make you aware of these issues
• 2. Design critic
− Question bad design
• Allow users to carry out tasks
− Safely
− Effectively
− Efficiently
− Enjoyably

Pendahuluan 8/26
 Interaksi Manusia dan Komputer

Usability
• Important issue
• Combination of
− Ease of learning
− High speed of user task performance
− Low user error rate
− Subjective user satisfaction
− User retention over time

Two Crucial Errors

•Assume all users are alike
•Assume all users are like the designer

Pendahuluan 9/26
 Interaksi Manusia dan Komputer

How do we improve interfaces?

1. Change attitude of software professional
2. Draw upon fast accumulating body of knowledge regarding H-C
interface design
3. Integrate UI design methods & techniques into standard software
development methodologies now in place

Improving Interfaces
• Know the User!
− Physical abilities − Cultural diversity
− Cognitive abilities − Motivation
− Personality differences − Special needs
− Skill differences

Pendahuluan 10/26
 Interaksi Manusia dan Komputer

Paradigms

• Predominant theoretical frameworks or scientific

world views
− e.g., Aristotelian, Newtonian, Einsteinian (relativistic)
paradigms in physics

• Understanding HCI history is largely about

understanding a series of paradigm shifts
− Not all coming on next slides are really “paradigm”
shifts, but you get the idea

Pendahuluan 11/26
 Interaksi Manusia dan Komputer

Paradigm Shifts

• Cards,tape -> VDU • Visual -> Multimedia

• Mainframe -> PC
• Glass tty -> WIMP
interface
• Commands -> Direct
manipulation
• Direct manipulation
-> Agents
• Linear -> Web-like
• Desktop ->
Ubiquitous, Mobile
• Single user -> CSCW
• Purposeful use ->
Situated use

Pendahuluan 12/26
 Interaksi Manusia dan Komputer

History of HCI

• Digital computer grounded in ideas from

1700’s & 1800’s

• Technology became available in the

1940’s and 1950’s

Pendahuluan 13/26
 Interaksi Manusia dan Komputer

Vannevar Bush
• “As We May Think” - 1945 Atlantic Monthly

“…publication has been extended far beyond our

present ability to make real use of the record.”

Bush
• Postulated Memex device
− Can store all records/articles/communications
− Large memory
− Items retrieved by indexing, keywords, cross references
− Can make a trail of links through material
− etc.
• Envisioned as microfilm, not computer
Pendahuluan 14/26
 Interaksi Manusia dan Komputer

J.R. Licklider

• 1960 - Postulated “man-computer

symbiosis”

• Couple human brains

and computing machines
tightly to revolutionize
information handling

Pendahuluan 15/26
 Interaksi Manusia dan Komputer

Vision/Goals
Immed Intermed Long-term
•Time sharing •Combined speech •Natural language
•Electronic I/O recognition, understanding
•Interactive, real- character •Speech recognition
time system recognition, light- of arbitrary users
•Large scale pen editing •Heuristic programming
information
storage and
retrieval Mid 60’s
• Computers too expensive for individuals ->
timesharing
− increased accessibility Need
− interactive systems, not jobs for
− text processing, editing HCI
− email, shared file system
Pendahuluan 16/26
 Interaksi Manusia dan Komputer

Ivan Sutherland
• SketchPad - ‘63 PhD thesis at MIT
− Hierarchy - pictures & subpictures
− Master picture with instances (ie, OOP)
− Constraints
− Icons
− Copying
− Light pen as input device
− Recursive operations

Pendahuluan 17/26
 Interaksi Manusia dan Komputer

Douglas Engelbart Inventor

of mouse
• Landmark system/demo:
− hierarchical hypertext, multimedia, mouse, high-res display, windows,
shared files, electronic messaging, CSCW, teleconferencing, ...

Alan Kay
• Dynabook - Notebook sized computer loaded with
multimedia and can store everything

Personal Desktop
computing interface

Pendahuluan 18/26
 Interaksi Manusia dan Komputer

Video Display Units

• More suitable medium than paper

• Sutherland’s Sketchpad as landmark
system
• Computers used for visualizing and
manipulating data

Pendahuluan 19/26
 Interaksi Manusia dan Komputer

Personal Computing
• System is more powerful if it’s easier to use
• Small, powerful machines dedicated to individual
• Importance of networks and time-sharing
• Kay’s Dynabook, IBM PC
Personal Computers
• ‘70’s IBM PC
− Text and command-based
− Sold lots
PCs with GUIs, Xerox Star - ’81, Star, Apple
Lisa – ‘82, Apple Macintosh – ‘84

Pendahuluan 20/26
 Interaksi Manusia dan Komputer

WIMP
• Windows, Icons, Menus, Pointers
• Can do several things simulataneously
• Familiar GUI interface
• Xerox Alto, Star; early Apples

Metaphor
• All use is problem-solving or learning to some extent
• Relating computing to real-world activity is effective
learning mechanism
− File management on office desktop
− Financial analysis as spreadsheets

Pendahuluan 21/26
 Interaksi Manusia dan Komputer

Direct Manipulation
• Coins and explores notion of direct manipulation of interface
• Long-time Director of
HCI Lab at Maryland
• ‘82 Shneiderman describes appeal of graphically-based interaction
− object visibility
− incremental action and rapid feedback
− reversibility encourages exploration
− replace language with action
− syntactic correctness of all actions
• WYSIWYG, Apple Mac

Pendahuluan 22/26
 Interaksi Manusia dan Komputer

Multimodality
• Mode is a human communication channel
− Not just the senses, e.g., speech and non-speech audio are two modes
• Emphasis on simultaneous use of multiple channels for I/O

Hypertext – Ted Nelson

• Computers can help people, not just business
• Coined term “hypertext”
• Think of information not as linear flow but as
interconnected nodes
• Bush’s MEMEX, Nelson’s hypertext
• Non-linear browsing structure
• WWW ’93
Pendahuluan 23/26
 Interaksi Manusia dan Komputer

Nicholas Negroponte
• MIT machine architecture & AI group ‘69-’80s
• Ideas:
− wall-sized displays, video
disks, AI in interfaces
(agents), speech recognition,
multimedia with hypertext

Mark Weiser
• Introduced notion of “calm technology”
− It’s everywhere, but recedes quietly into background
• CTO of Xerox PARC

Pendahuluan 24/26
 Interaksi Manusia dan Komputer

Language (Agents)
• Actions do not always speak louder than words
• Interface as mediator or agent
• Language paradigm

CSCW
• Computer-Supported Cooperative Work
• No longer single user/single system
• Micro-social aspects are crucial
• E-mail as prominent success but other groupware still
not widely used
Pendahuluan 25/26
 Interaksi Manusia dan Komputer

Ubiquity
• Person is no longer user of virtual device
but occupant of virtual, computationally-
rich environment
• Can no longer neglect macro-social
aspects
• Late ‘90s - PDAs, VEs, ...

Pendahuluan 26/26
Pendahuluan IMK
Human Computer Interaction (HCI = IMK)
merupakan studi tentang interaksi antara
manusia, komputer dan tugas / task.
> Bagaimana manusia dan komputer secara
interaktif melaksanakan dan menyelesaikan tugas /
task dan bagaimana sistem yang interaktif itu dibuat.
Sistem interaktif :
• User friendly
• Easy to use
• Safely
..........
IMK meliputi ergonomi dan faktor
manusia.
Secara tradisional,
ergonomi memfokuskan pada:
 karakteristik fisik mesin dan sistem
dan melihat unjuk kerja (performance)
dari user.
Faktor manusia merupakan studi
tentang manusia dan tingkah lakunya
dalam menggunakan mesin, alat-alat
teknologi dan sistem dalam
menyelesaikan tugas
 Interaksi manusia – mesin + informasi dan teknologi
komputer = interaksi manusia komputer

 IMK dalam konteks kerja dan tugas user melibatkan :

• Desain
• Implementasi sistem interaktif
• Evaluasi

 User : siapa saja yang terlibat dalam menyelesaikan

tugas dengan menggunakan teknologi
 Komputer : teknologi, dari desktop sampai sistem
komputer besar, baik dari sistem
pengontrolan proses atau sistem
embedded.
 Interaksi : komunikasi user dan komputer
Yang terlibat dalam IMK adalah :

> Psikologi dan ilmu kognitif :

memberikan dasar pengetahuan tentang
persepsi user, kognitif, kemampuan
memecahkan masalah
> Ergonomi : kemampuan fisik user
> Sosiologi : kemampuan memahami
konsep interaksi
> Ilmu komputer dan teknik :
membuat teknologi
THE HUMAN (MANUSIA =
USER)
Terbatas dalam kapasitas memproses
informasi.
Implikasinya untuk desain.

Informasi pada manusia

• diterima dan direspon melalui saluran
(channel) Input/ Output.
• Disimpan di memori
• Diproses dan diaplikasikan.
KOMPUTER
Terdiri dari berbagai macam elemen yang
masing masing memiliki pengaruh terhadap
user.
Peralatan input untuk penggunaan secara
interaktif memungkinkan user untuk
memasukkan teks, gambar, dan memilih
obyek pada layar.
Peralatan output untuk penggunaan secara
interaktif secara umum adalah beberapa
jenis layar serta output dengan suara.
Output dan input dalam bentuk kertas.
Memori
Proses
 INTERAKSI
Model interaksi membantu untuk memahami apa
yang terjadi pada interaksi antara user dan sistem.
Model mengakomodasi apa yang diinginkan user
dan yang dilakukan sistem.

Ergonomi mencakup karakter fisik interaksi.

Dialog antara user dan sistem dipengaruhi oleh

gaya interaksi.

Interaksi terjadi pada konteks sosial dan organisasi

mempengaruhi user dan sistem.
 PROTOTIPE

• Bagaimana cara mengekspresikan ide-ide perancangan?

- Tidak ada software pengkodean pada tahap ini.

• Catatan:
- Membuat dengan cepat.
- Perkenankan banyak fleksibilitas untuk desain yang berbeda.
- Membuat dengan murah.
- Meningkatkan nilai umpan balik.

Permasalahan yang timbul:

1. Anda tidak dapat mengevaluasi rancangan tersebut sampai
rancangan tersebut dibangun.
2. Namun, setelah pembuatan, jika ingin melakukan perubahan maka
akan sangat sulit.

Solusinya:
Simulasikan perancangan dengan biaya yang kecil, salah satunya
dengan membuat model (prototype).
Untuk itu kita dapat menerapkan UCD (User Centered Design) dalam
pembuatan prototype tersebut.
UCD adalah mengenai perancangan teknologi yang interaktif untuk
memenuhi kebutuhan user.

Tahapan dalam UCD antara lain:

1. Memahami kebutuhan user.
2. Mendeskripsikan kebutuhan user.
3. Merancang prototype sebagai alternatif.
4. Mengevaluasi perancangan.

Karakteristik dalam proses UCD:

1. Memahami user dan kebutuhannya.
2. Fokus pada user pada tahap awal desain dan mengevaluasi hasil
desain.
3. Mengidentifikasi, membuat dokumentasi dan menyetujui kegunaan
dan tujuan pengalaman user.
4. Perulangan hampir dapat dipastikan. Para perancang tidak pernah
berhasil hanya dalam satu kali proses.

IMK – Prototyping 1/6

Dalam bidang yang lain perancangan sebuah prototype biasanya berupa
model dalam skala kecil.
Contoh: Maket Bangunan

Mengapa menggunakan Prototype?

- Evaluasi dan feedback pada rancangan interaktif.

- Stakeholder (dalam hal ini user) dapat melihat, menyentuh,
berinteraksi dengan prototype.
- Anggota tim dapat berkomunikasi secara efektif.
- Para perancang dapat mengeluarkan ide-idenya.
- Memunculkan ide-ide secara visual dan mengembangkannya.
- Dapat menjawab pertanyaan
membantu pemilihan di antara
alternatif-alternatif.

Dimensi Prototype

1. Penyajian
- Bagaimana desain dilukiskan atau diwakili?
- Dapat berupa uraian tekstual atau dapat visual dan diagram.

2. Lingkup
Apakah hanya interface atau apakah mencakup komponen
komputasi?

3. Executability (Dapat dijalankan)

- Dapatkah prototype tersebut dijalankan?
- Jika dikodekan, akan ada periode saat prototype tidak dapat
dijalankan.

4. Maturation (Pematangan)
Apakah tahapan-tahapan produk ini mengikuti?
- Revolusioner: mengganti yang lama.
- Evolusioner : terus melakukan perubahan pada perancangan yang
sebelumnya.

IMK – Prototyping 2/6

Metode Pembuatan Prototyping Dengan Cepat

Non-Computer
(biasanya dikerjakan lebih awal dalam proses pembuatan)

vs

Computer-Based
(biasanya dikerjakan kemudian)

Metode Non-Computer (Manual)

Tujuan
Ingin menyatakan gagasan desain dan mendapatkan dengan mudah
dan cepat pendapat atas sistem.

Deskripsi Desain
Dapat berupa deskripsi tekstual dari suatu desain sistem.
- Kelemahan yang nyata adalah seberapa jauh dari sistem yang
sebenarnya.
- Tidak dapat melakukan suatu pekerjaan yang mewakili aspek dari
interface.

Sketsa, Mock-ups
- Paper-Based “menggambarkan” interface.
- Baik untuk mengungkapkan pendapat.
- Difokuskan pada orang dengan desain tingkat tinggi.
- Tidak terlalu baik untuk menggambarkan alur dan rinciannya.
- Murah dan cepat
umpan balik sangat menolong.

Storyboarding
Pensil dan simulasi catatan atau walkthrough dari kemampuan dan
tampilan sistem.
- Menggunakan urutan diagram/gambar.
- Menunjukkan kunci snap shots.
- Cepat dan mudah.

IMK – Prototyping 3/6

Skenario
Hipotesis atau imajinasi penggunaan.
- Biasanya menyertakan beberapa orang, peristiwa, lingkungan dan
situasi.
- Menyediakan konteks operasi.
- Terkadang dalam format naratif, tetapi juga dapat berupa sketsa atau
bahkan video.

Utilitas Skenario
- Melibatkan dan menarik.
- Mengijinkan perancang untuk melihat masalah dari pandangan orang
lain.
- Memudahkan umpan balik dan pendapat.
- Dapat sangat kreatif dan futuristik.

Teknik Lain
Tutorial dan Manual
- Mungkin menuliskannya lebih berguna daripada disimpan dalam
kepala.
- Memaksa perancang untuk membuat keputusan dengan tegas.
- Menulis/meletakkannya di atas kertas jauh lebih berharga.

Metode Komputer
Menirukan lebih banyak kemampuan sistem.
- Pada umumnya hanya baru beberapa aspek atau fitur
- Dapat berpusat pada lebih banyak detail
- Bahaya: Para pemakai jadi lebih segan untuk menyarankan
perubahan sekali ketika mereka melihat prototype yang lebih realistis.

Terminologi
1. Prototype Horisontal
Sangat luas, mengerjakan atau menunjukkan sebagian besar
interface, tetapi ini dilakukan dengan cara yang licik.

2. Prototype Vertikal
Lebih sedikit aspek atau fitur dari interface yang disimulasikan, tetapi
dilaksanakan dengan rincian yang sangat baik.

3. Early Prototyping

IMK – Prototyping 4/6

4. Late Prototyping

5. Low-fidelity Prototyping (prototype dengan tingkat ketepatan yang

rendah)

Contoh (1) storyboard:

- Digunakan di awal desain.
- Biasanya digunakan dengan skenario, lebih terinci, dan dapat
diputar ulang.
- Kumpulan dari sketsa/frame individual.
- menyajikan urutan inti cerita.
- menunjukkan bagaimana kemungkinan user dapat mengalami
peningkatan melalui setiap aktifitas.

Contoh (2) sketsa:

- Sketsa sangat penting untuk low-fidelity prototyping.
- Jangan takut dengan kemampuan menggambar.
- Menyajikan “tampilan” yang kotor dan cepat dari interface, konsep
desain, dll.

Contoh (3) “wizard-of-oz”:

- User berpikir mereka berinteraksi dengan komputer, tapi developer
lebih menanggapi hasilnya daripada sistemnya.
- Biasanya dilakukan di awal desain untuk memahami apa yang
diharapkan oleh user.

6. Mid-fidelity prototyping (prototype dengan tingkat ketepatan sedang)

- Form skematik.
- Navigasi dan fungsi yang disimulasikan
biasanya berbasis pada
apa yang tampil pada layar atau simulasi layar.
- Contoh tools yang digunakan: powerpoint, illustrator, dll.

7. High-fidelity prototyping (prototype dengan tingkat ketepatan yang

tinggi)
- Hi-fi prototype seperti sistem akhir.
- Menggunakan bahan baku yang sama seperti produk akhir.
Tools umum yang digunakan: Macromedia Director, Visual Basic,
Flash, Illustrator.

IMK – Prototyping 5/6

Prototyping Tools
1. Draw/Paint Program, contoh: Photoshop, Coreldraw
- Menggambar setiap layar, baik untuk dilihat.
- Prototype horisontal, tipis.
- Adobe Photoshop.

2. Scripted Simulations/Slide Show, contoh: Powerpoint, Hypercard,

Macromedia Director, HTML.
- Letakkan tampilan seperti storyboard dengan (animasi) perubahan
diantaranya.
- Dapat memberikan user catatan yang sangat spesifik.
- Disebut chauffeured prototyping.
- Macromedia Director.

3. Interface Builders, contoh: Visual Basic, Delphi, UIMX.

- Tools untuk menampilkan jendela, kendali, dan lain-lain dari
interface.

• Fitur yang baik

- Mudah dikembangkan dan memodifikasi layar.
- Mendukung jenis interface yang dikembangkan.
- Mendukung berbagai macam divasi Input/Output.
- Mudah untuk memodifikasi dan menghubungkan layar.
- Mengijinkan memanggil prosedur eksternal dan program.
- Mengijinkan mengimpor teks, grafik, media lain.
- Mudah untuk dipelajari dan digunakan.
- Dukungan yang baik dari vendor.

IMK – Prototyping 6/6

NPM 55419051

NAMA Putri Almadea

KELAS 3IA04

.
I. II.
1. D 11. G
2. B 12. A
3. A 13. B
4. D 14. C
5. C 15. E
6. C 16. D
7. A 17. I
8. B 18. F
9. A 19. J
10. B 20. A

III.
21. Goal, Operator, Methods, Selection
22. Chunk
23. bidang ergonomi atau Ergonomics Research Society
24. Throw -Away
25. Red/Merah
26. Lesikal
27 Alan Kay
28. Operasi Menekan atau melepaskan mouse
29. Thypography
30. Kesalahan Mode

IV. Jawablah dengan singkat dan jelas.

31. Penerapan warna pada denah dapat memudahkan baik mahasiswa atau
pegawai kampus
22. Penerapan typograpy yang baik dan di sertai pemilihan icon, font dan tata
letak layout yang baik membuat orang yang mengunjungi sebua website
dapat menemukan dengan mudah dan tidak membuat kebingungan
33. Skala likert adalah skala yang digunakan untuk mengukur presepsi, sikap
atau pendapat seseorang atau kelompo mengenai sebuah peristiwa atau
fenomona social, bedasarkan definisi operasional yang telah ditetapkan
oleh peneliti
34. Wireframe adalah sebuah kerangka untuk menata suatu item di laman
website atau aplikasi. Pembuatan wireframe biasanya dilakukan sebelum
 pembuatan produk tersebut dilakukan. Item yang berkaitan seperti teks,
gambar, layoiting, dan sebagainya. Wireframe biasa ditugaskan kepada
ahlinya, yang biasa dikenal sebagai UI/UX Designer. Untuk melakukannya,
seorang UI/UX Designer menggunakan kertas coretan atau software khusus
untuk wireframing. Wireframe hanya menampilkan lembaran yang terdiri
dari kotak-kotak dan garis-garis untuk mengatur tata letak berbagai elemen
pada website atau aplikasi.

35. Struktur navigasi

36. Kolaborasi adalah proses dua orang atau lebih

37. Pembelajaran virtual lebih menarik dengan adanya design grafis yang
mendukung pembelajran
38. Kecerdasan buatan adalah kecerdasan yang di tambahkan kepada suatu
sistem
39. Icon adalah seni untuk menginformasikan tanpa tulisan melalui gambar

40. Menu Bar merupakan sebuah bagian yang di dalamnya terdapat berbagai
perintah
 Kisi-kisi tentang UTS dan informasi lainnya

1. Materi soal UTS adalah dari awal sd akhir yang diajarkan sd gmeet Minggu ke 10

Materi secara lengkap dapat di unduh pada follder imkbaru pada tavipia.staff.gunadarma.ac.id

atau file2 ppt yang akan diberikan lewat ketua kls pada minggu ke 10.

file yang diunggah pada vclass ini adalah kisi-kisi uts ata 2021.2022 sebagai persiapan untuk
dapat mengerjakan soal-soal dengan lebih terarah.

2. Informasi mengenai jadwal ujian akan diberikan secepatnya dalam vclass mggu ke 10.

SOAL UJIAN TENGAH SEMESTER

 Berdoalah sebelum mengerjakan soal-soal berikut

I. Untuk soal 1 s/d 10

Jika pilihan jawaban :
A. Jika terdapat 3 jawaban yang benar
B. Jika terdapat 2 jawaban yang benar
C. Jika terdapat 1 jawaban yang benar
D. Jika semua jawaban benar

1. Ragam dialog (dialog style) :

1. Command language
2. WIMP
3. Natural Language
4. Speech

2. Jenis-jenis memori jangka panjang (Long Term memory)

1. episodic memori
2. perseptual memori
3. semantic memori
4. haptic memori

3. Prinsip-prinsip desain grafis :

1. metaphora
2. aligment
3. cosistency
4. clarity

HaL 1 dari 5
II. Untuk soal berikut no. 11 s/d 20
Jawablah dengan memilih jawabannya yang ada disebelah kanan

11. Audio Speech digunakan sebagai alarm A. Sistem Motor

dan warning atau status informasi.
B. CAD / CAM
12. Jika user ingin merespon sistem dengan
meng-clik mouse 1x tapi yang terjadi adalah C. Disain Ikon
double click.Hal ini adalah jenis ERROR
yang mana? D. Skenario

13.Contoh pembuatan Prototype rapid

menggunakan bantuan aplikasi ….

III. Untuk soal no. 21 s/d 30

21. Pada model user, apa singkatan dari GOMS?

22. Pada short term memory untuk lebih mengingat deretan angka dengan membaginya dalam
kelompok berdasarkan sifat tertentu, disebut ?

23. Cabang ilmu pengetahuan yang menitikberatkan pada karakteristik fisik mesin dan sistem serta
bagaiman hal tersebut dapat mempengaruhi kerja user ?

IV. Untuk soal no. 31 s/d 40

Jelaskan ilustrasi gambar berikut.
Ilustrasi gambar tersebut berhubungan dengan materi-materi IMK (Konsep, Teori, Metoda,
Penerapannya dlsb.)
Ada 10 gambar.

HaL 2 dari 5