Perancangan
Perancangan
Tampilan
Tampilan
Pertemuan 09
Kriteria yang terpenting dari
sebuah antarmuka adalah
tampilan yang menarik
Seorang pengguna,
biasanya tertarik untuk
mencoba sebuah program
aplikasi dengan terlebih
dahulu tertarik pada suatu
tampilan yang ada
dihadapan matanya
Peranca
Peranca
-
-ngan
ngan
Tampilan
Tampilan
Syarat untuk membuat tampilan
menarik adalah :
1.
harus mempunyai jiwa seni yang
memadai.
2.
harus mengerti selera user
secara umum
3.
harus bisa meyakinkan
pemrogramannya, agar yang
dibayangkan dapat diwujudkan
(diimplementasikan) dengan
piranti bantu (tool) yang tersedia
4.
harus mendokumentasikan
semua pekerjaan yang dilakukan
Peranca
Peranca
-
-ngan
ngan
Tampilan
Tampilan
Peranca
Peranca
-
-ngan
ngan
Tampilan
Tampilan
Cara-cara pendokumentasian :
1. membuat sketsa pada kertas
2. menggunakan peranti prototipe GUI
3. menuliskan tekstual yang
menjelas-kan tentang kaitan antara satu
jendela dengan jendela yang lain
4. menggunakan peranti bantu yang
biasa disebut CASE
(Computer-Aided Software Enginneering)
untuk cara ke 2 & 4 jarang digunakan
karena mahal dan biasanya untuk
pembuatan antarmuka grafik
Perancangan
Perancangan
Tampilan
Tampilan
–
–
untuk cara
untuk cara
pendekatan
pendekatan
Program aplikasi, pada dasarnya terdiri
dari 2 kategori yaitu :
Program aplikasi untuk keperluan
khusus dengan user yang khusus
juga (special purpose software)
Program aplikasi yang akan
digunakan oleh banyak user
(general purpose software)
Bidang
Bidang
Studi
Studi
Program Aplikasi untuk SPS adalah :
inventori gudang, pengelolaan data
mahasiswa, pelayanan reservasi hotel
Ada 2 pendekatan yang dilakukan untuk
SPS adalah
User-Centered Design
Perancangan antarmuka yang melibatkan
user. User diajak untuk aktif berpendapat dan
bersama-sama merancang antarmuka yang
diinginkan user.
User Design Approach
User sendiri yang merancang antarmuka
sesuai keinginan. Tetapi hal ini memberatkan
bagi pemrograman (mis. Peranti yang tidak
mendukung, dll).
Special
Purpose
software
-SPS
Bidang
Bidang
Studi
Studi
Program Aplikasi untuk SPS adalah :
inventori gudang, pengelolaan data
mahasiswa, pelayanan reservasi hotel
Ada 2 pendekatan yang dilakukan untuk
SPS adalah
User-Centered Design
Perancangan antarmuka yang melibatkan
user. User diajak untuk aktif berpendapat dan
bersama-sama merancang antarmuka yang
diinginkan user.
User Design Approach
User sendiri yang merancang antarmuka
sesuai keinginan. Tetapi hal ini memberatkan
bagi pemrograman (mis. Peranti yang tidak
mendukung, dll).
Special
Purpose
software
-SPS
Bidang
Bidang
Studi
Studi
Program Aplikasi untuk GPS disebut
juga sebagai Public Software.
Dimana aplikasi dapat digunakan
oleh berbagai user dengan
karakteristik yang beragam serta
berbagai tingkat kepandaian
Kunci utama GPS adalah dengan
melakukan :
-
antarmuka customization
-pengaturan desktop
-
pemilihan warna desktop oleh user
General
Purpose
software
-GPS
Bidang
Bidang
Studi
Studi
Ada 4 komponen antarmuka
user adalah
Model User
Merupakan model konseptual yang diinginkan
user dalam memanipulasi informasi dan
proses.
Bahasa Perintah–Command Language
Merupakan bahasa perintah dimana user
dengan cepat dapat mengoperasikannnya
Umpan Balik
Kemampuan sebuah program yang
membantu user untuk mengoperasikan
program itu sendiri.
Penampilan Informasi
Digunakan untuk menunjukkan status
informasi atau program ketika user
melakukan tindakan
Prinsip
dan
Petunjuk
Perancan
gan
Langkah-langkah
perancang-an perancang-antar muka adalah :
1.
Urutan perancangan
2.
Perancangan tampilan
berbasis teks
3.
Perancangan tampilan
berbasis grafis
4.
Waktu tanggap
5.
Penanganan kesalahan
Peranca
Peranca
-
-ngan
ngan
Tampilan
Tampilan
Bidang
Bidang
Studi
Studi
Dikerjakan secara top-down.
Proses perancangan dapat
dikerjakan sebagai berikut :
Pemilihan ragam dialog
Perancangan struktur dialog
Perancangan format pesan
Perancangan penangan
kesalahan (dengan validasi,
proteksi user, pemulihan dari
kesalahan dan penampilan
pesan kesalahan)
Perancangan struktur data
1. Urutan
Peranca-ngan
Bidang
Bidang
Studi
Studi
Pemilihan ragam dialog
dipengaruhi oleh karakteristik
populasi pengguna
(pengguna mula, menengah
atau pengguna ahli), tipe
dialog yang diperlukan, dan
kendala teknologi yang ada
untuk mengimplementasikan
ragam dialog tersebut
Pemilih-an
Ragam
Bidang
Bidang
Studi
Studi
adalah melakukan analisis
tugas dan menentukan model
pengguna dari tugas tersebut
untuk membentuk struktur
dialog yang sesuai
Pada tahap ini pengguna
sebaiknya banyak dilibatkan
sehingga pengguna langsung
mendapatkan umpanbalik yang
berupa diskusi informal
maupun prototipe dari dialog
yang nantinya akan
digunakannya
Peranca-ngan
Struktur
Dialog
Bidang
Bidang
Studi
Studi
Tata letak tampilan dan
keterangan tektual secara terinci
harus mendapat perhatian lebih.
Kebutuhan data masukan yang
mengharuskan pengguna untuk
memasukkan data ke dalam
komputer juga harus
dipertimbangkan dari segi
efisiensinya
Contoh : dengan mengurangi
pengetikan yang tidak perlu
dengan cara mengefektifkan
penggunaan tombol
Peranca-ngan
Format
Bidang
Bidang
Studi
Studi
Dalam pengoperasian sebuah program
aplikasi, tidak dapat dihindarkan adanya
kesalahan yang dilakukan oleh pengguna.
Untuk menghindari adanya kondisi
abnormal termination, yaitu eksekusi
program berhenti karena terjadi kesalahan.
Bentuk-bentuk penanganan kesalahan
yang dapat dilakukan antara lain adalah :
Validasi pemasukan data (mis: hrs input >0
tetapi yang diinput <0)
Proteksi pengguna (mis: program memberi
peringatan ketika pengguna melakukan
suatu tindakan secara tidak sengaja)
Pemulihan dari kesalahan (tersedianya
mekanisme untuk membatalkan tindakan
yang baru saja dilakukan)
Penampilan pesan salah yang tepat dan
sesuai dengan kesalahan yang terjadi
Peranca-ngan
Penanga
nan
Kesalah-an
Bidang
Bidang
Studi
Studi
Harus menentukan struktur
data yang dapat digunakan
untuk menyajikan dan
mendukung fungsionalitas
komponen-komponen
antarmuka yang diperlukan.
Struktur ini harus dipetakan
langsung ke dalam model
pengguna yang telah dibuat,
meskipun tingkat kompleksitas
antara satu aplikasi dengan
aplikasi lain dapat saja
berbeda.
Peranca-ngan
Struktur
Bidang
Bidang
Studi
Studi
Pada perancangan tampilan untuk
antarmuka berbasis teks, ada 6 faktor
yang harus dipertimbangkan agar
diperoleh tata letak yang berkualitas
tinggi, antara lain :
Urutan penyajian
Harus disesuaikan dengan model pengguna, apabila tidak dapat dicapai, maka perancang harus membuat semacam kesepakatan dengan calon pengguna tentang urutan tampilan yang akan digunakan
Kelonggaran – Spaciousness
Penyusunan tata letak yang tidak mengindahkan estetika akan mempersulit pengguna dalam melakukan pencarian suatu teks. Teks-teks tertentu harus ditempatkan dalam posisi tertentu dengan harapan ia dapat langsung memusatkan perhatian pengguna
2.
Perancan
gan
Tampilan
Berbasis
Teks
Bidang
Bidang
Studi
Studi
Pada perancangan tampilan untuk antarmuka
berbasis teks, ada 6 faktor yang harus
dipertimbangkan agar diperoleh tata letak yang
berkualitas tinggi, antara lain :
Pengelompokan
Data yang saling berkaitan sebaiknya dikelompokkan untuk mempermudah
penstrukturan layar tampilan secara keseluruhan Relevansi
Tampilkan hanya pesan-pesan yang relevan dengan topik yang sedang ditampilkan pada layar Konsistensi
Dalam sistem berbasis frame, pengguna
dihadapkan pada sejumlah tampilan yang penuh dengan informasi. Perancang harus konsisten dalam menggunakan ruang tampilan
Kesederhanaan
Cara paling mudah untuk menyajikan aras
informasi yang dapat dipahami dengan cepat oleh pengguna
2.
Perancan
gan
Tampilan
Berbasis
Teks
Contoh tata Letak Tekstual
Bidang
Bidang
Studi
Studi
Ada 5 faktor yang harus diperhatikan pada
saat merancang antarmuka berbasis
grafis
Ilusi pada obyek-obyek yang dapat
dimanipulasi. Harus melibatkan 3
komponen :
Gunakan kumpulan obyek yang sesuai dengan aplikasi, jika belum ada dikembangkan sendiri Penampilan obyek-obyek harus dilakukan
dengan keyakinan agar mudah dimengerti oleh pengguna
Gunakan mekanisme yang konsisten untuk memanipulasi obyek yang akan muncul dilayar
Urutan visual dan fokus pengguna
Antarmuka grafis dapat digunakan untuk menarik perhatian pengguna dengan membat suatu obyek berkedip/menggunakan warna tertentu/animasi
Gunakanlah rangsangan visual tertentu untuk
3.
Perancan
gan
Tampilan
Berbasis
Grafis
Bidang
Bidang
Studi
Studi
Ada 5 faktor yang harus diperhatikan pada
saat merancang antarmuka berbasis
grafis
Struktur internal
Merupakan suatu tanda khusus yang digunakan untuk menunjukkan adanya perbedaan
Khusus pada obyek-obyek yang dapat dimanipulasi perancang harus memberikan struktur internal dalam bentuk yang berbeda dengan yang digunakan pada dokumen tekstual
Kosakata grafis yang konsisten dan sesuai
Penggunaan simbol-simbol obyek/icon, tidak ada standar dan biasanya disesuaikan dengan kreatifitas perancang.
Kesesuaian dengan media
Karakteristik khusus dari layar tampilan yang digunakan akan mempunyai pengaruh yang besat terhadap keindahan antarmuka yang akan ditampilkan.
3.
Perancan
gan
Tampilan
Berbasis
Grafis
Bidang
Bidang
Studi
Studi
Keinginan user agar program
aplikasinya memberikan waktu
tanggap yang
sependek-pendeknya
Waktu tanggap > 14 detik
merupakan waktu tanggap yang
lama
