INTERAKSI.

Slides:



Advertisements
Presentasi serupa
Aspek Ergonomik.
Advertisements

INTERAKSI Pertemuan ketiga – Kuliah Interaksi Manusia dan Komputer
INTERAKSI MANUSIA DAN KOMPUTER
Interaksi Manusia dan Komputer
PERANCANGAN ANTARMUKA - 2
Interaksi Manusia dan Komputer
Interaksi Manusia dan Komputer Pendahuluan Oleh : ANISYA, S.KOM Teknik Informatika Fakultas Teknologi Informatika ITP 2013 Pertemuan 01 Oleh : Anisya,
INTERAKSI MANUSIA DAN KOMPUTER
Pemodelan & Kualifikasi
Interaksi Manusia dan Komputer (IMK) Dosen : Tata Sumitra M
Interaksi Manusia dan Komputer
IMK 1. Pengantar IMK. 2. Faktor Manusia Kerangka Kerja
Interaksi Manusia dan Komputer
INTERAKSI.
Merancang User Interface
MEMAHAMI RAGAM DIALOG.
Aspek Ergonomi Dalam IMK
Interaksi Manusia dan Komputer (IMK) 2 SKS Dosen : Yulistia,S. Kom. ,M
Bina Sarana Informatika
Interaksi Manusia Dan Komputer (Interaksi)
Interaksi Manusia dengan Komputer
Interaksi Manusia dan Komputer
Pert 4 Interaksi.
Pertemuan 1 Kontrak Perkuliahan
komponen antarmuka pengguna
Kerangka Kerja & Paradigma Interaksi
INTERAKSI.
Pertemuan 4 | Interaksi Manusia dan Komputer | UDINUS
KONSEP USER INTERFACE.
Interaksi Manusia Dan Komputer
Interaksi Manusia & Komputer Pendahuluan
Interaksi Manusia.
Interaksi Manusia & Komputer Desain
Desain Tempat Kerja Rahmi Lubis,S.Psi.,M.Psi..
SEKOLAH TINGGI MANAJEMEN INFORMATIKA & KOMPUTER
Interaksi Manusia & Komputer Ragam Dialog
Interaksi Manusia dan Komputer
Aspek Ergonomi Dalam IMK
KONSEP INTERFACE
Interaksi Manusia & Komputer Faktor Manusia
interaksi Interaksi Manusia - Komputer
Kerangka Kerja dan Paradigma Interaksi
Interaksi manusia komputer
Aspek Ergonomi Dalam IMK
Aspek Ergonomi dalam IMK
Mobile Device User Interface
Interaksi Manusia dan Komputer
UMAR MUHAMMAD,ST.,MT PERTEMUAN I
INTERAKSI MANUSIA DAN KOMPUTER
Human-Computer Dialogue
INTERAKSI MANUSIA DAN KOMPTER MOHAMAD HILMAN 2016.
PENANGANAN KESALAHAN DAN HELP DOKUMENTASI
INTERAKSI MANUSIA DAN KOMPUTER
MODEL DAN TEKNIK INTERAKSI
Aspek Ergonomi Dalam IMK
Aspek Ergonomi Dalam IMK
INTERAKSI MANUSIA DAN KOMPUTER
Aspek Ergonomi Dalam IMK
Interaksi.
PENGANTAR KOMPUTER DAN TEKNOLOGI INFORMASI 1B
Aspek Ergonomi Dalam IMK
Aspek Ergonomi Dalam IMK. Pengertian Ergonomi Suatu bidang studi yang mencari atau menangani desain peralatan dan tugas-tugas yang cocok dengan kapabilitas.
Rekayasa Perangkat Lunak
Aspek Ergonomi Dalam IMK
This presentation uses a free template provided by FPPT.com Application of Anthropomorphism to Interaction Design.
Desain Tempat Kerja Rahmi Lubis,S.Psi.,M.Psi..
INTERAKSI.
KONSEP USER INTERFACE PENGANTAR KOMPUTER DAN TEKNOLOGI INFORMASI 1B.
Dialogue Notation & Design Part-2
Interaksi Manusia dan Komputer (IMK) 3 SKS
Transcript presentasi:

INTERAKSI

PENDAHULUAN Model interaksi Ergonomi Gaya interaksi Konteks terjemahan antara pengguna dan sistem Ergonomi karakteristik fisik dari interaksi Gaya interaksi sifat pengguna / system dialog Konteks sosial, organisasi, motivasi

PENDAHULUAN Dialog manusia dan sistem dipengaruhi oleh bentuk interface. Interaksi mengambil tempat antara sosial dan organisasi framework yang mempengaruhi user dan sistem. Cakupan yang luas untuk tingkat keharusan komunikasi user dan sistem dalam melakukan task (tugas) : Batch processing : tidak diperlukan input langsung dari user. Direct manipulation and virtual reality : Semua dikontrol oleh user.

APA ITU INTERAKSI? komunikasi user  system

3 LEVEL INTERAKSI Task level : Dialog level Input/output level : Pengetahuan user terhadap task domain / area tugas, dan komputer merepresentasikan task domain yang diinginkan oleh manusia Dialog level - Pengetahuan user dalam berbahasa (bhs yg bisa dipahami komputer) dan komputer bisa mengerti bhs yg diberikan manusia shg tjd interaksi yg baik. Input/output level : - Input manusia ke komputer melalui peranti masukan (keyboard,mouse), dan ouput (monitor, printer)

Terms Of Interaction Norman Model Interaction Framework MODELS OF INTERACTION Terms Of Interaction Norman Model Interaction Framework

TERMINOLOGI INTERAKSI Domain : Area keahlian dan pengetahuan pada kegiatan dunia nyata Goal : Menginginkan hasil dari suatu task (tugas) Task : Merupakan operasi untuk memanipulasi muatan dari domain Intention : Aksi khusus untuk menemukan tujuan yang diinginkan

TERMINOLOGI INTERAKSI (lnjt) Task analysis : Identifikasi ruang masalah yang berkaitan dengan domain, tujuan, tugas, dan maksud System : aplikasi komputer Task language : Bahasa user, menjelaskan atribut domain yang relevan terhadap kondisi pengguna Core language : Bahasa sistem yang menjelaskan atribut domain yang relevan terhadap kondisi sistem

SIKLUS INTERAKSI (execution/evaluation loop) system evaluation execution goal Donald Norman’s model (7 komponen) : Menetapkan tujuan Membentuk intention Menetapkan rangkaian aksi Melaksanakan aksi Melihat kondisi sistem Menginterprestasikan kondisi sistem Mengevaluasi kondisi sistem sehubungan dengan goal dan intention Model Norman berkonsentrasi pada pandangan pengguna antarmuka

SIKLUS INTERAKSI (execution/evaluation loop) system evaluation execution goal Menetapkan tujuan membentuk intention menetapkan rangkaian aksi melaksanakan aksi melihat kondisi sistem menginterprestasikan kondisi system mengevaluasi kondisi sistem sehubungan dengan goal dan intention

SIKLUS INTERAKSI (execution/evaluation loop) system evaluation execution goal menetapkan tujuan membentuk intention menetapkan rangkaian aksi melaksanakan aksi melihat kondisi sistem menginterprestasikan kondisi system mengevaluasi kondisi sistem sehubungan dengan goal dan intention

SIKLUS INTERAKSI (execution/evaluation loop) system evaluation execution goal menetapkan tujuan membentuk intention menetapkan rangkaian aksi melaksanakan aksi melihat kondisi sistem menginterprestasikan kondisi system mengevaluasi kondisi sistem sehubungan dengan goal dan intention

USING Norman’s model Beberapa sistem lebih sulit digunakan daripada yang lain Gulf of Execution Aksi yang dirumuskan oleh user ≠ aksi yang diijinkan oleh sistem Gulf of Evaluation harapan user pada perubahan status sistem ≠ presentasi aktual dari status sistem

USING Norman’s model

GULF of EVALUATION GULF of EXECUTION &

GULF of EVALUATION GULF of EXECUTION & Desain interface yang baik, gulf harus seminimal mungkin. Gulf of Execution Jika aksi-aksi yang dibentuk oleh user tidak bisa dibentuk oleh sistem Aksi dari user sulit dirumuskan oleh input sistem Gulf of evaluation Jika presentasi dari aksi tidak bisa dimengerti oleh user User sulit menerjemahkan output dari sistem

KESALAHAN MANUSIA tergelincir (slips) dan kesalahan (mistakes) memahami sistem dan tujuan benar perumusan tindakan tindakan salah Kesalahan (mistakes) mungkin bahkan tidak punya tujuan benar! Memperbaiki segala sesuatu? slip - desain antarmuka yang lebih baik kesalahan - pemahaman yang lebih baik sistem

KERANGKA KERJA S U O I user input system output Lebih luas dari Norman… 4 komponen kerangka kerja interaksi : user input system output masing-masing memiliki bahasa yang unik interaksi  terjemahan antara bahasa-bahasa masalah dalam interaksi = masalah dalam penerjemahan S core U task O output I input

KERANGKA KERJA

KERANGKA KERJA kerangka umum untuk memahami interaksi niat pengguna  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

aspek fisik dari antarmuka antarmuka industri ERGONOMI aspek fisik dari antarmuka antarmuka industri

ERGONOMI Studi tentang karakteristik fisik dari interaksi Juga dikenal sebagai faktor-faktor manusia - tetapi ini juga dapat digunakan untuk tujuan yang lebih hanya sebagai HCI! Ergonomi baik menentukan standar dan pedoman untuk membatasi cara kita mendesain aspek tertentu dari sistem

Contoh-contoh Ergonomi pengaturan 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 kesehatan Contoh : posisi fisik, kondisi lingkungan (suhu, kelembaban), pencahayaan, kebisingan penggunaan warna Contoh : penggunaan merah untuk peringatan, hijau untuk oke, kesadaran kebutaan warna, dll

Ergonomi

Ergonomi

Ergonomi

Ergonomi

Ergonomi

Ergonomi

Ergonomi

Ergonomi

Ergonomi

ANTARMUKA INDUSTRI Office interface vs. industrial interface? Konteks masalah ! office industrial type of data textual numeric rate of change slow fast environment clean dirty

representasi berbagai informasi yang sama ANTARMUKA KACA ? Vessel B Temp 100 200 113 industri antarmuka: tradisional …. cepat dan tombol-tombol sekarang …. layar dan keypad antarmuka barometer lebih murah, lebih fleksibel, beberapa representasi, nilai-nilai yang tepat tidak secara fisik berada, kehilangan konteks, kompleks antarmuka perlu keduanya.. representasi berbagai informasi yang sama

MANIPULASI TIDAK LANGSUNG kantor– manipulasi langsung pengguna berinteraksi dengan dunia buatan system industri– manipulasi tidak langsung pengguna berinteraksi dengan dunia nyata melalui antarmuka issues .. feedback delays interface plant immediate feedback instruments

Ergonomi Industri

Ergonomi Industri

Ergonomi Industri

Ergonomi Industri

PRINSIP ERGONOMI Prinsip Fisikal : Menjadikan segala sesuatu mudah dijangkau Bekerja dengan tinggi yang sesuai/cocok Bekerja dengan postur yang sesuai Mengurangi pengeluaran tenaga yang berlebihan Meminimalkan kepenatan/keletihan Mengurangi pengulangan yang berlebihan Memberikan jarak ruang dan akses Meminimalkan contact stress

PRINSIP ERGONOMI Prinsip Fisikal (lnjt): Memberikan mobilisasi dan mengubah postur/posisi Menahan getaran Menciptakan lingkungan yang menyenangkan : Pencahayaan yang tepat : Menghindarkan user dari cahaya langsung atau pantulannya Memperoleh 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

Ergonomi

PRINSIP ERGONOMI Prinsip Kognitif Adanya standarisasi Membuat stereotipe Menghubungkan aksi dengan persepsi Mempermudah pemaparan suatu informasi Menyajikan informasi pada level yang tepat secara detail

PRINSIP ERGONOMI Prinsip Kognitif (lnjt) Memberikan image/gambaran yang jelas Membuat redundansi, misal warna yang berbeda, cetak tebal, miring, dll. Membuat pola/patterns Memberikan stimulan yang bervariasi sesuai kondisi Memberikan umpan balik secara cepat/seketika.

Ergonomi

Ergonomi

GAYA INTERAKSI dialogue … computer and user gaya interaksi yang berbeda Gaya interaksi berhubungan erat dengan user interface.

LIMA GENERASI PERKEMBANGAN USER INTERFACE Antarmuka sistem berkelompok : Generasi pertama dari user interface User berinteraksi dengan sistem melalui pengantar kerja secara berkelompok Semua perintah disampaikan terlebih dahulu sebelum dicetak hasilnya. Daya guna antarmuka rendah

Antarmuka berorientasikan baris perintah : LIMA GENERASI PERKEMBANGAN USER INTERFACE Antarmuka berorientasikan baris perintah : Diperkenalkan pada tahun 1960-an. Tele-type (TTY) adalah mesin yang pertama menggunakan antarmuka baris perintah User mengetikkan perintah baris demi baris. Interaksi user dengan perintah berbentuk dialog soal-jawab Berdaya guna rendah Komputer lebih mengontrol user Antarmuka tidak pemaaf dan membebani ingatan user

Antarmuka orientasi baris perintah

Antarmuka full screen : LIMA GENERASI PERKEMBANGAN USER INTERFACE Antarmuka full screen : Berbentuk pengisian borang Membolehkan beberapa data dimasukkan Sistem menu berbentuk user interface full screen

Antarmuka Full Screen

Antarmuka pengguna grafik : LIMA GENERASI PERKEMBANGAN USER INTERFACE Antarmuka pengguna grafik : Berbentuk visual (GUI : Graphic User Interface) menggunakan grafik, ikon, dan animasi Secara komersil mulai tahun 1980-an Interaksi 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

GUI Interface

GUI Interface

Antarmuka pengguna masa depan : LIMA GENERASI PERKEMBANGAN USER INTERFACE 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.

LIMA GENERASI PERKEMBANGAN USER INTERFACE Contoh bentuk user interface masa depan : Embodied Interaction : menggunakan gerakan tubuh untuk memberikan input ke komputer 3D Virtual Reality : memberikan bentuk seolah user benar-benar berada dalam komputer. Sensing Affect : komputer telah bisa mengenal lingkungan dan pengaruhnya, merasakan, mendengar, dan melihat. Sensor Networks : sensor yang ditempatkan jauh dari komputer, mampu mendeteksi vision dan sound. Merupakan perkembangan teknologi jaringan komputer secara wireless. Cyborg : evolusi perkembangan IMK yang merupakan aspek dari artificial intelligent.

Embodied Interaction

3D Virtual

3D Virtual Reality

Sensing Affect

Sensor Network

Cyborg

Future Interface

Future Interface

Future Interface

Future Interface

Future Interface

GAYA INTERAKSI secara umum : command line interface menus natural language question/answer and query dialogue form-fills and spreadsheets WIMP point and click three–dimensional interfaces

mudah untuk berfokus pada tampilan bagaimana dengan perasaan? INTERACTIVITY mudah untuk berfokus pada tampilan bagaimana dengan perasaan?

SPEECH-DRIVEN INTERFACE cepat 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

Speech-driven GIS

TAMPILAN dan NUANSA WIMP systems have the same elements: windows, icons., menus, pointers, buttons, etc. namun sistem windows yang berbeda ….. berperilaku berbeda e.g. MacOS vs Windows menu penampilan + perilaku = tampilan dan nuansa

INSIATIF Siapa yang memiliki inisiatif? WIMP pengecualian …. pertanyaan-menjawab – komputer antarmuka WIMP – pengguna WIMP pengecualian …. pre-emptive bagian dari penampilan modal kotak dialog datang dan tidak pergi! baik untuk kesalahan, langkah-langkah penting tetapi gunakan dengan hati-hati

KESALAHAN dan PERBAIKAN tidak selalu menghindari kesalahan … …tetapi kita menempatkan mereka benar memudahkan untuk mendeteksi kesalahan …maka pengguna dapat memperbaiki mereka hello, this is the Go Faster booking system what would you like? (user) I want to fly from New York to London you want a ticket from New York to Boston (user) no sorry, please confirm one at a time do you want to fly from New York (user) yes … … …

CONTEXT (suasana) Interaksi dipengaruhi oleh konteks sosial dan organisasi orang lain keinginan untuk mengesankan, persaingan, rasa takut akan kegagalan Motivasi ketakutan, kesetiaan, ambisi, kepuasan diri sistem yang tidak memadai menyebabkan frustrasi dan kurangnya motivasi

Designing experience real crackers cheap and cheerful! bad joke, plastic toy, paper hat pull and bang

Designing experience virtual crackers cheap and cheerful bad joke, web toy, cut-out mask click and bang

Designing experience virtual crackers cheap and cheerful bad joke, web toy, cut-out mask click and bang

how crackers work sender recipient sender fill in web form To: wxv From: .. receive email recipient closed cracker page open message recipient clicks cracker opens ... very slowly sender watches progress joke links open cracker page web toy mask

The crackers experience real cracker virtual cracker Surface elements design cheap and cheerful simple page/graphics play plastic toy and joke web toy and joke dressing up paper hat mask to cut out Experienced effects shared offered to another sent by email message co-experience pulled together sender can't see content until opened by recipient excitement cultural connotations recruited expectation hiddenness contents inside first page - no contents suspense pulling cracker slow ... page change surprise bang (when it works) WAV file (when it works)

Physical design banyak kendala: ergonomis - Tombol minimum ukuran fisik - saklar tegangan tinggi yang besar hukum dan keamanan - Kontrol cooker tinggi konteks dan lingkungan - mudah dibersihkan estetika - harus terlihat baik ekonomi - ... dan biaya tidak terlalu banyak!

Physical design

Design trade-offs kendala bertentangan ... perlu trade-offs dalam kategori: e.g. keselamatan - cooker kontrol panel depan - lebih aman bagi orang dewasa panel belakang - lebih aman bagi anak antara kategori e.g. ergonomi vs fisik - MiniDisc remote ergonomi - kontrol harus lebih besar fisik - tidak ada ruang! solusi - multifungsi mengendalikan & pengurangan fungsionalitas

inverse actions yes/no buttons ‘joystick’ also left side control well sort of ‘joystick’ also left side control

spring back controls one-shot buttons joystick some sliders good – large selection sets bad – hidden state

a minidisk controller twist for track movement pull and twist for volume – spring back – natural inverse for twist series of spring-back controls each cycle through some options –natural inverse back/forward

physical layout controls: logical relationship ~ spatial grouping

compliant interaction state evident in mechanical buttons rotary knobs reveal internal state and can be controlled by both user and machine