Jelaskan prinsip yang ada pada Perancangan antarmuka pengguna

Pertemuan 4 Prinsip Desain Antarmuka (Interface)

Prinsip prinsip desain antarmuka Merefleksikan model mental user : Merefleksikan kombinasi pengalaman dunia riil, pengalaman dari software lain, dan penggunaan komputer secara umum Explicit and Implied Action : Explicit actions adalah kondisi yang jelas dalam memberikan petunjuk untuk manipulasi suatu obyek. Implied actions adalah kondisi yang hanya memberikan kesan visual untuk memanipulasi obyek.

Prinsip desain antarmuka (lanjutan) Direct Manipulation user mendapatkan dampaknya dengan segera setelah melakukan suatu aksi. User Control mengijinkan user mengontrol dan menginisialisasi aksi. Feedback and Communication selalu memberitahukan user apa yang terjadi dari suatu aksi.

Prinsip desain antarmuka (lanjutan) Consistency user dapat mentransfer pengetahuan dan kemampuan dari suatu aplikasi ke aplikasi lain. WYSIWYG (What You See Is What You Get) tidak ada perbedaan antara yang dilihat di layar dengan hasil outputnya. Aesthetic Integrity informasi diorganisasikan dengan baik dan konsisten dengan prinsip desain visual yang baik.

Dokumentasi Desain I. Lingkup Sistem II. Desain Data III. Desain Architectural IV. Desain Antarmuka V. Desain Prosedural VI. Catatan Khusus

Data Design Mengubah objek data yang didefinisikan pada model analisis menjadi struktur data yang ada dalam perangkat lunak Atribut yang dimiliki objek data, hubungan di antara objek data, dan penggunaannya dalam program, semuanya mempengaruhi pemilihan struktur data

Architectural Design Menggunakan karakteristik aliran informasi dalam model analisis untuk menghasilkan struktur program Sebuah data flow diagram dipetakan menjadi struktur program menggunakan dua pendekatan : Transform mapping Transaction mapping Transform mapping : diterapkan untuk sebuah aliran data yang menunjukkan batas yang jelas antara data yang masuk dan yang keluar

Architectural Design (cont.) DFD dipetakan menjadi sebuah struktur yang mengalokasikan kontrol menjadi input, pemorsesan, dan output bersama dengan hirarki modul Transaction mapping : diterapkan jika sebuah item informasi menyebabkan percabangan DFD dipetakan menjadi sebuah struktur yang mengalokasikan kontrol menjadi sebuah substruktur yang mendapatkan dan mengevaluasi sebuah transaksi

Interface Design Meliputi antarmuka program internal dan eksternal serta desain untuk antarmuka pengguna Desain antarmuka internal dan eksternal diarahkan oleh informasi yang diperoleh dari model analisis

Mengembangkan software yang baik. High Performance software yang dibuat mempunyai performance yang tinggi, walaupun digunakan oleh beberapa user. Mudah digunakan software yang dibuat mempunyai sifat easy to use (mudah digunakan) sehingga tidak membutuhkan proses yang lama untuk mempelajarinya Penampilan yang baik software mempunyai antarmuka (interface) yang baik, sehingga user tidak merasa jenuh. Reliability kehandalan, sejauh mana suatu software dapat diharapkan untuk melakukan fungsinya sesuai dengan ketelitian yang diperlukan.

Mengembangkan software yang baik (Lanjutan) Mampu beradaptasi sejauh mana software yang dibuat mampu beradaptasi dengan perubahan-perubahan teknologi yang ada. Interoperability software yang dibuat haruslah mampu berinteraksi dengan aplikasi lain. Biasanya dapat dilihat dari adanya fasilitas untuk eksport dan import data dari aplikasi lain. Mobility software yang dibuat dapat berjalan pada bermacammacam sistem operasi.

Mengambil Keputusan Dalam Desain Aplikasi semakin membesar, dan menjadi semakin lambat. User Interface pada aplikasi semakin kompleks. Waktu yang diperlukan untuk mengembangkan fitur baru menjadi lebih lama. Dokumentasi aplikasi dan dokumen help menjadi lebih melebar. Resiko adanya efek pada fitur yang sudah ada. Meningkatkan waktu yang diperlukan untuk memvalidasi aplikasi

Mendesain Layout Model Aplikasi Ada 3 Model Aplikasi: 1. Berbasis Dokumen Aplikasi ini menghasilkan sebuah dokumen berupa filefile yang nantinya bisa dibuka dan dirubah kembali jika perlu. Aplikasi yang berbasis dokumen misalnya: Microsoft Word, Microsoft Excel, Open Office, Corel Draw, Photoshop, dll.

Model Aplikasi(lanjutan) 2. Berbasis Non Dokumen Aplikasi ini sifatnya tidak menghasilkan dokumen yang bisa dibuka dan dirubah kembali. Contoh dari aplikasi berbasis non dokumen ini adalah: Microsoft Outlook, MySQL, MYOB, dll

Model Aplikasi(lanjutan) 3. Utilitas Aplikasi ini sifatnya adalah untuk penunjang saja (sifatnya hanya tambahan). Ada kecenderungan aplikasi seperti ini menekankan pula pada style disamping fitur aplikasi. Contoh dari aplikasi ini adalah seperti aplikasi untuk mendengarkan musik atau menonton video (Winamp, Media Player, PowerDVD), aplikasi untuk anti virus (Kaspersky, Norton, F-Secure)

1. Layout Berbasis Dokumen Header Menubar Toolbar pane Lembar kerja

Macromedia Flash MX 2004

2. Layout Berbasis Non Dokumen Microsoft Outlook 2003

My SQL & M.Y.O.B

3. Layout Utilitas Ada kecenderungan aplikasi seperti ini menekankan pula pada style disamping fitur aplikasi Contoh :PowerDVDXP

Latihan Pertemuan 4 1. Kondisi yang jelas dalam memberikan petunjuk untuk manipulasi suatu obyek pada prinsip desain interface disebut : a.implied actions d. Aesthetic Integrity b.explicit actions e. Consistency c. User Control 2. Mengijinkan user mengontrol dan menginisialisasi aksi pada prinsip desain interface disebut : a. Implied actions d. Aesthetic Integrity b. Explicit actions e. Consistency c. User Control

Latihan Pertemuan 4 2. Mengijinkan user mengontrol dan menginisialisasi aksi pada prinsip desain interface disebut : a. Implied actions d. Aesthetic Integrity b. Explicit actions e. Consistency c. User Control 3. User dapat mentransfer pengetahuan dan kemampuan dari suatu aplikasi ke aplikasi lain pada prinsip desain interface disebut : a. Implied actions d. Aesthetic Integrity b. Explicit actions e.consistency c. User Control

Latihan Pertemuan 4 3. User dapat mentransfer pengetahuan dan kemampuan dari suatu aplikasi ke aplikasi lain pada prinsip desain interface disebut : a. Implied actions d. Aesthetic Integrity b. Explicit actions e.consistency c. User Control 4. Tidak ada perbedaan antara yang dilihat di layar dengan hasil outputnya pada prinsip desain interface disebut : a. Direct Manipulation d. Explicit actions b. WYSIWYG e. Implied actions c. Aesthetic Integrity

Latihan Pertemuan 4 4. Tidak ada perbedaan antara yang dilihat di layar dengan hasil outputnya pada prinsip desain interface disebut : a. Direct Manipulation d. Explicit actions b. WYSIWYG e. Implied actions c. Aesthetic Integrity 5. Model yang digunakan dalam mendisain layout adalah, kecuali : a. Berbasis Dokumen d. Non utilitas b. Berbasis Non Dokumen e. Benar Semua c. Utilitas

Latihan Pertemuan 4 5. Model yang digunakan dalam mendisain layout adalah, kecuali : a. Berbasis Dokumen d. Non utilitas b. Berbasis Non Dokumen e. Benar Semua c. Utilitas 1. Kondisi yang jelas dalam memberikan petunjuk untuk manipulasi suatu obyek pada prinsip desain interface disebut : a.implied actions d. Aesthetic Integrity b.explicit actions e. Consistency c. User Control

Tujuan dari Perancangan Antarmuka Pengguna adalah merancang interface yang efektif untuk sistem perangkat lunak. Efektif artinya siap digunakan, dan hasilnya sesuai dg kebutuhan. Kebutuhan disini adalah kebutuhan penggunanya. Pengguna sering menilai sistem dari interface, bukan dari fungsinya melainkan dari user interfacenya. Jika desain user interfacenya yang buruk, maka itu sering jadi alasan untuk tidak menggunakan software. Selain itu interface yang buruk sebabkan pengguna membuat kesalahan fatal. Saat ini interface yang banyak digunakan dalam software adalah GUI (Graphical User Interface). GUI memberikan keuntungan seperti:

Gampang dipelajari oleh pengguna yang pengalaman dalam menggunakan komputer cukup minim.
Berpindah dari satu layar ke layar yang lain tanpa kehilangan informasi dimungkinkan.
Akses penuh pada layar dengan segera untuk beberapa macam tugas/keperluan.

Beberapa karakteristik dari GUI dan penjelasannya dapat dilihat pada Tabel dibawah.

Gambar dibawah menggambarkan proses yang dilakukan dalam melakukan desain user interface. Prosse perulangan yang terjadi menjelaskan bahwa proses-proses tersebut dilakukan hingga menghasilkan desain yang diinginkan oleh pengguna. Desain harus bersifat user-centered, artinya pengguna sangat terlibat dalam

proses desain. Karena itu ada proses evaluasi yang dilakukan oleh pengguna terhadap hasil desain.

Berikut ini prinsip-prinsip UID:

User familiarity / Mudah dikenali : gunakan istilah, konsep dan kebiasaan user bukan computer (misal: sistem perkantoran gunakan istilah letters, documents, folders bukan directories, file, identifiers. -- jenis document open office.
Consistency / “selalu begitu” : Konsisten dalam operasi dan istilah di seluruh sistem sehingga tidak membingungkan. -- layout menu di open office mirip dgn layout menu di MS office.
Minimal surprise / Tidak buat kaget user : Operasi bisa diduga prosesnya berdasarkan perintah yang disediakan.
Recoverability/pemulihan : Recoverability ada dua macam: Confirmation of destructive action (konfirmasi terhadap aksi yang merusak) dan ketersediaan fasilitas pembatalan (undo).
User guidance / bantuan : Sistem manual online, menu help, caption pada icon khusus tersedia.
User diversity /keberagaman : Fasilitas interaksi untuk tipe user yang berbeda disediakan. Misalnya ukuran huruf bisa diperbesar.

Perancang sistem menghadapi dua masalah penting yaitu bagaimana informasi dari user bisa disediakan untuk sistem komputer – misalnya pada saat input data dan bagaimana informasi dari sistem komputer ditampilkan untuk user – hasil dari pemrosesan data. User interface yang baik harus menyatukan interaksi pengguna (user interaction) dan penyajian informasi (information presentation).

Ada 5 tipe utama interaksi untuk user interaction:

Pengoperasian secara langsung: interaksi langsung dengan objek pada layar. Misalnya delete file dengan memasukkannya ke trash. Contoh: Video games.

Kelebihan: Waktu pembelajaran user sangat singkat, feedback langsung diberikan pada tiap aksi sehingga kesalahan terdeteksi dan diperbaiki dengan cepat.
Kekurangan : Interface tipe ini rumit dan memerlukan banyak fasilitas pada sistem komputer, cocok untuk penggambaran secara visual untuk satu operasi atau objek

Pilihan berbentuk menu: Memilih perintah dari daftar yang disediakan. Misalnyasaat click kanan dan memilih aksi yang dikehendaki.

Kelebihan : User tidak perlu ingat nama perintah. Pengetikan minimal. Kesalahan rendah.
Kekurangan :Tidak ada logika AND atau OR. Perlu ada struktur menu jika banyak pilihan. Menu dianggap lambat oleh expert user dibanding command language.

Pengisian form : Mengisi area-area pada form. Contoh: Stock control.

Kelebihan : Masukan data yang sederhana. Mudah dipelajari
Kekurangan : Memerlukan banyak tempat di layar. Harus menyesuaikan dengan form manual dan kebiasaan user.

Perintah tertulis: Menuliskan perintah yang sudah ditentukan pada program. Contoh: operating system.

Kelebihan : Perintah diketikan langsung pada system. Misal UNIX, DOS command. Bisa diterapkan pada terminal yang murah.Kombinasi perintah bisa dilakukan. Misal copy file dan rename nama file.
Kekurangan : Perintah harus dipelajari dan diingat cara penggunaannya – tidak cocok untuk user biasa.Kesalahan pakai perintah sering terjadi. Perlu ada sistem pemulihan kesalahan.Kemampuan mengetik perlu.

Perintah dengan bahasa alami: Gunakan bahasa alami untuk mendapatkan hasil. Contoh: search engine di Internet.

Kelebihan: Perintah dalam bentuk bahasa alami, dengan kosa kata yang terbatas (singkat) – misalnya kata kunci yang kita tentukan untuk dicari oleh search engine. Ada kebebasan menggunakan kata-kata.
Kekurangan: Tidak semua sistem cocok gunakan ini. Jika digunakan maka akan memerlukan banyak pengetikan.

Sistem yang interaktif pasti menyediakan cara untuk menyajikan informasi untuk pengguna. Penyajian informasi bisa berupa penyajian langsung dari input yang diberikan (seperti teks pada word processing) atau disajikan dengan grafik. Beberapa faktor berikut adalah hal yang perlu diperhatikan sebelum menentukan

bentuk penyajian informasi:

Apakah pengguna perlu informasi dengan ketepatan tinggi atau data yang saling berhubungan?
Seberapa cepat nilai informasi berubah? Harus ada indikasi perubahan seketika?
Apakah pengguna harus memberi respon pada perubahan?
Apakah pengguna perlu melakukan perubahan pada informasi yang disajikan?
Apakah informasi berupa teks atau numerik? Nilai relatif perlu atau tidak?

Informasi bisa bersifat statis atau dinamis ketika disajikan, masing-masing baik dengan karakteristik yang berbeda dan kebutuhan yang berbeda pula:

Ditentukan saat awal sesi. Tidak berubah selama sesi berjalan.
Bisa berupa informasi numeris atau teks Chart di MS-Excel
Disajikan dengan jenis huruf khusus yang mudah dibaca atau diberi highlight dengan warna tertentu seperti pada Gambar 4 atau menggunakan icon yang mewakili

Perubahan terjadi selama sesi berlangsung dan perubahan harus dikomunikasikan/ditunjukkan ke user
Bisa berupa informasi numeris atau teks. Contoh : Defragmentation, scanning virus, download

Informasi dalam bentuk teks bersifat tepat dan berubah secara lambat sedangkan informasi dengan gambar/grafik mampu menjelaskan hubungan antar gambar, data bisa berubah dengan cepat. Seperti pada Gambar dibawah, informasi yang sama disajikan dengan dua cara yang berbeda. Jika yang dibutuhkan adalah hubungan antar data pada bulan-bulan tersebut, maka informasi dengan grafik memberikan informasi tentang hubungan tersebut lebih cepat dari pada informasi yang disajikan dengan teks dan numerik. Informasi dengan numerik dapat juga disajikan dengan cara digital atau analog dengan karakteristik sebagai berikut:

Singkat – hanya perlu sedikit tempat pada layar
Ketepatan nilai ditunjukkan

Nilai terlihat sambil lalu
Untuk menunjukkan nilai relatif
Mudah melihat data nilai yang berbeda

Nilai-nilai relatif misalnya seperti pada Gambar berikutnya. 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.

Warna menambah dimensi ekstra pada suatu interface dan membantu user memahami struktur yang kompleks.
Bisa dipakai untuk mewarnai-terang (higlight) hal-hal khusus.
Kesalahan umum dalam penggunaan warna pada desain UI:

Menggunakan warna untuk mengkomunikasikan arti-- merah bisa jadi peringatan atau ada kesalahan.
Terlalu banyak gunakan macam warna.

Dalam menggunakan warna pada desain interface ada beberapa petunjuk yang dapat diikuti seperti berikut ini:

Hindari penggunaan terlalu banyak warna.
Gunakan kode warna untuk mendukung operasi.
Pengguna bisa kendalikan warna untuk kode.
Desain monochrome kemudian tambahkan warna.
Gunakan warna kode secara konsisten.
Hindari pasangan warna yang tidak cocok/norak.
Gunakan warna untuk menunjukkan perubahan status.

User guidance meliputi semua fasilitas sistem untuk mendukung user termasuk on-line help, error messages, user manual. User guidance perlu disatukan dengan UI untuk bantu user saat membutuhkan informasi tentang sistem atau saat ada kesalahan. Help System dan sistem message (pesan kesalahan) adalah bentuk dari user guidance. Error Messages sangat penting, karena error message yang buruk cenderung ditolak oleh user dan error message sebaiknya berpedoman pada faktor-faktor pada Tabel dibawah.

Pesan kesalahan pada Gambardibawah, 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.