Rekayasa Perangkat Lunakdinus.ac.id/repository/docs/ajar/RPL-Interface_Design.pdf · Rekayasa Perangkat Lunak 2 ... Konstruksi Antarmuka biasanya dimulai dengan pembuatan prototipe-prototipe

Interface Design

Rekayasa Perangkat Lunak

2Rekayasa Perangkat Lunak

Desain Antarmuka (Interface Design)

Desain Antaramuka (Interface Design) atau Desain Antarmuka

Pengguna (User Interface Design) atau rekayasa antarmuka pengguna

(User Interface Engineering) adalah desain untuk komputer, peralatan,

mesin, perangkat komunikasi mobile, aplikasi perangkat lunak, dan

situs web yang berfokus pada pengalaman pengguna (User

Experience) dan interaksi.

Tujuan dari Desain Antarmuka Pengguna adalah untuk membuat

interaksi pengguna sesederhana dan seefisien mungkin, dalam hal

mencapai tujuan pengguna—atau apa yang sering disebut dengan

user-centered design.

5/24/2018Interface Design - RPL 2


Fokus Desain Antarmuka

1. Desain antarmuka Inter-modular

Dikendalikan oleh aliran data antara modul

Berkaitan erat dengan desain tingkat komponen

2. Desain antarmuka eksternal

Antarmuka antar aplikasi

Antarmuka antar perangkat lunak dan produsen dan / atau konsumen

informasi non-manusia

3. Desain antarmuka manusia-komputer

Komunikasi antara manusia dan mesin

Manusia sebagai pengguna memiliki berbagai karakter yang lebih sulit

dipelajari.


* SEPA 8th ed, Roger S. Pressman


Three Golden Rules Dalam Desain Antarmuka

Tiga Aturan Emas dalam desain antarmuka pengguna

1. Tempatkan pengguna sebagai pengendali

Apa yang saya inginkan adalah sebuah sistem yang membaca pikiran saya.

Dia tahu apa yang ingin saya lakukan sebelum saya butuhkan dan membuat

mudah untuk saya untuk melakukannya

2. Kurangi beban memori pengguna

Semakin banyak user harus mengingat, semakin banyak interaksi kesalahan

dengan sistem. Sistem seharusnya mengingat

3. Buat antarmuka yang bersifat konsisten

Interface Design - RPL 4

(Theo Mandel, 97)


R1-Tempatkan Pengguna sebagai Pengendali

Mendefinisikan interaksi sehingga tidak memaksa pengguna untukmelakukan aksi-aksi yang tidak diperlukannya dan tidakdikehendakinya

Sediakan interaksi yang bersifat fleksibel (pilihan interaksi lain) e.g.: keyboard, mouse, pena digitizer, layar sentuh / suara

Memungkinkan interaksi pengguna yang dapat diinterupsi atau dibatalkan

Sembunyikan hal-hal internal yang bersifat sangat teknis daripengguna

Rancang interaksi langsung dengan objek-objek yangtampak di layar monitor pengguna (WYSIWYG)



R2-Kurangi Beban Memori Pengguna

Kurangi short-term memory pengguna (menyediakanikon visual)

Memberi default (pilihan "reset“)

Mendefinisikan tombol pempercepat (shortcut) yang intuitif. (Alt+P untuk printer)

Tampilan visual antarmuka pengguna harus didasarkanpada metafora dunia nyata yang familiar (informasibuku bank, layout mesin)

Tampilan informasi dalam bentuk progresif(informasi umum dilanjutkan dengan detail)



R3-Antarmuka yang Konsisten

Memungkinkan pengguna untuk mengetahui hal yang

sedang dilakukan dalam konteks yang bermakna

Memelihara konsistensi antar sejumlah aplikasi yang

serupa

Jika model interaktif sebelumnya dibuat

berdasarkan harapan pengguna, jangan membuat

perubahan apa pun kecuali ada alasan yang kuat



Eight Golden Rules of Interface Design

1. Upayakan agar konsistensi.

Urutan tindakan yang konsisten harus diperlukan dalam situasi yang

serupa; terminologi identik harus digunakan dalam petunjuk, menu,

dan layar bantuan; dan perintah yang konsisten harus digunakan di

seluruh.

2. Memungkinkan pengguna yang sering menggunakan

pintasan.

Karena frekuensi penggunaan meningkat, demikian pula keinginan

pengguna untuk mengurangi jumlah interaksi dan untuk meningkatkan

laju interaksi. Singkatan, tombol fungsi, perintah tersembunyi, dan

fasilitas makro sangat membantu pengguna ahli.

=> 3.

[Shneiderman]



3. Menawarkan umpan balik informatif.

Untuk setiap tindakan operator, harus ada umpan balik sistem.

Untuk tindakan yang sering dan kecil, responsnya bisa

sederhana, sedangkan untuk tindakan yang jarang dan besar,

responsnya harus lebih substansial.

4. Desain dialog untuk menghasilkan penutupan.

Urutan tindakan harus diatur dalam kelompok-kelompok dengan

awal, tengah, dan akhir. Umpan balik informatif pada

penyelesaian sekelompok tindakan memberi operator kepuasan

pencapaian, rasa lega, sinyal untuk menjatuhkan rencana dan

pilihan kontijensi dari pikiran mereka, dan indikasi bahwa cara

yang jelas untuk mempersiapkan kelompok berikutnya tindakan.

=> 5.

[Shneiderman]



5. Tawarkan penanganan kesalahan sederhana.

Sebisa mungkin, rancang sistem agar pengguna tidak dapat

membuat kesalahan serius. Jika kesalahan dibuat, sistem harus

dapat mendeteksi kesalahan dan menawarkan mekanisme yang

sederhana dan mudah dipahami untuk menangani kesalahan.

6. Memungkinkan pembalikan aksi yang mudah.

Fitur ini mengurangi kecemasan, karena pengguna tahu bahwa

kesalahan dapat diurungkan; dengan demikian mendorong

eksplorasi pilihan yang tidak dikenal. Unit reversibilitas dapat

berupa satu tindakan, entri data, atau grup tindakan lengkap..

=> 7.

[Shneiderman]



7. Mendukung lokus kontrol internal.

Operator berpengalaman sangat menginginkan pengertian

bahwa mereka bertanggung jawab atas sistem dan bahwa

sistem menanggapi tindakan mereka. Rancang sistem untuk

membuat pengguna menjadi pemrakarsa tindakan daripada

responden.

8. Kurangi beban memori jangka pendek.

Keterbatasan pemrosesan informasi manusia dalam memori

jangka pendek menuntut agar tampilan tetap sederhana,

beberapa tampilan halaman dikonsolidasikan, frekuensi

gerakan-jendela dikurangi, dan waktu pelatihan yang cukup

diberikan untuk kode, mnemonik, dan urutan tindakan.

[Shneiderman]


Model Antarmuka Pengguna

Empat model yang berbeda memainkan peranan saat suatu

antarmuka pengguna dianalisis dan dirancang:

1) Pengguna menentukan Model Pengguna

2) SW engineer membuat Model Desain/Perancangan

3) End-user membangun Model Mental atau Persepsi Sistem

4) Pengembang membuat Model Implementasi



1)-Model Pengguna

Model Pengguna dibuat untuk mendapatkan profil para

pengguna akhir sistem (end user)

Pengguna dapat dikelompokkan sebagai berikut:

Pengguna Pemula

Pengguna berpengetahuan yang tidak terlalu sering

menggunakan sistem

Pengguna berpengetahuan yang sering menggunakan sistem

5/24/2018Interface Design - RPL 13* SEPA 8th ed, Roger S. Pressman


2)-Model Desain

Model desain dari seluruh sistem menggabungkan data,

arsitektur, antarmuka, dan representasi prosedural dari

perangkat lunak.



3)-Model Mental

Model Mental (Perspeksi Sistem) adalah gambaran sistem

yang ada di kepala para pengguna akhir

Tingkat ketepatan deskripsi sangat bergantung pada profil-

profil pengguna seperti dibahas sebelumnya



4)-Model Implementasi

Model Implementasi pada dasarnya menggabungkan

manifestasi-manifestasi yang tampak dari luar sistem

berbasis komputer, digabungkan dengan informasi-

informasi pendukung lainnya (buku-buku, video, dll)

yang mendiskripsikan sintak-sintak dan semantik

antarmuka pengguna

Saat model implementasi dan model mental pengguna

sesuai, para pengguna secara umum akan

merasa nyaman dengan perangkat lunak dan dapat

menggunakannya secara efektif



Analisis dan Perancangan Antarmuka Pengguna

Proses analisa dan perancangan Interface bersifat Iteratif

dan dapat direpresentasikan dengan model Spiral

Analisa & Perancangan Interface mencakup 4 aktifitas

kerangka kerja:

• User, Task & Environment Analysis (Analisis Antarmuka)

• Interface Design (Perancangan Antarmuka)

• Implementation (Konstruksi Antarmuka)

• Interface Validation (Validasi Antarmuka)



Proses Perancangan Antarmuka



Analisis Antarmuka

Orang-orang (para pengguna akhir) yang akan berinteraksi

dengan sistem melalui antarmuka pengguna yang

dimilikinya

Pekerjaan-pekerjaan yang harus dilakukan oleh para

pengguna akhir

Isi yang harus dipresentasikan sebagai bagian dari suatu

antarmuka pengguna

Lingkungan tempat pekerjaan-pekerjaan akan dikerjakan



Desain Antarmuka

Sasaran dari desain antarmuka pada dasarnya adalah untuk

mendefinisikan sejumlah objek antarmuka pengguna dan aksi-

aksi/tindakan (serta representasinya pada layar) yang

memungkinkan pengguna untuk melakukan semua pekerjaan yang

telah didefinisikan



Implementasi

Konstruksi Antarmuka biasanya dimulai dengan pembuatan

prototipe-prototipe yang memungkinkan penggunaan

skenario untuk dievaluasi



Validasi Antarmuka

Validasi berfokus pada:

• Kemampuan antarmuka pengguna untuk mengimplementasikan

setiap pekerjaan pengguna secara benar

• Tingkat kemudahan penggunaan antarmuka pengguna

• Penerimaan pengguna pada suatu antarmuka sebagai alat yang

bermanfaat dalam pekerjaan-pekerjaan mereka



Example – The Main Window



Example: Entry Form, table, etc

Label Field Table / Query Validation Explanation



Detail Design

ID_Object Type Name Description

FieldBox1 FieldBox Dipenuhi

dengan string

yang muncul di

layar.

Diisi dengan penjelasan tentang

reaksi sistem, misalnya, apa layar

terbuka, di mana tautan berjalan.

Ketika datang ke kode yang cukup

rumit, lihat algoritma yang

dijelaskan di atas.

Button1 Button OK Ketika diklik, akan memungkinkan

prosesnya AlgoXXX.

RTF1 RTF Box Konten teks disimpan di File xxx



Screen Design


27Rekayasa Perangkat Lunak5/24/2018Interface Design - RPL 27


http://mashable.com/2012/06/07/mockup-tools/

Beberapa Tools yang dapat

digunakan untuk desain antar

muka (screen)

Tools for Screen Design (Mockup Design)








Rekayasa Perangkat Lunakdinus.ac.id/repository/docs/ajar/RPL-Interface_Design.pdf · Rekayasa Perangkat Lunak 2 ... Konstruksi Antarmuka biasanya dimulai dengan pembuatan prototipe-prototipe

Documents