Menu, Form Fill-in and Dialog Box

Pada bab ini ada beberapa topik-topik yang akan kita bahas yaitu :

• Introduction
• Task Related Menu Organization
• Single Menus
• Combinations of Multiple Menus
• Content Organization
• Fast Movement through Menus
• Data Entry with Menus: Form Fill-in. Dialog Boxes and Alternatives

———————————————————————————————-
Introduction
Menu adalah suatu jalan untuk memberi tahu instruksi-instruksi yang tersedia kepada user.
Form fill-in adalah suatu bentuk dari sistem interaktif untuk meminta data atau informasi dari user.
Dialog Box adalah respon dari sistem interaktif ketika user memberi instruksi yang membutuhkan parameter

Task Related Menu Organization
Tujuan utama adanya Menu, Form Fill-in dan Dialog-box itu adalah untuk menciptakan suatu sistem organisasi yang sensibel, komprehensif, gampang diingat dan cocok untuk task users
Ada beberapa jenis menu yaitu:

• Single Menus
• Linear Sequence Menus
• Tree Structure Menus
• Cyclic and Acyclic Network Menus

——————
———————————————
Single Menus
Ada beberapa macam tipe Single Menus yaitu:
Binary Menus –> Menus dimana terdapat dua pilihan seperti yes,no. Male,Female. Variannya adalah Mnemonic Letters, Radio Buttons dan Button Choice

 

Multiple-item Menus –> Contohnya adalah Multiple-Selection Menus / Check Boxes

Pull-down, pop-up dan toolbar    
Pull down menus biasanya ada di bagian atas aplikasi yaitu di menu bar. Biasanya pilihan action disupport oleh keyboard shortcut untuk efiesiensi.

Pop-up Menus muncul ke display sebagai respon dari klik-kan atau check-an dari pointing device

Toolbars, iconic menus dan palletes menawarkan berbagai actions untuk objek yang ada.

Menus for Long Lists
Beberapa menu untuk list yang panjang:

• Scrolling Menus
• Combo Boxes
• Fisheye Menus
• Sliders
• Two Dimensional Menu

Scrolling Menus

Combo Boxes

Fish Eye Menu

Sliders











Two Dimensional Menu


Embedded Menus –> Alternatif dari berbagai Single Menus yang sudah ada. Menu ini menjadikan users yang membaca tentang orang,event atau tempat untuk mencari tahu informasi sesuai dengan konteks yang dipilih.

———————————————————————————————————
Combinations of Multiple Menus
Ada beberapa tipe Multiple Menus:

• Linear Sequence Menus –> Guide user untuk melalui Desicion-making process yang kompleks. Efektif bagi pengguna awam untuk melakukan task yang simpel
• Simultaneous Menus –> menampilkan beberapa menu yang aktif dalam waktu yang bersamaan dan user dapat menentukan pilihan sesuai keinginannya tanpa harus berurutan.
• Tree-structured Menus. Dibagi-bagi atas beberapa kategori seperti file,edit,view. Memiliki Menus yang expanding. Contohnya adalah Windows Explorer.

• Menu Maps –> membantu user untuk tetap pada tujuan dan mencegah user agar tidak kehilangan arah
• Acyclic and Cylic Networks –> Social Relationships, Transportation routing, Scientific-Journal Citations. Bisa menyebabkan kebingungan dan kehilangan arah. Cyclic -> bisa kembali ke level atas (upper level). Acyclic -> satu seleksi bisa dicapai dari berbagai path ( jalur)

——————————————————————————————
Content Organization
Menjelaskan tentang bagaimana konten itu disusun dan diorganisir untuk ditampilkan
Ada beberapa hal yang harus diperhatikan:
Task-Related Grouping in Tree Organization

• Group-group dibuat berdasarkan item-item yang mirip
• Membuat grup yang meliputi semua possibility / kemungkinan
• Harus dipastikan bahwa item-item yang ada tidak saling timpa tindih / overlapping
• Gunakan istilah yang familiar, tapi pastikan satu item dengan item yang lain berbeda

Item Presentation Sequence

• Biasanya urutan dalam penyusunan item adalah sebagai berikut: Waktu, Susunan berdasarkan numeric, Physical Properties
• Berbagai basis penyusunan : Urutan item secara alphabetik, Grouping item-item yang saling berkaitan, Item yang paling sering digunakan (Most Frequently Used), Item yang paling penting terlebih dahulu (Most Important)

Beberapa contoh guidelines untuk membuat menu selection:

• Jangan sembarangan mengrup Item
• Jangan sembarangan mengurutkan Item
• Pakailah grammar, layout dan istilah yang konsisten
• Perbolehkan berbagai shortcut yang ada
• Perbolehkan untuk langsung ke menu awal atau menu sebelumnya
• Pertimbangkan Online Help, Display Rate, Screen Size dan hal-hal kecil lainnya.

Menu Layout

• Judul dari Single Menu haruslah singkat namun deskriptif
• Haruslah konsisten dalam merangkai kata-kata
• Judul dari Tree-Structured Menus harus sama dengan judul dari menu diatasnya atau menu dibawahnya. contohnya jika menu berjudul Finance, jik diklik dan ke next screen, maka harus mempunyai frase yang sama dengan judul tersebut.
• Gunakanlah istilah yang familiar dan konsisten
• Item haruslah saling berbeda
• Keyword ditempatkan di bagian kiri

Kendala dalam merancang Graphic Layout

• Screen width dan length
• Display Rate
• Character Set
• Highlighting Techiniques

Namun selain yang diatas, konsistensi harus dijaga setidaknya untuk komponen berikut ini:

• Judul
• Penempatan Item
• Instructions
• Error Messages
• Status Reports

————————————————————————————————-
Fast Movement Through Menus
Fast Movement dalam Menus bisa dicapai dengan menggunakan keyboard shorcuts.
Keyboard shortcuts biasanya dipakai untuk expert. Namun dengan adanya shortcut ini, untuk menerjemahkan arti dari shortcut ke bahasa asing terkadang sulit. Contoh : undo , bahasa indonesia : kembali(?).
Contoh bentuk lain dari shortcuts misalnya Bookmars yang ada di browsers atau user-configured toolbars.
————————————————————————————————
Data Entry with Menus: Form Fill-in, Dialog Boxes and Alternatives
Form Fill-in
Dipakai ketika banyak data yang harus diisi. Display nya memiliki kesamaan dengan form dalam bentuk kertas.
Dalam memakai form fill-in, user harus familiar dengan keyboards, penggunaan tab/mouse untuk memindahkan kursor, metode dalam mendeteksi dan mencegah error, penggunaan enter key dan return key
Dalam mendesign Form fill-in, ada beberapa guideline yang harus diikuti:

• Judul harus bermakna / berarti
• Instructions harus komprehensif
• Fields harus dikelompokkan secara logical dan berurutan
• Visual harus dijaga dan menarik
• Fields yang ada harus familiar
• Istilah dan singkatan harus konsisten
• Ada ruang dan batas yang cukup untuk mengisi data
• Error Prevention
• Mark field yang harus diisi
• Explantory Message untuk tiap field
• Signal / Kode jika User sudah mengisi secara lengkap

Contoh Form fill-in:

Dialog Boxes
Merupakan kombinasi dari Form Fill-in dan Menu
Beberapa guideline dalam merancang internal layout:

• Judul harus berarti dan style yang digunakan harus konsisten
• Pengurutan dari kiri atas ke kanan bawah
• Clustering dan emphasis
• Layout harus konsisten (Margins, Grid, Lines, Boxes)
• Instilah, Fonts, Huruf besar (kapitalisasi), Justifikasi haruslah konsisten
• Standard buttons (Ok,Cancel)
• Error Prevention menggunakan direct manipulation

Guideline untuk external relationship:

• Appearance dan disapperance harus smooth
• Bisa dibedakan namun tidak terlalu jauh perbedaannya
• Size harus cukup kecil untuk mengurangi saling timpah tindih
• Display nya harus mirip dengan item yang bersangkutan
• Item yang perlu tidak saling timpah tindih
• Gampang untuk dihilangkan / dimatikan
• Jelas bagaimana cara melengkapinya / men-cancel

Contoh Dialog Boxes:

Berbagai alternatif lain yang ada:

• Pie Menus
• Control Menus
• Marking Menus
• Flow Menus
• Toolglass

Contoh Pie Menus