Pendahuluan

 Antarmuka pengguna
Interaksi Manusia dan
(User Interface) : bagian Komputer
sistem komputer yang
memungkinkan manusia
berinteraksi dengan
komputer.
 Perancangan antarmuka
: proses penggambaran
bagaimana sebuah
bagian sistem dibentuk.
 Prinsip User Interface (1)
 Dalam perancangan antarmuka, ada
beberapa prinsip yang harus diperhatikan
(Deborah, 1992) :
1. Kompatibilitas Pengguna
2. Kompatibilitas Produk
3. Kompatibilitas Transisi Antar Tugas
4. Konsistensi
5. Kebiasaan
6. Kesederhanaan
7. Manipulasi Langsung
Prinsip User Interface (2)
8. Kontrol
9. Efektivitas (tepat dalam penggunaan)
10. Efisien dalam penggunaan
11. Keamanan dalam penggunaan
12. Kesesuaian Fungsi
13. Mudah dipelajari
14. Mudah diingat
1. Kompatibilitas Pengguna
2. Kompatibilitas Produk

Memungkinkan adanya perubahan

antarmuka agar sistem menjadi lebih

“kompatibel” bagi pengguna.

 3. Kompatibilitas Transisi
Antar Tugas
Sistem harus dapat digunakan untuk
memudahkan pengguna dalam
melakukan tugasnya  fungsi-fungsi dalam
antarmuka disesuaikan dengan kebutuhan
pengguna.
4. Konsistensi
Membantu pengguna untuk dapat

menganalogikan dan memprediksi sesuatu

yang sebelumnya belum pernah dilakukan.

5. Kebiasaan
Konsep, terminologi, dan pengaturan

antarmuka harus yang dapat dipahami

oleh pengguna dengan baik agar

pengguna tidak bingung saat berinteraksi.

6. Kesederhanaan
Merancang antarmuka dengan bentuk

yang sederhana, tanpa mengurangi

fungsionalitas dari sistem/produk yang

dibangun.
 7. Manipulasi Langsung (1)
 Merupakan gaya/ragam dialog dimana aksi
yang dilakukan pengguna dapat langsung
terlihat pada tampilan objek yang tampak pada
layar monitor.
 Manipulasi langsung biasanya menyertakan alat
penunjuk, seperti : mouse, trackball, layar
sentuh, dan menggunakan grafik dalam
menampilkan objek dan aksinya.
 Contoh penerapan manipulasi langsung :
- Pada games  cth : Solitaire
- Pada program spreadsheet  cth : Ms.Excel
 7. Manipulasi Langsung (2)
 Karakteristik yang harus diperhatikan dalam
manipulasi langsung adalah : Bahwa meskipun pada
layar tampilan banyak sekali objek yg dapat
dioperasikan, tapi pada satu saat pengguna hanya
“berkuasa penuh” pada sebuah objek yang ada
disana.
 Manipulasi langsung jg dpt diterapkan pada bidang
yg lebih luas dan serius :
- Kontrol proses industri  pembangkitan dan
penyaluran listrik dan industri makanan berskala
besar.
- Editor Teks konsep WYSIWYG (what you see is
what you get)
- Simulator  simulator penerbangan
8. Kontrol
 Sistemselalu dibawah kontrol pengguna
 Antarmuka harus mempunyai sarana yang
memungkinkan pengguna untuk dapat
menentukan :
- dimana sebelumnya pengguna berada
- dimana pengguna berada sekarang
- kemana pengguna dapat pergi
- apakah pekerjaan yg sudah dilakukan dapat
dibatalkan.
 9. Efektivitas
(Tepat dalam Penggunaan)
Apakah sistem yang dibangun dapat
membuat pengguna:
 Mudah untuk mempelajarinya
 Efisien dalam melakukan pekerjaan
 Dapat mengakses informasi yang diperlukan,
dsb.
10. Efisien Dalam Penggunaan
Apakah sistem menyediakan fasilitas yang

memudahkan pengguna dalam

mengerjakan tugasnya.
11. Keamanan Dalam Penggunaan

 Untuk melindungi
pengguna dalam
menghadapi kondisi
yang tidak
diinginkan.
 Salah satu cara
pengamanan,
dengan membuat
pesan dari aktivitas
yang dilakukan
pengguna.
12. Kesesuaian Fungsi
 Fungsi-fungsiyang disediakan sistem harus
sesuai dengan definisi sistem tersebut.
 Contoh :
- Aplikasi pengolah kata, berarti aplikasi
tersebut harus menyediakan seluruh fasilitas
yang dibutuhkan dalam pengolahan kata,
seperti pembuatan dokumen baru, sampai ke
penyimpanan dokumen, dll.
13. Mudah Dalam Mempelajari
 Sistem yang mudah digunakan adalah
sistem yang mudah dipelajari dan mudah
diingat.
 Perancang harus mengetahui karakteristik
pengguna, termasuk kemampuan dan
keahlian pengguna sistem yang akan
dibangun.
14. Mudah Diingat
Mudah diingat bagaimana cara
menggunakannya, sehingga perancang
juga perlu memperhatikan bagaimana
desain/rancangan sistem yang akan
dibangun agar mudah dipelajari oleh
pengguna, sehingga menjadi mudah
diingat.
 Hal-hal Yang Harus Diperhatikan
Dalam Merancang Antarmuka
 Apa keinginan dan harapan orang?
 Apa batasan dan kemampuan fisiknya?
 Bagaimana sistem penerimaan dan
pemrosesan informasi mereka bekerja?
 Apa yang dianggap menarik dan
menyenangkan?
 Bagimana karakteristik dan batasan teknik
dari hardware dan software komputernya?
 Dokumentasi Rancangan
a) Membuat sketsa pada kertas
b) Menggunakan peranti prototipe GUI
(Graphical User Interface)
c) Menulis tekstual yang menjelaskan
tentang kaitan antara satu jendela
dengan jendela yang lain
d) Menggunakan peranti bantu yg disebut
CASE (Computer-Aided Software
Engineering).
 Kategori Program Aplikasi
1. Program aplikasi untuk keperluan khusus
(special purpose software)
- pengguna yang akan memanfaatkan aplikasi
tersebut dapat diperkirakan, sehingga memudahkan
dalam merancang antarmuka.

2. Program aplikasi yang akan digunakan untuk

banyak pengguna (general purpose software) atau
public software.
- penggunanya mempunyai tingkat kepandaian dan
karakteristik beragam, sehingga perlu adanya
“customization” agar pengguna dapat
menggunakan aplikasi sesuai dengan selera masing-
masing.
 Cara Pendekatan (1)
1. User-Centered Design Approach
 Digunakan pada program aplikasi untuk
keperluan khusus.
 Perancangan antarmuka melibatkan
pengguna  pengguna aktif berpendapat
ketika perancang sedang membuat
antarmuka  pengguna seolah-olah sudah
mempunyai gambaran nyata tentang
antarmuka sistem yang akan mereka
gunakan.
Cara Pendekatan (2)
2. User Design Approach
- pengguna sendiri yang merancang
antarmuka yang diinginkan.
 PERANCANGAN TAMPILAN
BERBASIS TEKS
6 Faktor Tata Letak Tampilan
1. Urutan Penyajian
2. Kelonggaran (Spaciousness)
3. Pengelompokan
4. Relevansi
5. Konsistensi
6. Kesederhanaan
1. Urutan Penyajian
 Urutan penyajian disesuaikan dengan model
pengguna yang telah disusun.
 Harus ada kesepakatan antara perancang
dengan calon pengguna tentang urutan
tampilan yang akan digunakan.
2. Kelonggaran (Spaciousness)
 Penggunaan tabulasi dan spasi dapat
memudahkan pengguna untuk mencari suatu
teks yang diinginkan, meskipun boros tempat
kosong pada layar.
 Teks-teks tertentu ditempatkan di posisi
tertentu dengan harapan dapat langsung
memusatkan perhatian pengguna.
3. Pengelompokan
 Pengelompokan data yang saling berkaitan
untuk mempermudah penstrukturan layar
tampilan secara keseluruhan.
 Petunjuk adanya pengelompokan data bisa
menggunakan beberapa karakter khusus.
4. Relevansi
 Menampilkan pesan-pesan yang relevan/sesuai
dengan topik yang sedang ditampilkan di layar.
5. Konsistensi
 Kadang pengguna dihadapkan pada sejumlah
tampilan yang penuh informasi, sehingga
perancang harus konsisten dalam
menggunakan ruang tampilan yang tersedia.
 Misalnya pada sistem dengan tampilan dialog
berbasis pengisian borang (frame).
6. Kesederhanaan
 Memberikan kemudahan bagi pengguna dalam
memahami informasi yang ditampilkan.
 PERANCANGAN TAMPILAN
BERBASIS GRAFIS
 Dengan antarmuka berbasis grafis berbagai
kemudahan dalam hal pengontrolan format
tampilan dapat dikerjakan dengan lebih mudah
dan fleksibilitas tampilan dapat semakin dirasakan
oleh perancang tampilan maupun
penggunanya.
 Disisi lain, kita harus memperhatikan beberapa
kendala dalam penerapan antarmuka berbasis
grafis, antara lain : waktu tanggap, kecepatan
tampilan, lebar tampilan, dan tipe tampilan
 5 Faktor Penting pada
Perancangan Interface
Berbasis Grafis
1. Ilusi pada obyek-obyek yang dapat dimanipulasi,
mis: gambar disket, printer, dll
2. Urutan visual dan fokus pengguna, mis: tanda kedip
untuk posisi kursor, penggunaan warna yang
berbeda
3. Struktur internal; berguna untuk menunjukkan bahwa
obyek yang sedang dihadapi dapat dimodifikasi
sesuai dengan keinginan user
4. Kosakata grafis yang konsisten dan sesuai, mis:
gambar disket, printer, dll
5. Kesesuaian dengan media/informasi yang akan
disampaikan
1. Ilusi pada objek-objek yang dapat
dimanipulasi.

Perancangan antarmuka berbasis grafis

harus melibatkan tiga komponen :
 Kumpulan Objek
 Penampilan objek-objek
 Mekanisme yang konsisten
2. Urutan visual dan Fokus pengguna

Antar muka grafis dapat digunakan untuk menarik

perhatian pengguna antara lain dengan membuat

objek yang berkedip, menggunakan warna

tertentu, serta menyajikan suatu animasi yang akan

lebih menarik perhatian pengguna

3. Struktur Internal
 Pada pengolahan kata kita sering menulis
beberapa kata yang berbeda dengan
kata-kata yang lain, misalnya ada
sekelompok kata yang ditebalkan,
dimiringkan atau diberi garis bawah.
 Pada antar muka berbasis grafis, khusunya
pada objek-objek yang dapat dimanipulasi,
perancang juga harus memberikan struktur
internal (reveral structure) dalam bentuk
yang berbeda dengan yang digunakan
pada dokumen tekstual, untuk memberi
tahu pengguna sejauh mana pengguna
dapat mengubah atau memanipulasi objek
tersebut.
 4. Kosa kata grafis yang
konsisten dan sesuai

Pada program aplikasi yang berbeda,

penggunaan simbol biasanya disesuaikan dengan

kreatifitas perancangnya.
 5. Kesesuaian dengan pengguna
 Karakteristik
dari layar tampilan yang
digunakan akan mempunyai pengaruh yang
besar terhadap keindahan “wajah”
antarmuka yang akan ditampilkan.
 Dengan semakinnya canggihnya teknologi
layar tampilan pada saat ini, kreatifitas
perancang tampilanlah yang saat ini lebih
dituntut untuk memenuhi permintaan
pengguna akan aspek kenyamanan dan
keramahan antarmuka.
 Penanganan Kesalahan
 Validasi pemasukan data, mis: jika user harus
memasukkan bilangan positif, namun dia
memasukkan data negatif atau nol, maka
harus ada mekanisme untuk mengulang
pemasukan data tersebut
 Proteksi user; program memberi peringatan
ketika user melakukan suatu tindakan secara
tidak sengaja, mis: penghapusan berkas
 Pemulihan dari kesalahan: tersedianya
mekanisme untuk membatalkan tindakan yang
baru saja dilakukan
 Penampilan pesan salah yang tepat dan sesuai
dengan kesalahan yang terjadi pada waktu itu
 Kesalahan dibagi 2, yaitu :
1. Kesalahan pada saat implementasi
program yaitu kesalahan sintaks yang
secara langsung akan dideteksi oleh
kompiler (compile-time error), terjadi pada
saat program sedang dikompilasi.
2. Kesalahan Logika ketika program sedang
dijalankan, terjadi pada saat program
dijalankan(run-time error atau fatal error).
Kesalahan ini akan mengakibatkan
terhentinya program secara abnormal.
 FORMAT PENGUMPULAN TUGAS
I. PENDAHULUAN III. PERANCANGAN (MS.ACCESS)
1.1 GAMBARAN UMUM PERUSAHAAN
3.1 PERANCANGAN STRUKTUR FILE
1.2 STRUKTUR ORGANISASI
3.2 RELASI TABEL
1.3 URAIAN TUGAS
3.3 PERANCANGAN ANTAR MUKA
1.4 AKTIVITAS PERUSAHAAN

II. ANALISIS SISTEM YANG BERJALAN IV. LAMPIRAN

2.1 ANALISIS SISTEM YANG BERJALAN
2.2 ANALISIS DOKUMEN
2.3 ANALISIS PROSES
2.3.1 FLOW MAP
2.3.2 DFD
2.3.3 KAMUS DATA
2.3.4 NORMALISASI
2.3.5 ERD