I N T E R A K S I
Transcript of I N T E R A K S I
3/24/2014
1
I N T E R A K S I
Pertemuan 4 | Interaksi Manusia dan Komputer | UDINUS
Apa Itu Interaksi?
Komunikasi
user system
3/24/2014
2
Interaksi
Dialog manusia dan sistem dipengaruhi oleh bentukinterface.Interaksi mengambil tempat antara sosial dan organisasiframework yang mempengaruhi user dan sistem.Cakupan yang luas untuk tingkat keharusan komunikasiuser dan sistem dalam melakukan task (tugas) :
Batch processing :tidak diperlukan input langsung dari user.
Direct manipulation and virtual reality :Semua dikontrol oleh user.
Level Interaksi
Pengetahuan user pada task domain
Pengetahuan user dalam berbahasa
Tangan mata telinga user
Komputer merepresentasikan task domain
Perintah bahasa komputer
Input keyboard, tampilan dan input lainnya
Output tampilan printer dan output lainnya
Task Level
Dialog Level
Input/Output Level
Goal dari User Output pada Dunia Nyata Goal Level
Struktur Manusia Struktur Komputer
3/24/2014
3
Terminologi * Interaksi
Domain :Area keahlian dan pengetahuan pada kegiatan dunianyata
Goal :Menginginkan hasil dari suatu task (tugas)
Task :Merupakan operasi untuk memanipulasi muatan daridomain
Intention :Aksi khusus untuk menemukan tujuan yang diinginkan
*batasan
Terminologi Interaksi (Lnjt)
Task analysis :Identifikasi ruang masalah yang berkaitan dengandomain, tujuan, tugas, dan maksud
System :aplikasi komputer
Task language :Bahasa user, menjelaskan atribut domain yang relevanterhadap kondisi pengguna
Core language :Bahasa sistem yang menjelaskan atribut domain yangrelevan terhadap kondisi sistem
3/24/2014
4
Siklus Interaksi (Execution/Evaluation Loop)
Donald Norman’s model (7 komponen) :Menetapkan tujuanMembentuk intentionMenetapkan rangkaian aksiMelaksanakan aksiMelihat kondisi sistemMenginterprestasikan kondisi sistemMengevaluasi kondisi sistem sehubungan dengan goal dan intention
Model Norman berkonsentrasi pada pandangan pengguna antarmuka
system
evaluationexecution
goal
Siklus Interaksi (Execution/Evaluation Loop)
Menetapkan tujuanMembentuk intentionMenetapkan rangkaian aksiMelaksanakan aksiMelihat kondisi sistemMenginterprestasikan kondisi systemMengevaluasi kondisi sistem sehubungan dengan goal dan intention
system
evaluationexecution
goal
3/24/2014
5
Menetapkan tujuanMembentuk intentionMenetapkan rangkaian aksiMelaksanakan aksiMelihat kondisi sistemMenginterprestasikan kondisi systemMengevaluasi kondisi sistem sehubungan dengan goal dan intention
system
evaluationexecution
goal
Siklus Interaksi (Execution/Evaluation Loop)
menetapkan tujuanmembentuk intentionmenetapkan rangkaian aksimelaksanakan aksimelihat kondisi sistemmenginterprestasikan kondisi systemmengevaluasi kondisi sistem sehubungan dengan goal dan intention
system
evaluationexecution
goal
Siklus Interaksi (Execution/Evaluation Loop)
3/24/2014
6
Gulf Of Execution & Gulf Of EvaluationDesain interface yang baik, gulf harus seminimalmungkin.
Gulf of ExecutionJika aksi-aksi yang dibentuk oleh user tidak bisa dibentukoleh sistemAksi dari user sulit dirumuskan oleh input sistem
Aksi yang dirumuskan oleh user≠ aksi yang diijinkan oleh sistem
Gulf of evaluationJika presentasi dari aksi tidak bisa dimengerti oleh userUser sulit menerjemahkan output dari sistem
harapan user pada perubahan status sistem≠ presentasi aktual dari status sistem
Gulf Of Execution & Gulf Of Evaluation
3/24/2014
7
Kerangka Kerja Interaksi
Model kerja interaksi G.D Abowd dan R. Beale (Human-Computer Interaction, 2003)
4 komponen kerangka kerja interaksi :userinputsystemoutput
masing-masing memiliki bahasa yang unik
interaksi ⇒ terjemahan di antara bahasa yang ada
masalah dalam interaksi = masalah dalam penerjemahan
Score
Utask
Ooutput
Iinput
Kerangka Kerja
3/24/2014
8
Kerangka Kerja
niat pengguna (user)→ diterjemahkan ke dalam tindakan di antarmuka
→ diterjemahkan ke dalam status perubahan sistem → tercermin dalam tampilan output
→ ditafsirkan oleh pengguna
kerangka umum untuk memahami interaksi tidak terbatas pada sistem komputer elektronik mengidentifikasi semua komponen utama yang terlibat dalam interaksi memungkinkan sistem penilaian komparatif suatu abstraksi
ErgonomiStudi tentang karakteristik fisik dari interaksi yang mengarah kepadafaktor kenyamanan kerja.
Memahami seluruh kondisi manusia, baik dari segi anatomi, fisiologi,psikologi, engineering, manajemen, dan desain/perancangan.
Ergonomi baik menentukan standar dan pedoman untuk membatasicara kita mendesain aspek tertentu dari sistem
3/24/2014
9
Contoh-contoh Ergonomipengaturan kontrol dan tampilan
contoh : kontrol dikelompokkan berdasarkan fungsi atau frekuensi penggunaan, atau secara berurutan
lingkungan sekitar Contoh : pengaturan tempat duduk beradaptasi untuk mengatasi semua ukuran pengguna
masalah kesehatanContoh : posisi fisik, kondisi lingkungan (suhu, kelembaban), pencahayaan, kebisingan
penggunaan warna Contoh : penggunaan merah untuk peringatan, hijau untuk oke, kesadaran kebutaan warna, dll
Ergonomi
3/24/2014
10
Ergonomi
Ergonomi
3/24/2014
11
Ergonomi
Ergonomi
3/24/2014
12
Ergonomi
Ergonomi
3/24/2014
13
Ergonomi
Antarmuka Industri
Office interface vs. industrial interface?
Konteks masalah !
office industrialtype of data textual numericrate of change slow fastenvironment clean dirty
3/24/2014
14
MANIPULASI TIDAK LANGSUNG
kantor– manipulasi langsungpengguna berinteraksi dengan dunia buatan
industri– manipulasi tidak langsung
pengguna berinteraksi dengan dunia nyata melalui antarmuka
issues ..feedbackdelays
system
interface plant
immediate
feedback
instruments
Ergonomi Industri
3/24/2014
15
Ergonomi Industri
Ergonomi Industri
3/24/2014
16
Ergonomi
Prinsip ErgonomiPrinsip Fisikal :
Menjadikan segala sesuatu mudah dijangkauBekerja dengan tinggi yang sesuai/cocokBekerja dengan postur yang sesuaiMengurangi pengeluaran tenaga yang berlebihanMeminimalkan kepenatan/keletihanMengurangi pengulangan yang berlebihanMemberikan jarak ruang dan aksesMeminimalkan contact stress
3/24/2014
17
Prinsip ErgonomiPrinsip Fisikal (lnjt):
Memberikan mobilisasi dan mengubah postur/posisiMenahan getaranMenciptakan lingkungan yang menyenangkan :
Pencahayaan yang tepat :Menghindarkan user dari cahaya langsung atau pantulannyaMemperoleh keseimbangan antara kecerahan (brightness) layar tampilan dan kecerahan yang ada di depan user.Menghindari cahaya langsung atau pantulan yang langsung mengenai layar tampilan.
Cahaya langsung (berasal dari matahari)Cahaya tidak langsung (pantulan dari tembok, lantai, meja, dsb)
Temperatur yang tepat
Prinsip ErgonomiPrinsip Kognitif
Adanya standarisasiMembuat stereotipeMenghubungkan aksi dengan persepsiMempermudah pemaparan suatu informasiMenyajikan informasi pada level yang tepat secara detail
3/24/2014
18
Prinsip ErgonomiPrinsip Kognitif (lnjt)
Memberikan image/gambaran yang jelasMembuat redundansi, misal warna yang berbeda, cetaktebal, miring, dll.Membuat pola/patternsMemberikan stimulan yang bervariasi sesuai kondisiMemberikan umpan balik secara cepat/seketika.
Ergonomi
3/24/2014
19
Ergonomi
Gaya Interaksi
dialogue … computer and user
gaya interaksi yang berbeda
Gaya interaksi berhubungan erat dengan user interface.
3/24/2014
20
5 Perkembangan Generasi User Interface
1. Antarmuka sistem berkelompok :Generasi pertama dari user interfaceUser berinteraksi dengan sistem melalui pengantar kerja secara berkelompokSemua perintah disampaikan terlebih dahulu sebelum dicetak hasilnya.Daya guna antarmuka rendah
2. Antarmuka berorientasikan baris perintah :Diperkenalkan pada tahun 1960-an.Tele-type (TTY) adalah mesin yang pertama menggunakan antarmuka baris perintahUser mengetikkan perintah baris demi baris.Interaksi user dengan perintah berbentuk dialog soal-jawabBerdaya guna rendahKomputer lebih mengontrol userAntarmuka tidak pemaaf dan membebani ingatan user
5 Perkembangan Generasi User Interface
3/24/2014
21
Antarmuka Orientasi Baris Perintah
3. Antarmuka full screen :Berbentuk pengisian borangMembolehkan beberapa data dimasukkanSistem menu berbentuk user interface full screen
5 Perkembangan Generasi User Interface
3/24/2014
22
Antarmuka Full Screen
4. Antarmuka pengguna grafik :Berbentuk visual (GUI : Graphic User Interface) menggunakan grafik, ikon, dan animasiSecara komersil mulai tahun 1980-anInteraksi berdasar WIMP (window, icon, menu, dan pointer)Manipulasi langsung dari user dengan objek visual melalui mouse atau peranti lain.Point and click, drag and drop, dan menggerakkan objek merupakan ciri utama dalam GUI
5 Perkembangan Generasi User Interface
3/24/2014
23
GUI Interface
GUI Interface
3/24/2014
24
5. Antarmuka pengguna masa depan :Mengarah pada penambahan unsur animasi obyek, audio (suara dan bunyi), serta unsur tiga dimensi.Interaksi yang digunakan lebih ke natural language dan membenarkan penggunaan input yang tidak berformat.
5 Perkembangan Generasi User Interface
Contoh bentuk user interface masa depan :Embodied Interaction : menggunakan gerakan tubuh untukmemberikan input ke komputer3D Virtual Reality : memberikan bentuk seolah user benar-benarberada dalam komputer.Sensing Affect : komputer telah bisa mengenal lingkungan danpengaruhnya, merasakan, mendengar, dan melihat.Sensor Networks : sensor yang ditempatkan jauh dari komputer,mampu mendeteksi vision dan sound. Merupakan perkembanganteknologi jaringan komputer secara wireless.Cyborg : evolusi perkembangan IMK yang merupakan aspek dariartificial intelligent.
5 Perkembangan Generasi User Interface
3/24/2014
25
Embodied Interaction(menggunakan gerakan tubuh untuk memberikan input ke komputer )
3D Virtual(memberikan bentuk seolah user benar-benar berada dalam
komputer)
3/24/2014
26
3D Virtual Reality
Sensing Affect
(komputer telah bisa mengenal lingkungan dan pengaruhnya, merasakan, mendengar, dan melihat )
3/24/2014
27
Sensor Network(sensor yang ditempatkan jauh dari komputer, mampu mendeteksi
vision dan sound.)
Cyborg(evolusi perkembangan IMK yang merupakan aspek dari artificial intelligent)
3/24/2014
28
Future Interface
Future Interface
3/24/2014
29
Future Interface
Future Interface
3/24/2014
30
Future Interface
Gaya Interaksi Secara Umum command line interfacemenusnatural languagequestion/answer and query dialogueform-fills and spreadsheetsWIMPpoint and clickthree–dimensional interfaces
3/24/2014
31
Speech-driven Interfacecepat memperbaiki …
…. tapi masih tidak akurat
bagaimana memiliki dialog yang kuat…….. Interaksi, tentu saja!
e.g. airline reservasi: jawaban “yes” dan “no” + sistem mencerminkan kembali pemahamannya
“kamu menginginkan tiket dari New York ke Boston? “
Speech-driven
3/24/2014
32
Speech-driven GIS
Designing experience
real crackerscheap and cheerful!bad joke, plastic toy, paper hat pull and bang
3/24/2014
33
Designing experience
virtual crackerscheap and cheerfulbad joke, web toy, cut-out mask click and bang
Designing experience
virtual crackerscheap and cheerfulbad joke, web toy, cut-out mask click and bang
3/24/2014
34
how crackers work
sender
fill in web form
To: wxvFrom: ..
receive email recipient
closedcracker page
openmessage
recipient clickscracker opens ...
very slowly
jokelinks
opencracker page
web toymask
sender
watchesprogress
Physical designbanyak kendala:
ergonomis - tombol dengan ukuran minimumfisik - saklar tegangan tinggi yang besarhukum dan keamanan - kontrol cooker tinggikonteks dan lingkungan - mudah dibersihkanestetika - harus terlihat baikekonomi - ... dan biaya tidak terlalu banyak!
3/24/2014
35
Physical design
physical layout
controls:logical relationship
~ spatial grouping
Spatial : spasi
3/24/2014
36
compliant interaction
Kondisi yang umum dalam tombol mekanik
tombol putar mengungkapkan sesuatu yang umum dan dapat dikendalikan oleh
pengguna dan mesin
3 teknik interaksi
Linquistic Stylemelalui bahasa yg dimengerti oleh komputer Key-Model Stylemelalui penekanan tombol2 yg diprogram sebelumnya untuk menjalankan fungsi-fungsi.Direct Manipulation Stylemelalui manipulasi terhadap obyek tertentu.
3/24/2014
37
Linquistic Style
Command line
Key-Model Style
Question and answerFunction key interactionMenu based interaction
3/24/2014
38
Direct Manipulation Style
Form fill-inGraphical direct manipulationGraphical User Intarface