IMK-Pertemuan 6

Menu, Form Fill-in,  Dialog box

• Menu cara untuk menyajikan petunjuk yang tersedia bagi pengguna.
• Form Fill-in adalah sistem interaktif untuk meminta data atau informasi dari pengguna.
• Dialog box merupakan respon dari sistem interaktif setelah pengguna memberikan instruksi yang membutuhkan parameter.

Single Menus

• Binary menus: Satu dari dua pilihan
• Multipel items menu, menampilkan banyak pilihan dengan menggunakan teknik-teknik seperti scrollbar, pulldown menus and pup up menus: dilihat dari cara permunculannya di layar.

Single menu: Binary Menus

• Mnemonic letters 

          Photo akan ditampilkan berdasarkan

             H = Hitam dan Putih

            W = Warna

                Pilih huruf pilihan Anda ?

• Radio button

• Button choices

Single menu: Multiple-item menus

• Multiple-item menus

           Drive A tidak terbaca ? 

           Abort, Retry, Ignore, Fail ?

• Multiple-selection menus or check boxes

Single Menu:

Pull down dan pop up

• Alphasliders

• Embedded links

• Iconic menus, toolbars, or palettes

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

• Pengelompokan semantik:

          - Kelompokkan item-item yang serupa secara logis.
          - Bentuk kelompok yang melingkupi semua kemungkinan.

          - Gunakan peristilahan yang dikenal.

Contoh Tree structured menus:

Acyclic dan Cyclic Menu Networks

Digunakan pada hypertext, seperti www dimana potensi untuk tersesat meningkat

Bergerak Pada Menu dengan Cepat

1. Menu dengan typeahead

• Tidak perlu menunggu menu selesai ditampilkan untuk memilih menu, dapat langsung mengetikkan serangkaian karakter dari menu utama.
• Pilihan-pilihan dapat digabungkan menjadi suatu perintah mnemonic
• Contoh : menu pada handphone

2. Nama menu untuk akses langsung

• Skema penamaan yg memungkinkan pemakai mengakses tujuan secara langsung
• Contoh : jump pada winamp, bookmark pada web browser

3. Menu Macros

    Merekam jalur menu yang sering digunakan sebagai perintah buatan sendiri.

Pedoman Perancangan Menu :

• Gunakan task semantic
• Lebih baik lebar dan dangkal daripada sempit dan dalam
• Tunjukkan posisi dengan gambar, angka, atau judul
• Gunakan pengelompokan item yang berarti
• Tampilkan item dengan singkat, mulai dengan keyword
• Gunakan tata bahasa, tata letak, dan peristilahan yang konsisten
• Sediakan typeahead dan shortcut lainnya

Data Entry - Form Fill-in

Pedoman mendesain form fill-in:

• judul yang bermakna
• instruksi yang mudah dipahami
• Pengelompokan logis dan sekuensing bidang
• Tata letak visual menarik dari bentuk
• Field-label yang familiar
• Konsisten menggunakan kata / singkatan
• Terlihat Ruang dan bounderies untuk bidang data-entry
• Gerakan kursor Nyaman
• Koreksi kesalahan untuk karakter individu dan seluruh bidang
• Pencegahan kesalahan di mana mungkin
• Pesan kesalahan untuk nilai-nilai yang tidak dapat diterima
• Penandaan bidang yang diperlukan
• Penjelasan pesan untuk bidang

Data Entry - Form Fill-in:

Dialog boxes

Dialog boxes (kotak dialog) adalah kombinasi teknik menu dan formulir isian yang banyak digunakan di GUI (graphical user interface)  modern.

Perlu diperhatikan:

1. Tata letak internal kotak dialog
2. 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.

Contoh kotak dialog :

Open dialog box pada Macromedia Flash MX

Baca Selengkapnya

IMK-Pertemuan 5

Direct Manipulation and Virtual Environments 

Direct Manipulation

Karakteristik manipulasi langsung adalah penyajian langsung aktifitas sistem pada pengguna ketika pengguna memberi ins`truksi langsung (semacam kenyataan maya (virtual reality) yang terpampang lewat tampilan dilayar) maka dikerjakan langsung oleh sistem komputer.

Virtual Environments

Sebuah teknik untuk menyembunyikan karakteristik fisik dari sumber daya komputer dari bagaimana cara sistem lain, aplikasi atau pengguna berinteraksi dengan sumber daya tersebut. 

Contoh dari Direct Manipulation

• SPREADSHEET : Lembar kerja yang menampilkan data yang dapat dimanipulasi dalam bentuk kolom dan baris yang mendukung makro atau baris.  Contohnya adalah  MS. Excell, Open Office Calc.
• VIDEO GAMES : Bidang aksi visual yang membangkitkan minat. Perintah berupa aksi fisik dan hasilnya langsung  terlihat . Contoh  : Playstation, Nitendo Wii, Xbox .
• COMPUTER – AIDED DESIGN : Digunakan untuk merancang mobil, rangkaian elektronik, arsitektur, pesawat terbang. Aplikasi ini menyenangkan karena dapat digunakan untuk objek yang ingin dimanipulasi secara langsung. Berhubungan : Computer-Aided Manufacturing (CAM).

3D Interfaces

Dalam interaksi pengguna 3D (3DUI) atau user interface 3D (3DUIs) manusia berinteraksi dengan komputer dengan aspek ruang tiga dimensi. Dengan akarnya dalam virtual reality, 3DUI kini secara luas dianggap untuk merujuk kepada banyak domain yang berbeda sepanjang kontinum virtuality atau istilah umum untuk interaksi dalam antarmuka berbasis realitas.

Tahapan Dasar Pada 3D

3D komputer grafis penciptaan jatuh menjadi tiga tahap dasar:

• 3D modeling : proses mengembangkan matematika representasi dari setiap tiga-dimensi benda (baik benda mati atau hidup) melalui perangkat lunak khusus. Contoh :

• Layout dan animasi : Layout meliputi: sudut penataan kamera, lighting, dan shading. Animasi digambar dengan pensil berwarna di banyak kertas. Perlu diperhatikan juga detail gerakan, penyesuaian waktu, dan penyesuaian gerakan mimik muka dan mulut.
• Rendering 3D : proses untuk membentuk sebuah gambar dari sebuah model yang dibentuk oleh perangkat lunak animasi, model tersebut berisi data geometri, titik pandang, tekstur dan cahaya yang diperlukan untuk membuat gambar yang utuh. Contoh:

Virtual and Augmented Reality

Virtual Reality

Virtual reality (VR) atau realitas maya adalah teknologi yang membuat pengguna dapat berinteraksi dengan suatu lingkungan yang disimulasikan oleh komputer (computer-simulated environment), suatu lingkungan sebenarnya yang ditiru atau benar-benar suatu lingkungan yang hanya ada dalam imaginasi. Contoh :

Augmented Reality

Augmented adalah teknologi yang menggabungkan benda maya dua dimensi dan ataupun tiga dimensi ke dalam sebuah lingkungan nyata tiga dimensi lalu memproyeksikan benda-benda maya tersebut dalam waktu nyata. Tidak seperti realitas maya yang sepenuhnya menggantikan kenyataan, namun Augmented Reality hanya menambahkan atau melengkapi kenyataan. Contoh :

Baca Selengkapnya