HUMAN COMPUTER INTERACTION Television (High Tech) (Intermediate)   To reproduce the video effects on this slide, do the following: On the Home tab, in the Slides group, click Layout, and then click Blank. On the Insert tab, in the Images group, click Picture. In the left pane of the Insert Picture dialog box, click the drive or library that contains the picture of the TV. In the right pane of the dialog box, click the picture that you want and then click Insert. Under Picture Tools, on the Format tab, in the Adjust group, click Remove Background, to remove background and television screen from image, do the following: Click one of the handles on the marquee lines, drag the line so that it contains the portion of the picture that you wish to keep, and excludes most of the areas you wish to remove (highlighted area will be removed). On the Background Removal tab, in the Refine group, click Mark areas to Remove, then click in corner of TV monitor and drag selection in a diagonal line to other corner. Select Mark Areas to Keep and/or Mark Areas to Remove to refine selection. On the Background Removal tab, in the Close group, select Keep Changes. On the Home tab, in the Drawing group, click Arrange, point to Align then do the following: Click Align Middle. Under Picture Tools, on the Format tab, in the Picture Styles group, click the arrow at the bottom right launching the Format Picture dialog box. In the Format Picture dialog box, select Position in the left pane, under Position on slide in the right pane set the Horizontal to .52” and the Vertical to .74”. In the Format Picture dialog box, select Size in the left pane, under Size and Rotate in the right pane set the Height to 6.5” and the Width to 8.96”. Close the Format Picture dialog box. On the Insert tab, in the Media group, click Video, and then click Video from file. In the left pane of the Insert Video dialog box, click the drive or library that contains the video. In the right pane of the dialog box, click the video that you want and then click Insert. On the Animations tab, in the Animation group, select Play. Also on the Animations tab, in the Timing group, click the arrow to the right of Start and select With Previous. With the video selected, under Video Tools, in the Format tab, in the bottom right corner of the Video Styles group, click the arrow opening the Format Video dialog box. In the Format Video dialog box, click Size in the left pane, under Size and Rotate in the right pane set the height to 4.45” and the Width to 7.91”. In the Format Video dialog box, click Position in the left pane, under Position on Slide in the right pane set Horizontal to 1.04” and the Vertical to 1.27”. Close the Format Video dialog box. Select the video and under Video Tools, on the Format tab, in the Arrange group, click Send Backward, and then select Send to Back. To reproduce the background effects on this slide, do the following: On the Design tab, in the bottom right corner of the Background group, click the arrow at the bottom right launching the Format Background dialog box. In the Format Background dialog box, select Fill in the left pane, under Fill on the right pane select Gradient Fill. Under Gradient stops, click Add gradient stop or Remove gradient stop until four stops appear on the slider. Customize the gradient stops as follows: Select the first stop on the slider, and then do the following: In the Position box, enter 35%. Click the button next to Color, and then under Theme Colors select Blue, Accent 1, Lighter 80% (second row, fifth option from the left). Select the second stop on the list, and then do the following: In the Position box, enter 91%. Click the button next to Color, and then under Theme Colors select Blue, Text 2, Lighter 60% (third row, fourth option from the left). Select the third stop on the list, and then do the following: In the Position box, enter 94%. Click the button next to Color, and then under Theme Colors select Dark Blue, Text 2, Darker 25% (fifth row, fourth option from the left). Select the last stop on the list, and then do the following: In the Position box, enter 97%. Click the button next to Color, and then under Theme Colors select Dark Blue, Text 2, Lighter 40% (fourth row, fourth option from the left). Close the Format Background dialog box.

Human Computer interaction Definisi “ 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. ” [ ACM SIGCHI Curricula for Human-Computer Interaction [Hewett et al., 2002, page 5] ] Suatu subjek yang interdisipliner, berhubungan dengan berbagai penelitian dan bidang ilmu lainnya

Human Computer Interaction Ilmu HCI mencangkup beberapa kajian mengenai: Kegunaan dan konteks komputer Karakteristik manusia Sistem komputer dan arsitektur antarmuka The Developmental Process Human Computer Interaction Manusia User Lainnya (others) dalam suatu organisasi Komputer Hardware (Perangkat keras) Software (Perangkat Lunak) Interaksi user “memberitahukan” kepada komputer apa yang diinginkan Komputer mengomunikasikan hasilnya

Disciplines contributing to HCI Computer science Cognitive psychology Ergonomics Artificial intelligence Linguistics Philosophy Sociology anthropology

ASPEK DAN TUJUAN A. ASPEK INTERDISIPLINER B. TUJUAN Aesthetic, Antropology, Artificial Intelligence, Cognitive science, Design, Ergonomics (Human factors), Library and Information Sciences, Engineering, Cognitive psychology dan Sociology B. TUJUAN Tujuan dasar HCI adalah meningkatkan interaksi antara user dan komputer, dengan membuat komputer yang lebih user-friendly dan lebih mudah untuk digunakan. HCI juga memperhatikan mengenai Metodologi dan proses dalam mendesain suatu antarmuka Teknik dalam membandingkan dan mengevaluasi antarmuka Mengembangkan teknik baru mengenai interaksi dan antarmuka Mengembangkan model-model yang bersifat deskriptif dan prediktif serta teori-teori mengenai interaksi

USER KOMPUTER USER FRIENDLY User dalam konteks komputer adalah sesorang yang menggunakan sistem komputer. Pada umumnya mereka memiliki sebuah akun, nama pengguna, serta membaca dengan teliti antarmuka bagi pengguna. KOMPUTER Sebuah komputer adalah perangkat atau mesin yang digunakan untuk melakukan perhitungan atau mengatur operasi-operasi yang dapat diekspresikan dalam bentuk numerik dan logika. Komputer terdiri atas komponen-komponen yang dapat melakukan fungsi-fungsi yang sudah terdefinisi dengan baik. Kompleksitas interaksi pada komponen-komponen inilah yang membuat komputer memiliki kemampuan dalam mengolah informasi. Ketika komputer terkonfigurasi dengan baik (Melalui pemrograman), komputer dapat merepresentasikan beberapa aspek dari masalah atas sebagian dari sistem. USER FRIENDLY Usability adalah kondisi dimana seseorang bisa dengan mudah menggunakan sebuah alat tertentu atau objek buatan manusia untuk mencapai suatu tujuan tertentu. Usability juga mengacu pada metode-metode pengukuran dan pembelajaran dari kegunaan serta prinsip dibalik suatu objek yang dirasakan efisiensi maupun keindahannya.

Untuk mewujudkan konsepsi komputer sebagai pengolah data untuk menghasilkan suatu informasi, maka diperlukan sistem komputer (computer system) yang elemennya terdiri dari hardware, software dan brainware. Ketiga elemen sistem komputer tersebut harus saling berhubungan dan membentuk kesatuan. Hardware tidak akan berfungsi apabila tanpa software, demikian juga sebaliknya. Dan keduanya tiada bermanfaat apabila tidak ada manusia (brainware) yang mengoperasikan dan mengendalikannya. A. Hardware atau Perangkat Keras: peralatan yang secara fisik terlihat dan dapat disentuh. B. Software atau Perangkat Lunak: program yang berisi instruksi/perintah untuk melakukan pengolahan data. C. Brainware: manusia yang mengoperasikan dan mengendalikan sistem komputer

Pentingnya HCI Produktivitas individual (cth. word processing (pengolahan kata), instalasi) organisasi (merubah isi pekerjaan, kepuasan, lingkungan pekerjaan, kekuasaan dan pengaruh) Keselamatan kerja cth. Pembangkit tenaga nuklir, Pengendalian lalu-lintas penerbangan

Implikasi Praktis dalam HCI Desain, Implementasi Evaluasi terhadap user interface

Faktor-faktor dalam HCI Organisasi: job design, aturan, kebijakan Lingkungan: suara, heating, cahaya, ventilasi Kesehatan: stress,headaches The user : motivasi, kepuasan, pengalaman Kenyamanan : tempat duduk User interface : I/O devices, color scheme, icons, dialogue, help Tugas: kompleksitas, kebaruan, alokasi, pengulangan, monitoring Kendala: biaya, rentang waktu, staf, peralatan, bangunan System functionality : hardware, software, jaringan Produktivitas : output, kualitas, biaya, errors, waktu produksi

USER INTERFACE Antarmuka pemakai adalah keseluruhan sarana yang digunakan oleh manusia (user) untuk berinteraksi dengan beberapa peralatan mesin tertentu, komputer atau alat kompleks lainnya (sistem). Di dalam antarmuka pemakai (user interface) terdapat sarana: A. Input, Memungkinkan pemakai (user) untuk mengontrol sistem B Output, Memungkinkan sistem untuk memberikan informasi kepada users (disebut juga sebagai feedback)

Map of Human Computer Interaction

Karakteristik Manusia Untuk memahami manusia sebagai suatu sistem pemrosesan informasi, bagaimana manusia berkomunikasi, dan persyaratan secara fisik dan psikologis Pemrosesan Informasi Manusia Karakteristik manusia sebagai pemroses informasi memori, persepsi, keterampilan motorik, perhatian, problem-solving, motivasi, model-model konseptual, diversity Bahasa, komunikasi dan interaksi Aspek-aspek bahasa sintaks, semantik, pragmatik, interaksi dalam percakapan, bahasa khusus Ergonomics Karakteristik antropometri dan fisiologis manusia serta hubungan mereka dengan ruang kerja dan lingkungan arrangement of displays and controls; cognitive and sensory limits; effects of display technology; fatigue and health; furniture and lighting; design for stressful and hazardous environments; design for the disabled...

Sistem Komputer dan Arsitektur Antarmuka Komponen khusus yang dimiliki komputer untuk berinteraksi dengan manusia: The specialized components computers have for interacting with people: Input and output devices mekanik dan karakteristik perangkat keras (Hardware) tertentu, karakteristik kinerja (manusia dan sistem), esoteric devices, virtual devices Dialogue techniques Software teknik dan arsitekture dasar untuk berinteraksi dengan manusiathe basic software architecture and techniques for interacting with humans cth. dialog inputs and outputs; interaction styles; issues Dialog genre Penggunaan konseptual dalam sarana teknis e.g. interaction and content metaphors, transition management, style and aesthetics Computer graphics Konsep dasar dari grafik komputer yang sangat berguna dalam HCI

The Development Process Konstruksi dan evaluasi antarmuka manusia: Design approaches Proses desain cth. grafis desain dasar (tipografi, warna, dll), rekayasa perangkat lunak, analisis tugas, desain industri Implementation techniques and tools taktik dan alat untuk implementasi, dan hubungan antar desain, evaluasi dan implementasi cth. prototyping techniques, dialog toolkits, object-oriented methods, representasi data dan algoritma Evaluation techniques filsafat dan metode khusus untuk evaluasi cth. productivitas, usability testing, formative and summative evaluation

Usability is a part of usefulness and is composed of: Learnability Efficiency of use Memorability Few and noncatastrophic errors Subjective satisfaction Usability includes considerations such as: Who are the users, what do they know, and what can they learn? What do users want or need to do? What is the general background of the users? What is the context in which the user is working? What has to be left to the machine? What to the user? Answers to these can be obtained by conducting user and task analysis at the start of the project and by user-focused requirements analysis, building user profiles, and usability testing.

USABILITY TESTING Time on Task How long does it take people to complete basic tasks? For example, find something to buy, create a new account, and order the item. Accuracy How many mistakes did people make? And were they fatal or recoverable with the right information? Recall -- How much does the person remember afterwards? Emotional Response How does the person feel about the tasks completed? Confident? Stressed? Would the user recommend this system to a friend?

CSCW (Computer Supported Cooperation Work) The term computer supported cooperative work (CSCW) "how collaborative activities and their coordination can be supported by means of computer systems." Groupware are synonyms. Ellis (1993) defines groupware as "computer-based systems that support groups of people engaged in a common task (or goal) and that provide an interface to a shared environment." On the other hand, different authors claim that while groupware refers to real computer-based systems, CSCW focuses on the study of tools and techniques of groupware as well as their psychological, social, and organizational effects. CSCW Support different time and place. A lot of confusion in the field of CSCW raises from the different interpretations of the terms collaboration and cooperation. The concept of cooperation is often used in relation to the concepts of coordination and communication. Contoh : Videoconferencing, Messaging (Instant messaging, Email)

IKON SEBAGAI ANTARMUKA MANUSIA KOMPUTER Ikon (Yunani) = image/gambar/simbol yang merepresentasikan suatu objek -> baru kemudian berkembang menjadi tulisan Dalam HCI, ikon dimaksudkan sebagai IMAGE atau SIMBOL YANG MEREPRESENTASIKAN SUATU OPERASI/PERINTAH a. Ikon Piktorial untuk merepresentasikan informasi operasi semantik dan abstrak dengan gambar b. Ikon Simbol untuk merepresentasikan informasi operasi semantik dengan beberapa karakter

Pertimbangan dalam menciptakan ikon KETERGANTUNGAN KULTUR/BUDAYA dan APLIKASI, gunakan simbol alami sesuai latarbelakang budaya BENTUK MUDAH DIKENAL (easy recognition), makna yang tepat akan membantu mengingat dan mengidentifikasi ikon BERBEDA DGN IKON LAIN DALAM 1 SISTEM, mudah dibedakan dan memiliki ciri yang khas dalam merefleksi- kan makna dari objek yang direpresentasikan KEUNTUNGAN DIGUNAKAN IKON SEBAGAI ANTARMUKA Operasi akan lebih cepat daripada menuliskan kata-kata perintah Untuk memahami arti semantik suatu ikon akan lebih cepat Perintah-perintah atau operasi dengan ikon dapat dilakukan secara simultan

Kenapa mempelajari kegunaan manusia dalam sistem komputer? (1) Dilihat dari pandangan sistem: complex human complex computer complex interface between the two Dilihat dari faktor manusia: humans have necessary limitations errors are costly in terms of loss of time loss of money loss of lives in critical systems loss of morale design can cope with such limitations!

Kenapa mempelajari kegunaan manusia dalam sistem komputer? (2) Dilihat dari pandangan bisnis: to use humans more productively/effectively the human costs now far outweigh hardware and software costs Dilihat dari faktor personal: people view computers as appliances, and want it to perform as one Dilihat dari pasar: everyday people using computers now expect “easy to use system” not tolerant of poorly designed systems if product is hard to use, people will seek other products Cth: Mac vs IBM (Microsoft Windows)

Kenapa mempelajari kegunaan manusia dalam sistem komputer? (3) Dilihat dari pandangan sosial: Computers contribute to critical parts of our society, and cannot be ignored educate our children take medical histories and provide expert advice keep track of our credit worthiness control air and ground traffic flow control chemical/oil/nuclear plants control space missions assist humans with their everyday tasks (office automation) control complex machines (aircraft, space shuttles, super tankers) help control consumer equipment (cars, washing machines) entertainment (games, intellectual stimulation)