Download - Imk 04 Interface Berbasis Menu 2
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
1/33
1
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
2/33
Ragam InteraksiRagam interaksi merujuk kepada semua
cara yang digunakan untuk penggunauntuk dapat berinteraksi dengan sistemkomputer.
Ragam interaksi didasarkan pada polaperilaku seseorang
Bersifat kontekstual dan innateRagam interaksi merujuk ke ‘bagaimana’
perilaku pengguna ketika berinteraksidengan sistem
2
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
3/33
Tipe Ragam InteraksiInteraksi berbasis bahasa perintah (command
language)
Sistem menuAntarmuka berbasis ikon
Manipulasi langsung
Antarmuka berbasis pengisian borang (form-
lling style)
3
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
4/33
Antarmuka BerbasisMenuMenu adalah sekumpulan pilihan yang
ditampilkan pada layar, setiap menu
mewakili sebuah perintahPengguna memilih sebuah perintah dari
sejumlah perintah yang disusun ke dalamsejumlah menu dan melihat pengaruhnya.
Eksekusi dari menu yang dipilih akanmenghasilkan perubahan status dari suatuantarmuka.
4
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
5/33
Jenis Menu(1)Menu tunggal:Menu binerMenu tunggal banak pilihanMenu datarMenu tarikMenu berbasis ikon dan toolbar Menu dengan pilihan ang panjang
Menu dan hotlink tertanamMenu breadcrumb
5
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
6/33
Jenis Menu(2)!ombinasi Banak Menu:Menu linearMenu serempakMenu berstruktur pohon"eta situs #aring menu tak berputar dan berputar
6
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
7/33
Menu BinerMenu biner digunakan untuk memilih salah
satu dari dua pilihan ang tersedia
$ontoh:
7
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
8/33
Menu Tunggal
Banyak PilihanMenu tunggal banak pilihan merupakan
%ariasi dari menu biner &&' lebih dari duapilihan
$ontoh:
8
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
9/33
Menu Datar (1)Menu datar merupakan menu berbasis teks
kon%ensional dengan semua menu ang tersediaditampilkan pada laar
$ontoh:
9
PENGELOLAAN DATA AKADEMIS MAHASISWA
“STMIK SANTOSA”
DAFTAR MENU
Inisialisasi Berkas Mahasiswa
Inisialisasi Berkas Mata KuliahInisialisasi Berkas Nilai UjianMembuka Semua Berkas
Mengisi Data Mahasiswa
Mengisi Data Mata Kuliah
Mengisi Data Nilai UjianMengisi Data KRS
Menghitung IP Semester
Mencetak Presensi Kuliah
Mencetak Presensi UjianMencetak KRSMencetak Nilai Ujian
Mencetak KHS
Mencetak Data Mahasiswa
Mencetak Data Mata Kuliah
Selesai
Pilih salah satu: _
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
10/33
Menu Datar (2)"ilihan pada menu datar dioperasikan dengan
memilih selektor
Selektor:uruf !ompatibel: sama dengan huruf pertama pilihan
*ak !ompatibel: tidak harus sama
Angka
!ompatibel: sama dengan nomor urut huruf pertama pilihan *ak kompatibel: tidak harus sama
10
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
11/33
Menu Datar () MENU DATAR DENGAN
SELEKTOR HURUF
KOMPATIBEL
B. Baca Data
C. Cetak Laporan
D. Data Baru
E. Edit RekamanG. Gabung Berkas
H. Hapus Rekaman
I. Isi Rekaman
Pilih salah satu:_
MENU DATAR DENGAN
SELEKTOR HURUF
TAK KOMPATIBEL
A. Baca Data
B. Cetak Laporan
C. Data Baru
D. Edit RekamanE. Gabung Berkas
F. Hapus Rekaman
G. Isi Rekaman
Pilih salah satu:_
a. b.
MENU DATAR DENGAN
SELEKTOR ANGKA
KOMPATIBEL
2. Baca Data
3. Cetak Laporan
4. Data Baru
5. Edit Rekaman
7. Gabung Berkas
8. Hapus Rekaman
9. Isi Rekaman
Pilih salah satu:_
MENU DATAR DENGAN
SELEKTOR ANGKA
TAK KOMPATIBEL
1. Baca Data
2. Cetak Laporan
3. Data Baru
4. Edit Rekaman
5. Gabung Berkas
6. Hapus Rekaman
7. Isi Rekaman
Pilih salah satu:_
11
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
12/33
Menu Tarik (1)Menu datar tidak lagi disukai karena terlalu
memakan kapling pada laar monitor
+ntuk menampilkan daftar pilihan angbanak sekarang banak digunakan menutarik ( pulldown menu), dan hampir semuaprogram aplikasi menggunakanna
12
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
13/33
Menu Tarik (2)
13
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
14/33
Menu Berbasis Ikon
!an Toolbar "ada menu berbasis ikon dan toolbar , pilihan
dinatakan sebagai suatu ikon atau toolbar tertentu
$ontoh:
14
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
15/33
"ariasi #ain
15
Menu gulung Kotak kombo
Menu mata ikan
Penggeser
Menu dua dimensi
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
16/33
Menu Tertanam $Hotlink (1)Menu tertanam adalah menu ang dapat
ditambahkan sendiri oleh pengguna suatuaplikasi, misalna -oogle .arth
Menu hotlink banak dijumpai di situs /ebsiteang tujuanna untuk memba0a pengguna keinformasi tertentu
16
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
17/33
Menu Tertanam $Hotlink (2)$ontoh:
17
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
18/33
Menu Breadcrumb+ntuk membantu pengguna mena%igasi
dirina ke ruang informasi ang tersedia,seringkali digunakan menu breadcrumb
$ontoh:
18
1ui2k*ime3 and a *I44 (56/) de2ompressor
are needed to se e this pi2ture
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
19/33
%ombinasi BanyakMenu(1)"ada sejumlah aplikasi, khususna ang berbasis
/eb, biasana dijumpai sejumlah ragam menuang berbeda
Menu ang ada ditampilkan satu persatu atause2ara serempak (bersamaan):
$ontoh kombinasi banak menu ang ditampilkansatu per satu misalna pada pemesanan tiket
pesa0at terbang atau kamar hotel:000airasia2om
19
1ui2k*ime3 and a *I44 (56/) de2ompressor
are needed to see this pi2ture
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
20/33
%ombinasi BanyakMenu(2)$ontoh menu serempak:
20
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
21/33
%ombinasi BanyakMenu()Menu berstruktur pohon dan jaring:
21
1ui2k*ime3 and a *I44 (56/) de2ompressor
are needed to see this pi2ture
1ui2k*ime3 and a *I44 (56/) de2ompressor
are needed to see this pi2ture
1ui2k*ime3 and a *I44 (56/) de2ompressor
are needed to see this pi2turePohon
Jaring tak
berutar
Jaring
berutar
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
22/33
%ombinasi BanyakMenu(&)"eta situs: digunakan untuk membantu
pengguna mengetahui se2ara keseluruhan
ruang informasi ang tersedia
22
!!!"eba#"$om
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
23/33
Manipulasi langsung (1)Shneiderman (789):
Manipulasi langsung adalah ragam dialog angmempunai karakteristik: penajian %isual dari obek ang akan dimanipulasi
tindakan ;sik sebagai pengganti teks masukan
reaksi langsung ang dapat dilihat
23
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
24/33
Manipulasi langsung (2)"ree2e, 788
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
25/33
Manipulasi langsung ()>e;nisi lain ang lebih umum:Mengklik dan menggeser obek pada laar
tampilan
>e;nisi di atas hana menekankan padatindakan ;sik oleh pengguna
Istilah ini sering disebut dengan manipulasi%isual ($ooper dan Reimann, ?@@)
25
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
26/33
Manipulasi langsung (&)Aspek kognitif:
Directness: gagasan tentang arah
perasaan ang timbul sebagai hasil dari interaksidengan antarmuka
Aspek dari directness: #arak antara ang dipikirkan pengguna dengan
kebutuhan sistem !eterlibatan se2ara kualitatif
26
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
27/33
Manipulasi langsung (')Manipulasi "rogram %s Manipulasi IsiManipulasi program: 2ara pengguna menggunakan program aplikasi
untuk menelesaikan satu tugas *idak perlu keahlian khusus
Manipulasi isi: lebih merujuk ke data ang diolah oleh program
aplikasi tersebut "erlu keahlian khusus atau pelatihan dalam jangka
0aktu agak lama
27
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
28/33
Manipulasi langsung ()>i et al (?@@
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
29/33
Interaksi Berbasis
Pengisian Borang (1)"engisian borang hampir dilakukan oleh
setiap orang sepanjang hidup mereka
Antarmuka berbasis pengisian borang adalah jenis antarmuka ang menggunakan metaforborang untuk mengisi data ke komputer
29
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
30/33
Interaksi Berbasis
Pengisian Borang (2)Aspek&aspek IB"B (7):Proteksi tampilan & adana pembatasan agar
pengguna tidak dapat mengakses semua
tampilan ang ada di laarBatasan me!an tampilan & medan data dapat
ditentukan untuk mempunai panjang angtetap atau berubah, menggunakan format
bebas atau tertentuIsi me!an & pengguna biasana mempunai
sejumlah gambar&an tentang isi medan angdiperbolehkan petunjuk pengisian dapat jugaditampilkan sebagai bagian dari tampilan
30
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
31/33
Interaksi Berbasis
Pengisian Borang ()Aspek&aspek IB"B (?):Me!an opsional & beberapa medan isian
dapat bersifat opsional medan opsional dapat
dinatakan se2ara tekstual atau menggunakanaturan tertentu seperti penggunaan 0arnaberintensitas rendah, 0arna tampilan angberbeda dan lain&lainDefault & apakah dalam medan isian
dimungkinkan adana nilai default #ika a,tentukan tempatna, apakah pada bagian angtidak dapat diakses pengguna ataukah padabagian masukan data
31
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
32/33
Interaksi Berbasis
Pengisian Borang (&)Aspek&aspek IB"B ():Bantuan & adana bantuan (help) ang menunjukkan
2ara pengisian borang dapat pula, atau malah sebalikna,ditambahkan, tetapi harus terpisah dari bentuk dasar
borang #ika terdapat fasilitas bantuan, pengguna perludineritahu 2ara mengakses bantuan tersebut
Me!an penghentian & masukan data dalam medandapat diakhiri dengan jalan menekan tombol nter atauReturn atau mengisi karakter terakhir dengan karakter
tertentu, atau de&ngan 2ara berpindah ke medan lain*a+igasi & kursor dapat digerakkan di sekeliling laar
ang menggunakan tombol Tab untuk urutan ang tetap,atau dapat pula digerakkan se2ara bebas menggunakanpiranti seperti mouse
32
-
8/17/2019 Imk 04 Interface Berbasis Menu 2
33/33
Interaksi Berbasis
Pengisian Borang (')Aspek&aspek IB"B (