Interaksi Manusia dan Komputer Antarmuka Berbasis Menu.

Slides:



Advertisements
Presentasi serupa
Komponen Antarmuka Grafis
Advertisements

Komponen Antarmuka Grafis. Indrawani S/SPK/ GRAFIS • Grafis menjadikan presentasi informasi lebih jelas dalam mengungkapkan arti dari data dan dapat.
RAGAM DIALOG.
MENGETIK DOKUMEN SEDERHANA
DASAR-DASAR MICROSOFT WORD
PERANCANGAN ANTARMUKA - 2
Sistem Menu.
Mata Pelajaran TIK Kelas X Semester 2
SORTIR dan TABEL. MEMBUAT/ MENYISIPKAN TABEL Ada beberapa cara membuat/ menyisipkan tabel dalam Word for Windows : Pulldown menu Table, klik Insert Table.
Perancangan Tampilan.
Dialog berbasis text dan pengisian borang
Ragam Dialog Interaksi
Komponen Antarmuka Grafis
Pertemuan 3 RAGAM DIALOG.
Rama Lesmana Pendidikan Matematika
Pemilihan Menu dan Pengisian Formulir
PEMBUATAN TABEL DENGAN STAROFFICE DISUSUN OLEH : M.S. HERAWATI, Skom
MEMAHAMI RAGAM DIALOG.
Komponen Antarmuka Grafis
Menu dan Formulir.
1. Elemen pada Microsoft Excel
Usability: Disain Web yang Brilian
Menggunakan Menu dan kotak Dialog
Pertemuan 3 Menu dan Formulir
Pertemuan 3 RAGAM DIALOG.
Pertemuan <<3>> MENU, FORMULIR, DAN KOTAK DIALOG
BAB 5 MENGGUNAKAN PERANGKAT LUNAK PENGOLAH KATA
komponen antarmuka pengguna
Cara Membuat Daftar Isi Otomatis pada Microsoft Word
Perancangan Sistem L. Erawan.
MICROSOFT OFFICE EXCEL
Menu, Form, dan Kotak Dialog
ANTARMUKA BERBASIS MENU
Ragam Dialog|pertemuan VI
Ragam Dialog|.
Menu, Formulir, dan Kotak Dialog
Menu, Form, dan Kotak Dialog
Interaksi Manusia & Komputer Ragam Dialog
Interface Metaphors dan Model Konseptual
Assalamu’alaikum ^^.
B. Membuat Dokumen Baru.
SORTIR dan TABEL.
MICROSOFT OFFICE EXCEL
Pertemuan 3 RAGAM DIALOG.
SORTIR dan TABEL.
PERANCANGAN ANTARMUKA/TAMPILAN
APLIKASI KOMPUTER Microsoft Word 2007 I.
Menu, Form, dan Kotak Dialog
Microsoft Power Point.
(MEMBUAT DOKUMEN DENGAN PENGOLAHAN KATA)
MICROSOFT OFFICE EXCEL
Microsoft Word 2007.
Membuat Dokumen dengan Software Pengolah Angka
DIALOG.
KEBERGUNAAN Anna Dara Andriana., M.Kom
Interaksi Manusia - Komputer Rani Susanto, M. Kom
Menu, Formulir, dan Kotak Dialog
Pertemuan 3 RAGAM DIALOG.
SORTIR dan TABEL.
RAGAM DIALOG.
Pertemuan 3 RAGAM DIALOG.
Menu, Formulir, dan Kotak Dialog
SEMESTER PENDEK INTERAKSI MANUSIA & KOMPUTER
PERANGKAT LUNAK PENGOLAH KATA (microsoft word)
Menu, Formulir, dan Kotak Dialog
Membuat Tabel di Microsoft Word
STIE YPP MUJAHIDIN TOLITOLI
Ragam Dialog|pertemuan VI
Menu, Form, dan Kotak Dialog
INTERAKSI MANUSIA & KOMPUTER HUMAN COMPUTER INTERACTION.
Transcript presentasi:

Interaksi Manusia dan Komputer Antarmuka Berbasis Menu

PENGANTAR Ketika perancang tidak dapat menciptakan strategi manipulasi langsung yang sesuai, menu dan borang isian merupakan alternatif yang menarik. Antarmuka berbasis menu banyak dijumpai pada sistem lama dan pada sistem yang lebih modern biasanya diimplementasikan dengan menggunakan pull down menu, checkbox atau radiobutton didalam kotak dialog, atau link pada halaman web. Jika pilihan yang tersedia disusun dengan urutan dan struktur yang bagus, pengguna dapat menentukan pilihan yang tersedia dengan mudah dan cepat.

ORGANISASI MENU BERBASIS TUGAS Norman dan Chin (1989) menyebutkan bahwa jumlah pilihan pada program aplikasi terkadang cukup banyak. Semakin banyak jumlah menu yang ada maka tingkat kompleksitasnya pun semakin tinggi. Aplikasi yang paling sederhana terdiri atas sebuah menu tunggal. Menu tunggal pun mempunyai variasi yang cukup banyak. Kelompok kedua adalah sistem menu yang menggunakan urutan linear untuk menampilkan pilihan yang tersedia. Struktur pohon merupakan struktur menu yang paling banyak dijumpai.

MENU TUNGGAL Menu tunggal memungkinkan pengguna untuk memilih salah satu dari dua pilihan, atau sejumlah pilihan yang tersedia. Menu tunggal dapat berupa pop-up pada daerah kerja yang aktif atau tersedia secara permanen.

Variasi lain dari menu tunggal adalah menu banyak pilihan yang memungkinkan pengguna untuk memilih lebih dari satu pilihan. Menu jenis ini diimplementasikan menggunakan komponen interaksi yang berupa kotak cek.

MENU DATAR DAN SELEKTOR PILIHAN Pada tahun 1995, kebanyakan sistem menu masih menuliskan pilihan – pilihan yang tersedia dengan menggunakan keseluruhan layar. Daftar menu yang ada biasanya ditulis dengan kalimat – kalimat yang cukup panjang. Ragam menu seperti ini disebut menu daftar.

Penentuan pilihan pada menu datar dapat dikerjakan dengan dua cara, cara pertama adalah dengan menggunakan selektor dari setiap pilihan yang tersedia. Cara kedua adalah dengan menggerakkan penyorot ke suatu pilihan dan kemudian dikonfirmasikan dengan menekan tombol enter. Untuk memudahkan pengguna dalam melakukan pilihannya, pada setiap pilihan sering disertakan suatu selektor yang dapat berupa angka, huruf, atau campuran angka dengan huruf.

Jika banyaknya pilihan sama dengan atau kurang dari 10 buah, kita dapat menggunakan selektor yang berupa angka. Tetapi jika pilihan lebih dari 10, penggunaan selektor angka kurang cocok karena pengguna harus menekan dua buah tombol untuk memilih pilihan dengan nomor selektor 10 atau lebih.

Contoh pemakaian selektor

Selektor tak kompatible memiliki kelebihan dan kekurangan yang berkebalikan dengan selektor kompatible. Ada satu kelemahan yang sangat mendasar dari penggunaan selektor tak kompatible, yaitu pengguna harus menghafal kembali urutanya apabila susunan atau urutan pilihanya diacak. Hal inilah yang menghambat proses pencarian pilihan pada menu tak kompatible.

Menu tarik (pull down menu) Adalah menu yang mempunyai banyak pilihan tetapi karena keterbatasan ruang pilihan – pilihan yang ada hanya terlihat pada saat menu utamanya di klik biasanya diletakkan di bagian atas jendela. Jenis menu ini pertama kali dikenalkan oleh Xerox star, Apple Lisa, dan Apple Machintosh.

Pada daftar pilihan yang tersaji secara vertikal seringkali terdapat: 1. Tombol kunci-cepat, misalnya kombinasi Mac+K (pada Macintosh) atau Ctrl-K (padaWindows). Digunakan untuk mempercepat pemilihan menu. 2. Symbol tiga titik (…) merupakan pertanda bahwa jika diklik akan memunculkan dialog baru. Sedangkan yang tidak ada titik biasanya adalah menu yang berisikan sebuah perintah langsung. 3. Symbol panah (>) menunjukkan bahwa menu pilihan itu masih mempunyai subpilihan yang lain.

MENU BERBASIS ICON DAN TOOLBAR Jika semua menu ditampilkan selain membingungkan pengguna hal itu juga mengurangi ruang kerja pengguna. Dengan demikian pada kedua jenis menu diatas perancang harus menyediakan fasilitas untuk memuncul hilangkan pilihan – pilihan tertentu sesuai keinginan pengguna.

MENU DENGAN PILIHAN PANJANG Ada beberapa cara untuk menampilkan menu panjang yaitu: 1.Menu gulung (Scroll Menu)

2. Kotak Kombo (Combo Box) 3.Menu mata ikan (Fish Eye Menu)

4. Penggeser 5. Menu 2 dimensi

MENU DAN HOTLINK TERTANAM Dalam keadaan tertentu, pilihan yang ada sering ditanam (embedded) pada suatu teks atau foto/citra. Hal ini disebabkan karena tidak ada lokasi khusus yang dapat digunakan untuk menempatkan pilihan yang tersedia. Contohnya dalam sebuah foto udara yang diambil dari Google earth. Pilihan yang tersedia disimbolkan dengan balon kecil berwarna biru dan keterangan tempat, misalnya KPTU Teknik UGM. Dengan mengklik balon kecil berwarna biru tersebut, beberapa informasi penting akan muncul.

Sambungan tertanam (embedded link) diperkenalkan oleh sistem Hyperties yang digunakan pada dua proyek hiperlink komersial (Shiderman 1988; Shneiderman dan Kearsley, 1989), dan menjadi inspirasi untuk hotlink pada situs Web. Sambungan tertanam memungkinkan pengguna untuk melihat pilihan sesuai konteksnya dan menghindari adanya pilihan lain yang mengganggu dan menghabiskan kapling pada layar tampilan.

MENU BREADCRUMB Otter and Johnson (2000), menyebut sebuah fenomena dengan istilah disorientasi atau tersesat di dunia maya, ketika pengguna berselancar di dunia maya dengan cara mengunjungi situs web dan akan merasa tersesat dan tidak tahu apa yang harus ia lakukan. Untuk membantu pengguna mengetahui posisinya saat itu, menu breadcrumb sering digunakan.

contoh menu breadcrumb Lebih lanjut Nielsen mengatakan bahwa sejak tahun 1995 dia merekomendasikan menu breadcrumb karena beberapa alasan yaitu: 1. Menu breadcrumb menunjukkan kepada penggunaan situs lokasi itu sehingga membantu mereka memahami posisi mereka terhadap bagian siitus yang lain.

2. Menu breadcrumb memungkinkan "satu klik akses ke tingkat situs yang lebih tinggi" sehingga dapat membantu pengguna yang terlanjur masuk terlalu dalam ke dalam struktur menu menunju ke bagian yang tidak dikehendaki. 3. Menu breadcrumb tidak pernah menimbulkan persoalan dalam pengujian (oleh) pengguna; seseorang dapat saja tersilap dengan tidak melihat elemen perancangan yang kecil ini, tetapi mereka tidak pernah menyalahkan-artikan jejak breadcrumb atau mengalami kesulitan dalam mengoperasikannya. 4. Menu breadcrumb hanya memerlukan tempat yang sempit.

KOMBINASI BANYAK MENU Sejumlah menu yang saling terkait satu sama lain dapat digunakan untuk menuntun pengguna menggunakan sejumlah pilihan. Pengguna melihat hal ini sebagai sejumlah menu yang berurutan secara linear.

Contohnya, pemesanan tiket yang dapat dilakukan secara online. Pada saat pertama kali seseorang memesan tiket, ia terlebih dulu harus memilih apakah tiketnya untuk sekali jalan atau pergi- pulang, dilanjutkan dengan memilih tanggal penerbangan, banyaknya tiket yang akan dibeli (termasuk apakah ada bayi atau anak-anak). Setelah calon pembeli tiket akan diminta untuk mengisi identitas dan beberapa informasi yang relevan dengan calon penumpang, cara pembayaran, sampai kepada percetakan tiket elektroniknya.

Pada menu serempak, pengguna akan dihadapkan pada antarmuka yang memuat berbagai pilihan dan pengguna dapat memilih sembarang menu yang ada secara bebas

MENU BERSTRUKTUR POHON Struktur pohon merupakan sejumlah pilihan dapat dengan mudah dikelompokan menjadi sejumlah kategori terpisah dengan pembeda yang unik. Pengelompokan dan pengindeksan merupakan pekerjaan yang rumit, dan dalam berbagai situasi tidak ada satu penyelesaian tunggal yang dapat diterima oleh semua orang.

Penelusuran menu dapat dikerjakan dalam beberapa detik jika pengelompokan setiap tingkat dibuat secara alamiah dan mudah dimengerti oleh pengguna, dan jika pengguna mengetahui targetnya. Sebaliknya, jika pengelompokannya tidak jelas dan pengguna hanya mempunyai gambaran yang samar tentang apa yang akan dicari, mereka dapat tersesat di dalam pohon menu yang ada (Norman dan Chin, 1988). Keuntungan struktur pohon adalah mampu menampilkan informasi dalam jumlah besar kepada pengguna mula atau yang tidak aktif.

Contoh menu struktur pohon

PETA SITUS Pengguna akan semakin sulit untuk menentukan posisinya ketika kedalaman menu bertambah sehingga mengalami apa yang disebut disorentasi atau tersesat di dunia maya (Conklin, 1986). Pada dasarnya, menurut Conklin, seorang pengguna disebut mengalami disorientasi atau tersesat apabila dia: 1. tidak mengetahui posisinya (di dalam situs Web), 2. tidak mengetahui apakah ada titik tuju yang diinginkan, dan 3. tidak mengetahui cara menuju titik tuju yang diinginkan.

Untuk mengatasi persoalan tersebut, perancang menambahkan peta situs (sitemap) yang berisi semacam ringkasan isi situs Web.

JARING MENU BERPUTAR DAN TIDAK BERPUTAR Jaring menu berfungsi untuk memberikan keleluasan pengguna sehingga bergerak ke menu selanjutnya tanpa harus balik ke menu awal.

Ketika pengguna bergerak dari pohon ke jaring menu tak berputar dan jaring menu berputar, kemungkinan untuk tersesat menjadi semakin besar. Kebingungan dan disorientasi sering dilaporkan oleh pengguna situs Web yang mengalami kesulitan ketika melakukan navigasi pada jaring berputar berskala besar (Shneiderman dan Plaisant, 2005).

Pada struktur pohon terdapat sebuah menu yang berfungsi sebagai menu utama, sehingga penelurusan balik lebih mudah dilakukan. Dalam struktur jaring, untuk dapat melakukan penelusuran balik, tumpukan dari menu yang sudah dikunjungi harus dibuat. Pada Suatu aplikasi seringkali terjadi salahguna dalam menggunakan jenis menu pada suatu sistem dan tidak memberikan keleluasan kepada pelanggan dalam melakukan aktifitasnya.

CARA MENGORGANISIR PILIHAN Beberapa hal yang perlu diperhatikan dalam pengorganisasian pilihan antara lain penge­lompokan dan pengurutan pilihan yang tersedia. Selain itu, pemilihan judul atau label menu dan tata letak yang sesuai akan banyak membantu pengguna untuk menggunakan aplikasi tersebut.

PENGELOMPOKAN BERBASIS TUGAS PADA STRUKTUR POHON Persoalan dalam pengelompokan pilihan timbul karena adanya kategori yang tumpang tindih, penggunaan jargon yang sukar, istilah yang sangat umum, maupun kemungkinan adanya pilihan tam­bahan yang tidak jelas.

Berdasarkan berbagai persoalan di atas, di bawah ini disajikan salah satu cara pemecahannya: 1. Satukan pilihan-pilihan yang secara logis serupa. 2. Kelompok berdasar nilai tertentu. 3. Pastikan bahwa pilihan-pilihan tersebut tidak saling tumpang tindih. Pilihan-pilihan dalam tingkat lebih rendah harus secara alamiah terhubung ke sebuah menu pada tingkat yang lebih tinggi. 4. Gunakan istilah yang sederhana dan pastikan bahwa antara satu pilihan dengan pilihan lain harus berbeda.

URUTAN PENYAJIAN PILIHAN Setelah perancang menetapkan pilihan yang ada, perancang masih dihadapkan pada pemilihan urutan penyajian dari pilihan itu. Jika pilihan yang tersedia mempunyai urutan yang alamiah - misalnya nama hari dalam seminggu, bab dalam sebuah buku, atau ukuran kaos - maka keputusannya mudah ditentukan. Urutan penyajian pilihan dapat menggunakan berbagai dasar, misalnya:

 Waktu (urutan kronologis),  Urutan numerik (secara urut naik atau urut turun),  Sifat fisik (panjang, luas, volume, temperatur, berat, kecepatan, dan lain-lain ). URUTAN PENYAJIAN PILIHAN

Dalam kebanyakan kasus, pilihan-pilihan yang ada tidak mempunyai urutan berdasarkan tugas, dan perancang harus menentukan urutannya berdasar berbagai kemungkinan urutan, misalnya:  Pilihan paling penting diletakkan sebagai pilihan pertama;  Pilihan paling sering digunakan diletakkan sebagai pilihan pertama;

 Kelompok dari sejumlah pilihan yang saling terkait (dipisahkan dengan baris kosong atau pemisah lain antar kelompok);  Urutan secara alfabetis

 Dalam sebuah menu, biasanya terdapat beberapa pilihan yang sering dipilih dibanding pilihan lain. Ada semacam keinginan untuk mengorganisir pilihan-pilihan tersebut dari pilihan yang paling banyak dipilih ke yang paling sedikit dipilih. Cara ini barangkali akan mempercepat pemilihan menu teratas, tetapi kehilangan makna urutan dan pilihan yang paling jarang dipilih dapat bersifat menganggu.

 Microsoft dengan produknya Office 2000 menyajian menu yang disebut dengan menu adaptif. Ketika pengguna menggunakan salah satu aplikasi dari Office 2000, pilihan yang belum dipilih tidak ditampilkan dari daftar pilihan yang ada, sehingga membuat daftar pilihannya menjadi pendek. Untuk melihat pilihan yang tidak nampak, pengguna harus mengklik simbol panah yang terdapat di bagian paling bawah dari menu tersebut.

 Studi yang dilakukan oleh Mc Gicnere, et al., (2002) membandingkan antara menu adaftif pada Microsoft Word dengan varian menu lain yang memberikan kesempatan kepada pengguna untuk menggunakan salah satu dari dua alternatif: susunan normal dengan semua pilihan terlihat dan susunan tertentu yang didasarkan pada keinginan masing-masing pengguna.

URUTAN PENYAJIAN PILIHAN Pada Subbab ini akan membahas sejumlah penilaian subyektif tentang tata letak menu yang memerlukan validasi empiris, diantaranya:  Judul Menu,  Pemilihan Ungkapan, dan  Tata letak Grafik.

 Judul Menu  Pemilihan Ungkapan  Tata letak Grafik. Pemilihan judul buku merupakan pekerjaan yang sulit bagi penulis, editor, ataupun penerbit. Judul yang unik, menarik, dan mudah diingat akan membuat perbedaan yang nyata terhadap tanggapan pembaca Serupa dengan hal itu, pemilihan judul menu juga merupakan pekerjaan yang tidak mudah dan memerlukan pemikiran yang serius.

 Untuk menu tunggal, judul singkat yang menjelaskan suatu situasi sudah memadai. Pada menu tersusun linear, judulnya harus secara akurat menunjukkan langkah-langkah yang perlu dilakukan secara berurutan. Penggunaan tata bahasa yang konsisten akan mengurangi kebingungan, dan penggunaan kata benda yang singkat tetapi tidak mendua seringkali sudah memadai.

 Studi yang dilakukan oleh Teitelbaum dan Granda (1983) menunjukkan bahwa pengguna memer­lukan waktu dua kali lebih lama untuk memilih menu yang sama ketika posisi menunya berpindah-pindah dibandingkan jika posisi menunya tetap. Dengan demikian perancang harus berusaha sebisa mungkin untuk menempatkan menu yang sama pada posisi yang sama.

 Judul Menu  Pemilihan Ungkapan  Tata letak Grafik. Masing-masing kata yang digunakan belum tentu dimengerti oleh setiap pengguna.

Beberapa “aturan” berikut ini sepertinya sudah jelas, tetapi ada baiknya ditulis kembali, karena hal itu paling banyak dilanggar:  Gunakan terminologi yang sudah dikenal dan konsisten.  Pastikan bahwa setiap pilihan berbeda satu dengan yang lain.  Gunakan ungkapan yang singkat tetapi jelas dan konsisten.  Gunakan kata kunci sebagai awal ungkapan.

 Judul Menu  Pemilihan Ungkapan  Tata letak Grafik. Sekelompok karakter seringkali digunakan secara bersamaan karena adanya keterbatasan dalam hal lebar dan panjang layar tampilan. Teknik penyorotan pilihan mempengaruhi tata letak grafis dari menu yang akan disusun.

Perancang menu harus mempunyai pedoman untuk menjaga konsistensi paling tidak untuk komponen menu berikut ini: 1. Penulisan judul. Beberapa pengguna lebih menyukai judul yang ditulis rapi tengah, tetapi rapi kiri biasanya lebih disukai, terutama untuk tampilan yang mempunyai kecepatan rendah.

2. Penempatan pilihan. Biasanya pilihan ditulis rapi kiri, dengan nomor atau huruf tertentu yang mendahului judul pilihan secara lengkap. Baris kosong seringkali digunakan untuk memisahkan kelompok pilihan tertentu. Jika menggunakan banyak kolom, penomoran atau penggunaan huruf harus tetap konsisten.

3. Petunjuk. Petunjuk untuk setiap menu, jika ada, harus seragam untuk setiap pilihan yang ada dan harus ditempatkan diposisi yang sama. Aturan ini juga digunakan untuk petunjuk tentang penelusuran, pertolongan, atau penggunaan tombol fungsi.

4. Pesan kesalahan. Ketika pengguna memilih pilihan yang tidak dapat diterima, pesan kesalahan harus muncul pada posisi yang konsisten dan penggunaan istilah serta sintaksisnya juga harus konsisten. 5.Laporan status. Sejumlah sistem mempunyai semacam tanda yang menunjukkan dari menu yang sedang dikunjungi, halaman yang sedang dilihat, atau pilihan yang harus dipilih untuk menyelesaikan suatu tugas. Informasi ini harus muncul pada posisi yang konsisten dan juga harus mempunyai struktur yang konsisten

Penggunaan berbagai gambar, jenis huruf, ukuran font yang berbeda, dan teknik penyorotan sangat membantu pengguna untuk mengetahui menu yang sedang dipilih. Pada menu yang bertumpuk atau menu berjalan (karena pengguna, pada satu saat harus berjalan melewati beberapa tingkat) secara perseptual sangat bermanfaat, tetapi akan menimbulkan tantangan motorik kepada pengguna karena pengguna harus menggerakkan kursor ke arah yang sesuai.

TERIMA KASIH