perancangan interface user · pdf file•perancangan interface user yang baik harus...

54
MUHLIS TAHIR - 092904033 PTIK A PERANCANGAN INTERFACE USER CHAPTER 15

Upload: duongque

Post on 04-Feb-2018

253 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

MUHLIS TAHIR - 092904033

PTIK A 2009

PERANCANGAN

INTERFACE

USER

CHAPTER 15

Page 2: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

TUJUAN

Memahami prinsip-prinsip perancangan umum yang harus diikuti oleh perekayasa yang bertanggung jawab terhadap perancangan interface user.

Menyadari adanya lima gaya interaksi dengan sistem perangkat lunak.

Memahami berbagai gaya presentasi informasi dan mengetahui kapan presentasi informasi secara grafis layak digunakan.

Memahami beberapa dasar perancangan pendukung user yang menjadi satu dengan perangkat lunak.

Memahami atribut kegunaan dan pendekatan-pendekatan sederhana terhadap evaluasi sistem.

CHAPTER 15

Page 3: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

MATERI

• PRINSIP PRINSIP PERANCANGAN INTERFACE USER

• INTERAKSI USER

• PRESENTASI USER

• PENDUKUNG USER

• EVALUASI INTERFACE

CHAPTER 15

Page 4: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PENDAHULUAN

• Proses perancangan interface harus terpusat pada user.

• Interface harus berinteraksi dengan user dengan segala

keterbatasan dan kelebihannya, harus logis dan konsisten, dann

harus menyertakan fasilitas untuk membantu user, memakai

sistem dan memulihkan kesalahan-kesalahan mereka.

• Perancangan interface user yang baik harus bersifat kritis bagi

keberhasilan suatu sistem

• Interface harus bersifat tekstual atau berbasis form

CHAPTER 15

Page 5: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PENDAHULUAN

• Hampir semua user komputer sekarang memiliki personal komputer.

• Komputer-komputer ini menyediakan interface user grafis(GUI) yang mendukung tampilan berwarna dengan resolusi tingggi dan interaksi dengan memakai mouse dan keyboard.

• Interface berbasis teks sering digunakan secara luas, terutama pada sistem warisan, user komputer sekarang normalnya mengharapkan sistem aplikasi memiliki suatu bentuk interface user grafis.

CHAPTER 15

Page 6: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PENDAHULUAN

• Berikut ini karakteristik-karakteristik GUI sebagai

interface user

Karakteristik Keterangan Windows Mulitipel window memungkinkan berbagai informasi

ditampilkan ditampilkan secara simultan pada layar user.

Icon Icon memrepresentasikan berbagi tipe informasi. Pada

beberapa system, icon mempresentasikan file pada system

lainnya dan icon mempresentasikan proses.

Menu Command dipilih dari menu dan bukan diketiikkan dalam

suatu bahasa command.

Pointing(Alat Penunjuk) Piranti petunjuk seperti mouse digunakan untuk melakukan

pemilihan dari menu atau menunjukmitem yang diinginkan

pada window.

Grafik Elemen-elemen grafis dapat dicampur dengan teks pada

tampilan yang sama.

CHAPTER 15

Page 7: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PENDAHULUAN

Keunggulan GUI

GUI relatif mudah dipelajari dan digunakan. User tanpa pengalaman komputasi pun dapat mempelajari cara pemakaian interface tersebut setelah mengikuti sesi pelatihan yang singkat.

User memiliki banyak layar(window) untuk interaksi sistem. Peralihan dari satu pekerjaan ke pekerjaan yang lainnya dapat dilakukan tanpa kehilangan pandangan dari informasi yang dihasilkan pada pekerjaan pertama.

Interaksi yang cepat dengan layar yang penuh dapat dilakukan dengan akses ke bagian mana pun pada layar

CHAPTER 15

Page 8: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PENDAHULUAN

• Tujuan dari bab ini adalah untuk membuat perekayasa

perangkat lunak peka terhadap isu-isu penting yang

mendasari perancangan interface user.

• Interface desain user adalah sebuah pendekatan untuk

merancang interface user dimana kebutuhan pengguna

adalah hal yang terpenting dan dimana pengguna terlibat

dalam proses desain.

• Desain interface user melibatkan pengembangan

antarmuka.

CHAPTER 15

Page 9: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PENDAHULUAN

• Gambar Proses Perancangan Interface User

CHAPTER 15

Page 10: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PENDAHULUAN

• Keterangan Gambar Proses Perancangan Interface User

Mengilustrasikan proses iterative dari perancangan interface user. Proses prototype ini dapat dimulai dengan membuat tiruan interface diatas kertas yang sederhana sebelum meneruskannya dengan pengembangan perancangan pada layar mensimulasikan interaksi user. End-user system memegang peran aktif pada proses perancangan. Peran user adalah mengevaluasi.

CHAPTER 15

Page 11: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PRINSIP-PRINSIP PERANCANGAN

INTERFACE USER

• Perancang interface user harus memperhitungkan kemampuan fisik dan mental orang-orang yang memakai perangkat lunak.

• Manusia normal(rata-rata) memiliki memori jangka pendek yang terbatas dan mereka melakukan kesalahan, terutama ketika harus menangani terlalu banyak informasi, atau berada dibawah tekanan.

• Jadi ketika anda ingin menjadi seorang perancang maka harus memperhitungkan semua ini ketika merancang interface user.

CHAPTER 15

Page 12: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PRINSIP-PRINSIP PERANCANGAN

INTERFACE USER

• Prinsip kebiasaan user yang menyarankan bahwa user tidak boleh dipaksa beradaptasi dengan suatu interface karena implementasinya tidak tepat.

• Interface harus menggunakan istilah-istilah yang dikenal user dan objek yang dimanipulasi oleh sistem harus langsung berhubungan dengan lingkungan user.

• Sebagai contoh jika suatu sistem dirancang untuk digunakan oleh kontroler lalu lintas udara, objek yang dimanipulasi harus berupa pesawat,jalur penerbangan,menara dsb.

CHAPTER 15

Page 13: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PRINSIP-PRINSIP PERANCANGAN

INTERFACE USER

• Prinsip-prinsip Perancangan Interface User

Prinsip Keterangan

Kebiasaan User Interface harus menggunakan istilah dan konsep yang diambil dari

pengalaman orang-orang yang kan paling sering menggunakan system

tersebut.

Konsistensi Interface harus konsisten dalam hal, jika dimungkinkan, operasi-operasi yang

hamper sama harus diaktifkan dengan cara yang sama.

Kejutan minimal User harus tidak dikejutkan oleh perilaku system

Kemampuan Pemulihan Interface harus mencakup mekanisme untuk memungkinkan user pulih dari

error.

Panduan User Interface harus menyediakan umpan balik yang berarti ketika terjadi

kesalahan dan menyediakan fasilitas bantuan yang context sensitive.

Keragaman User Interface harus menyediakan fasilitas interaksi yang sesuai untuk berbagai

tipe user system.

CHAPTER 15

Page 14: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PRINSIP-PRINSIP PERANCANGAN

INTERFACE USER

Kebiasaan User

Interface harus didasarkan pada berorientasi pengguna istilah dan konsep daripada konsep-konsep komputer. Misalnya sistem kantor harus menggunakan konsep-konsep seperti surat, dokumen, folder dll bukan direktori, file pengidentifikasi.

Konsistensi

Sistem harus menampilkan tingkat yang sesuai konsistensi. Perintah dan menu yang sama harus memiliki format dan perintah baca harus sama.

Minimal Kejutan

Jika perintah beroperasi dengan cara yang diketahui, pengguna harus dapat memprediksi operasi perintahnya.

CHAPTER 15

Page 15: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

PRINSIP-PRINSIP PERANCANGAN

INTERFACE USER

Kemampuan Pemulihan Sistem harus menyediakan beberapa ketahanan terhadap kesalah pengguna dan memungkinkan pengguna untuk pulih dari kesalahan. Ini mungkin termasuk membatalkan fasilitas, konfirmasi tindakan destruktif.

Panduan User

Beberapa panduan penggunaan seperti bantuan pada baris manual,dll harus disediakan.

Keragaman User

Interaksi fasilitas untuk berbagai jenis pengguna harus didukung. Sebagai contoh, beberapa pengguna telah melihat kesulitan dan teks yang lebih besar sehungga harus tersedia.

CHAPTER 15

Page 16: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Interaksi User

Dua masalah harus ditangani secara interaktif oleh interface user

1) Bagaimana informasi dari user dapat diberikan ke sistem komputer ?.

2) Bagaimana informasi dari komputer dapat dipresentasikan pada user ?.

Interaksi user merupakan fokus dari subbab ini, dengan presentasi informasi.

Interaksi user berarti dimasukannya command dan data yang berhubungan ke sistem komputer

CHAPTER 15

Page 17: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Interaksi User

• Interaksi Gaya

1) Manipulasi Langsung

2) Pemilihan Umum

3) Bahasa Natural

4) Pemgisian form

5) Bahasa Command

CHAPTER 15

Page 18: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Interaksi User

1) Manipulasi Langsung. User berinteraksi langsung dengan

objek di layar. Sebagai contoh, untuk menghapus file, user

dapat menarik objek tersebut ke trash can.

2) Pemilihan Umum. User memilih command dari satu daftar

kemungkinan(menu). Seringkali terjadi bahwa objek layar

yang lain dipilih pada saat yang sama dan command

beroperasi pada objek tersebut. Pada pendekatan ini, untuk

menghapus sebuah file, user memilih file kemudian memilih

command delete.

3) Bahasa Natural. User memberikan command dalam bahasa

natural. Untuk menghapus file, user dapat mengetikkan

‘delete the file named xxx’.

CHAPTER 15

Page 19: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Interaksi User

4) Pengisian Form. User menjadi field-field pada sebuah form. Beberapa field mungkin memiliki menu yang berhubungan dan form bisa memiliki ‘tombol’ yang berhubungan yang, ketika ditekan, mengakibatkan dimulainya suatu aksi. Penghapusan file dengan menggunkan interface berbasis form akan bersifat artifisial. Cara ini mencakup pemasukan nama file, yang dilanjutkan dengan penekanan tombol delete.

5) Bahasa Command. User mengeluarkan command khusus dan parameter-parameter yang berhubungan untuk menginstruksikan sistem melakukan sesuatu. Untuk menghapus file, user mengeluarkan command delete dengan nama file sebagai parameter

CHAPTER 15

Page 20: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Interaksi User

Gaya Interaksi Keuntungan Utama Kerugian Utama Contoh Aplikasi

Manipulasi

Langsung

Interaksi cepat dan intuitif mudah

dipelajari

Mungkin sulit diimplementasi

hanya cocok jika ada metaphor

visual untuk task dan objek

Video game dan system

CAD

Pemilihan Menu Menghindari kesalahan user hanya

dibutuhkan sedikit pengetikkan

Lambat untuk user yang

berpengalaman bias menjadi

kompleks jika ada banyak

pilihan menu

Sebagian besar system

umum

Pengisian Form Entri data yang mudah dan mudah

dipelajari

Mengambil banyak tempat

pada layar

Control stok pemrosesan

pinjaman pribadi

Bahasa Command Ampuh dan Fleksibel Sulit dipelajari dan manajemen

error yang buruk

System operasi,system

pencarian informasi

perpustakaan

Bahasa Natural Bias diakses oleh user biasa dan mudah

diperluas

Membutuhkan lebih banyak

pengetikkan dan system

pemahaman bahasa natural

tidak dapat diandalkan

System jadwal system

pencarian informasi WWW

CHAPTER 15

Page 21: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Interaksi User

• Interaksi User Multipel

Linux operating system

X-windows GU I

mana ger

Graphical user

inter face

(Gnome/KDE)

Command

langua ge

interpreter

Unix shell

inter face

(ksh/csh)

CHAPTER 15

Page 22: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

Semua sistem interaktif harus menyediakan suatu cara

untuk menyatakan informasi kepada user.

Presentasi informasi mungkin hanya berupa representasi

langsung dari Informasi input (contohnya, teks pada

pengolahan kata) tapi bisa juga informasi grafis.

Model View Controller adalah cara mendukung beberapa

presentasi data,

CHAPTER 15

Page 23: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Presentasi Informasi

• Dengan memisahkan system presentasi dari data, representasi pada

layar user dapat diubah tanpa harus mengubah system komputasi

yang mendasarinya.

CHAPTER 15

Page 24: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi User

• Model MVC dari Interaksi User

CHAPTER 15

Page 25: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi User

• Keterangan Model MVC dari Interaksi User

Setiap view memilki objek kontroler yang berhubungan

yang menangani input user dan interaksi peranti.model

yang merepresentasikan data numeric dapat memiliki

view yang merepresentasikan data sebagai histogram dan

view yang menyatakan data sebagai table.

CHAPTER 15

Page 26: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Informasi Statis

Diinisialisasi pada awal Sesi dan ini tidak akan berubah

selama sesi ini berlangsung

Dapat berupa angka maupun teks

• Informasi Dinamik

Akan terjadi perubahan selama sesi berlangsung dan

perubahan tersebut harus dikomunikasikan kepada

interface user

Dapat berupa angka maupun teks

CHAPTER 15

Page 27: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Faktor Menampilkan Informasi

1) Apakah user tertarik pada informasi yang tepat ? Atau pada hubungan antara nilai-nilai data yang berbeda ?

2) Seberapa cepat nilai-nilai informasi berubah ? Apakah perubahan pada suatu nilai ditunjukkan langsung kepada user ?

3) Haruskah user mengambil tindakan sebagai tanggapan terhadap perubahan informasi ?

4) Apakah user perlu berinteraksi dengan informasi yang ditampilkan melalui manipulasi langsung ?

5) Apakah informasi yang akan ditampilkan berbentuk tekstual ? Atau numerik ? Apakah relatif item infomasi penting ?

CHAPTER 15

Page 28: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Presentasi Informasi Alternatif

0

1000

2000

3000

4000

Jan Feb Mar April May June

Jan

2842

Feb

2851

Mar

3164

April

2789

May

1273

June

283 5

CHAPTER 15

Page 29: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Keterangan gambar Presentasi Informasi Alternatif

• Nilai-nilai relatif misalnya seperti pada Gambar diatas.

Selain nilai yang disajikan relatif, informasinya bersifat

dinamis, karena berubah saat sesi berjalan. Untuk

nilai digital kita biasanya gunakan untuk menunjukkan

jam pada jam sistem di

komputer. Selain ketepatan diperlukan, perubahannya

tidak terjadi secara cepat.

CHAPTER 15

Page 30: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Analog atau Presentasi Digital

Presentasi Digital

Compact – memakan ruang yang sangat kecil

Precise – nilainya dapat dikomunikasikan

Presentasi Analog

Lebih mudah untuk mendapatkan kesan yang baik dan dapat dibaca sekilas.

Kemungkinan dapat menunjukkan nilai yang relatif

Lebih mudah untuk melihat data dari nilai luar biasa.

CHAPTER 15

Page 31: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Metode Presentasi informasi numerik yang bervariasi dinamic

1

3

4 20 10 20

Dial with needle Pie char t Ther mometer Horizontal bar

CHAPTER 15

Page 32: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi informasi

• Tampilan informasi grafis yang menunjukkan nilai yang

relatif

0 100 200 300 400 0 25 50 75 100

Pressur e Temper atur e

CHAPTER 15

Page 33: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Highlight Tekstual Dari Informasi Alfanumerik

CHAPTER 15

Page 34: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Keterangan gambar Highlight Tekstual Dari Informasi

Alfanumerik

• Etika informasi alfanumerik disajikan, grafik dapat

dipakai untuk mengambil informasi dari latar

belakangnya. Ketimbang menyatakan sebaris informasi,

nilai –nilai tersebut dapat ditampilkan pada suatu kotak

atau ditunjukkan dengan menggunakan icon. Kotak yang

menampilkan bertumpuk dengan display layar pada saat

itu. Dengan demikian perhatian user akan langsung

tertangkap kekotak tersebut.

CHAPTER 15

Page 35: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Presentasi Informasi

• Visualisasi Data

I. Informasi cuaca, yang dikumpulkan dari sejumlah sumber, ditunjukkan sebagai peta cuaca dengan isobar, muka cuaca, dll

II. Status jaringan telepon secara grafis sebagai satu set node yang terhubung pada pusat manajemen jaringan

III. Status pabrik kimia divisualisasi dengan menunjukkan tekanan dan tempratur dalam bentuk tangki dan pipa yang terhubung.

IV. Model molekul ditampilkan dan dimanipulasi dalam tiga dimensi dengan menggunakan sistem virtual reality

V. Satu set web page ditampilkan sebagai pohon hiperbolik(Lamping et al..,1995).

CHAPTER 15

Page 36: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Warna Pada Desain

Interface

• Semua sistem interaktif, selain sistem khusus dengan layar kecil, mengdukung tampilan berwarna dan interface user menggunakan warna dengan cara yang berbeda beda.

• Pada beberapa sistem (seperti pengolahan kata),warna hanya digunakan untuk high-light pada sistem lain (seperti sistem CAD), warna dipakai untuk menunjukkan layer yang berbeda pada desain.

• Warna dapat memperbaiki interface user dengan membantu user memahami dan menangani kompleksitas.

• Shneiderman(1998) memberikan 14 panduan kunci untuk penggunaan warna yang efektif pada interface user.

CHAPTER 15

Page 37: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Warna Pada Desain

Interface

• Tips memilih warna agar tidak terjadi kesalahan dalam interface user

1) Batasi jumlah warna yang digunakan dan gunakan secara konservatif.

2) Gunakan perubahan warna untuk menunjukkan perubahan status sistem

3) Gunakan pengkodean warna untuk mendukung pekerjaan yang sedang dilakukan user

4) Gunakan kode warna dengan hati-hati dan konsisten

5) Berhati-hatilah dalam membuat pasangan warna.

CHAPTER 15

Page 38: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Warna Pada Desain

Interface

Kesalahan yang sering terjadi antara lain:

i. Perancang ketika memakai warna pada interface user adalah

menghubungkan arti dengan earna tertentu dan

menggunakan terlalu banyak warna pada satu display.

ii. Jika warna dipakai terlalu banyak, atau jika warna-warna

tersebut terlampau cerah, display bisa membingungkan.

iii. Tumpukan warna bisa membingungkan user dan

menyebabkan kelelahan visual.

iv. Kebingungan user juga mungkin terjadi jika warna dipakai

secara tidak konsisten.

CHAPTER 15

Page 39: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Pendukung User

• Pendukung User meliputi semua fasilitas sistem mendukung pengguna termasuk-line bantuan, kesalahan pesan,manual dll

• Sistem pengguna user harus terintegrasi dengan pengguna user untuk membantu user saat mereka membutuhkan informasi tentang sistem atau ketika mereka membuat beberapa jenis kesalahan.

• Manajer harus memberikan waktu dan usaha yang cukup untuk perancangan message dan sebaliknya penulis dan ahli grafis yg profesional pada proses tersebut.

CHAPTER 15

Page 40: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Pesan Error

• Kesan pertama yang mungkin didapat user dari sistem

perangkat lunak adalah pesan error sistem.

• User tidak berpengalaman mungkin memulai

pekerjaannya, membuat kesalahan awal, dan langsung

harus memahami pesan error yang didapatnya.

• Hal ini mungkin cukup sulit bagi perekayasa perangkat

lunak yang ahli sekalipun , bagi user yang tidak

berpengalaman atau user biasa, pemahaman ini mungkin

bisa tidak tercapai.

• Latar belakang dan pengalaman user harus diantisipasi

ketika merancang pesan error.

CHAPTER 15

Page 41: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Pesan Error

• Faktor Faktor Perancangan pada pembuatan kata-

kata pesan

Faktor Keterangan

Konteks System panduan user harus mengetahui apa yang dilakukan user dan

harus menyesuaikan pesan output dengan konteks pada saat itu.

Pengalaman Selagi user menjadi terbiasa dengan system, mereka dapat menjadi

kesal dengan adanya pesan yang panjang dan berarti. Dilain pihak,

pemula akan sulit memahami penyataan yang singkat dan padat

mengenai masalah yang dihadapi. System panduan user harus

menyediakan kedua tipe pesan ini dan memungkinkan user

mengontrol keringkasan pesan.

Tingkat Keahlian Pesan harus disesuaikan dengan keahlian user di samping

pengalaman mereka. Pesan untuk kelas user yang berbeda dapat

dinyatakan dengan cara yang berbeda, tergantung pada istilah yang

dikenal pembaca.

Gaya Pesan harus positif dan tidak negative. Harus dipakai mode aktif dan

bukan pasif. Pesan tersebut tidak boleh menyinggung perasaan atau

mencoba untuk lucu.

Budaya Jika mungkin, perancang pesan harus mengenai budaya Negara di

mana system tersebut dijual. Ada perbedaan budaya yang jelas antara

Eropa, Asia dan Amerika. Bisa jadi pesan yang cocok untuk satu

budaya ternyata tidak dapat diterima di budaya lain.

CHAPTER 15

Page 42: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Pesan Error

Gambar input perawat untuk nama pasien

CHAPTER 15

Page 43: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Pesan Error

Keterangan Gambar input perawat untuk nama pasien

• Pesan kesalahan pada Gambar diatas ada dua macam: berorientasi

pada sistem dan berorientasi pada pengguna. Pada pesan yang

berorientasi pada sistem, pesan membuat pengguna merasa tidak

berdaya karena tidak ada jalan keluar yang jelas, bahasa yang

digunakan adalah bahasa teknis yang tidak berarti apa-apa. Pada

pesan yang berorientasi pada pengguna, pesan lebih jelas dan

memberikan alternatif jalan keluar. Sekalipun informasi yang

diberikan lebih banyak dan

terkesan penuh, tapi pengguna merasa tertolong.

CHAPTER 15

Page 44: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Perancang Sistem Help

Ketika user diberi pesan error yang tidak mereka pahami,

mereka beralih ke sistem Help untuk mendapat informasi.

Semua sistem Help yang komprehensif memiliki struktur

jaringan yang kompleks dimana setiap frame informasi

help bisa mengacu ke beberapa frame informasi lain.

Masalah dalam sistem help dapat timbul ketika user

memasuki jaringan setelah melakukan kesalahan dan

kemudian menelusuri jaringan.

CHAPTER 15

Page 45: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Perancang Sistem Help

• Teks pada sistem Help harus disiapkan dengan bantuan spesialis aplikasi. Frame help seharusnya bukan hanya merupakan reproduksi dari manual user karena user karena orang membaca kertas dan layar dengan cara yang berbeda.

• Sistem help dapat diimplementasikan sebagai satu set page World Wide Wen (WWW) atau dengan menggunakan sistem hiperteks generik yang dapat diintegrasikan dengan aplikasi.

• Sistem WWW memiliki keuntungan berupa kemudahannya diimplementasi dan tidak diperlukan perangkat lunak khusus.

CHAPTER 15

Page 46: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Dokumentasi user

Dokumentasi user tidak harus merupakan bagian dari

perancangan interface user, tetapi adalah praktek yang

baik untuk merancang dukungan help online dalam

hubungannya dengan dokumentasi harus.

Manual sistem harus menyediakan informasi yang lebih

rinci dari help online dan harus dirancang agar dapat

digunakan oleh berbagai kelas end user sistem.

CHAPTER 15

Page 47: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Dokumentasi User

• Jenis Dokumen yang dihasilkan untuk mendukung user

CHAPTER 15

Page 48: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Dokumentasi User

• Dokumen Dokumen ini adalah:

1) Deskripsi Fungsional

2) Dokumen Instalasi

3) Manual Pendahuluan

4) Manual Referensi

5) Manual Administrator

CHAPTER 15

Page 49: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Evaluasi Interface

Beberapa evaluasi desain interface user harus dilakukan untuk menilai kesesuaian

Evaluasi skala penuh adalah proses yang sangat mahal dan tidak praktis untuk sebagian besar sistem

Idealnya evaluasi harus dilakukan terhadap spesifikasi kegunaan yang didasarkan pada atribut kegunaan

Evaluasi yang sistematis dari desain interface user bisa jadi merupakan proses yang mahal yang melibatkan ilmuwan kognitif dan perancang grafis.

evaluasi inteface dengan cara ini tidak realisitis dari segi ekonomi untuk sistem-sistem yang dikembangkan oleh organisasi-organisasi kecil dengan sumber daya yang terbatas

CHAPTER 15

Page 50: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Evaluasi Interface

• Atribut Kemampulabaan

Atribut keterangan

Dapat

dipelajari(Learnability)

Berapa lama waktu yang dibutuhkan user baru sampai

dapat produktif dengan system?

Kecepatan operasi(speed

of operation)

Seberapa baik respons system sesuai dengan praktek kerja

user?

Ketahanan(robustness) Seberapa toleran system ini terhadap error user?

Kemampuan

Lebih(recoverability)

Seberapa baik system pulih dari error user?

Kemampuan

Adaptasi(adaptability)

Seberapa dekat system bergantung pada satu model kerja?

CHAPTER 15

Page 51: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Evaluasi Interface

• Teknik Evaluasi Sederhana

a) Umpan balik terhadap kuesioner

b) Peralatan video yang relatif murah mengandung arti bahwa

observasi langsung dapat didukung dengan merekam sesi

user untuk analisis berikutnya sebab dapat membantu dalam

pendeteksian masalah dan harus digunakan metode evaluasi

lain untuk menemukan operasi apa yang menyebabkan

kesulitan bagi user.

c) Pemakaian kode untuk mengumpulkan statistik penggunaan

memungkinkan interface diperbaiki dengan sejumlah cara.

CHAPTER 15

Page 52: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Hal-Hal Penting

Proses perancangan interface harus terpusat pada user. Interface harus berinteraksi dengan user dengan segala keterbatasan dan kelebihannya, harus logis dan konsisten, dan harus menyertakan fasilitas untuk membantu user memakai sistem dan memulihkan kesalahan-kesalahan mereka.

Gaya interaksi dengan sistem perangkat lunak mencakup manipulasi langsung, sistem menu,form isian,bahasa command, dan bahasa natural.

Tampilan informasi grafis harus digunakan ketika menampilkan tren dan nilai-nilai aproksimasi. Tampilan digital hanya harus dipakai jika yang dibutuhkan adalah ketepatan.

Warna harus dipakai dengan hemat dan konsisten dengan interface user. Perancang harus memperhitungkan fakta bahwa tidak sedikit orang yang menderita buta warna

CHAPTER 15

Page 53: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Hal-Hal Penting

Sistem Help user harus menyediakan dua macam help: Help! Yang berarti tolong saya dalam kesulitan dan Help ? Yang berarti tolong saya butuh informasi.

Pesan Error tidak boleh menyatakan bahwa user-lah yang salah . Pesan-pesan tersebut harus memberikan saran bagaimana cara menghadapi kesalahan tersebut dan memberikan hubungan ke sistem help.

Dokumentasi user harus mencakup manual pemula dan referensi. Dokumen yang terpisah untuk administrator sistem harus tersedia.

Spesifikasi sistem harus mencakup, jika mungkin, nilai-nilai kuantitatif untuk atribut kegunaan dan evaluasi proses harus memeriksa sistem dengan persyaratan-persyaratan ini.

CHAPTER 15

Page 54: PERANCANGAN INTERFACE USER · PDF file•Perancangan interface user yang baik harus bersifat kritis bagi ... elemen grafis dapat dicampur dengan teks pada ... mengambil tindakan sebagai

Terima Kasih CHAPTER 15