1

DIKTAT KULIAHRIF 3090

INTERAKSI MANUSIA DANKOMPUTER

Disusun oleh :

Dyah Ayu Irawati, ST., M.Cs. 198407082008122001Ariadi Retno THR, S.Kom., M.Kom. 198108102005012002

JURUSAN TEKNIK ELEKTROPROGRAM STUDI MANAJEMEN INFORMATIKA

POLITEKNIK NEGERI MALANG2012

2

BAB 1Pengantar

I.1. PendahuluanDalam kehidupan keseharian, kita sering berhadapan dengan produk-produk yang interaktif : handphone, komputer, televisi, mesin ATM, web, mesinfotokopi dan masih banyak lagi. Pernahkah kita memikirkan seberapabergantungnya kita terhadap produk-produk tersebut ? Ketikamenggunakannya, pernahkah kita memikirkan aspek kegunaan, kemudahan,kenyamanan dan keamanannya ?Pada tahun 1950-an sampai 1970-an, orang tidak terlalu memperhatikankesulitan dalam pemakaian komputer, karena pada saat itu komputer hanyadipakai oleh para ahli komputer. Tetapi pada masa sekarang, komputer sudahdipakai pada hampir semua aspek kehidupan.Dalam era teknologi informasi saat ini, manusia mempunyaiketergantungan yang semakin tinggi terhadap berbagai produk tersebut.Semakin meningkat dan kompleksnya penggunaan produk-produk interaktifmenyebabkan munculnya kebutuhan akan interface (antar muka) yang mudahdipakai, sederhana, efektif dan efisien. Pertanyaan ”Apakah sistem komputeranda memiliki interface yang user friendly? ” menjadi penting untukdipertimbangkan dalam mendesain suatu sistem. Jika produk-produk tersebutmemerlukan prosedur yang rumit ketika digunakan, bisakah andamembayangkan berapa banyak waktu yang harus dihabiskan untukmengoperasikannya?Penelitian tentang interaksi manusia dan komputer telah mengubah arahkomputasi secara mendasar. Salah satu contoh kesuksesan penelitian tentanginteraksi manusia dan komputer adalah grafik interface yang digunakan padaMicrosoft Windows, yang dipakai diberbagai belahan dunia sampai saat ini.Grafik interface ini dikembangkan dari Xerox PARC, yang mulanya merupakansalah satu penelitian di Stanford Research Laboratory dan MassachusettsInstitute of Technology. Selain itu, perkembangan World-Wide- Web yang sangatpesat merupakan akibat langsung dari penelitian interaksi manusia dankomputer yaitu : aplikasi teknologi hypertext yang memungkinkan seseorangmelintasi batas-batas regional dengan menggunakan mouse.Interaksi manusia dan komputer secara umum adalah bidang studi yangmempelajari manusia, teknologi komputer dan interaksi dari kedua belah pihak.

3

Interaksi manusia dan komputer bisa didefinisikan sebagai ‘disiplin ilmu yangmempelajari desain, evaluasi, implementasi dari sistem komputer interaktifuntuk dipakai oleh manusia, beserta studi tentang faktor-faktor utama dalamlingkungan interaksinya.’ (ACM SIGCHI,1992,p.6)Pada saat ini jenis interaksi yang banyak digunakan adalah interaksi dasarseperti : manipulasi secara langsung, penggunaan mouse pointing, windows, textediting dan fasilitas menggambar. Dimasa yang akan datang pemakaian aplikasilain seperti pengenalan gerak isyarat, multimedia dan 3 dimensi akan semakinbanyak digunakan sebagai sarana interaksi antara manusia dan komputer.Penelitian tentang interaksi manusia dan komputer dilakukan baik dikalangan universitas maupun industri. Perkembangan penelitian interaksimanusia dan komputer di universitas dan industri dapat dilihat pada gambar 1.

4

Konsep antarmuka yang baik penting untuk semua jenis sistem, misalnya: monitoring proses industri, navigasi, e-commerce, Sistem Informasi Geografis(SIG) dan lain-lain. Interface yang baik sangat membantu dalam penggunaan danpemanfaatan suatu sistem. Seringkali kecepatan, keamanan, dan bahkankahandalan sistem sangat tergantung pada interface yang baik.Interaksi manusia dan komputer mempelajari bagaimana mendesaininterface yang baik dan bagaimana suatu interface dikatakan baik. Dalammendesain interface, ada beberapa hal yang harus diperhatikan yaitu :1. setiap aplikasi memiliki keunikan2. pengguna komputer memiliki tingkat pemahaman yang berbeda-beda3. desainer memiliki sudut pandang yang berbeda dengan penggunanyasehingga seringkali tidak memahami betul apa yang dibutuhkanpengguna.4. pengguna akan lebih banyak menghabiskan waktu dalam memanfaatkansistem komputer, bukan desainernya.5. sistem komputer dinilai dari user interfcenya.6. pada umumnya antarmuka menghabiskan 50%-80% bagian dariapplication code.Perkembangan teknologi komputer turut berpengaruh dalam pemakaiankomputer itu sendiri yang pada akhirnya mempengaruhi perkembangan desaininterface suatu sistem komputer sehingga bisa memaksimalkan fungsinya untukuser. Pekembangan komputer dapat dilihat pada tabel 1.1.Tabel 1-1. Perkembangan komputer digital dan pemakainya

Tipe Komputer Tahun Pemakai Utama KeteranganRiset 1950-an Ahli matematikadan peneliti Size, reliability, pemakai harusmempelajari setiap detail dari

Gambar 1.1. Perkembangan penelitian beberapa jenis saranayang dipakai dalam interaksi manusia dan komputer.

5

(scientist) pemrogramanMainframe 1960dan1970-anAhli pemrosesandata yangmenyediakanservice bagipelanggan

Pengguna hasil outputkomputer (businessmanagers) kurang puasdengan adanya delay, biayadan ke-tidak-fleksibel-ankomputerMinicomputer 1970-an Ahli teknik danlainnya (non-komputer) Pemakai komputer masihharus mengerti pemrograman;usability mulai menjadimasalahMicrocomputer(danaplikasinya) 1980-an Hampir semuaorang Karena itulah usabilitymenjadi masalah UTAMA!Metode interaksi yang ada pada komputer dapat di kelompokkan menjadi :1. interaksi dasara. Manipulasi langsung objek grafik : manipulasi langsung dengan mengubahobjek menggunakan pointer. Pertama kali di demonstrasikan oleh IvanSutherland (1963).b. Mouse : mouse pada awalnya dikembangkan di laboratorium Stanfordpada tahun 1965 sebagai bagian dari proyek NLS untuk menggantikanlight-pen. Pada tahun 1968, Ken Pulfer dan Grant Bechthold membuatrangka mouse dari kayu dan menggunakannya untuk membuat animasidengan membuat semua frame filmnya.c. Windows : multiple windows didemonstrasikandi Engelbart’s NLS tahun1968.2. tipe aplikasia. program menggambar : sebagian besar program menggambar yang adasekarang ini merupakan pengembangan program menggambar(Sketchpad) yang didemonstrasikan di Sutherland pada tahun1963.Sketchpad menggunakan light-pen untuk menggambar objek.b. Teks editor : program teks editor pada awalnya dikembangkan di StanfordResearch Lab pada tahun 1963. program ini mampu mencari danmenggantikan kata, menggulung (scrolling) teks, memindahkan teks,mengkopi, menghapus dan mem-blok kata atau karakter.c. Spreadsheet : VisiCalc merupaka spreadsheet paling awal yangdikembangkan oleh Frankston dan Bricklin (1977-1978), mahasiswa MITdan Harvard, untuk komputer Apple II.d. HyperText : ide dari hypertext (dokument dihubungkan dengan dokumenlain) merupakan pengembangan dari ide MEMEX yang diprakarsai olehVannevar Bush’s sejak tahun 1945. Nama hypertext di cetuskan oleh Ted

6

Nelson pada tahun 1965.e. Computer Aided Design (CAD) : CAD merupakan program bantu untukpara desainer. CAD dipresentasikan pada tahun 1963.f. Video games : video games grafis pertama adalah SpaceWar yang di buatoleh Slug Russel pada tahun 1962. Games ini menggunakan komputerjoystick pertama.3. interaksi moderna. pengenalan isyarat : sistem pengenalan isyarat pertama kalididemonstrasikan oleh Tom Ellis pada tahun 1964.b. Multi-Media : proyek interaktif dokumen grafik yang dikembangkandalam proyek FRESS pada tahun 1968 merupakan sistem hypermediapertama dan menggunakan teks serta grafik raster (belum menggunakanvideo). Pada tahun 1982, BBN mengembangkan kombinasi informasimultimedia (teks, spreadsheet,grafik dan suara). Tahun 1983, film manualdari Architecture Machine (MIT) menjadi demonstrasi antara video dankomputer grafik yang pertama.c. 3 D : sistem 3 D yang pertama adalah ”Timothy Johnson’s 3 D CAD”.d. Bahasa alami dan percakapan : metode interaksi yang menggunakanbahasa penghubung yang biasa dipakai manusia.Untuk mengembangkan interface yang bisa mengakomodasi kebutuhanpenggunanya, selain dari sisi peralatan (komputer) juga diperlukan pendekatandari sisi manusianya. Ada banyak disiplin ilmu yang mendukung interaksimanusia dan komputer antara lain :a. ilmu komputerb. ekonomic. psikologid. seni dan desaine. sosiologif. komunikasig. filsafath. bahasai. Kecerdasan buatanI.2 Tujuan Interaksi manusia dan komputerArti penting interaksi manusia dan komputer dapat dilihat dari beberapasegi, antara lain :1. daya guna (usable) : dilihat dari seberapa besar manfaat yang bisadidapatkan dari sistem yang dipakai, apakah sistem tersebut memudahkanatau justru menyulitkan penguna. Sebagian besar faktor pertimbangandalam mendesain suatu sisten adalah dilihat dari besarnya manfaat yangbisa didapatkan dari sistem tersebut. Ada 5 karakter desain yang

7

memperhatikan aspek daya guna yaitu :a. desain berpusat pada pengguna : sejak awal desain sudah berfokus padapengguna dan fungsi dari sistemb. desain yang partisipatif : dalam mendesain melibatkan pengguna sebagaitim desain. Seringkali desainer tidak mengerti benar apa yangdibutuhkan dan diinginkan oleh pengguna.c. desain eksperimental : ada tahap percoabaan yang dilakukan oleh useruntuk mengetahui apakah sistem yang dibuat sudah cocok dengan polakerja dan keinginan penggunad. desain iteratif : sistem yang telah di coba diperbaiki secara berkelanjutansampai sesuai dengan spesifikasi yang telah ditetapkan.e. Desain yang mensupport pengguna : dalam sistem di beri fasilitas yangbisa dimanfaatkan oleh pengguna mendukung aplikasi sistem tersebut.2. fungsionalitas : berhubungan dengan fungsi-fungsi yang ada di dalam sistemitu sendiri, apakah sesuai dengan yang direncanakankan atau belum.3. keamanan : keamanan meliputi keamanan data dan keamanan penggunanya(biasanya dari sisi kesehatan) ketika sistem tersebut digunakan. Adakah efeksamping yang dialami pengguna ketika menggunakan sistem tersebut.4. efektifitas dan efisiensi : dilihat dari seberapa besar pengaruh sistemtersebut terhadap produktivitas keja pengunanya.I.3 Ruang Lingkup Interaksi Manusia dan KomputerDalam interaksi manusia dan komputer, ada 3 komponen yang perludipelajari yaitu manusia, komputer dan interaksinya. Manusia dapat merupakanpengguna individu, kelompok maupun publik. Sebelum mendesain sangatdisarankan mempertimbangkan orang-orang yang nantinya akan terlibat dalamsistem tersebut, baik sebagai pengguna, aministator maupun desainernya. Dalammendesain, kemampuan desainer untuk memahami penggunanya sangatpenting sehingga desainer perlu memahami beberapa sifat manusia.Komputer meliputi semua prasarana yang dipakai dalam sistem tersebutbaik hardware maupun software. Dalam mendesain perlu diperhatikanprasarana yang digunakan oleh pengguna supaya sistem yang dibuat dapatberjalan dengan baik. Desain yang sangat baik jika tidak didukung denganprasarana yang memadai tidak akan bisa berjalan dengan baik.Interaksi merupakan komunikasi antara pengguna dengan komputer.Dalam prakteknya, pengguna akan menghabiskan banyak waktu untukberhubungan dengan sistem yang dibuat sehingga desainer perlumemperhatikan pola-pola interaksi yang cocok untuk pengguna. Sistem yangsama belum tentu memberikan efek yang sama pada pengguna. Dala hal inidesainer perlu benar-benar memahami karakter pengguna.

8

Cognitive Ergonomics dan Human Computer InteractionFaktor kenyamanan, yang dalam istilah teknis disebut ergonomik, dalambidang apapun mempunyai pengaruh yang nyata dalam peningkatan maupunpenurunan efisiensi dan efektifitas kerja. Ergonomics bertujuan untukmengoptimisasikan hubungan antara manusia dan pekerjaannya.Dalam pemakaian komputer lingkungan fisik tempat penggunamelakukan aktivitas mempunyai pengaruh yang significant dalam interaksimanusia dengan komputer. Harus disadari bahwa lingkungan kerja fisik yangjelek akan mempengaruhi kinerja karyawan. Aspek yang perlu dipertimbangkandalam menciptakan lingkungan kerja yang nyaman antara lain :1. aspek ergonomik dari tempat kerja2. pencahayaan3. suhu dan kualitas udara4. gangguan suara5. kesehatan dan keamanan kerja6. kebiasaan bekerjaAspek tersebut diatas sangat sulit ditentukan standarnya, karena sangatbersifat subjektif.1. aspek ergonomik dari tempat kerjaaspek ergonomik biasanya penuh dengan informasi kuantitatif.Ada beberapa ilmu yang sering dipakai oleh para ahli dalammemperhitungkan aspek ergonomik antara lain Antropometrik.Antropometrik adalah bidang ilmu yang berhubungan dengan pengukurantubuh manusia misalnya tinggi badan, jangkauan penglihatan penglihatandan jangkauan tangan. Ini dapat dipakai untuk mendesain tempat dudukyang nyaman, posisi tangan di keyboard yang nyaman dsb.Misalnya dalam pekerjaan yang banyak melakukan pemasukandata (data entry) lebih berorientasi pada hard copy, sehingga operatorakan lebih banyak melakukan pengetikan dibandingkan dengan melihat kelayar. Sedangkan pekerjaan akuisisi data akan lebih banyak melihat kelayar dari pada memasukkan data.Tabel 1-2 menunjukkan beberapa keluhan fisik yang sering terjadid tempat kerja.Tabel 1-2. Keluhan-keluahan fisik, faktor penyebab dan saran pemecahannyaKeluhan Faktor penyebab Saran pemecahanKelelahanvisual, iritasi Pencahayaan yang tidakmemadai Menjaga tingkat iluminasiruangan antara 300-700 luxKilau dan pantulan cahaya Tempatkan layar tampilansejajar dengan jendela.Pakai pelindung kilauRasa pegal dipunggung Kursi yang tidak memadai Sediakan kursi yangmemberikan dukungan

9

pada bagian pinggang danpunggung dan dapat diaturketinggiannyaRuangan kaki yang sempit Sediakan meja yangmemadai sehingga kakioperator dapat bergerakbebasLeher, bahu,dan lengan Tinggi meja yang tidakmemadai Sediakan meja dan kursiyang ketinggiannya sesuaidengan operatorPergelangantangan Sudut telapak tangan yangjelek Gunakan kursi yangmempunyai sandaranlenganTerlalu banyak mengetik Aturalah kecepatanmengetik sesuai denganprinsip analisis waktu dangerakanBerhenti secara periodisdari pekerjaan mengetik2. pencahayaandalam penggunaan ruang kerja yang banyak menggunakan layartampilan, kilau yang ditimbulkan oleh layar merupakan persoalan yangdapat mengganggu kenyamanan pengguna komputer. Untuk mencegahberbagai keluhan visual,tujuan utama dari perancangan pencahayaan adalah:a. menghindari pengguna dari cahaya terang langsung atau pantulanb. memperoleh keseimbangan antara kecerahan layar tampilan dankecerahan yang ada di depan penggunac. menghindari cahaya langsung atau pantulan yang tepat mengenai layar3. suhu dan kualitas udarapemakaian komputer dalam jumlah yang besar menimbulkan panastambahan di ruang kerja. Isu mengenai panas yang ditambahkan olehkomputer penting karena perubahan suhu udara yang sedikit saja dapatmempengaruhi kinerja seseorang.Salah satu cara untuk mengendalikan suhu udara adalah denganmemasang pengontrol suhu dan kelembabab udara di ruang kerja. Selainsuhu dan kelembaban, tipe dan kualitas penyaring udara yang dipasang diruang kerja juga mempengaruhi kinerja karyawan.4. ganguan suaraAdanya suara di ruang kerja dapat berpengaruh positif dan negatifdalam kerja. Seringkali kita tidak sadar dengan adanya suatu suara yang

10

tetap dan tidak berlebihan. Tetapi kita akan menjadi stress dengan suarayang cukup keras atau tiba-tiba. Atau suara yang mengalami perubahankeras dan tinggi rendahnya suara (transient sound). Suara mempengaruhikonsentrasi dan tingkat stress manusia.Dalam kondisi khusus, masalah suara dapat diatasi denganmenggunakan penutup telinga atau memberikan pengontrol akustik dalamruang kerja.5. kesehatan dan keamanan kerjakemajuan teknologi ternyata tidak hanya membawa dampak positifsaja. Salah satu hal yang perlu diperhatikan dalam penggunaan teknologibaru adalah adanya hambatan dari orang-orang yang tidak menyukaiteknologi tersebut maupun penggunaan teknologi yang tidak tepat.Aspek keamanan dan kenyamanan kerja dipengaruhi oleh kondisiumum kesehatan pekerja. Kondisi kesehatan yang bervariasi secarasignificant dapat meningkatkan resiko ketidaknyamanan, kelelahan otot danpersendian dan resiko kesehatan yang lain.6. kebiasaan bekerjaselain kondisi kesehatan pekerja, kebiasaan dalam bekerja juga turutmempengaruhi kinerja. Agar dapat bekerja dengan nyaman dengankomputer ada beberapa kebiasaan yang bisa membantu yaitu:a. bekerja dalam keadaan sesantai mungkin dan dalam posisi yang benarb. mengubah posisi duduk untuk mencegah kelelahan otot yang berlebihanc. berdiri dan mengambil beberapa menit untuk mengendorkan ketenganototd. istiharat secara periodikReferensi Dix, Introduction Preece, bab 1,2 (Part I: Introduction) Brad A.Myers, A Brief History of Human Computer Interaction Technology,1996, CMU-CS-96-163www.cc.gatech.educlasses/AY2002/cs4470_fall/CMU-CS-96-163 Santosa I, Interkasi manusia dan komputer , teori dan praktek, 2004, AndiOffset, Yogyakarta.

11

BAB IIKomponen Interaksi Manusia dan Komputer

Sistem komputer memiliki tiga aspek yaitu perangkat keras (hardware),perangkat lunak (software) dan manusia. Ketiganya harus saling bekerja samauntuk membangun suatu sistem yang lengkap dan sempurna. Sehingga untukmerancang sebuah sistem interaksi manusia dan komputer, perancang tidakhanya harus mengetahui aspek teknis dari sistem yang dirancang tetapi jugaharus mengerti bagaimana manusia mengolah informasi.II.1. ManusiaManusia merasakan dunia nyata menggunakansensor yang dikenaldengan panca indera – mata (penglihatan), telinga (pendengaran), hidung(penciuman), lidah (perasa) dan kulit (peraba). Melalui sensor itulah manusiamengolah informasi, meskipun mempunyai banyak keterbatasan dan hanyabekerja pada kondisi tertentu. Berbagai keterbatasan inilah yang harus disadarioleh desainer dalam mendesain interface.II.1.a. PenglihatanPenglihatan merupakan sensor yang paling banyak dipakai oleh manusiadibandingkan dengan sensor lainnya. Ada beberapa aspek yang mempengaruhipenglihatan manusia yaitu luminans, kontras, kecerahan, sudut dan ketajamanpenglihatan, medan penglihatan, warna, psikologi warna dan persepsi.1. LuminansLuminans (luminance) adalah banyaknya cahaya yang dipantulkan olehpermukaan objek. Satuan dari luminans adalah lilin/m2. semakin besarluminan dari sebuah objek maka rincian objek yang dapat dilihat matasemakin banyak. Diameter bola mata akan mengecil dan meningkatkankedalaman fokusnya. Bertambahnya luminan sebuah objek menyebabkanmata bertambah sensitif terhadap kedipan (flicker).2. KontrasKontras adalah hubungan antara cahaya yang dikeluarkan oleh suatu objekdengan cahaya dari latar belakang objek tersebut. Kontras didefinisikansebagai perbandingan antara selisih antara luminan objek dengan latarbelakangnya dan luminan latar belakangnya. Nilai kontras positif diperolehjika cahaya yang dipancarkan oleh objek lebih besar dibandingkan denganlatar belakangnya.3. KecerahanKecerahan adalah tanggapan subjektif pada cahaya. Luminans yang tinggiberimplikasi pada kecerahan yang tinggi juga. Kita akan melihat bataskecerahan tinggi ke rendah dengan melihat kisi-kisi Hermann.

12

Gambar 2.1. Kisi-kisi HermannPada gambar kisi-kisi Hermann diatas, pada kisi-kisi kiri anda akan melihatkesan titik putih pada perpotongan antara garis vertikal dan horisontal. padakisi-kisi kanan anda akan melihat kesan titik hitam pada perpotongan antaragaris vertikal dan horisontal. Tetapi jika mata anda tepa pada titikperpotongan tersebut, titik hitam atau putih tersebut akan lenyap.4. Sudut dan ketajaman penglihatanSudut penglihatan didefinisikan sebagai sudut yang berhadapan oleh objekpada mata. Ketajaman penglihatan (visual acuity) adalah sudut penglihatanyang minimum ketika mata masih dapat melihat sebuah objek dengan jelas.Besarnya sudut penglihatan dinyatakan denganDL

2tan120 1dimana : L = tinggi bendaD = jarak benda dari mata pengamatФ = sudut penglihatan

Mata

L bendaα

D

Gambar 2.2 Sudut Penglihatan mata normal

13

5. medan penglihatanmedan pengihatan adalah sudut terkecil yang dibentuk ketika mata bergerakkekiri terjauh dan kekanan terjauh. Dibagi menjadi 4 daerah :a. penglihatan binokuler : tempat kedua mata bisa melihat sebuah objekdalam keadaan yang sama.b. penglihatan monokuler kiri : tempat terjauh yang dapat dilihat oleh matakiri ketika mata kiri bergerak ke sudut paling kiri.c. Penglihatan monokuler kanan : tempat terjauh yang dapat dilihat olehmata kanan ketika mata kanan bergerak ke sudut paling kanan.d. Daerah buta : daerah yang sama sekali tidak dapat dilihat oleh keduamata.

6. warnamata manusia sensitif terhadap cahaya tampak. Panjang gelombang cahayatampak berkisar antara 400-700 nm dan berada pada daerah ultraungusampai inframerah. Sesorang yang mempunyai mata normal mampumembedakan sekitar 128 warna. Mata dapat membedakan warna secaraakurat ketika posisi objek membentuk sudut ± 600 terhadap warna.Pemakaian warna yang sesuai dengan pengguna akan mempertinggiefektifitas grafis. Penggunaan warna yang salah menyebabkan penggunasalah menangkap informasi. Warna dapat juga dipakai untuk memberikankesan umum tentang system. Sayangnya tidak standar yang dapat dipakaiuntuk menentukan penggunaan warna yang baik karena karakteristik tiaporang berbeda dalam persepsi mereka terhadap warna.7. psikologi warnawarna merupakan suatu sensasi yang dihubungkan dengan sistem syarafkita seperti halnya bau dan rasa. Lensa mata manusia tidak mempunyaikemampuan untuk mengoreksi warna. Hal ini menimbulkan efek

mata

900

900

150

150

00

620-700620-700

940-1040940-1040

Kedua mata

Area buta

Mata kananMata kiri

Gambar 2.3. Medan penglihatan

14

kromostereopsis, yaitu efek yang menyebabkan warna-warna murni padajarak yang sama terlihat memiliki jarak yang berbeda. Warna merahcenderung memberikan kesan paling dekat sementara warna birumemberikan kesanpaling jauh.Lensa mata menyerap energi hampir sebesar dua kali lebih banyak padadaerah warna biru dibandingkan warna merah atau kuning. Ketika manusiamenjadi semakin tua, penguningan lensa akan bertambah yangmenyebabkan tidak sensitif terhadap warna biru.8. persepsipersepsi adalah suatu proses pengalaman seeorang dalam menggunakanindera. Warna dpat meningkatkan interaksi manusia dengan komputer jikaimplementasinya mengikuti prinsip dasar penglihatan manusia. Tabel 2-1.menunjukkan beberapa kombinasi warna yang lazim dipakai.Tabel 2-1. Kombinasi warna yang baikLatar belakang Garis tipis dan teks Garis tebal dan teksPutih Biru(94%), Hitam (63%)Merah(25%) Hitam (69%) Biru(63%)Merah(31%)Hitam Putih (75%), Kuning(63%) Putih (59%), Kuning(69%)Hijau (25%)Merah Putih (56%), Kuning(75%)Hitam (44%) Putih (44%), Kuning(44%)Hitam (50%) Cyan (31%)Hijau Hitam (100%) Biru(56%)Merah(25%) Hitam (69%) Biru(31%)Merah(63%)Biru Putih (81%), Kuning(50%)Cyan (25%) Putih (25%), Kuning(38%)Magenta (31%) Cyan (31%)Cyan Hitam (56%) Biru(69%)Merah(37%) Hitam (44%) Biru(50%)Merah(56%) Magenta (25%)Magenta Hitam (63%) Biru (44%)Putih (56%) Hitam (44%) Biru(50%)Kuning(25%)Kuning Hitam (56%) Biru(63%)Merah(63%) Hitam (56%) Biru(63%)Merah(75%)Pemakaian warna harus diatur supaya mata merasa nyaman. Hindaripenggunaan tampilan yang secara simultan menampilkan warna yang tajam.Warna yang tajam akan menyebabkan pemfokusan mata. Pemfokusan yangberulang-ulang menyebabkanmata cepat lelah. Tabel 2-2 menunjukkanbeberapa kombinasi yang kurang baik.

15

Tabel 2-2 Kombinasi warna yang kurang baikLatar belakang Garis tipis dan teks Garis tebal dan teksPutih Kuning, Cyan Kuning, CyanHitam Biru, Merah, Magenta Biru, MagentaMerah Magenta, biru, Hijau, Cyan Magenta, Biru,Hijau, CyanHijau Cyan, Magenta, Kuning Cyan, Magenta, KuningBiru Hijau, Merah, Hitam Hijau, Merah, HitamCyan Hitam, Kuning, Putih Kuning, Hijau, PutihMagenta Hijau, Merah, Cyan Cyan, Hijau, MerahKuning Putih, Cyan Putih, Cyan, HijauAda beberapa hal yang perlu diperhatikan dalam pemberian warna yaitu :a. hindari penempatan warna merah dan hijau secara sembarangan.b. Hindari penggunaan biru murni untuk teks, garis tipis dan bentuk yangkecil karena mata tidak diset untuk rangsangan yang terinci.c. Hindari penggunaan warna yang berlebihand. Kelompokkan elemen-elemen yang saling berkaitan dengan latarbelakang yang samae. Urutkan warna sesuai dengan posisi spektralnyaII.1.b. PendengaranPendengaran manusia dapat merespon frekuensi dengan rentang 20-20.000 Hz. Suara manusia sensitif pada rentang 1000-4000 Hz. Selain frekuensi,pendengaran manusia dipengaruhi juga oleh kebisingan (loudness). Kebisingandinyatakan dengan desibel (dB). Percakapan mempunyai tingkat kebisingan 50-70 dB. Kerusakan telinga dapat terjadi jika mendengar kebisingan lebih dari 140dB adn kurang sensitif dengan tingkat kebisingan kurang dari 20 dB.II.1.c. SentuhanSentuhan (peraba) jarang dipakai pada desain interaksi manusia dengansystem. Sensitifitas sentuhan lebih dikaitkan dengan aspek ergonomis dalamsebuah sistem. Sebagai contoh, manusia lebih menyukai penggunaan keyboardyang lunak dan pas dengan bentuk tangan.II.1.d. Pemodelan Pengolahan InformasiUntuk bisa memahami cara kerja interaksi manusia dengan komputer,kita perlu membuat model sistem pengolahan informasi pada manusia dankomputer. Pada dasaranya, baik manusia maupun komputer memiliki piranti

16

input, sistem pengolah dan output. Informasi yang diterima dan tanggapannyadikirimkan melalui beberapa media input dan output, yaitu: Visual channel Auditory channel Haptic channel MovementSistem pengolahan manusia terdiri adri dua bagian yaitu pengolahan sadar(conscious processing) dan otomatis. Pengolahan sadar terjadi ketikarangsangan datang kemudian dibawa ke bagian intellektual dan memerlukanbeberapa waktu untuk menghasilkan tanggapan. Pengolahan otomatisterjadi secara reflek dan memerlukan waktu tanggapan yang pendek.

Perseptual Perseptual

Intelektual intelektual

MEMORl

Kontrol motorik Kontrol motorik

ResponderSensor

Keluaran Masukan

Prosesor

Kendalimasukan

Memori

Kendali keluaran

Antar muka

Pengolahansadar

Pengolahanotomatis

MANUSIA

KOMPUTER

Gambar 2.4. Model sistem pengolahan pada manusia

17

Model persepsi, kognisi dan memori manusia dapat dilihat pada gambar2.5.

Pengolahan perseptual dapat dipandang sebagai kumpulan registerpenyangga temporer. Informasi yang diterima manusia akan disimpan padabagian ini sebelum dilewatkan ke pengolahan persepsi sebelum ditanggapi.Register sensori manusia mempunyai persistensi (kemenetapan) sebesar 0,2detik sementara pendengaran sekitar 2 detik. Efek dari persistensi banyakdimanfaatkan dalam TV untuk membuat sederetan citra diskrit muncul sebagaicitra bergerak kontinu.Register sensori dapat dibedakan menjadi beberapa macam yaitu : yaitu:- iconic memory untuk stimuli visual- echoic memory untuk stimuli aural- haptic memory untuk sentuhanMemory-memory tersebut selalu di overwrite tiap kali ada informasi baruyang diterima. Informasi yang diterima oleh sensory memory akan dikirim dandisimpan ke memory yang permanen (Long Term Memory / LTM) atau dioverwrite dan hilang.Kanal antara register sensori dan memori jangka pendek mempunyaikapasitas rendah yang menyatakan keterbatasan sesorang dalammemperhatikan semua masukan secara serentak.Memori jangka pendek (Short-term memory) dan jangka penjang (Long-

term memory ) memiliki aktivitas kognitif yang berbeda.a. Short-term memory (STM) / working memoryMiller (1956) membuktikan bahwa STM manusia memiliki kapasitas untukmenyimpan 7+/-2 ‘chunks’ informasi. Sebagai contoh, cobalah untukmengingat urutan nomor berikut:0811738463Berapa banyak nomor yang bisa anda ingat? Jika anda bisa mengingat limasampai sembilan digit, maka kapasitas STM anda termasuk normal.Sekarang cobalah untuk mengingat urutan nomor berikut:0811 738 463

Registermemori Memorijangka pendek MemorijangkapanjangLingkunganluarKanal kapasitas rendah

Gambar 2.5. Model persepsi, kognisi dan memori manusia

18

Apakah anda bisa mengingatnya dengan lebih mudah? Disini, nomor-nomortersebut di kelompokkan (chunked). Artinya, mengelompokkan informasibisa meningkatkan kapasitas STM.b. Long-term memory (LTM)LTM berfungsi sebagai tempat menyimpan informasi secara permanen,misalnya pengalaman kita, aturan dan kebiasaan kita, dan segala sesuatuyang kita ketahui. Sampai sekarang belum diketahui berapa kapasitasmaksimum LTM manusia. LTM bisa dibagi menjadi dua jenis, yaitu episodicmemory dan semantic memory. Episodic memory dipakai untuk meyimpankejadian dan pengalaman yang kita dapatkan secara serial. Semanticmemory dipakai untuk menyimpan fakta, konsep dan skill yang telah kitadapatkan secara terstruktur. Informasi pada semantic memory didapatkandari episodic memory sehingga manusia bisa mempelajari fakta-fakta ataukonsep-konsep baru dari kejadian yang dialaminya.Informasi yang diterima manusia di proses dan diaplikasikan untuk:a. Pengambilan kesimpulan / Reasoning

Reasoning adalah proses dimana manusia menggunakan pengetahuannyauntuk menarik kesimpulan atau mendapatkan pengetahuan baru tentangsesuatu. Reasoning terdiri dari tiga jenis: deductive, inductive dan abductive.Deductive reasoning dipakai untuk mendapatkan kesimpulan logika daripremise (fakta) yang diketahui.misalnya:jika hari ini hujan, saya tidak pergi kuliahhari ini hujan .jadi hari ini saya tida pergi kuliahDeductive reasoning tidak memperdulikan kebenaran dari premise, jadimisalnya:Jika hari ini hujan maka tanahnya keringHari ini hujan .Jadi tanahnya keringContoh tersebut diatas tetap disebut deductive reasoning, meskipun kitatahu bahwa itu tidak masuk akal.Inductive reasoning meng-generalisasi-kan kasus-kasus yang kita lihat untukmendapatkan informasi yang belum kita ketahui. Misalkan, jika semua gajahyang kita lihat memiliki belalai, kita infer (ambil kesimpulan) bahwa semuagajah memiliki belalai. Tentu saja inference ini tidak bisa dipercaya dantidak bisa dibuktikan kebenarannya. Meskipun demikian, induction sangatberguna bagi kita dalam mempelajari lingkungan kita. Kita tidak mungkin

19

bisa melihat semua gajah yang ada atau yang akan ada dalam dunia ini,tetapi kita memiliki pengetahuan bahwa semua gajah memiliki belalai.Tipe ketiga dari reasoning adalah abduction. Abduction dipakai untukmendapatkan sebab dari suatu kejadian. Misalnya, kita tahu bahwa Joniselalu ngebut jika dia mabuk. Jika suatu ketika kita lihat Joni sedang ngebut,maka kita ambil kesimpulan bahwa Joni sedang mabuk. Tentu saja hal initidak bisa dipercaya karena mungkin saja ada sebab lain, misalnya diasedang terburu-buru karena terlambat ujian.b. Memecahkan masalah / Problem-solvingJika reasoning adalah bagaimana cara mendapatkan informasi baru dariinformasi yang sudah diketahui, problem-solving adalah proses untukmencari solusi dari suatu task yang belum pernah dikenal sebelumnya,dengan menggunakan pengetahuan yang kita miliki. Terdapat beberapateori tentang bagaimana manusia memecahkan permasalahannya (Dix, pp.38-41):

- Gestalt theory- Problem space theory- Analogy in problem solving

c. Akuisisi keahlian / Skill acquisitionMasalah-masalah yang kita pecahkan biasanya tidak seluruhnya merupakanmasalah baru. Sebaliknya, secara tidak sadar, kemampuan (skill) kita padasuatu domain bertambah. Bagaimana cara kita meningkatkan skill yang kitamiliki? Salah satu model dari skill acquisition adalah dari Anderson, yangdikenal dengan nama ACT model (Dix, pp. 42-43). Pada ACT, skill dibagimenjadi tiga level dasar:1. The learner uses general-purpose rules which interpret facts about aproblem. This is slow and demanding on memory access2. The learner develops rules specific to the task.3. The rules are tuned to speed up performance.II.2. KomputerKomputer memiliki bagian input yang berfungsi untuk memasukkan datake dalam memori komputer. Bagian input dapat di klasifikasikan menjadi:a. text entry: keyboard, speech, hand-writingb. pointing: mouse, trackballc. scanner

20

Selain bagian input komputer juga memiliki bagian output yang berfungsiuntuk menghasilkan keluaran supaya dapat di mengerti pengguna. Bagian outputdapat diklasifikasikan menjadi :a. screenb. audioc. printerDalam komputer, informasi yang berupa data disimpan dalam bagianyang disebut memori. Memori dapat di klasifikasikan berdasarkan sifatpenyimpanannya menjadi :a. memori jangka pendek : RAMb. memori jangka panjang : magnetic and optical disksPemrosesan data dalam komputer dilakukan oleh Central Processing Unit(CPU). Didalam prosesor terdapat Control unit dan Arithmatic Logic Unit (ALU).Control unit berfungsi untuk mengendalikan semua perangkat yang terpasangpada komputer. ALUberfungsi untuk mengolah data aritmatic serta data yanglainnya.

II.3. InteraksiModel-model interaksi dipakai sebagai alat bantu untuk mengerti prosesinteraction antara user dan sistem. Mereka dipakai untuk menjembatanikeinginan user dan hasil sesungguhnya dari sistem. Dalam Ergonomics dibahaskarakteristik fisik dari interaksi dan efeknya terhadap efektivitas. Dialog antarauser dan sistem dipengaruhi oleh style dari interface. Imteraksi berpartisipasidalam konteks sosial dan organisasi yang mempengaruhi user dan sistem.Referensi Dix, Introduction Preece, bab 1,2 (Part I: Introduction) Brad A.Myers, A Brief History of Human Computer Interaction Technology,1996, CMU-CS-96-163www.cc.gatech.educlasses/AY2002/cs4470_fall/CMU-CS-96-163 Santosa I, Interkasi manusia dan komputer , teori dan praktek, 2004, AndiOffset, Yogyakarta.

21

BAB IIIPiranti Interaksi

Dalam konteks Interaksi Manusia dan Komputer, device (peralatan)memungkinkan komunikasi antara manusia dan komputer melalui beberapajenis channel komunikasi. Device bisa diklasifikasikan menjadi dua, yaitu:a. device input (bagi komputer): keyboard, mouse, joystickb. device output (dari komputer): layar monitor, printer, speakerPemilihan device yang dipakai tergantung dari dua faktor:a. Jenis user yang memakaib. Jenis task yang hendak dikerjakanDalam interaksi manusia dan manusia, telah dipakai semua channel komunikasi(terutama channel visual dan channel audio), tetapi dalam interaksi manusia dankomputer, channel visual adalah channel utama yang dipakai komputer untukmenyajikan informasi. Channel lainnya boleh dikatakan masih ‘under-utilized’alias masih jauh dari kemampuan maksimal dari channel tersebut. Beberapaperalatan yang dipakai sebagai masukan adalah :a. Keyboardb. Mousec. Joystickd. Track-balle. Light-penf. Touch-screena. KeyboardPiranti masukan tekstual merupakan piranti standar yang dijumpai padasemua komputer. Piranti ini sering disebut dengan keyboard. Ada beberapamodel keyboard yaitu :1. Keyboard QWERTY, dibuat berdasarkan layout mesin tik. Tata letak iniditemukan oleh Scholes, Glidden dan Soule pada tahun 1878, dankemudian menjadi standar mesin tik komersial pada tahun 1905.Keyboard QWERTY didesain sedemikian rupa sehingga key yang palingsering ditekan terpisah letaknya sejauh mungkin, sehingga bisameminimalkan kemacetan pada saat mengetik (pada mesin ketikmekanik). Meskipun tata letak QWERTY sangat luas pemakaiannya,tetapi memiliki beberapa kelemahan dan ketidakefisienan. Misalnya, 48persen dari gerakan diantara huruf yang berurutan harus dilakukandengan sebuah tangan. Hanya 32 persen ketukan yang dilakukan pada

home row (baris awal dari posisi jari pada keyboard). Beban tangan kiri

22

lebih besar dari tangan kanan (56 persen). Contoh paling nyata dariketidakefisienan tata letak QWERTY adalah pengetikan huruf ‘a’ yangcukup sering dipakai, tetapi harus dilakukan oleh jari kelingking yangpaling lemah.2. keyboard DVORAK (1932), dimana susunan hurufnya disusun sedemikianrupa sehingga tangan kanan dibebani lebih banyak pekerjaan dibandingdengan tangan kiri. Selain itu, tata letak Dvorak dirancang agar 70 persendari ketukan jatuh pada home row, sehingga bisa mengurangi kelelahankarena pengetikan (lebih ergonomik). Sejumlah percobaan menunjukkanbahwa tata letak Dvorak lebih efisien 10-15 persen dibanding dengan tataletak QWERTY.

Gambar 3.1. Tata letak Keyboard Dvorak3. keyboard ‘chord’, dibutuhkan training untuk bisa memakai keyboard ini,tapi bisa mencapai 300 wpm. Dengan keyboard ‘chord’ ini, seseorangdapat menekan suatu tombol atau kombinasi tombol untuk menghasilkansuatu kata atau suku kata. Hal ini sangat cocok untuk mereka yang harusmencatat ucapan seseorang, misalnya pada proses pengadilan. Salah satujenis tata letak keyboard ‘chord’ ini adalah tata letak ‘Palantype’.

Gambar 3.2. Tata letak Keyboard ‘Chord’ dengan tata letak PalantypePada gambar 3.2 dapat dilihat bahwa tata letak Palantype memiliki tigakelompok karakter. Kelompok pada bagian kiri menunjukkan konsonanawal sebuah kata, bagian tengah menunjukkan kelompok vokal, dan

23

bagian kanan menunjukkan kelompok konsonan terakhir dari sebuah kataatau suku kata. Untuk huruf yang tidak tersedia pada keyboard, bisadigunakan gabungan dari beberapa tombol, misalnya kombinasi tombol Tdan + akan menghasilkan bunyi D.Kelemahan utama dari tata letak Palantype ini adalah bahwa tidak semuakata bisa dieja dengan benar. Misalnya, kata bite, byte dan bight yangmemiliki bunyi sama akan dikodekan dengan chord yang sama sehinggatidak bisa dibedakan dan dibutuhkan teknik khusus untuk memecahkanmasalah tersebut. Contoh lain dari keyboard untuk penyingkatan kataadalah keyboard Stenotype yang sering digunakan oleh pada wartawanuntuk mencatat hasil wawancara dengan seseorang.Keyboard adalah device terbaik untuk input text, tetapi beberapaexperiment membuktikan bahwa untuk task seleksi (misalnya menu), keyboardlebih lambat dan tidak akurat dibandingkan device lainnya.b. MouseMouse merupakan salah satu piranti interaktif yang paling banyakdipakai. Mouse digunakan untuk menempatkan kursor pada posisi tertentu dilayar, mengaktifkan menu dan untuk menggambar. Pergerakan mouse di layarditentukan dengan pergerakan mouse di mouse-pad. Mouse tersedia dalambentuk mekanis dan optis.Mouse lebih bersifat intuitif karena membuat aktivitas semakinterintegrasi dengan sistem komputer. Mouse juga lebih cepat dan akuratdaripada keyboard dan joystick dalam task seleksi. Tetapi dibangdingkan dengantouch-screen dan light-pen, mouse lebih lambat dan tidak akurat dibandingkanpada kegiatan yang sama.c. JoystickJoystick merupakan piranti penunjuk tidak langsung. Gerakan kursordikendalikan oleh gerakan tuas. Atau tekanan tuas. Dalam pengoperasiannyajorstick tidak memerlukan tempat yang luas. Keuntungan joystick adalahapapun yang muncul di layar tidak akan merusak ketika kita menggerakkanjoystick, selain itu harganya juga murah. Kelemahan joystick adalah kurangakurat dibandingakn dengan mouse. Joystick banyak dipakai pada aplikasi game.d. Track-ballPrinsip kerja track-ball mirip dengan mouse. Perbedannya utamanyaterletak pada konfigurasinya. Pada mouse, operator harus menggerakkanseluruh badan mouse tetapi pada track-ball, badan track-ball tetap diam. Track-ball terdiri dari suatu bola yang ditempatkan pada suatu tempat. Bola itu bisadiputar kearah manapun. Track-ball bisa dikatakan memiliki sifat-sifat joystick

24

dan mouse. Track-ball mudah dipelajari dan hemat tempat.Track-ball memiliki keakuratan dan kecepatan yang baik untuk pointingdevice. Arah dan keceatan kursor di layar ditentukan oleh arah dan gerakanrotasi bola track-ball.e. Light-penLight-pen dipakai sebagai piranti untuk menggambar. Prinsip kerja Light-pen adalah dengan memantau selisih waktu saat elektron mulai melakukanpenyegaran dengan waktu saat lokasi tempat pena berada dinyalakan. Kordinatlayar yang ditunjukkan oleh light-pen dilewatkan ke komputer melalui adaptergrafik. Light-pen memungkinkan koordinasi mata dan tangan secara langsungsehingga memiliki keakuratan yang tinggi.Light-pen memiliki beberapa kelemahan antara lain : membutuhkansedikit tambahan tempat untuk bekerja, bisa melelahkan lengan jika dipakaiterlalu lama, bisa mengotori/merusak layar monitor, memungkinkan reaksi yangtidak diinginkanf. Touch-screenTouch-screen memungkinkan koordinasi mata dan tangan secaralangsung sehingga user bisa langsung menunjuk ke obyek yang diinginkan.Touch-screen hampir tidak membutuhkan training dan sering menjadi devicetercepat untuk kebanyakan task yang ada. Touch-screen tidak membutuhkan alatlain selain layar monitor.Touch-screen memiliki beberpa kekurangan antara lain : tekanan jariberlebihan bisa merusak layar monitor, layar monitor cepat kotor karenasentuhan jari tangan dan lengan cepat lelah jika posisi layar kurang sesuai.Pemilihan piranti bantu disesuaikan dengan kebutuhan dan fungsi yangdiinginkan. Tabel 3-1. menunjukkan beberapa alternatif piranti bantuberdasarkan kebutuhannya.Tabel 3-3. Pemilihan device untuk berbagai jenis taskJenis task Device terbaikNumeric data entryText entry Numeric keypadAlphanumeric keyboard (QWERTY)Object selection (eg. icon selection) Mouse, Joystick, Trackball, LightPenObject manipulation (eg. drag anddrop) Mouse, Joystick, Trackball, LightPenTracking (eg. drawing) Mouse, LightPenAspek penting dari device input (terutama pointing device), adalah hubunganantara pergerakan secara fisik dari device dan hasilnya pada interface komputer.a. Direct vs Indirect: apakah pergerakan fisik dari device secara langsung

25

berkorespondensi dengan reaksi yang terlihat pada layar?b. Absolute vs Relative: apakah lokasi device secara langsung mengontrollokasi dari aksi yang terlihat pada layar?Tabel 3-4. A taxonomy of User-centered Pointing DevicesAbsolute RelativeDirect Touch screenLight pen MouseIndirect ?? Track ballJoystickCursor keysReferensi Dix, Introduction Preece, bab 1,2 (Part I: Introduction) Brad A.Myers, A Brief History of Human Computer Interaction Technology,1996, CMU-CS-96-163www.cc.gatech.educlasses/AY2002/cs4470_fall/CMU-CS-96-163 Santosa I, Interkasi manusia dan komputer , teori dan praktek, 2004, AndiOffset, Yogyakarta.

26

BAB IVDesain Antarmuka

Tujuan akhir dari suatu desain interaktif adalah mengembangkan sisteminteraktif yang mendatangkan kemudahan, kenyamanan dan keasyikan dalammenggunakan sistem tersebut. Dalam pengembangan aplikasi perangkat lunakkomputer, antarmuka dari perangkat lunak adalah bagian yang amat penting.Pengguna sering menilai mutu dari sistem hanya dengan melihat interface darisistem tersebut. Pengguna selalu menginginkan aplikasi yang bisa memenuhikebutuhannya dan mudah untuk dipakai. Terlalu banyak para desainer interfaceperangkat lunak yang tidak menghiraukan standard dalam desain antarmuka.Para desainer interface perangkat lunak tersebut seringkali memiliki pengertianyang salah dengan memiliki keyakinan bahwa hal yang penting dalam desaininterface adalah membuat program yang ‘pintar’ atau dengan menggunakankombinasi warna yang amat menarik. Constantine (1995) menekankan bahwadalam kenyataan, suatu antarmuka yang baik haruslah memungkinkan user yangmemahami domain permasalahannya untuk menggunakan aplikasi tanpa harusmembaca manual atau menerima training terlebih dahulu.Semakin intuitif suatu antarmuka, maka semakin mudah interfacetersebut digunakan. Jika suatu interface mudah untuk digunakan, maka biayapenggunaan interface tersebut semakin rendah. Jika suatu interface didesaindengan baik, maka proses training user lebih mudah dilakukan, dan otomatisakan mengurangi biaya training. Selain itu, biaya pemeliharaan sistem bisadikurangi dan kepuasan dari user akan meningkat.Desain antarmuka seringkali menentukan kesuksesan dari sistemperangkat lunak itu sendiri. Meskipun functionality dari aplikasi penting, caramenyajikan functionality tersebut tidak kalah pentingnya. Suatu aplikasi yangsulit digunakan tidak akan dipakai oleh user, tidak perduli bagaimanapunhebatnya kemampuan aplikasi tersebut, jika user tidak menyukainya, merekatidak akan memakainya. Jangan meremehkan nilai dari desain antarmuka.Interface dapat menciptakan pengaruh emosional bagi pengguna.Kemampuan emosional, terutama kemampuan mengekspresikan dan mengenaliemosi merupakan inti dari komunikasi manusia. Salah satu pendekatan desainyang dapat mempengaruhi emosional penggunanya adalah denganmenggunakan icon yang ekspressive, yang mengambarkan mimik manusia.Tamplan icon di layar dapat sangat menenangkan pengguna karenamengindikasikan bahwa komputernya dapat bekerja dengan baik.

27

Antarmuka Design Tips and Techniques1. Konsistensi.2. Buatlah standarisasi yang selalu dipatuhi dalam segala hal.3. Jelaskan aturan yang dipakai.4. Beri dukungan, baik untuk pemula (novice) atau pemakai mahir (expert).5. Kemudahan navigasi dari layar ke layar lainnya.6. Kemudahan navigasi pada suatu layar.7. Gunakan kata-kata yang jelas pada message dan label.8. Gunakan komponen sesuai dengan fungsinya.9. Pelajari aplikasi lain yang sejenis.10. Gunakan warna seperlunya.11. Ikuti aturan kekontrasan warna.12. Gunakan font seperlunya.13. Gunakan fasilitas disable untuk fasilitas yang tidak relevan, jangandihilangkan.14. Gunakan tombol default yang tidak berbahaya / fatal.15. Gunakan field alignment.16. Justify data seperlunya.17. Jangan membuat layar yang penuh informasi.18. Buatlah pengelompokan informasi pada layar.19. Tampilkan window yang akan diaktifkan dilokasi yang sesuai.20. Jangan hanya menggantungkan functionality aplikasi pada menu pop-up.

Gambar 4.1. Contoh Alignment field yang jelek (atas) dan baik (bawah).PrototypingPrototyping adalah teknik analisis iteratif dimana user terlibat secaraaktif dalam proses desain layar dan laporan. Tujuan suatu prototype adalahuntuk menunjukkan kepada user berbagai kemungkinan desain dari interfacesuatu aplikasi. Proses prototyping bisa dilakukan dalam empat tahap (lihat

28

Gambar 4.2):1. Tentukan kebutuhan user.2. Kembangkan prototype.3. Evaluasi prototype.4. Jika belum sempurna, proses diatas diulang lagi sampai selesai.DetermineNeeds

BuildPrototypeEvaluatePrototypeFinished? NoYesDone

Gambar 4.2. Empat Tahap Prototyping yang iteratif.Prototyping Tips and Techniques1. Gunakan objek yang ada dalam dunia nyata.2. Bekerjalah dengan user yang akan menggunakan aplikasi.3. Tentukan jadwal dan patuhilah jadwal tersebut.4. Gunakan tool untuk prototyping.5. Biarlah user mencoba prototype (test-drive?).6. Pelajarilah konsep dasar bisnis dari aplikasi yang sedang dikembangkan.7. Gunakan level dalam membuat prototype.8. Jangan menghabiskan waktu dengan melakukan coding yang baik.Interface Flow DiagramsInterface Flow Diagrams dipakai untuk menunjukkan hubungan antar komponenantarmuka, layar dan laporan dari suatu aplikasi. Gambar 4.3 dibawah adalahcontoh Interface Flow Diagram dari suatu Order-Entry System.

29

:MainMenuselect selectcustomer icon order icon:Customer :Order click :ProductSearch Entry search SearchScreen Screen button Screenclick click clicksearch search searchbutton button button:Customer :Customer :ProductList Order ListListselect select select selectcustomer customer print product:Customer :Order :ProductEdit Printout EditScreen Screenselectprint:Customer SummaryReport

Gambar 4.3. Flow Interface Diagramuntuk Order-Entry SystemDalam contoh tersebut, simbol kotak dipakai untuk merepresentasikanobjek dari antarmuka, yaitu screen, report atau form, dan simbol anak panahdipakai untuk merepresentasikan flow yang mungkin antar screen. Misalkan,pada main menu, user bisa memilih customer search screen atau order entryscreen. Pada order entry screen, user bisa memilih product search screen ataucustomer order list. Interface flow diagram amat membantu desainer untukmendapatkan gambaran interface dalam suatu aplikasi secara high-level,sekaligus untuk melakukan validasi dari desain interface yang dilakukannya.

30

Referensi1. Ambler, S.W. 1998, User Interface Design: Tips and Techniques, Ambysoft Inc.2. Constantine, L.L. 1995, Constantine on Peopleware, Englewood Cliffs, NJ:Yourdon Press.

31

BAB VDesain Ragam Dialog

PendahuluanDialog adalah komunikasi antara dua pihak atau lebih. Dalam desain antarmuka,istilah dialog memiliki arti yang lebih spesifik, yaitu struktur komunikasi antarauser dan sistem komputer.Lima jenis dialog utamaa. Menub. Form-fillinc. Command Languaged. Natural Languagee. Direct ManipulationMenuDialog berbasis menu cocok untuk user pemula atau jarang mempergunakankomputer. Untuk expert user, sistem menu masih bisa diterima jika unjuk kerjadari sistem cukup cepat untuk menghindari delay yang tidak perlu.Contoh:a. Pull-down menub. Pop-up menuc. Scrollable menud. Numerical menu choiceKeuntungan KerugianMempersingkat waktu training Kurang baik jika terlalu banyak menuMengurangi pengetikan tombol key Bisa memperlambat user yang seringmemakai sistem (expert user)Membutuhkan sedikit memorykomputer Membutuhkan banyak tempat di layarTerstruktur Tidak cocok untuk entry dataSesuai dengan desain perangkat lunak Tidak cocok untuk dialog yang diawalioleh userTool untuk desain menu tersedia Membutuhkan display yang unjukkerjanya cepatTabel 5-1. Keuntungan dan kerugian Menu

32

Dalam mendesain menu, perlu diperhatikan jumlah item yang ada dalam tiaplevel menu. Suatu desain menu tidak boleh memiliki terlalu banyak itemmaupun terlalu banyak level, karena bisa mengurangi akurasi dan kecepatan.Kiger (1984) menyarankan dalam suatu desain menu, sebaiknya terdiri dari 4-8item dan 3-4 level.Form-fillinForm-fillin sangat berguna dalam dialog manusia dan komputer karena manusiasudah terbiasa dengan konsep mengisi suatu form. Keuntungan utama dariform-fillin dialog adalah semua informasi bisa terlihat secara keseluruhansehingga pemakai merasa tidak canggung dengan interface yang sedangdihadapi. Secara umum, form-fillin bisa dipakai oleh semua jenis pemakai,karena semua pemakai sudah terbiasa dengan konsep pengisian form dalamkehidupan sehari-harinya.Contoh Form-fillin:

Keuntungan KerugianManusia sudah terbiasa denganpengisian form Terkadang lambatMempermudah entry data Membutuhkan banyak tempat di layarTraining minimal Tidak cocok untuk command selectionMembutuhkan sedikit memorykomputer Membutuhkan kontrol cursor di layarTerstruktur Mekanisme navigasi kurang jelasSesuai dengan desain perangkat lunakTool untuk desain dialog tersediaTabel 5-2. Keuntungan dan kerugian Form-fillin

33

Form Fillin Design Guidelines (Shneiderman, pp. 133-135)a. Judul/Prompt singkat yang memiliki arti jelasb. Instruksi yang singkat dan jelas (misalnya dengan fasilitas help)c. Mengelompokkan field yang berhubungan, beserta urutannyad. Bentuk tampilan yang menarik (misalnya dengan windowing, warna, 3D,…)e. Memakai label field yang umum dipakai pada aplikasi lainnyaf. Memakai istilah dan singkatan yang konsisteng. Batasan yang jelas untuk field yang bisa di-entry-kanh. Fasilitas pergerakan cursor yang tepat (TAB / arrow-keys)i. Memiliki fasilitas koreksi jika ada kesalahan baik untuk karakter maupunfieldj. Memiliki error-message untuk entry-value yang invalidk. Field optional jelas terlihat (dengan tambahan kata: ‘optional’)l. Penjelasan tentang field (dengan micro-help pada posisi yang standard)m. Tanda selesai entryCommand LanguageCommand language selalu diinisialisasi oleh pemakai. Pemakai mengetikkancommand (perintah) tanpa prompt ataupun help dari sistem. Contoh yangpaling sering dijumpai dari command language adalah bahasa dari sistemoperasi, misalnya:a. DOS: dir, copy, delb. UNIX: ls, cp, rmc. vi (UNIX visual editor): ^F, ^B, w, qCommand language tidak memberikan petunjuk sedikitpun pada pemakainya.Sebaliknya, pemakai diharapkan untuk sudah mengetahui (atau mempelajari)command-command tersebut. Secara implisit, berarti pemilihan nama commandsangat penting karena pemakai harus mengingatnya.

C:\> Help!!!Bad command or file nameC:\> I don’t know how to communicate with this thing!Bad command or file nameC:\> This interface needs OBEDIENCE SCHOOL!!Bad command or file nameC:\> ARRGH !! I give up.Bad command or file nameC:\>Gambar 5.1. Contoh Command Language (DOS)(Shneidermann, p. 140)

34

Command language memiliki tiga jenis (style) penulisan:a. positional syntax (dipakai oleh DOS dan CP/M)contohnya: COPY file1 file2b. keyword syntax (mengidentifikasi keyword, lalu parameternya)contohnya: COPY FROM file1 TO file2COPY TO file2 FROM file1c. mixed syntax (kombinasi positional dan keyword)contohnya: cc -o outfile cfile.cKeuntungan KerugianFleksibel Membutuhkan training cukup lamaDiinisialisasi (diawali) oleh pemakai Harus dipakai terus menerus supayabisaCepat, Tepat, Efisien, Singkat Membutuhkan banyak memoryMenarik untuk user yang expert Error handling sangat jelekBisa dipakai untuk menciptakan‘macro’

Tabel 5-4. Keuntungan dan kerugian Command-lineCommand Language sangat baik untuk expert user atau pemakai yang seringmemakai komputer, tapi kurang tepat untuk pemula.Command Language Guidelines (Shneidermann, p. 176) Buat suatu model dari objek dan aksi yang spesifik Pilih nama yang memiliki arti, spesifik dan unik Implementasikan suatu struktur hirarki jika mungkin Sediakan struktur yang konsisten (hirarki, urutan argumen, aksi-objek) Dukung aturan singkatan yang konsisten (lebih baik disingkat menjadi satuhuruf) Menawarkan pilihan pada user yang sering pakai untuk membuat macro Gunakan menu command pada display yang cepat jika perlu Batasi jumlah command dan cara-cara untuk melakukan suatu taskNatural LanguageNatural Language adalah dialog manusia dengan komputer yang memiliki sifatyang sama dengan dialog manusia dengan manusia. Natural Language jauh lebih

35

kompleks daripada jenis dialog lainnya. Secara umum, natural language belumbisa dipakai sebagai dasar desain dialog pada program aplikasi umum, karenakompleks dan tidak efisien.Keuntungan KerugianTidak ada syntax khusus Tidak jelasFleksibel dan canggih Tidak spesifikAlami (Natural) Terlalu banyak kata yang tidak perluBisa diinisialisasi baik oleh manusiaatau komputer Membutuhkan desain perangkat lunakyang kompleksTidak efisienTabel 5-5. Keuntungan dan kerugian Natural languageDirect ManipulationPertama kali dicetuskan oleh Ben Shneidermann pada tahun 1980-an.Karakteristik utama dari dialog jenis ini adalah kemampuannya untukmerepresentasikan task yang diberikan oleh pemakai secara langsung ke deviceoutput yang disediakan. Pemakai komputer biasanya sudah terbiasa denganinterface WIMP (Window, Icon, Menu, Pointer) yang dipopulerkan oleh AppleMacintosh, tetapi interface jenis ini sebenarnya cuma salah satu contoh daridialog direct manipulation.Contoh:a. Screen editorsb. Graphicsc. Simulator dan video gamesKeuntungan KerugianAnalogi (kemiripan) Membutuhkan perangkat lunakkomplekMengurangi waktubelajar/penyesuaian Membutuhkan display grafik yangcepatMenarik secara visual Membutuhkan tambahan input device(mouse)Canggih Membutuhkan ketrampilan mendesaingrafikSingkat Lebih sulit untuk di programTool untuk desain sudah tersedia Khusus Icon: semantic mappingTabel 5-6. Keuntungan dan kerugian Direct Manipulation

36

Delapan aturan utama untuk mendesain dialoga. Strive for consistency. Prinsip ini paling sering dilanggar, tapi juga prinsipyang paling mudah untuk diperbaiki jika terjadi pelanggaran. Contoh-contoh konsistensi:- Urutan action yang konsisten pada situasi yang mirip.- Istilah yang konsisten untuk prompt, menu, layar bantu dan perintah.- Perkecualian (pengetikan password atau konfirmasi delete) harusdibatasi.b. Enable frequent users to use shortcuts. Misalnya:- Penggunaan singkatan.- Penekanan tombol khusus.- Perintah-perintah tersembunyi.- Fasilitas macro.- Response time dan display rate yang lebih cepat.c. Offer informative feedback. Tiap operator action harus ada feedback darisistem, misalnya:Untuk frequent (sering) dan minor action: response secukupnya.Untuk infrequent (jarang) dan major action: response harus lebih jelasdan lengkap.d. Design dialog to yield closure. Urutan action sebaiknya diatur dalamkelompok yang memiliki awal, pertengahan dan akhir. Feedback yanginformative pada akhir suatu kumpulan action akan melegakan danmemuaskan user.e. Offer simple error handling. Sebisa mungkin, desainlah sistem sedemikianrupa sehingga user tidak mungkin bisa membuat error yang serius.- Jika terjadi error, sistem harus bisa mendeteksi error dan caramengatasinya.- User hanya perlu mengetikkan bagian perintah yang error saja (tidaksemuanya).- Perintah yang mengakibatkan error tidak boleh mengubah state darisistem, atauSistem harus memberikan instruksi untuk mengembalikan state kekeadaansemula sebelum terjadi error.f. Permit easy reversal of action. Sebisa mungkin, semua action harus bisadibatalkan (UNDO). Fasilitas ini bisa memuaskan rasa ingin tahu dariuser, dimana user bisa mencoba action yang belum mereka kenal denganaman, karena bisa di batalkan jika terjadi sesuatu yang tidak diinginkan.Fasilitas UNDO yang diharapkan adalah fasilitas UNDO untuk:- Single action- Data Entry- Sekumpulan action lengkapg. Support internal locus of control. User yang sering menggunakan sistem

37

mengharapkan bahwa mereka bisa mengontrol sistem dan response-nya.Jika terjadi response yang tidak dikehendaki, data entry yang bertele-tele,kesulitan dalam mendapatkan informasi, ketidak-mampuan dalammelakukan suatu action, semuanya bisa mengakibatkan kekecewaan user.Gaines (1981) menyarankan bahwa user haruslah berfungsi sebagai‘initiators of action’, bukan sebagai ‘responders’. Teori Gaines ini dikenalsebagai aturan ‘avoid acausality’.h. Reduce short-term memory load. Manusia memiliki kemampuan short-term memory yang terbatas, sehingga tampilan informasi pada layarkomputer haruslah:- Sederhana- Multiple page harus dikonsolidasi- Pergerakan window harus dikurangi- Waktu training harus dialokasikan untuk pengkodean, mnemonic danurutanaction.User in control Mixed initiative system System incontrol

Natural Command Direct Menu FormLanguage Language Manipulation FillinReferensia. Dix, A. et al. 1993, Human-Computer Interaction, Prentice Hall, New York,pp. 251-297b. Downton, A. (ed.) 1992, Engineering the Human-Computer Interface,McGraw-Hill, London, pp. 65-118c. Preece, J. et al. 1994, Human-Computer Interaction, Addison Wesley,Wokingham, pp. 261-283d. Schneiderman, B. 1992, Designing the User Interface, Strategies for

Effective Human-Computer Interaction, 2nd Ed., Addison-Wesley, Reading-MA.

38

BAB VIPerancangan Tampilan

VI.1 Jenis AplikasiProgram aplikasi, pada dasarnya terdiri dari 2 kategori yaitu :a. Program aplikasi untuk keperluan khusus dengan user yang khusus juga(special purpose software)Contohnya : inventori gudang, pengelolaan data mahasiswa, pelayananreservasi hotelAda 2 pendekatan yang dilakukan untuk merancang tampilan pada specialpurpose software :

- User-Centered DesignPerancangan antarmuka yang melibatkan user. User diajak untukaktif berpendapat dan bersama-sama merancang antarmuka yangdiinginkan user.- User Design ApproachUser sendiri yang merancang antarmuka sesuai keinginan. Tetapihal ini memberatkan bagi pemrograman (mis. Peranti yang tidakmendukung, dll).b. Program aplikasi yang akan digunakan oleh banyak user (general purposesoftware)Program Aplikasi untuk GPS disebut juga sebagai Public Software, dimanaaplikasi dapat digunakan oleh berbagai user dengan karakteristik yangberagam serta berbagai tingkat kepandaianContohnya : OS Windows 7Kunci utama perancangan tampilan untuk general purpose softwareadalah dengan melakukan :- antarmuka customization- pengaturan desktop- pemilihan warna desktop oleh user

VI.2 Perancangan AntarmukaBerikut adalah 4 komponen antarmuka :a. Model UserMerupakan model konseptual yang diinginkan user dalam memanipulasiinformasi dan proses.b. Bahasa Perintah–Command LanguageMerupakan bahasa perintah dimana user dengan cepat dapatmengoperasikannnya

39

c. Umpan BalikKemampuan sebuah program yang membantu user untukmengoperasikan program itu sendiri.d. Penampilan InformasiDigunakan untuk menunjukkan status informasi atau program ketika usermelakukan tindakanLangkah-langkah perancangan antarmuka adalah :1. Urutan perancangan2. Perancangan tampilan berbasis teks3. Perancangan tampilan berbasis grafis4. Waktu tanggap5. Penanganan kesalahanDikerjakan secara top-down, proses perancangan dapat dikerjakan sebagaiberikut :1. Pemilihan ragam dialogPemilihan ragam dialog dipengaruhi oleh karakteristik populasi pengguna(pengguna mula, menengah atau pengguna ahli), tipe dialog yangdiperlukan, dan kendala teknologi yang ada untuk mengimplementasikanragam dialog tersebutMelakukan analisis tugas dan menentukan model pengguna dari tugastersebut untuk membentuk struktur dialog yang sesuai. Pada tahap inipengguna sebaiknya banyak dilibatkan sehingga pengguna langsungmendapatkan umpanbalik yang berupa diskusi informal maupunprototipe dari dialog yang nantinya akan digunakannya2. Perancangan struktur dialog3. Perancangan format pesan4. Perancangan penangan kesalahan (dengan validasi, proteksi user,pemulihan dari kesalahan dan penampilan pesan kesalahan)Dalam pengoperasian sebuah program aplikasi, tidak dapat dihindarkanadanya kesalahan yang dilakukan oleh pengguna. Untuk menghindariadanya kondisi abnormal termination, yaitu eksekusi program berhentikarena terjadi kesalahan. Bentuk-bentuk penanganan kesalahan yangdapat dilakukan antara lain adalah :a. Validasi pemasukan data (mis: hrs input >0 tetapi yang diinput <0)b. Proteksi pengguna (mis: program memberi peringatan ketikapengguna melakukan suatu tindakan secara tidak sengaja)c. Pemulihan dari kesalahan (tersedianya mekanisme untukmembatalkan tindakan yang baru saja dilakukan)d. Penampilan pesan salah yang tepat dan sesuai dengan kesalahan yangterjadi

40

5. Perancangan struktur dataHarus menentukan struktur data yang dapat digunakan untuk menyajikandan mendukung fungsionalitas komponen-komponen antarmuka yangdiperlukan. Struktur ini harus dipetakan langsung ke dalam modelpengguna yang telah dibuat, meskipun tingkat kompleksitas antara satuaplikasi dengan aplikasi lain dapat saja berbeda.Pada perancangan tampilan untuk antarmuka berbasis teks, ada 6 faktor yangharus dipertimbangkan agar diperoleh tata letak yang berkualitas tinggi, antaralain :1. Urutan penyajianHarus disesuaikan dengan model pengguna, apabila tidak dapat dicapai,maka perancang harus membuat semacam kesepakatan dengan calonpengguna tentang urutan tampilan yang akan digunakan2. Kelonggaran – SpaciousnessPenyusunan tata letak yang tidak mengindahkan estetika akanmempersulit pengguna dalam melakukan pencarian suatu teks. Teks-tekstertentu harus ditempatkan dalam posisi tertentu dengan harapan iadapat langsung memusatkan perhatian pengguna.3. PengelompokanData yang saling berkaitan sebaiknya dikelompokkan untukmempermudah penstrukturan layar tampilan secara keseluruhan4. RelevansiTampilkan hanya pesan-pesan yang relevan dengan topik yang sedangditampilkan pada layar5. KonsistensiDalam sistem berbasis frame, pengguna dihadapkan pada sejumlahtampilan yang penuh dengan informasi. Perancang harus konsisten dalammenggunakan ruang tampilan6. KesederhanaanCara paling mudah untuk menyajikan aras informasi yang dapat dipahamidengan cepat oleh pengguna.Ada 5 faktor yang harus diperhatikan pada saat merancang antarmuka berbasisGrafis :1. Ilusi pada obyek-obyek yang dapat dimanipulasi. Harus melibatkan 3komponen :a. Gunakan kumpulan obyek yang sesuai dengan aplikasi, jika belum adadikembangkan sendirib. Penampilan obyek-obyek harus dilakukan dengan keyakinan agarmudah dimengerti oleh pengguna

41

c. Gunakan mekanisme yang konsisten untuk memanipulasi obyek yangakan muncul dilayar2. Urutan visual dan fokus penggunaa. Antarmuka grafis dapat digunakan untuk menarik perhatian penggunadengan membat suatu obyek berkedip/menggunakan warnatertentu/animasib. Gunakanlah rangsangan visual tertentu untuk maksud tertentu3. Struktur internala. Merupakan suatu tanda khusus yang digunakan untuk menunjukkanadanya perbedaanb. Khusus pada obyek-obyek yang dapat dimanipulasi perancang harusmemberikan struktur internal dalam bentuk yang berbeda denganyang digunakan pada dokumen tekstual4. Kosakata grafis yang konsisten dan sesuaia. Penggunaan simbol-simbol obyek/icon, tidak ada standar danbiasanya disesuaikan dengan kreatifitas perancang.b. Kesesuaian dengan mediac. Karakteristik khusus dari layar tampilan yang digunakan akanmempunyai pengaruh yang besat terhadap keindahan antarmukayang akan ditampilkan.5. Keinginan user agar program aplikasinya memberikan waktu tanggapyang sependek-pendeknyaa. Waktu tanggap > 14 detik merupakan waktu tanggap yang lamab. Waktu tanggap < 2 detik merupakan waktu tanggap yang cukupmemadai6. Penanganan KesalahanAda 2 macam kesalahan, antara lain :a. Kesalahan sintaksis, yaitu kesalahan pada saat program dikompilasi(compile-time error). Sebelum kesalahan itu dibetulkan, programtidak akan dapat dioperasikan.b. Kesalahan logika, yaitu kesalahan pada saat program sedangdijalankan (run-time error). Kesalahan ini akan mengakibatkanterhentinya eksekusi program secara abnormal. Penyebabnya adalahdari user atau pada saat proses program aplikasi di eksekusi

42

Berikut adalah contoh tata letak tekstual :

Gambar 6.1 Contoh tata letak tekstualVI.3 Piranti Bantu SederhanaSelama proses merancang tampilan, Perancang seharusnya membuatdokumentasi akan bentuk-bentuk tampilan yang akan diimplementasikan.Perancang dapat menggunakan piranti bantu sederhana yang dapatdigunakan untuk mendokumentasikan wajah antarmuka yang diinginkan.Piranti bantu yang akan dijelaskan hanya berbentuk lembaran kertasLembaran kertas yang dimaksud diberi nama dengan Lembar KerjaTampilan/screen design work sheet (LKT).LKT (lembar kerja tampilan) terdiri dari :a. Nomor lembar kerjab. Tampilan (berisi sketsa tampilan yang akan muncul di layar)c. Navigator (menjelaskan kapan tampilan akan muncul)d. Keterangan (penjelasan singkat tentang attribut tampilan)

43

Gambar 6.2 Lembar Kerja Tampilan

Gambar 6.2 Pembuatan Lembar Kerja TampilanVI. 4 Jaring Semantik TampilanJaring semantik tampilan adalah bagan yang menggambarkanketerhubungan antara satu LKT dengan LKT yang lain menurut padaperancangan navigasinya.Ada 2 komponen jaringan sematik tampilan, yaitu :1. Nomor tampilan (lembar kerja)2. Transisi yang menyebabkan perpindahan ke tampilan yang lainBerikut pada gambar 6.3 adalah contoh jaring semantik tampilan :

44

Gambar 6.3 Contoh Jaring Semantik Tampilan

45

BAB VIIPemrograman Antarmuka

Jenis-jenis pemrogramana. Pemrograman Konvensional (Conventional / Traditional Programming)b. Pemrograman yang berOrientasi pada Object (Object-OrientedProgramming)c. Pemrograman Visual (Visual Programming)d. Pemrograman yang berbasis Event (Event-Driven Programming)e. Pemrograman Client-Server (Client/Server Programming)Rapid Aplication Developmenta. Kebutuhan perangkat lunak berkualitas semakin meningkatb. Waktu pembuatan perangkat lunak semakin singkatc. Graphical Antarmuka (GUI)d. Menerapkan konsep-konsep RAD seperti OO, Visual Programming, Event-Driven Programming dan Client/Server ProgrammingInterface berbasis grafika. Membutuhkan hardware yang relative lebih mahal dari interface berbasisteksb. GUI (Graphical User Interface) ----- WIMP (Window, Icon, Menu andPointer)c. Direct Manipulation ----- WYSIWYG (what you see is what you get)d. Better Interface DesignOrientasi pada Objeka. Objek : entity dalam sistemb. Class : sekumpulan objek yang sejenisc. Message : metode yang dipakai objek untuk berkomunikasid. Abstraction : information-hiding, untuk keamanan datae. Inheritance : mewarisi sifat-sifat parent classf. Polimorphism : method objek memiliki nama sama, berbeda fungsig. Reuse : mengembangkan class / object library yang sering dipakaiPemrograman Visuala. Reusable Componentsb. Memiliki berbagai jenis komponen standard siap pakai (menu, buttons, ...)c. Pemrogram bisa mengembangkan komponen baru yang sesuai dengan

46

kebutuhannyad. Time Savinge. Waktu development lebih singkat dibandingkan dengan pemrogramankonvensionalf. Pengembang sistem bisa lebih berkonsentrasi pada sistem, bukanpada teknik pemrogramang. GUI based interfaceh. Secara umum, memiliki tampilan lebih menarik daripada text-basedinterface.Pemrograman berbasis event (Event-based Programming)Event-based Programming (Event-driven Programming) adalah pemrogramanyang memakai event (seperti event penekanan tombol keyboard atau mouse)sebagai dasarnya dan memberikan respon untuk event tersebut.Berbeda dengan pemrograman biasa dimana user harus menginputkaninformasi dalam suatu urutan tertentu yang telah ditentukan oleh pembuatprogram, dalam pemrograman berbasis event, user dimungkinkan untukmemilih sendiri urutan penginputan informasi. User bisa menginputkaninformasi tanpa tergantung urutan.Secara umum, suatu event adalah suatu aksi yang dikenal oleh objek, misalnyaevent penekanan tombol mouse, penggerakan mouse atau penekanan tombolkeyboard, sedemikian rupa sehingga programmer bisa menuliskan programsebagai respon dari event tersebut. Event bisa terjadi karena tiga hal yaitu:a. Aksi dari userb. Aksi dari programc. Trigger dari sistemEvent diatas juga termasuk input dari user (penekanan tombol, penekananmouse atau penggerakan mouse) dan interaksi dengan program lain(penggerakan suatu window menyebabkan event pengaktifan window tersebut).Bermacam-macam tipe event bisa terjadi kapanpun dan dalam urutan apapun.Event-event tersebut ditempatkan pada suatu queue (antrian) sesuai waktuterjadinya dan diproses sesuai dengan urutannya.Hal yang perlu diketahui adalah:a. Sifat event adalah asynchronousb. Event bisa terjadi pada urutan apapun dan pada posisi manapun dalamprogram.c. Event yang terjadi harus selalu ada event-handler nyaEvent loop adalah loop yang secara implisit ada pada semua event-based

47

programming. Semua program yang memakai GUI memproses event. Event looptidak terlihat oleh programmer dan tidak perlu diprogram oleh programmer.Berikut ini adalah algoritma suatu event loop:repeat receive event from event queueprocess event/* may do background activity in idle time */until termination event or conditionEvent handler (callback function) adalah suatu fungsi yang akan dieksekusi padasaat suatu event tertentu terjadi. Suatu event handler bisa dipakai oleh beberapaevent sekaligus.Mekanisme call back ini digunakan dalam pemrograman berbasis event. Rutinutama dari suatu program berbasis event berisi suatu loop yang menungguevent. Jika suatu event terjadi, maka program tersebut akan mengeksekusi rutintertentu (fungsi callback / event-handler) untuk memrosesnya. Selama fungsicallback ini dieksekusi, event-event lain yang terjadi akan disimpan dalam suatuqueue. Setelah fungsi call back selesai dieksekusi, kontrol akan dikembalikan kerutin utama, dimana event yang ada dalam queue akan dilayani sesuai denganurutan terjadinya. Loop ini akan diulangi selamanya sampai program selesaidieksekusi.Arsitektur semacam ini memiliki beberapa keterbatasan. Program harus selalusiap untuk menerima event yang terjadi. Style dari pemrograman berbasis eventmenuntut penyelesaian suatu task dalam waktu singkat, sehingga event-eventbisa di-handle dengan cepat dan user bisa mendapatkan respon dengan cepat.Jika pemrosesan butuh waktu lama, struktur dari program bisa dipecah-pecahmenjadi beberapa subtask yang lebih kecil. Alternatif lain bisa dilakukan dengancara mendelegasikan suatu task yang besar ke beberapa subproses sehinggaprogram utama tetap bisa meng-handle event.

48

Dibawah ini adalah diagram mekanisme pemrograman yang berbasis eventdengan suatu event loop dan beberapa event-handler nya (call back functions)Event yang Inisialisasiterjadidalam suatu fungsi callback Aapplikasifungsi callback BMenunggu event Mengirim eventatau mengambil ke fungsievent dari queue call back

event loop fungsi callback CGambar 7.1. Mekanisme pemrograman berbasis event

Konsep Client/ServerIstilah client/server dipakai untuk menjelaskan berbagai macam topik dalamlingkungan pemrograman. DLL (Dynamic Link Library) adalah contoh sederhanadari konsep client/server, dimana DLL berfungsi sebagai server dan programaplikasi yang memakai DLL tersebut berfungsi sebagai client. OLE dan DDE jugamemakai konsep client/server dimana aplikasi pemanggil berfungsi sebagaiclient dan aplikasi yang dipanggil berfungsi sebagai server. Konsep client/serverjuga banyak dipakai dalam konteks penyimpanan dan manipulasi database.Secara umum, bagian client dari konsep client/server diartikan sebagai programyang dijalankan pada terminal komputer yang terhubung dalam suatu network.Client ini berfungsi sebagai tempat dimana semua proses input dan output dataterjadi. Misalnya, sebuah program yang dibuat dengan Delphi berfungsi sebagaiaplikasi client yang melakukan proses input dan output data pada suatu serverdatabase yang berada dalam network tersebut.Bagian server dari konsep client/server diartikan sebagai server database yangberfungsi untuk melayani permintaan dari program aplikasi untuk mengambil,memanipulasi dan menyimpan data. Server database bisa dibayangkan sebagai

49

sebuah kotak hitam yang menyediakan fungsi-fungsi database dalammemanipulasi data. Suatu server database biasanya didesain untuk mampumelayani user dan transaksi network dalam jumlah besar.Referensi1. Weber et al. 1996, Develeping with Delphi, Object-Oriented Techniques,Prentice-Hall, NJ 07458.

50

BAB VIIITask Analysis

Banyak model yang menerapkan model dari ‘mental processing’ dimana usermencapai tujuannya (goals) dengan cara ‘divide and conquer’. Dua diantaranyayang paling banyak dipakai adalah GOMS (Goals, Operators, Methods andSelection) dan CCT (Cognitive Complexity Theory). Metode lain yang memilikikarakteristik yang mirip dengan GOMS dan CCT adalah Task AnalysisTechniques.GOMS (Goals, Operators, Methods and Selection)Model ini dikembangkan oleh Card, Moran dan Newell (1983), memiliki empatelemen yaitu:Goalsadalah tujuan dari user, menerangkan apa yang hendak dicapai oleh user.Dalam GOMS, goals ini dipakai sebagai pedoman untuk user untukmengevaluasi apa yang hendak dicapai (tujuannya) dan untuk titik tolakdimana user harus kembali jika terjadi error dalam proses desain.OperatorsIni adalah level terendah dari analisa. Operators adalah kegiatan dasar yangharus dilakukan oleh user untuk menggunakan sistem. Operators bisamempengaruhi sistem (misalnya, tekan tombol ‘x’) atau hanya mental statedari user (misalnya, baca dialog box).MethodsAda beberapa cara untuk mendekomposisi suatu goal menjadi sub-goals.Misalnya dalam suatu window manager, sebuah window bisa ditutup menjadiicon dengan dua cara, yaitu dengan memilih option ‘close’ dari pop-up menuatau dengan menekan kombinasi tombol Alt-F4. Dalam GOMS, keduadekomposisi dari goal tersebut dikenal dengan istilah method, dimana dalamcontoh diatas adalah CLOSE-METHOD dan Alt-F4 METHOD.GOAL: ICONIZE-WINDOW[select GOAL: USE-CLOSE METHODMOVE MOUSE TO WINDOW HEADERPOP-UP MENUCLICK OVER CLOSE OPTIONGOAL: USE-Alt-F4 METHODPRESS Alt-F4 KEY]SelectionDari contoh diatas, kita bisa melihat pemakaian kata ‘select’ pada saatmemilih method. GOMS tidak hanya menggunakan pilihan acak, tapi juga

51

berusaha untuk memperkirakan method apa yang hendak digunakan. Hal inibergantung pada user dan state dari sistem, juga detail dari goal. Misalnya,user Budi tidak pernah menggunakan Alt-F4 method kecuali untuk gameSolitaire, dimana mouse terus digunakan sampai suatu tombol key ditekan.GOMS memakai keadaan diatas sebagai suatu aturan selection untuk Budi.User Budi:Rule 1: Gunakan CLOSE-METHOD kecuali ada aturan lainRule 2: jika aplikasi adalah Solitaire, gunakan Alt-F4 METHODSuatu analisa yang memakai GOMS biasanya berisi satu high-level goal yangkemudian didekomposisikan menjadi sekumpulan task, dimana tiap task bisadidekomposisikan lagi sampai ke level operators yang paling dasar.Metode yang lebih ‘natural’ untuk mengekspresikan model dari GOMS adalahNGOMSL seperti pada figure 6.1 dibawah ini.PC DOS Macintosh

Specific file manipulation method Specific file manipulationmethodMetode untuk men-delete suatu file Metode untuk men-delete suatufileStep 1 Ambil dari LTM (Long Term Step 1 Melakukan proses click dandrag Memory) perintah ‘DEL’ file yang hendak di-delete ketrashStep 2 Pikirkan nama directory dan nama Step 2 Tujuan (men-delete file)telah file yang hendak di-delete tercapaiStep 3 Lakukan tujuan (goal) denganmengetikkan dan mengeksekusiperintah tersebutStep 4 Tujuan (men-delete file) telahtercapaiGeneral submethods General submethodsMetode untuk mengetikkan dan Metode untuk men-drag item ketujuanmengeksekusi suatu perintahStep 1 Ketikkan perintah yang diinginkan Step 1 Cari icon dari item pada screenStep 2 Ketikkan file-spec pertama Step 2 Gerakkan cursor ke lokasi iconStep 3 Jika tdak ada file-spec kedua, Step 3 Tekan tombol mouse

52

dan tahango to Step 5 Step 4 Cari icon tujuan pada screenStep 4 Ketikkan file-spec kedua Step 5 Gerakkan cursor ke icon tujuanStep 5 Periksa perintah yang telah diketikStep 6 Periksa apakah icon tujuantelahStep 6 Ketik ‘CR’ (carriage return) menjadi reverse-videoStep 7 Tujuan telah tercapai Step 7 Lepaskan tombol mouseStep 8 Tujuan telah tercapaiFigure 8.1: GOMS dengan notasi NGOMSL untuk men-delete suatu filepada dua sistem operasi yang berbedaCCT (Cognitive Complexity Theory)CCT diperkenalkan oleh Kieras dan Polson (1985). CCT menerapkan konsepdasar dari GOMS, yaitu dekomposisi dari goals (tujuan) dan mengembangkanmodel tersebut sehingga lebih ‘predictive’.CCT memiliki dua deskripsi paralel, yaitu user’s goal dan computer system(device). User’s goal dari CCT berdasarkan hierarki tujuan (goal) dari GOMS,yang diekspresikan dengan menggunakan ‘production rules’ (sekelompok aturanyang saling berurutan), misalnya:if condition then actionContoh penulisan production rules (misalnya, production rules untukmenyisipkan satu space dalam editor vi):(INSERT-SPACEIF (AND (TEST-GOAL insert space)(TEST-CURSOR %LINE %COL) )THEN ((DO-KEYSTROKE ‘I’)(DO-KEYSTROKE SPACE)(DO-KEYSTROKE ESC)(DELETE-GOAL insert space)))Rule (aturan) yang dipakai CCT bisa dipakai untuk desain yang lebih kompleksdaripada hierarki berurutan sederhana dari GOMS. CCT memungkinkan desainsecara parallel. Misalnya, satu set production rules dipakai untukmerepresentasikan tujuan menulis sebuah buku, dan satu set lainnya dipakaiuntuk merepresentasikan tujuan untuk minum kopi. Aturan-aturan tersebutbisa dipakai secara paralel, misalnya user bisa minum kopi pada saat menulisbuku.

53

Semakin banyak production rules dalam deskripsi dari CCT, maka interface akansemakin sulit untuk dipelajari. Waktu yang dibutuhkan untuk mempelajari suatuinterface boleh dikatakan setara dengan jumlah rule yang harus dipelajari.CCT boleh dikatakan sebagai suatu ‘engineering tool’ yang bisa dipakai untukmengukur learnability dan tingkat kesulitan dari suatu interface yangdikombinasikan dengan deskripsi secara mendetail dari ‘user behaviour’.KLM (Keystroke Level Model)Berbeda dengan GOMS dan CCT yang menggunakan cognitive understanding,KLM menggunakan ‘human motor system’ sebagai dasar prediksi detail dariunjuk kerja user. KLM ditujukan untuk suatu unit tugas dalam interaksi,misalnya, eksekusi dari beberapa perintah sederhana yang tidak lebih dari 20detik. Contohnya adalah perintah search and replace, atau mengubah jenis huruf(font) dari suatu kata. KLM tidak ditujukan pada suatu perintah kompleksseperti menggambar suatu diagram. KLM mengasumsikan bahwa suatu tugasyang kompleks harus sudah di pecah-pecah menjadi tugas yang lebih sederhana(seperti dalam GOMS) sebelum user berupaya untuk mengekspresikannya dalamsuatu model.Dalam contoh diatas, tugas tersebut dipecah menjadi dua tahap:a. Acquisition dari tugas, dimana user mengembangkan suatu ‘mentalrepresentation’ dari tugas.b. Execution dari tugas dengan menggunakan fasilitas dari sistem.KLM hanya memberikan prediksi untuk tahap-tahap akhir dari suatu aktivitas.Dalam tahap Acquisition, cara-cara penyelesaian suatu tugas sudah ditentukan,sehingga dalam tahap execution tidak perlu dipikirkan lagi. KLM berkaitandengan GOMS, dan bisa dianggap sebagai model GOMS yang paling low-level.Model KLM ini mendekomposisikan tahap execution menjadi lima ‘physical-motor operators’, satu ‘mental operator’ dan satu ‘system response operator’,yaitu:a. K keystroke, berupa penekanan tombol keyboard, termasuk tombolshift dan tombol-tombol lainnya.b. B berupa penekanan tombol mouse (mouse button)c. P pointing, menggerakkan mouse (atau device lain) ke suatu targetlokasid. H homing, perpindahan tangan dari mouse dan keyboarde. D drawing, menggambar garis dengan menggunakan mousef. M mental, persiapan pemikiran untuk menyelesaikan suatu aksi fisikg. R system response, yang bisa diabaikan jika user tidak perlu

54

menunggu penyelesaian dari suatu tugas, seperti dalam mengcopy satukarakter.Eksekusi dari suatu tugas akan melibatkan beberapa operator. Misalnya, dalamsuatu editor yang memiliki fasilitas mouse. Jika kita hendak memperbaiki satukarakter yang salah, maka yang dilakukan adalah menggerakkan mouse kekarakter tersebut, melakukan proses delete dan mengetikkan karakter yangbenar, kemudian kembali ke posisi kita yang terakhir. Proses ini bisadidekomposisikan menjadi:1. Move hand to mouse H[mouse]2. position mouse after bad character PB[LEFT]3. return to keyboard H[keyboard]4. delete character MK[DELETE]5. type correction K[char]6. reposition insertion point H [mouse] MPB[LEFT]Model KLM ini bisa memprediksi total waktu yang dibutuhkan untuk tahapeksekusi dengan cara menambah waktu untuk tiap-tiap komponen dari aktivitasdiatas. Misalnya, waktu yang dibutuhkan untuk satu keystroke adalah tK, makatotal waktu yang dibutuhkan untuk melakukan penekanan tombol keyboard(keystrokes) adalah:TK = 2tKKalkulasi diatas bisa juga diterapkan untuk operator-operator lainnya untukmenghitung total waktu seluruh operator:TEXECUTE = TK + TB + TP + TH + TD + TM + TR= 2tK + 2tB + tP + 3tH + 0 + 2tM + 0Waktu yang dibutuhkan untuk berbagai operator dalam KLM (diambil dari Card,Moran dan Newell (1980)):Operator Remarks Time (sec)K Press keygood typist (90 wpm) 0.12poor typist (40 wpm) 0.28non-typist 1.20B Mouse button pressdown or up 0.10click 0.20P Point with mouseFitts’ law 0.1 log2(D/S + 0.5)average movement 1.10

55

H Home hands to and from keyboard 0.40D Drawing - domain dependent -M Mentally prepare 1.35R Response from system - measure -

56

BAB IXTeknik Presentasi

Presentasi VisualProblem yang dihadapi oleh para pendesain interface komputer:a. Teknik terbaik untuk merepresentasikan informasi grafik yang besarpada layar komputer yang terbatasb. Alat terbaik untuk mensupport representasi tersebut beserta navigasinyaSolusi 1:a. Memetakan keseluruhan informasi grafik sesuai dengan size dari layarkomputerb. Kerugian: informasi detail tidak bisa terbaca karena terlalu kecilSolusi 2:a. Menampilkan sebagian kecil dari informasi grafik pada layar komputerb. Kerugian: sangat sulit untuk melakukan navigasi ke bagian-bagianinformasi grafik yang tidak terlihat di layar (scrolling)Teknik presentasi lainnya:a. Dual screen systemb. Split screen systemc. Bifocal Display systemd. Fisheye View systemDual screen system membutuhkan dua layar komputer sekaligus, satu layardipakai untuk merepresentasikan keseluruhan informasi, layar lainnya dipakaiuntuk menampilkan sebagian kecil dari informasi supaya bisa terbaca.Split screen system adalah variasi dari dual screen system, dimana satu layarkomputer dibagi menjadi dua bagian, satu bagian dipakai untuk menampilkansebagian kecil dari informasi secara mendetail, sedangkan bagian lainnya dipakaiuntuk menampilkan keseluruhan informasi (bagian yang ditampilkan mendetaildi highlight disini)Keuntungan:a. Hanya butuh satu layar monitorb. Praktis jika ukuran informasi grafik antara 30-50 kali ukuran layarkomputerKerugian:a. User masih harus melakukan swapping antar bagian dilayar

57

b. Area detail dilayar berkurang karena hanya bisa memakai separuh darikeseluruhan layarc. Layar monitor yang dibutuhkan cukup besar (17-20 inch)Bifocal Display (Spence and Apperley, 1982)Informasi grafik di tampilkan secara keseluruhan, dan pada saat yang sama, userbisa melihat ke salah satu area yang dibutuhkan secara mendetail.Demagnification Demagnification Demagnificationin both X and Y in Y dimension in both X and Ydimensions dimensionsCentralDemagnification ‘Focus’ Demagnificationin X dimension Region in X dimensionno demagnificationDemagnification Demagnification Demagnificationin both X and Y in Y dimension in both X and Ydimensions dimensionsKeuntungan:a. Hanya butuh satu layar monitorb. Praktis untuk informasi grafik yang ukurannya max 30 kali ukuran layarmonitorc. User bisa mengontrol keseluruhan informasi grafik selama berinteraksiKerugian:a. Area detail dilayar berkurangb. Perubahan yang tiba-tiba pada batas bagian detail dan demagnificationc. Membutuhkan perhitungan tambahan dalam pemrograman untukmenghasilkan bagian detail dan demagnificationFisheye View SystemKeuntungan:a. Hanya butuh satu layar monitorb. Praktis untuk informasi grafik yang ukurannya max 20 kali ukuran layarmonitorc. User bisa mengontrol keseluruhan informasi grafik selama berinteraksiKerugian:a. Area detail dilayar berkurang

58

b. Membutuhkan perhitungan yang paling rumit dibandingkan denganteknik-teknik lainnya dalam pemrograman untuk menghasilkan tampilanfisheyec. Image cenderung ada distorsi pada bagian-bagian tepi dari informasigrafikApplication Domain:a. Topological mapsb. Communication networkc. Technical drawingsd. Electrical circuit diagrams

59

BAB XTeknik Evaluasi

PendahuluanEvaluasi adalah bagian utama dari ‘user-centred system design’. Tanpa evaluasi,tidak mungkin diketahui apakah desain dari sistem sudah memenuhi keinginanuser atau organisasi yang akan memakainya.Latar belakang evaluasi:a. Understanding the real worldb. Comparing designc. Engineering towards a targetd. Checking conformance to a standardDalam tahap-tahap awal dari proses desain, evaluasi cenderung dilakukan untuk:a. Memperkirakan usability dari produkb. Mengetahui pengertian team desainer tentang kebutuhan userc. Mencoba ide-ide secara cepat dan informalDalam tahap-tahap akhir dari proses desain, evaluasi cenderung untuk:a. Mengetahui kesulitan userb. Meningkatkan kualitas dari produkEvaluasi bisa dilakukan di:a. laboratoriumb. lapangan (lokasi pemakaian sesungguhnya)c. bekerja-sama dengan userMetoda Evaluasi Desaina. Analytic methodsb. Review methodsc. Model based methodsMetoda Evaluasi Implementasia. Metode Eksperimentalb. Metode Observasionalc. Metode Survey / QueryMetode eksperimentala. Tipe

60

b. Sistematis dan terkontrolc. Berorientasi kasuald. Perspektif dalam industrie. Berkembang dalam laboratorium usabilityf. Prosedurg. Deskripsi tujuanh. Menentukan hipotesa yang hendak diuji kebenarannyai. Pertimbangan task, user, sistem, dll.j. Pertimbangan analisa statistikMetode Observasionala. Tipeb. Langsungc. Video/Audiod. Perspektif dalam industrie. Portablef. Fleksibelg. Data lengkaph. Proseduri. Tahap observasi awalj. Identifikasi struktur taskk. Deskripsi prosedur dari observasil. Evaluasi observasim. Analisa dataMetode Survey / Querya. Tipeb. Interviewc. Terstrukturd. Fleksibel / check-listd. Questionnaires / Rating Scalese. Tertutupf. Terbukag. Perpektif dalam industrih. Berguna untuk penilaian emosii. Interviewj. Persiapan / Efisiensik. Peroranganl. Fleksibilitasm. Questionnairesn. Bisa diulango. Administrasi tidak mahalp. Prosedur

61

q. Konsep struktur / urutanr. Penilaian alternatif bentuk-bentuk pertanyaans. Memilih pertanyaan untuk questionnaire percobaan (pilotquestionnaire)t. Melakukan questionnaire percobaan / Perbaikan / questionnairesesungguhnyau. Melakukan analisaPemilihan suatu metoda evaluasi haruslah sesuai dengan jenis aplikasi yanghendak dievaluasi.Pedoman Evaluasia. Pandanglah sistem dari jarak jauh untuk bisa melihat sistem secarakeseluruhanb. Pandanglah sistem dari jarak dekat sehingga bisa mendapatkan data yangbergunac. Biarlah subjek yang memberi informasi kepada anda, bukan sebaliknyad. Yakinkan bahwa subjek memakai sistem sesuai dengan aturan yangditetapkane. Dalam melakukan observasi, jangan mengganggu subjekf. Perhatikan datag. Data tidak pernah membohongi anda, interpretasi andalah yang bisamembohongi andah. Selesaikan masalah yang besar dahulu

62

BAB XISistem Multimedia

PengantarMultimedia, yang juga banyak dikenal dengan istilah many-media, secarasederhana dihubungkan dengan utilisasi (pendaya-gunaan) dari media ataukombinasi dari media-media yang tepat untuk topik tertentu dalam rangkauntuk memaksimalkan kelancaran komunikasi.Generasi pertama dari aplikasi multimedia adalah berdasarkan static video disksources. Sedangkan generasi kedua dari aplikasi multimedia memilikikemampuan untuk membuat dan menyimpan image dan video dari user. Saat inisistem multimedia sudah memiliki fasilitas lengkap mulai dari text, grafik, stillpictures, animation, motion video dan kumpulan suara / sound effects. Topikantarmuka dari sistem multimedia inilah yang saat ini mulai dieksplorasi dandikembangkan.Domain Aplikasi Multimediaa. Educationb. Entertainmentc. Information ServicesJenis-jenis media Sound non-speech natural sounds (auditory icons) artificial sounds (earcons)

speech music

Visual text grafik diagram tabel gambar gambar bergerak diagram animasi

Mixed Mode

63

film TV

Desain Sistem MultimediaDalam mendesain suatu sistem media, terdapat tiga hal pokok yang harusdipertimbangkan, yaitu:a, Media yang paling tepat untuk suatu taskc. Lingkungan (environment) yang tepat untuk media tersebutd. Efek yang diharapkan dengan mengkombinasikan media-media tersebut.Dalam memilih media yang tepat, Deatherage (1972) menyarankan pedomandibawah ini:Gunakan media audio jika: Gunakan media visual jika:1. Informasi sederhana 1. Informasi kompleks2. Informasi pendek 2. Informasi panjang3. Informasi hanya dibutuhkan saatitu 3. Informasi masih dibutuhkanbeberapa saat kemudian4. Informasi berisi event dalamwaktu 4. Informasi berisi lokasi dalamruang5. Informasi yang dibawakanmembutuhkan respon langsung 5. Informasi yang dibawakan tidakmembutuhkan respon langsung6. Sistem visual dari manusia terlalusibuk 6. Sistem audio dari manusiaterlalu sibuk7. Lokasi terlalu gelap atau terlaluterang 7. Lokasi terlalu bising8. Manusia harus terus bergerakdalam melakukan tugasnya 8. Manusia bisa tetap diam padasuatu posisi tertentu dalammelakukan tugasnyaFigure 13-1. Alasan pemakaian media audio atau visual(diambil dari Deatherage, 1972, p.124)

Delapan prinsip dalam mendesain interface sistem Multimedia:1. The principles of telepresence2. The principles of measurable media differences3. The goal principle4. The complexity principle5. The principle of apparent redundancy6. The principle of operator choice7. The intrusion principle8. The principle of media synchronisation

64

1. Introduction to HCIa. What is HCI? Describe the reasons why should the software designer learnHCI!b. Describe the development of HCI as a new field of study!2. HCI componentsa. What is ‘skill acquisition’? Describe the process of skill acquisition in termsof STM, LTM and rehearsal!b. Describe the difference between reasoning and problem-solving!3. Programming the User InterfaceDescribe the mechanism of event-driven programming in terms of the events,event-loop, event-queue and event-handler! Use diagrams if necessary!4. UsabilityDescribe the development of usability concept from the point of view ofMiller, Shackel, Brooke and Jordan! Write down the emphasize for eachconcept!5. Task AnalysisIn a word processor, a single word can be selected by double-clicking thecursor in the middle of the word. If the user wishes to select an arbitrarystring of characters, the characters must be highlighted by dragging themouse over the text with the mouse button held down. To cut the text out ofa document, the user must first highlight the text and then issue the cutcommand.a. Write an NGOMSL description for the goal of ‘cut out text’!b. Use TKS to model the task ‘cut out text’!

65

1. Interaction Styles (25 points)a. How would you set about designing an interface that suited all levels ofusers?b. What are the differences between semantic directness and articulatorydirectness?2. Devices (25 points)a. Classify the following input devices (numeric keypad, mouse, trackball)intodirect or indirect input devices! Give reasons!b. Compare and contrast the differences between the QWERTY keyboardandthe DVORAK keyboard!3. Visual Presentation Techniques (25 points)a. Describe the differences between distortion and non-distortion orienteddisplays! Give examples!b. Describe the way Bifocal Display works!4. Auditory Interfaces (25 points)a. Compare and contrast the differences between the Auditory Icons and theEarcons!b. Show the weaknesses of Blattner’s Earcons classification!

66

GARIS-GARIS BESAR PROGRAM PENGAJARAN(GBPP)

INTERAKSI MANUSIA DAN KOMPUTERRIF 3090

Disusun oleh :Dyah Ayu Irawati, ST., M.Cs.

JURUSAN TEKNIK ELEKTROPROGRAM STUDI MANAJEMEN INFORMATIKA

POLITEKNIK NEGERI MALANG2011

67

Garis-Garis Besar Program Pengajaran (GBPP)

Mata Kuliah : Interaksi Manusia dan Komputer

Kode Mata Kuliah : RIF 3090

Semester/SKS : 1 / 1 SKS

Beban Studi : 3 jam / minggu

Diskripsi Singkat : Materi kuliah ini meliputi konsep dasar aspek-aspek hubungan antara masnusia dan komputer sertamampu menganalisis, merancang dan mengimplementasikan teori ini dalam pembuatan antarmuka(interface) antar manusia dan komputer

Kompetensi Mata Kuliah : Mahasiswa dapat mengerti dan mampu memahami aspek-aspek hubungan antara masnusia dan komputerserta mampu menganalisis, merancang dan mengimplementasikan teori ini dalam pembuatan antarmuka(interface) antar manusia dan komputer sebuah program sehingga pengguna dapat menggunakankomputer dengan nyaman dan puas.

Referensi : 1. Schneiderman,Ben.(1998). Designing the User Interface: Strategies for Effective Human-ComputerInteraction, 3/E. Addison-Wesley.

2. Dix, Introduction , Preece, bab 1,2 (Part I: Introduction)3. Brad A.Myers, A Brief History of Human Computer Interaction Technology, 1996, CMU-CS-96-163

www.cc.gatech.educlasses/AY2002/cs4470_fall/CMU-CS-96-1634. Santosa I, Interaksi manusia dan komputer , teori dan praktek, 2004, Andi Offset, Yogyakarta.

No Standar Kompetensi(TIU)

PokokBahasan Kompetensi Dasar (TIK) Sub Pokok Bahasan

DomainWaktu Refe

rensiKognitif Psikomotorik Afektif(1) (2) (3) (4) (5) (6) (7) (8)

1. Mengerti konsepdasar interaksimanusia dankomputer

PengantarInteraksiManusia danKomputer

a. Mengetahui danmenjelaskan apa itu interaksimanusia dan komputer,b. Mengetahui danmenjelaskan bidang studiyang terkait dengan IMKc. Mengetahui danmenjelaskan piranti bantupengembangan sistem

Antarmuka manusia dankomputer, konsep dasarhubungan manusia dankomputer, bidang studiyang terkait denganinteraksi manusia dankomputer, piranti bantupengembangan sistem

Ѵ Ѵ

3 X 45” 1,2

68

2. Mengerti konsepdasar interaksimanusia dankomputer

PengantarInteraksiManusia danKomputer

a. Mengetahui danmenjelaskan apa itu interaksimanusia dan komputer,b. Mengetahui danmenjelaskan bidang studiyang terkait dengan IMKc. Mengetahui danmenjelaskan piranti bantupengembangan sistem

Antarmuka manusia dankomputer, konsep dasarhubungan manusia dankomputer, bidang studiyang terkait denganinteraksi manusia dankomputer, piranti bantupengembangan sistem

Ѵ Ѵ

3 X 45” 1

3. Mengetahui danmampu menjelaskanmengenai faktor-faktor apa saja yangberpengaruh padainteraksi manusia dankomputer

Faktor Manusia a. Mengetahui faktorpenglihatan manusia padaIMKb. mengetahui faktorpendengararan manusia padaIMKc. mengetahui faktor sentuhanmanusia pada IMK

Penglihatan,Pendengaran, danSentuhan

Ѵ Ѵ

3 X 45” 1

4. Mengetahui danmenjelaskan jenis-jenis dialog interaktifyang memungkinkanterjadinya interaksimanusia dankomputer

Ragam Dialog Mengerti, dapatmenjelaskan danmenggambarkan jenis-jenisragam dialog untuk IMK

Ragam dialoginteraktif, dialogberbasis perintahtunggal, dialogberbasis bahasapemrograman,antarmuka naturallanguage, sistemmenu, dialog berbasispengisian borang,dialog berbasis ikon,sistem window,interface berbasisinteraksi grafis.

Ѵ Ѵ Ѵ

3 X 45” 1,2

5. Mengetahui danmenjelaskan jenis-jenis dialog interaktifyang memungkinkanterjadinya interaksimanusia dankomputer

Ragam Dialog Mengerti, dapatmenjelaskan danmenggambarkan jenis-jenisragam dialog untuk IMK

Ragam dialoginteraktif, dialogberbasis perintahtunggal, dialogberbasis bahasapemrograman,antarmuka natural

Ѵ Ѵ Ѵ

3 X 45” 1,2,4

69

language, sistemmenu, dialog berbasispengisian borang,dialog berbasis ikon,sistem window,interface berbasisinteraksi grafis.

6. Mampumemanfaatkanberbagai ragamdialog untukmerancang suatuinterface

Kuliah Mandiri Mampu memilih danmenggunakan ragam dialogdalam rancangan interface.

Pemanfaatan berbagairagam dialog

Ѵ Ѵ Ѵ

3 X 45”

7. Mengetahui danmenjelaskanberbagai pirantiinteraktif input outputyang mendukungterjadinya interaksiantara manusiadengan komputer.

Piranti I/O a. Mengetahui pirantimasukan tekstual,

b. Mengetahui pirantipenunjuk danpengambil

c. Mengetahui panel layarsentuh

d. Mengetahui tentanglayar tampilan

e. Mengetahui pengolahtampilan

f. Mengetahui danmenjelaskan danmengembangkancontoh dan pengaruhpiranti interaktif

Piranti masukan tekstual,Piranti penunjuk danpengambil (pointing andpicking device), Panelsensitif sentuhan (touch-screen), Layar tampilan,Pengolah tampilan,Pengaruh pirantiinteraktif Ѵ Ѵ

3 X 45” 2

8. Mengetahui danmenjelaskanberbagai pirantiinteraktif input outputyang mendukungterjadinya interaksiantara manusiadengan komputer.

Piranti I/O a. Mengetahui pirantimasukan tekstual,

b. Mengetahui pirantipenunjuk danpengambil

c. Mengetahui panel layarsentuh

d. Mengetahui tentanglayar tampilan

e. Mengetahui pengolahtampilan

Piranti masukan tekstual,Piranti penunjuk danpengambil (pointing andpicking device), Panelsensitif sentuhan (touch-screen), Layar tampilan,Pengolah tampilan,Pengaruh pirantiinteraktif

Ѵ Ѵ

3 X 45” 1,2

70

f. Mengetahui danmenjelaskan danmengembangkancontoh dan pengaruhpiranti interaktif

9. Mampumemanfaatkan danmemadukan berbagaimacam ragam dialogdan piranti interaktifdalam merancangsuatu user interface

Kuliah Mandiri Mampu memilih danmenggunakan ragam dialogdan piranti interaktif dalamrancangan interface.

Pemanfaatan berbagairagam dialog dan pirantiinteraktif.

Ѵ Ѵ Ѵ

3 X 45” 1,2

10. mengetahui danmampu menjelaskandan mengikutitahapan-tahapanperancanganinterface.

PerancanganTampilan

a. Mengerti prinsip danpetunjuk perancangantampilanb. Memahami dan dapatmembuat peranti bantusederhanac. mengerti dan dapatmembuat sebuahprototypingd. mengerti dan dapatmembuat storyboard

Prinsip dan petunjukperancangan tampilan,peranti bantusederhana,prototyping,storyboarding Ѵ Ѵ Ѵ

3 X 45” 1,2

11. mengetahui danmampu menjelaskandan mengikutitahapan-tahapanperancanganinterface.

PerancanganTampilan

Memahami konsep dandapat membuat jaringsemantik tampilan

Jaring semantiktampilan

Ѵ Ѵ Ѵ

3 X 45” 1,2,3,4

12. Mengetahui danmampu menjelaskanmengenai pengaruhaspek ergonomisterhadapperancangan antarmuka manusiadengan komputer.

AspekErgonomik

a.Mengetahui dan mampumenjelaskan tentangpengukuran danantropometrik

b.Mengetahui dan mampumenjelaskan aspekergonomik dari stasiunkerja

c.Mengetahui dan mampumenjelaskan mengenai

Pengukuran danantropometrik, aspekergonomik stasiunkerja, efekpencahayaan, layartampilan, suhu dankualitas suara,gangguan suara,kesehatan dankeamanan kerja,

Ѵ Ѵ

3 X 45” 1

71

efek pencahayaan, layartampilan, suhu dankualitas suara, gangguansuara, kesehatan dankeamanan kerja,kebiasaan-kebiasaandalam kerja

kebiasaan kerja.

13. Mampumemanfaatkan danmemadukan berbagaimacam ragam dialogdan piranti interaktifdalam merancangsuatu user interface

Kuliah Mandiri Mampu memilih danmenggunakan ragam dialogdan piranti interaktif dalamrancangan interface.

Pemanfaatan berbagairagam dialog dan pirantiinteraktif.

Ѵ Ѵ Ѵ

3 X 45” 1,2

14. Mengetahui danmampu menjelaskanmengenai teknikevaluasi terhadapperancangan antarmuka manusiadengan komputer.

TeknikEvaluasi

Mampu menjelaskanmengenai teknik-teknikevaluasi

Memanfaatkan teknikevaluasi

Ѵ Ѵ Ѵ

3 X 45” 1,2,4