Reka Bentuk antara Muka Pengguna User interface

Pengenalan
Dua contoh Analogi: 1. Autoteller Machine (ATM). ATM Interface memudahkan pengguna untuk berurusniaga, di mana rekabentuk antaramuka pengguna yang dibina memberi kesan kepada pengguna dari segi gambaran, pemahaman dan arahan. 2. Situasi dalam kereta. Berkenaan butang (buttons) dalam kereta yang direkabentuk mengikut fungsi tertentu. Auto teller mechine (ATM) The interface of ATM make an interaction between machine more friendly. This interface design

Pengenalan
Antaramuka Pengguna Jalinan komunikasi di antara manusia sebagai pengguna dan komputer sebagai alat. Komunikasi - lebih bersifat human to machine - komputer bertindak sebagai jambatan (penghubung) bagi sesuatu pencapaian maklumat. Komunikasi yang dihasilkan adalah menerusi skrin komputer - merangsang perasaan ingin tahu pengguna untuk menerokai maklumat. Memberi Kesan - Gambaran, pemahaman dan arahan. - ada elemen grafik, reka bentuk antaramuka perlu konsisten, jelas dan menarik. User interface is a human computer interaction & communication and also as a connection to access the information Bridge of Human & machine Computer screen as a medium of information exploration Computer screen as a motivation tool of information re-structure Computer screen as a cognitive tool of knowledge construction Effect of computer screen visualization, understanding development & also instruction, text, graphic, animation must be consistent, attractive and clear

Paparan Skrin
Paparan Skrin adalah segala imej, teks dan arahan yang terdapat di skrin komputer. perlu disusun untuk memudahkan pengguna menggunakannya. Faiola dan Debloois -1988- mendapati pembahagian informasi yang dapat membantu pengguna adalah daripada unit yang luas kepada yang lebih kecil. Every image on screen such as text, graphic, animation or combination of that which called screen display must be coordinate. Why? More user friendly on user interface. Faiola & Debloois (1998) : screen design -

Paparan Skrin

Paparan skrin yang baik - dapat memaparkan informasi mengikut format yang teratur. Elemen-elemen seperti teks, ikon dan nombor perlu disusun di skrin komputer dengan jelas, konsisten dan kemas. tanpa konsistensi pengguna tidak dapat memberi tumpuan - boleh mengakibatkan kekeliruan dan keletihan. Principe of screen design : structuring the information based on correct format Text, icon, numbering system, button and link must be consistent, clear & clean (clean & clear) Without consistent, user always be confusing on focusing the information. Better chance of misunderstanding.

Gambaran Informasi
Gambaran Informasi amnya boleh dikaitkan sebagai visual yang digunakan sebagai alat menerangkan sesuatu perkara. Apabila penerangan yang dilakukan dalam bentuk teks disokong dengan gambaran/visual maka boleh membantu pengguna mengingati dan mengetahui hubungan yang terjalin. (Lihat Contoh 1) Anda juga secara kreatifnya dapat mereka bentuk format reka letak bagi gambaran informasi dalam projek anda. (Lihat Contoh2)

Information display : refer to tool which visualize the information When the information shown by the combination of text and graphic, its become a user cognitive tool for better retention and make a correlation between these elements You are also can construct the creativity skill to format the design of information display of your multimedia courseware.

Contoh 1 :

Contoh 2 :

Gambaran Arahan
Gambaran Arahan -digunakan untuk membimbing pengguna mempelajari bahan di dalam perisian. Menu pilihan/utama perlu ditempatkan sebaik-baik yang mungkin sebaikbaiknya mengikut pergerakan mata pengguna.-call card Arahan-arahan tertentu juga boleh dipaparkan di skrin. Untuk mengelakkan kesukaran bagi pengguna mengingati pelbagai arahan. (Lihat Contoh 3) Penggunaan Antaramuka yang baik dapat menghasilkan suatu hubungan yang baik di antara pengguna dan komputer Instruction display Facilitate the user how to learn the information / content inside the courseware. Main menu / main screen must be formatting based on human eye movement Some of instruction must be display on screen as a guideline to user Its very important on User interface design to make a human computer interaction more friendly.

Pergerakan mata pengguna.

Contoh 3 :

Jenis Antaramuka Manusia & Komputer

A. Metafor Perbualan. Menggunakan Sintak dan Semantik. Agak rumit - pengguna perlu mengingati bahasa-bahasa programming Dengan muncul Dialog Bahasa Biasa, beban dapat dikurangkan. Suatu mesin khas dapat dicipta - komputer meniru bahasa manusia dengan sistem yang mempunyai 20 000 perbendaharaan kata Bahasa Inggeris (98%). Maka kepada sesiapa yang berminat bolehlah membina suatu sistem menggunakan bahasa melayu. Interview metaphor Used syntax and Semantic Too complicated use the programming language There a new approach of this dialog metaphor to reduce a workload With this new system / machine, computer had to duplicate the language of human which integrate with 20000 English phrase / word There are some program which integrate Malay term / Phrase / word such as

Jenis Antaramuka Manusia & Komputer

B. Metafor Manipulasi Secara Terus. Mewujudkan suatu persekitaran - manusia dapat menjalinkan komunikasi melalui objek atau tingkahlaku yang telah disediakan. Komunikasi yang dilakukan disokong dengan suatu peranti luar di mana pergerakan dan sentuhan dapat dilaksanakan. Peranti luar yang sering digunakan - tetikus. Directly manipulation metaphor There are an environment which the interaction between human and machine (computer) based on prepared environment This type of communication supported by user controlled external devices such as mouse & cursor.

Fungsi
Fungsi antaramuka - mereka perhubungan segera antara pengguna dengan komputer (aturan) dengan menyediakan ruangan interaksi yang dapat membenarkan pengguna menyusuri isi kandungan sesuatu koswer. Terdapat pelbagai komponen dalam sesuatu antaramuka yang menyediakan pelbagai fungsi dan kegunaan. 3 komponen yang biasa membentuk fungsi antaramuka iaitu latarbelakang, alat penyusuran dan kawasan panas.

Interface function Instant connection between user and computer (structured timing) which provided for user to explore or have an interaction with courseware. There a various type of components of interface which provide for multiple function and usage Three basic components of interface function : backgrounds

Fungsi A.Latar Belakang Lapisan asas yang menyediakan suasana penyampaian atau mengambarkan bahan persembahan sebelum ia dipaparkan. Latar belakang yang bermakna adalah latarbelakang yang dapat menjalinkan ikatan terdekat pengguna dengan maklumat. Kekuatan reka bentuk latarbelakang bergantung kepada imej dan warna yang digunakan.

Fungsi B. Pelayar Komponen penting dalam mempengaruhi jalinan komunikasi atau perhubungan di antara pengguna dengan komputer. Melalui pelayar ini juga interaktiviti atau hubungan dua hala dapat diwujudkan. Komponen-komponen pelayar : 1. Panel Kawalan. 2. Butang. 3. Ikon.

Panel Kawalan Direka untuk menggambarkan gambarajah visual yang menunjukkan sifat dan fungsi sebenar. Tujuan Utama - memberi daya kawalan kepada pengguna Untuk itu, rekacipta panel kawalan perlu mempunyai imej visual menyerupai yang konvensional dengan gambaran fungsi yang tepat.

Button - memberi tindak balas kepada respon pengguna. bergerak ke skrin seterusnya, kembali kepada skrin atau keluar Butang yang baik- dapat menarik perhatian atau merangsang pengguna untuk menekan butang tersebut , memberi kepuasan terhadap perubahan yang berlaku apabila tetikus melalui, menekan atau meninggalkan sesuatu butang. Terdapat pelbagai cara - menggunakan perisian grafik (Photoshop), di Internet (free buttons) atau di dalam perisian bahasa pengarang yang telah menyediakan galeri butangnya yang tersendiri.

Ikon (Icon) - menunjukkan konsep atau idea. Ikon bertindak seperti butang membawa pengguna kepada topik yang terdapat di dalam sesuatu koswer apabila pengguna menekan pada ikon kad imej. Anda juga boleh menghasilkan ikon anda sendiri - perisian Paint.

Fungsi C. Kawasan Panas (Hot Area) Kawasan di mana kursor berubah apabila melaluinya. Perubahan kursor dari bentuk default kepada bentuk lain Secara asasnya, kawasan panas berfungsi untuk memulakan sesuatu contohnya seperti tulisan, suara, animasi dan video apabila kursor melaluinya. Skop kawasan panas boleh ditentukan oleh pengguna. Pengguna boleh meletakkan kawasan panas di mana-mana bahagian pada latar belakang atau isi kandungan.

Penggunaan Audio dalam Antaramuka Pengguna

Salah satu elemen yang penting dalam menyumbang kepada pengalaman pengguna menerokai sesuatu koswer Terdapat tiga jenis pengunaan audio yang asas, suara latar (Voice Over), muzik dan kesan-kesan khas bunyi. Secara asasnya, penggunaan kesan-kesan khas bunyi dapat memberikan kesan besar kepada mood pengguna dalam sesuatu aplikasi.

Penggunaan Audio dalam Antaramuka Pengguna Contoh: 1. Bunyi Amaran - Waspada 2. Bunyi Tindak balas - maklumbalas 3. Bunyi Arahan - Alternatif lain 4. Muzik Latar - Keselesaan dan kedamaian Penggunaan audio yang tepat dan tidak melampau dapat menarik minat pengguna -dapat mempertingkatkan informasi serta mengekalkan ingatan terhadap informasi dengan lebih lama.

Sepuluh Perkara Penting Mengenai A/muka Pengguna Dlm Arahan Multimedia 1. Bahan yang disampaikan mestilah setaraf dengan pengetahuan pengguna. 2. Pastikan bahawa perkataan, ilustrasi atau ikon yang digunakan sesuai bagi setiap paparan di skrin. 3. Setiap skrin paparan mestilah boleh menarik perhatian, mepertingkatkan pembelajaran dan daya ingatan semula pengguna.

4. Segala maklumat atau keterangan yang diberikan tidak melebihi keperluan yang dikehendaki. 5. Kemasukan visual dan petikan benar-benar dapat memperkembangkan proses pembelajaran. 6. Gunakan warna-warna yang boleh merapatkan komunikasi. 7. Menguji kesan bagaimana individu memproses beberapa ilustrasi. 8. Ujian ke atas pengguna ikon. 9. Pastikan mesej tidak berlebihan semasa teks dan visual digunakan. 10. Pastikan visual dari ikon tidak sensitif mengikut pandangan budaya seseorang.

Alat Pengukur Antaramuka Pengguna

Digunakan untuk menilai antaramuka program komputer yang baru atau sedang dibangunkan. Sepuluh kriteria yang akan dinilai dalam pembentukan antaramuka program komputer. Terdapat juga sesetengah kriteria yang tiada kaitan.

Alat Pengukur Antaramuka Pengguna 1. Dimensi Pertama - Senang digunakan. 2. Dimensi Kedua - Pelayaran. 3. Dimensi Ketiga - Beban Kognitif. 4. Dimensi Keempat - Pemetaan. 5. Dimensi Kelima - Reka Bentuk Skrin. 6. Dimensi Keenam - Kesesuaian Ruang Pengetahuan. 7. Dimensi Ketujuh - Persembahan Maklumat. 8. Dimensi Kelapan - Integrasi Media. 9. Dimensi Kesembilan - Astetik. 10. Dimensi Kesepuluh - Fungsi Keseluruhan.