Materi Pokok Pert 13 :

Perancangan Antarmuka User

Tujuan Pembelajaran :
Mahasiswa mempunyai pengetahuan langkah-langkah
mendesain user interface sebuah aplikasi sistem
Materi :
Merancang user interface (antarmuka pengguna),
pedoman dan teknologinya
Gaya antarmuka pemakai dengan memakai grafis
Desain antarmuka pemakai
 Diskusi pendahuluan
Pertanyaan Pendahuluan
a. Sebutkan sedikitnya lima langkah pokok yang
menjadi pertimbangan dalam mendesain antar
muka (GUI) sebuah sistem aplikasi ?
Materi pertemuan 13
KONSEP : Pengguna (User)
Klasifikasi Pengguna.
Expert User Pengguna yg telah terbiasa memakai komputer
Menggunakan sebagian besar waktunya untuk mengolah aplikasi
programs.
Bekerja dengan komputer secara kontinyu (tidak terputus-putus).
Disebut juga dedicated user.

Novice User sangat sedikit berpengalaman memakai komputer

Menggunakan komputer sekali-sekali, dan sederhana
Jarang dan tidak terus-menerus
disebut juga casual user.
Human Factor :
Galitz (seorang ahli antarmuka pemakai),
menyebutkan ada beberapa masalah pada
desain antarmuka pengguna :
Terlalu banyak memakai jargon, akronim
Rancangan yang tidak jelas
Tidak dapat membedakan anatar tindakan pilihan
Tidak mampu menjawab permasalahan user
Desain yang tidak konsisten dengan user
requirement
Apa yang harus diperhatikan ?
Pahamilah user anda dan tugas-tugas mereka.
Libatkan user sejak awal dalam mendesain
interface
Lakukan test sistem seperti keadaan
sebenarnya di tempat user.
Gunakan pendekatan rancangan yang iteratif
Petunjuk merancang interface
1. User harus memahami urutan langkah dlm sistem :
a. user mengerti apa yg diminta oleh sistem
b. user mengerti bahwa data yg di-enter sudah benar.
c. User mengerti kalau ada entri data yang tidak benar.
d. Jika terjadi delay, informasikan pada user.
e. user mengerti bahwa proses completed / not completed.
2. Usahakan Instruksi dan message berada/muncul
pada display area yang sama.
3. Messages and instructions harus jelas dan cukup
bagi user untuk memahami.
Petunjuk merancang interface
4. Gunakan atribut yg ditampilkan secara hemat
5. Spesifikasikan nilai yang akan ditampilkan.
6. Antisipasi kemungkinan error.
7. Users harus mengetahui, tidak akan
melanjutkan proses sebelum error diperbaiki.
8. Jika terjadi kerusakan seharusnya komputer
langsung terkunci, menghindari kesalahan
input, dan segera menghubungi analyst atau
technical support
Petunjuk : pengaturan Tone dan istilah
Tone
Sederhana, kalimat dengan gramatika yg benar.
Jangan terlalu banyak memakai istilah yg funny
Jangan terlalu menganggap rendah user.
Terminologi
Jangan terlalu banyak jargon.
Kurangi penjelasan yg tidak perlu.
Gunakan istilah sehari-hari.
Konsistensi diantara layar.
Hati-2 memakai instruksi, gunakan kata kerja.
Teknologi : GUI dan pertimbangan desainnya
GUI (Graphical User Interface)
Mendesain antarmuka pengguna dengan tampilan grafis,
meliputi tipe dan pertimbangan strateginya
Konstruksi Dasarnya : Windows dan Frame
Windows : area 4 segi dengan pembatas dan dengan
sebuah title sebagai judulnya
Frame : windows dibagi ke dlm zona2 dan disebut frame
Tipe :
Menu Driven
Dialog Tanya Jawab
Instruction Driven
Menu Driven
Menu Driven : Sistem digambarkan sebagai
urutan pilihan (opsi). User menggunakan opsi
untuk mencapai hasil yang diinginkannya
Dialog keseluruhan digambarkan sebagai dialog
chart
Jenis Menu Driven :
Pull-down and cascading menus
Tear-off and pop-up menus
Toolbar and iconic menus
Hypertext and hyperlink menus
Petunjuk : pengaturan Tone dan istilah
Dialog.
Keseluruhan aliran tampilan (layar antarmuka
pengguna) termasuk pesan pada sebuah aplikasi
Dialog Chart
Bagan(chart) yang menggambarkan susunan
seluruh dialog pada sebuah aplikasi
Digunakan untuk menjelaskan pada user
gambaran lingkup operasi aplikasinya
Instruction Driven
Instruction Driven : Dialog sistem berbasis set
instruksi (command language). Biasanya untuk
pengguna expert.
Jenis Instruction Driven :
Language-based : dibuat dgn perintah untuk suatu
tindakan (query by example dan SQL)
Mnemonic syntax :user dapat memasukan
perintah untuk meminta respon dari komputer
Natural language syntax : menggunakan
pertanyaan dan perintah dengan bahasanya user
Pertimbangan dalam mendesain GUI
Internal Control
User ID and Password
Privileges assigned to roles
Web certificates
Online Help :
Growing use of HTML for help systems
Help authoring packages
Tool tips
Help wizards
Agents reusable software object that can operate across
different applications and networks.
Proses dalam Desain GUI
Petakan dialog antarmuka pemakai
Gunakan State Transition Diagram (STD)
Buat prototipe dialog :
Dimulai dari menu utama (lihat STD) dan layar
dibawahnya.
Dapatkan feedback dari pengguna
 Penutup
Dari pembahasan materi pert 13 desain
antarmuka user :
Mahasiswa diharapkan mampu membuat
disain user interface yang baik dengan
menggunakan pedoman perancangan user
interface
(lihat: Diskusi 13 membuat disain
antarmuka pemakai)
 Diskusi 13
Dari kasus Latihan 01 (pert 08 dan 09) tugas
saudara adalah :
Membuat desain antar muka pengguna (GUI)
untuk menampilkan aplikasi sistem penjualan dan
pembelian Toko (PT) ABC
Menggambarkan dialog chart aplikasi tersebut
 Kuis 13 (15 menit)
Apakah kegunaan DIALOG CHART pada
sebuah rancangan sistem aplikasi ?