bab 2 filosofi rekabentuk antaramuka

28
Pengaturcaraan Antaramuka Pengguna BAB 2 FILOSOFI REKABENTUK ANTARAMUKA

Upload: chaerry-cha

Post on 26-Jun-2015

625 views

Category:

Education


8 download

DESCRIPTION

Filosofi Rekabentuk Antaramuka

TRANSCRIPT

Page 1: Bab 2 Filosofi Rekabentuk Antaramuka

Pengaturcaraan Antaramuka Pengguna

BAB 2

FILOSOFI REKABENTUK ANTARAMUKA

Page 2: Bab 2 Filosofi Rekabentuk Antaramuka

Filosofi

Lima filosofi yang utama antaramuka pengguna : Konsisten (consistent) dan tidak mengelirukan pengguna. Membimbing pengguna kepada tindakan-tindakan yang

seterusnya. Bertenaga (robust). Pengguna tidak hilang arah atau

terkejut. Menjadikannya Ramah, iaitu memberikan maklum balas

yang berguna. Berkuasa, iaitu memberikan pengguna berkuasa penuh.

Page 3: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Konsisten: Jangan Kelirukan Pengguna

Konsistensi adalah kebolehan pengguna untuk meramalkan apa yang perisian hendak lakukan dalam suatu keadaan yang diberi, berdasarkan pengalaman lepas terhadap produk.

Ada beberapa perisian menggunakan secara meluas fungsi kekunci (F1 hingga F12) pada papan kekunci, tetapi jika penggunaan fungsi kekunci ini tidak konsisten, akan menimbulkan masalah.

Page 4: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Konsisten: Jangan Kelirukan Pengguna (samb) Satu perkara utama yang dinyatakan oleh Microsoft

ketika membina antaramuka sebelum Windows versi 3.1, bahawa kurangnya kekonsistenan di dalam antaramukanya, seperti - membuka fail dan memilih warna.

Penyelidikan menunjukkan pengguna lebih suka menggunakan aplikasi yang mempunyai persekitaran grafik seperti Windows berbanding persekitaran baris perintah (command line seperti DOS).

Lebih banyak aplikasi yang digunakan maka lebih banyak jangkaan terhadap cara yang sama dari pengguna.

Page 5: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Konsisten: Jangan Kelirukan Pengguna (samb)

Konsisten juga penting dalam merekabentuk peralatan 'tools'.

Aplikasi sekarang memperkenalkan banyak palang alat (toolbars) walaupun kadang-kadang tidak konsisten.

Dengan itu pengguna akan merasa lebih sukar untuk menggunakannya.

Page 6: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Membimbing

Satu antaramuka yang baik adalah antaramuka yang dapat memberi bimbingan atau klu yang menjurus kepada apa yang akan dilakukan seterusnya dalam situasi yang diberikan pada ketika itu.

Dengan bimbingan yang betul pengguna tidak hilang arah dalam melaksanakan kemahuan mereka.

Tidak timbul persoalan seperti mengapa tiba-tiba mesti buat begini dan begitu.

Page 7: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Membimbing (samb)

Sebagai contoh, sekiranya saya memandu di sepanjang jalan, saya punyai panduan tentang ke mana jalan itu pergi seterusnya berdasarkan bentuk jalan itu, tanda-tanda yang terdapat di sepanjang jalan, dan sebagainya. Sekiranya kita memandu pada jalan yang tiada apa-apa tanda, kita akan sesat jalan.

Page 8: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Bertenaga

Antaramuka sepatutnya berpandu arah sehinggakan pengguna baru dapat melaksanakan tugas tanpa bersusah payah.

Tidak terlalu longgar bagi 'power users' untuk melaksanakan tugas rumit dengan gangguan antaramuka.

Antaramuka yang berlebihan (extreme) mempunyai ciri terlebih bantuan dan terlalu pantas.

Page 9: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Bertenaga (samb)

Terdapat 2 jenis antaramuka. Pertama antaramuka menjadikan kita sentiasa

berjaga-jaga akan kehadirannya. Contohnya, antaramuka yang mengeluarkan

soalan-soalan “Do you want to continue?”, dan “Are you sure you want to reformat your hard drive?”.

Ia meminta tindakbalas samada untuk tindakan percubaan atau merbahaya pengguna.

Page 10: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Bertenaga (samb)

Satu jenis lagi ialah antaramuka yang akan membenarkan kita melakukan hampir semua perkara, dan tidak akan memberikan kita maklum balas tentang samada apa yang kita lakukan adalah baik, tidak baik atau merbahaya.

Ia menganggap yang kita tahu apa yang kita lakukan untuk semua kes.

Page 11: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Ramah

Bahagian penting dalam antaramuka ialah memberikan satu maklum balas bertahap sesuai, kepada pengguna. Maklum balas yang baik dan jelas kepada pengguna mengandungi maklumat : Apa yang telah pengguna lakukan. Bagaimana melakukannya. Apakah hasilnya.

Page 12: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Ramah (samb)

Apabila pengguna melakukan tindakan, mereka ingin tahu apakah sebenarnya mereka telah lakukan.

Sebagai contoh, apabila pengguna memlih “Print” daripada menu “File”, suatu dialog mencetak muncul untuk mendapatkan lebih maklumat daripada pengguna.

Pada ketika ini, pengguna telah diberitahu dengan hadirnya kotak dialog mencetak yang mereka telah memilih masukan “Print”.

Page 13: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Ramah (samb)

Contoh-contoh maklum balas adalah seperti: Objek digelapkan (highlighted). Kotak dialog dikeluarkan untuk mendapat

maklumat lanjut dari pengguna. Cetak berapa salinan ? Besar mana hasil cetakan ?

Page 14: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikannya Ramah (samb)

Selain itu, sesuatu tindakan yang telah dilaksanakan mestilah dinampakkan kepada pengguna sebagai maklum balas, seperti: Visual feedback - bukti. Imej pada palang alat depress (tenggelam tanda

di tekan). Peralatan digelapkan. Kotak dialog.

Page 15: Bab 2 Filosofi Rekabentuk Antaramuka

Jadikanya Berkuasa

Antaramuka yang berkuasa dapat mempercepat dan mempermudahkan kerja-kerja pengguna - default.

Contohnya dalam perisian pemprosesan perkataan. Setiap kali pengguna hendak bina dokumen, pengguna tidak perlu memberikan maklumat halaman seperti margin, header, footer, bil lajur, jarak menegak, jenis tulisan, saiz dan gaya.

Page 16: Bab 2 Filosofi Rekabentuk Antaramuka

Garis Panduan Merekabentuk Antaramuka Pengguna

Peraturan dari antaramuka Xerox Star(1970).

Peraturan dari antaramuka IBM Common User Access(1989).

Page 17: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka Xerox Star(1970) Konkrit lawan Abstrak.

Perkara-perkara konkrit adalah lebih mudah ditunjukkan secara visual berbanding idea abstrak. Cuba fikirkan dalam bentuk ikon-ikon.

Bolehlihat (visible) lawan Tidak Kelihatan (invisible).

Menyorokkan maklumat dan memaksa pengguna untuk mengingat akan menyebabkan antaramuka bersifat sukar.

Penyalinan lawan Pembinaan. Jangan biarkan pengguna terpaksa membina sesuatu

bermula dari awal, Berikan sesuatu yang telah ada kemudian ubahsuai. Idea menyalin dengan cerdik ini diterima berbanding dengan palagiat.

Page 18: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka Xerox Star(1970) (samb)

Memilih lawan Memasukan Maklumat. Tidak perlu memaksakan pengguna untuk

mengingati apa yang hendak ditaip, berikan mereka senarai yang boleh mereka pilih darinya.

Interaktif lawan Batch.

Page 19: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka IBM Common User Access(1989)

Garispanduan IBM Common User Access mencadangkan sintaks antaramuka bagi program aplikasi yang dilarikan pada komputer IBM dan yang serasi dengannya.

Garis panduan lain adalah Apple guide-lines untuk sistem pengoperasian Macintosh, dan Open System Motif untuk sistem Unix.

Page 20: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka IBM Common User Access(1989) (samb)

Komponen visual. Komponen skrin utama bagi semua aplikasi beroperasi

melalui tetingkap. Tindakan kebiasaannya dalam bentuk menu-menu pull-

down. Hanya objek-objek aplikasi yang kelihatan. Tetingkap aplikasi boleh digerak dan disaiz semula. Palang tajuk mempunyai ikon sistem menu- yang

membenarkan operasi terhadap tetingkap dilakukan seperti :- memaksima (maximize), meminima (minimize), mengalih (move) atau menutup tetingkap.

Page 21: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka IBM Common User Access(1989) (samb)

Page 22: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka IBM Common User Access(1989) (samb)

Page 23: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka IBM Common User Access(1989) (samb)

Tetikus dan ikon Tetikus digunakan untuk menunjukkan penggesa (cursor)

pada objek. Bebutang tetikus ditekan jika objek yang ditunjukkan

hendak dipilih. Objek yang dipilih berubah warna untuk menunjukkan ia

telah dipilih. Program boleh memberitahu pengguna apa operasi yang

sedang berlaku dengan mengubah bentuk ikon tetikus. Contohnya, jika penggesa diletakkan pada sempadan atau bingkai tetingkap, ikonnya berubah menjadi bentuk anak panah dua kepala.

Page 24: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka IBM Common User Access(1989) (samb)

Page 25: Bab 2 Filosofi Rekabentuk Antaramuka

Peraturan dari antaramuka IBM Common User Access(1989) (samb)

Palang tindakan Boleh dikatakan semua aplikasi mempunyai lebih dari

satu menu. Kebiasaannya dalam susunan: File Edit View Options Help

Palang –palang menu bagi kebanyakan aplikasi dilengkapi dengan palang-palang alat yang berbagai untuk memudahkan pengguna.

Ia terdiri dari ikon-ikon yang mewakili tindakan yang sering digunakan. Contohnya: palang alat piawai, palang alat pemformatan, palang alat melukis dan sebagainya.

Page 26: Bab 2 Filosofi Rekabentuk Antaramuka

Penggunaan Warna dan Bunyi Dalam Sistem Komputer Warna juga memainkan peranan penting dalam antaramuka.

Melaluinya dapat diperlihatkan paparan yang lebih menarik dan menyeronokkan kepada pengguna.

Sebagi contoh, anda boleh menggunakan panduan-panduan di bawah semasa membina antaramuka: Jadikan semua caption satu warna manakala semua medan

kemasukkan data menggunakan warna selainnya. Jadikan warna tetingkap yang sedang aktif berbeza dari semua

tetingkap lain yang tidak aktif. Gunakan warna merah bagi mesej-mesej berjenis amaran. Apabila status item berubah, tukarkan warnanya dari warna

semasa.

Page 27: Bab 2 Filosofi Rekabentuk Antaramuka

Penggunaan Warna dan Bunyi Dalam Sistem Komputer (samb)

Sebagi contoh, anda boleh menggunakan panduan-panduan di bawah semasa membina antaramuka: Jadikan semua caption satu warna manakala semua

medan kemasukkan data menggunakan warna selainnya. Jadikan warna tetingkap yang sedang aktif berbeza dari

semua tetingkap lain yang tidak aktif. Gunakan warna merah bagi mesej-mesej berjenis

amaran. Apabila status item berubah, tukarkan warnanya dari

warna semasa.

Page 28: Bab 2 Filosofi Rekabentuk Antaramuka

Penggunaan Warna dan Bunyi Dalam Sistem Komputer (samb)

Cara penggunaan berkomunikasi dengan bantuan bunyi semakin meningkat sekarang ini.

Ada beberapa idea tentang peranan bunyi yang boleh dipraktikkan. Di antaranya termasuklah: Bunyi sebagai pengukuhan. Bunyi menggambarkan keadaan maklumat ketika

itu. Bunyi sebagai alat bantu pelayaran.