sharinggan

sharinggan Pictures, Images and Photos

01 Agustus, 2010

Knowledge User

User Physchology Characteristic:

Cognitive Style
• Verbal/analytic
• Spatial/Intuitive
Attitude
• Positive
• Neutral
• Negative
Motivation
• High
• Moderate
• Low

Dari uraian di atas kita dapat mengetahui tujuan akhir dari desain aplikasi adalah easy learning agar mudah digunakan oleh user.

User Knowledge and Experience
• Data dan informasi yang terdapat pada aplikasi sangat sederhana, karena disesuaikan dengan pengetahuan dan pengalaman user.
• Seperti aplikasi telepon genggam pada umumnya aplikasi ini tidak memerlukan typing skill yang baik, karena disesuaikan dengan keypad telepon genggam.

User Job and Task Characteristic
• Frequency of use – Low
• Task Importance – Low
• System Use

sumber :

http://nikoseptianto.blogspot.com/2010/02/interaksi-manusia-dan-komputer.html/

WHAT YOU SEE IS WHAT YOU GET

WHAT YOU SEE IS WHAT YOU GET

WYSIWG (diucapkan / wɪziwɪɡ /) adalah singkatan dari What You See Is What You Get (Arti : Apa Yang Anda Lihat Adalah Apa Yang Anda Dapatkan). Istilah ini digunakan dalam perkomputasian untuk menggambarkan suatu sistem dimana konten yang sedang disunting akan terlihat sama persis dengan hasil keluaran akhir, yang mungkin berupa dokumen yang dicetak, halaman web, slide presentasi, atau bahkan pencahayaan untuk acara teater.

Ungkapan ini awalnya hanya tangkapan dari sebuah frase yang dipopulerkan oleh Flip Wilson ‘s drag persona “Geraldine” dari Rowan & Martin’s Laugh-In pada akhir 60-an dan kemudian pada The Flip Wilson Show sampai 1974), yang sering mengatakan “What you see is what you get” untuk alasan perilakunya yang unik. Ungkapan ini terbukti cukup populer untuk menjadi judul sebuah hit single oleh The drama pada tahun 1971.


• Contoh : apa yang tercetak di printer merupakan informasi yang terkumpul dari data-data yang terlihat di layar monitor pada saat mencari data.


• Hal ini juga perlu menjadi perhatian software engineer pada saat membangun antarmuka.


• Informasi yang dicari/diinginkan harus sesuai dengan usaha dari user pada saat mencari data dan juga harus sesuai dengan data yang ada pada aplikasi sistem (software).


• Jika sistem mempunyai informasi yang lebih dari yang diinginkan user, hendaknya dibuat pilihan (optional) sesuai dengan keinginan user. Bisa jadi yang berlebihan itu justru tidak diinginkan user.


• Yang mendasar disini adalah harus sesuai dengan kemauan dan pilihan dari user.


Sumber : http://cezicez.wordpress.com/

Sistem Menu Group dalam windows

Sistem Menu Group dalam windows

Organisasi Semantik Menu

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-8E42LFF8RwBQ3kW3h_4pY6LjEIaQDMK6AwTKnnkHVPWDNnPSmE_zIGdusrop4zJRfUkCEqXFp1Q5ho1BhWRKrLzBQThcbE_u3BMBBph4_sKAALCwDy7lET1NIFb5PTLINOIuZSZkSrdl/s1600/1.JPG

• Binary menus

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEpHvIDEcV5ZZLOZMKUHT0Dje95AViJyxAbWDjceqodeQLCeXr5F7_1KJcuxvLIUJuH3zepkxl7Q0ihr3oxw-6sVKlaizG6FZ8J8eHnOl5rgsrsQLq5d3feQojKXzIOnJVdjgFJzjqB_TX/s1600/2.JPG

• Multiple selection menus

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtjLzQlcOdLP8o-vl6zuh6O8-Tvdgb926S5NQ6K8II6jZCaZNL0dChQYJpDY7xd72EWhO0wzEx63-LkUr1E60gVPNf-ohoJvkldG13_wKFykiK4W2X4WOtMPcl-0oLiGFzMCOSNEPvoVgR/s1600/3.JPG


• Multiple-item menus / radio buttons


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKVakMjK5v-dzhhX32rnB3kUmsXNWtXd17pEGFonGC2AvQ0KVoe2zdjWawhJ7Cvk83GR1it28ejM1U5RPVApOCNAav7BLBk8mPyvWMrh_KOOIR-ike1oD1eA0x1ZBDtiftZF9phN5EaUyi/s1600/4.JPG

• Pull-down and pop-up menus


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpP85paFcO9UwP6ncI5iqgm4Nihed_GMxUx2y5o_nwc84vZW-MxaWlbbKzputEzPyc_iigstDureXhyphenhyphen1R9QwDwNRILvaILvffaXZnqyi6m5NUOvRwByvBhq9K6j-gc-skDExG8ZwTraUeE/s1600/5.JPG

• Scrolling and two-dimensional menus

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfmwE6jh6_icNF0WhNwjArLg84eNdRUSfitCW3VUvxpR8TY9teYNLRiPMoC_DpvQqZR0oJ4Zu2Uqy6izWwHMBAAWk068I6-5LGgMx2qZN4HoE85325aiChruRoh_adgS7HC_pukNKbTJBB/s1600/6.JPG

• Alphasliders


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAcSi0kZvSCF_50e1DrMq14Usgg4ppfOFQyIfcNK8MwfzMUG0YscORQpFbPGd0KU8e9mmjwbMTZRQRZv-TnJJXMkVLmnZpe3sKQDUTzsG-24403AXUvTJ5aHYp4MWQLFQR1h2cHiUs3kV/s1600/7.JPG

• Embedded links

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhI7zo-KqDAQrFKxpd7NyvZIWpQl4wsx6ZEzBhfugJATUvE8pyoeXqLP5FWBnImZ2z8rnAPYBTejRivj7RYwB1dJzRCvgsKuSjDLJKQTojw2apWC3iCFS0Aldqplxdt5N0sBF6lGWfCXggv/s1600/8.JPG

• Iconic menus, toolbars, or palettes

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjla8DdNCRMo44HPpTqyRc3WcIROdcHPCN-usQp66m74Ne9pzP7dkkVVySEoBLJ4k-IbQU2uEffTdEmY_RcD1Y8OvWLvV943y8PB2QvDvTmuTWdL-ZaqmfnqqlfS7LhMY5QYIRWuOUNQ8vW/s1600/9.JPG

Linear Sequences & Multiple Menus

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyzrvne4qDSvISyQbVjmPyKO4-KJn-V4xRKLyf_yOLWzI8ZI_zNk0DZgrn1-nTRMOH9dXRXS7hZVfBO_mroXiN5LpN7KWo6MgtwtiniMAgNUdC_XhkxtX-umTwgPC9YqkvvMjKvWL608I-/s1600/10.JPG

Tree-Structured Menus
• Ketika kumpulan item berkembang dan menjadi sulit dipelihara dalam kendali intelektual, perancang dapat membentuk kategori item-item yang serupa, membentuk struktur tree.

• Contoh pengelompokan:
– Laki-laki, perempuan
– Hewan, sayuran, mineral
– Fonts, size, style, spacing

• Depth versus Breadth:
– Depth: jumlah level.
– Breadth: jumlah item per level.

• Pengelompokan semantik:
– Kelompokkan item-item yang serupa secara logis.
– Bentuk kelompok yang melingkupi semua kemungkinan.
– Pastikan item tidak overlap.
– Gunakan peristilahan yang dikenal.

Acyclic & Cyclic Menu Networks

• Kadang-kadang lebih cocok daripada struktur tree.
• Memungkinkan jalur dari bagian tree yang berbeda, tidak mengharuskan pemakai memulai dari menu utama.
• Secara alami terdapat pada:

– Hubungan sosial.
– Jalur transportasi.
– Kutipan dalam jurnal ilmiah.

• Membutuhkan penelusuran balik.
• Kadang-kadang lebih cocok daripada struktur tree.
• Ketika item-item menu telah dipilih, urutan presentasinya perlu diperhatikan.
• Beberapa dasar pengurutan:

– Waktu (kronologis).
– Numeris (menaik atau menurun).
– Sifat fisik (panjang, luas, volume dsb. Secara menaik atau menurun).

• Banyak kasus pengurutan tidak mempunyai aturan pengurutan yang berhubungan dengan tugas, sehingga perlu dipertimbangkan:
– Pengurutan alfabetis istilah-istilah.
– Pengelompokan item-item serupa (dibatasi dengan pemisah antarkelompok).
– Yang sering digunakan ditempatkan di awal.
– Yang paling penting ditempatkan di awal.

Pergerakan Cepat pada Menu

• Menu dengan typeahead
• Nama menu atau bookmarks
• Menu macros

Menu dengan Typeahead

• Penting jika menu sudah sering digunakan sementara waktu respons atau kecepatan tampil lambat.
• Pendekatan BLT (Bacon, Lettuce, Tomato Sandwich): pembentukan mnemonik dari penggabungan huruf-huruf pilihan menu.

Nama Menu atau Bookmarks

• Penamaan sederhana memudahkan pemakai mengakses menu secara langsung.
• Web browser menyediakan bookmarks atau favorites sebagai jalan pintas bagi pemakai untuk menuju situs yang pernah dikunjungi.

Menu Macros

• Perintah yang sering digunakan dapat direkam dan disimpan sebagai makro.
• Pada beberapa software, makro dapat ditempatkan di toolbar sebagai ikon.

Tata Letak Menu

• Judul
• Penamaan pilihan menu
• Tata letak dan desain grafis

Tata Letak Menu: Judul

• Menu tunggal: Judul yang deskriptif.
• Menu tree: Nama pilihan harus sama dengan judul halaman yang dipanggil.

Tata Letak Menu: Penamaan Pilihan Menu

• Gunakan peristilahan yang dikenal dan konsisten.
• Pastikan item dapat dibedakan dari pilihan lain.
• Gunakan pemilihan kata yang konsisten dan singkat.
• Tempatkan kata kunci di kiri.

Tata Letak Menu: Tata Letak dan Desain Grafis

• Perhatikan kendala seperti lebar dan tinggi layar, kecepatan tampil, character set, dan highlighting.
• Buat pedoman/panduan untuk komponen-komponen: judul, penempatan item, petunjuk, pesan kesalahan, dan laporan status.
Formulir Isian
• Formulir isian cocok dipakai jika banyak field data dibutuhkan.
• Pendekatan formulir isian menarik karena:

– Kelengkapan penuh informasi terlihat.
– Seperti formulir kertas.
– Sedikit petunjuk diperlukan.

Beberapa Variasi Isian Field

• Combo box: kombinasi list box dan text box.
• Coded fields: mempunyai mask untuk format isian khusus. Mis.:
– Telepon – (___)___-_____
– Social Security Number – ___-__-____
– Waktu – __:__ __
– Tanggal – __/__/____
– Nilai uang – $_____.00

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdjqnfWiIsmtMrjbCPVjYbEXRXWd0zqeq5p43j5bGrCfC2H7roFwnchgJbse0IJNsBJqBUia5wLxMqcSYJyHrVWMpXNC93QPxixuFsk22aRajx61Udqws19ukPvIwHcQVinNfyT0lUX6ra/s1600/11.JPG

Kotak Dialog

• Kotak dialog adalah kombinasi teknik menu dan formulir isian yang banyak digunakan di GUI modern.
• Perlu diperhatikan:

– Tata letak internal kotak dialog
– Hubungan eksternal kotak dialog

Pedoman Tata Letak Internal Kotak Dialog

• Judul berarti, gaya konsisten.
• Pengurutan dari atas kiri ke bawah kanan.
• Pengelompokan dan penegasan.
• Tata letak yang konsisten.
• Peristilahan, font, penggunaan huruf besar, justifikasi yang konsisten.
• Tombol standar (OK, Cancel).
• Pencegahan kesalahan.

Pedoman Hubungan Eksternal Kotak Dialog

• Penampilan dan penutupan halus.
• Dapat dibedakan tapi batasnya kecil.
• Ukuran cukup kecil (minimalkan overlap).
• Dekat dengan item yang sesuai.
• Tidak menghalangi item yang harus dilihat.
• Mudah ditutup (dibuat menghilang).
• Jelnis penyelesaian/pembatalannya.

Contoh kotak dialog :

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRd8JwZITAHDoTu4Rf0_GJIWtH9e9ra_fglD1kjFBV0YZla0VwfFJ8dFYbpUtQpKuR9ajYkumqNwDxXGjO69ae1mhb0p1IScG_bQZHxVuIOXbeXDhKMrfOYQZjmL6_xWxyJOLuNsIgmAap/s1600/12.JPG

sumber :

http://journal.mercubuana.ac.id/data/LecNote%20Paradigma_Prinsip%20dan%20Proses%20Desain.pdf /

Visit the Site
MARVEL and SPIDER-MAN: TM & 2007 Marvel Characters, Inc. Motion Picture © 2007 Columbia Pictures Industries, Inc. All Rights Reserved. 2007 Sony Pictures Digital Inc. All rights reserved. blogger templates