11/20/2012

Perancangan Formulir dan

Laporan
Modern Systems Analysis and Design
Fourth Edition

Jeffrey A. Hoffer

1
 11/20/2012

Formulir vs Laporan
Formulir
• Sebuah dokumen bisnis yang berisi beberapa data yang
telah ditetapkan
p dan dapat
p mencakup p beberapa
p daerah
di mana data tambahan harus terisi
• Sebuah contoh dari formulir biasanya didasarkan pada
satu record database.
Laporan
• Sebuah dokumen bisnis yang berisi hanya data yang
telah ditetapkan.
• Sebuah dokumen pasif untuk membaca atau melihat
data.
• Biasanya berisi data dari catatan banyak database atau
transaksi. 3

Jenis Laporan secara Umum

• Terjadwal: dibuat pada interval waktu yang telah
ditetapkan untuk memenuhi kebutuhan informasi
rutin
• Key-indikator: memberikan ringkasan informasi
penting secara teratur
• Pengecualian: Data menyoroti diluar rentang
operasi normal
• Drill-down: memberikan rincian belakang
ringkasan kunci-indikator atau pengecualian
laporan
• Ad-hoc: menanggapi permintaan yang tidak
direncanakan untuk non-rutin kebutuhan informasi
4

2
 11/20/2012

Proses Merancang Formulir dan

Laporan
• Pengguna yang berfokus pada aktivitas
• Mengikuti pendekatan prototyping
• Persyaratan penentuan:
– Siapa yang akan menggunakan formulir atau laporan
tsb.?
– Apa tujuan dari formulir atau laporan?
– Kapan laporan itu dibutuhkan atau digunakan?
– Dimana formulir atau laporan harus disampaikan dan
digunakan?
– Berapa banyak orang perlu menggunakan atau
melihat formulir atau laporan?
5

Proses Merancang Formulir dan

Laporan (cont.)
• Prototyping
– Prototipe awal dirancang dari kebutuhan
– Pengguna mereview desain prototipe dan
termasuk menerima perubahan desain
atau permintaan
– Jika ada perubahan yang diminta, maka
siklus konstruksi-evaluasi-perbaikan
diulang sampai desain diterima

3
 11/20/2012

Sebuah lembaran koding

adalah alat kuno untuk
merancang formulir dan
laporan, biasanya
berhubungan dengan
berbasis teks formulir
dan laporan untuk
aplikasi mainframe

Visual Basic
dan alat-alat
pembangunan
lainnya
menyediakan
alat bantu
komputer
b t k GUI dan
bentuk d
pembentuk
laporan

4
 11/20/2012

Spesifikasi Desain Formulir atau

Laporan
• Hasil utama dari desain antarmuka
• Melibatkan tiga bagian:
– Bahasan Narasi : ciri pengguna, tugas,
sistem, dan faktor lingkungan
– Contoh desain: gambar bentuk (dari
coding sheet atau formulir alat
pembangun/pengembangan)
– Penilaian: ukur test / kegunaan hasil
(konsistensi, kecukupan, akurasi, dll)
9

Panduan Desain Formulir atau

Laporan
• Judul y yang
g berarti: jjelas,, spesifik,
p , informasi
versi, tanggal
• Informasi yang berarti : hanya mencakup
informasi yang diperlukan, tanpa perlu
memodifikasi
• Tataletak seimbang: jarak yang memadai,
margin dan label yang jelas
margin,
• Sistem navigasi mudah: menunjukkan
bagaimana untuk bergerak maju dan mundur,
dan di mana posisi saat ini
10

5
 11/20/2012

Desain
D i
Formulir
yang
jelek

11

Desain
D i
Formulir
yang
bagus

12

6
 11/20/2012

Penggunaan Highlighting pada

Formulir dan Laporan
• Beritahu pengguna bila ada kesalahan
d l
dalam entri
tiddata
t atau
t pengolahan.
l h
• Memberikan peringatan tentang
kemungkinan masalah.
• Menarik perhatian ke kata kunci, perintah,
prioritas tinggi pesan
pesan, data nilai yang tidak
biasa.

13

Metode untuk Highlighting

• Kedip (Blinking) • Membalik arah
• Terdengar nada video
(Audible tones) • Kotak (Boxing)
• Perbedaan • Grs bawah
Intensitas (Underlining)
• Perbedaan ukuran • Seluruh huruf
• Perbedaan bentuk besar
huruf/font • Posisi offset untuk
info yang tdk
14
standar

7
 11/20/2012

Highligt dapat
mencakup
penggunaan
huruf besar,
perbedaan
ukuran font,
tebal, miring,
garis bawah
bawah,
tinju, dan
pendekatan
lainnya
15

Berwarna vs. Tidak Berwarna

• Manfaat dari Penggunaan • Masalah dari Penggunaan
Warna Warna
– Menenangkan atau pencolok – Pasangan warna bisa
mata menyakitkan atau
– Aksen tampilan menarik menyebabkan masalah bagi
– Memfasilitasi diskriminasi beberapa pengguna
halus dalam penampilan yg – Resolusi dapat menurun
kompleks dengan menampilkan yang
– Menekankan organisasi berbeda
logis dari informasi – Konsistensi warna dapat
– Menarik perhatian & menurun pada layar yang
peringatan berbeda
– Membangkitkan reaksi lebih – Pencetakan atau konversi ke
emosional media lain tidak mungkin
dengan mudah
menerjemahkan 16

8
 11/20/2012

Panduan untuk Penayangan Text

• Kasus: huruf besar dan kecil campuran,
gunakan tanda baca konvensional
• Spasi: spasi ganda jika mungkin, jika baris
kosong antara paragraf
• Justifikasi: kiri membenarkan teks, margin yang
tepat
• Hyphenation: tidak ada kata
kata-kata
kata ditulis dgn
tanda penghubung antara baris
• Singkatan: hanya jika dipahami secara luas dan
secara signifikan lebih pendek dari teks lengkap
17

Rancangan
Layar yang
jelek

18

9
 11/20/2012

Rancangan
layar yang
baik

19

Panduan Tabel dan Daftar

• Label
– Semua kolom dan baris harus memiliki label
bermakna.
– Label harus dipisahkan dari informasi lain
dengan menggunakan penyorotan.
– Redisplay label ketika data melampaui satu
layar atau halaman.

20

10
 11/20/2012

Panduan Tabel dan Daftar

• Format kolom, baris dan teks:
– Urutkan dalam urutan yang bermakna.
– Tempatkan baris kosong antara setiap lima baris dalam
k l
kolom panjang.
j
– Informasi serupa ditampilkan dalam beberapa kolom
harus diurutkan secara vertikal.
– Kolom harus memiliki minimal dua spasi di antara
mereka.
– Biarkan spasi
p p
pada laporan
p dicetak untuk p
pengguna
gg
untuk menulis catatan.
– Gunakan jenis huruf tunggal, kecuali untuk penekanan.
– Gunakan keluarga yang sama tipografi dalam dan di
layar dan laporan.
21
– Hindari terlalu font “mewah”.

Panduan Tabel dan Daftar

• Memformat angka, data tekstual dan
alfanumerik:
– Rapat Kanan data numerik dan
menyelaraskan kolom dengan titik desimal
atau pembatas lainnya.
– Rapat Kiri data tekstual. Gunakan panjang
garis pendek, biasanya 30 sampai 40 karakter
per baris.
p
– Potong urutan panjang data alfanumerik
menjadi kelompok-kelompok kecil terdiri dari
tiga sampai empat karakter masing-masing.

22

11
 11/20/2012

Rancan
gan
Tabel
yang
buruk

23

Rancan
gan
baik

24

12
 11/20/2012

Tabel vs. Grafik

• Gunakan tabel untuk membaca nilai data
individu
• Gunakan grafik untuk:
– Menyediakan ringkasan
– Menampilkan tren dari waktu ke waktu
– Membandingkan poin dan pola variabel
– Peramalan kegiatan
– Menyederhanakan pelaporan dr sejumlah besar
informasi

25

26

13
 11/20/2012

Bar dan garis grafik

memberikan
ringkasan informasi
bergambar yang
dapat meningkatkan
nilai laporan dan
formulir.

27

Menilai kegunaan
• Evaluasi keseluruhan bagaimana sistem
b k j d
bekerja dalam
l mendukung
d k pengguna
tertentu untuk suatu tugas tertentu
• Ada tiga karakteristik
1. mempercepat
2 ketepatan
2.
3. kepuasan

28

14
 11/20/2012

Panduan untuk memaksimalkan

kegunaan
• Konsistensi: terminologi, format, judul,
navigasi waktu respon
navigasi,
• Efisiensi: meminimalkan tindakan yang
diperlukan pengguna
• Kemudahan: cukup jelas output dan label
• Format: tampilan sesuai data dan simbol
• Fleksibilitas: memaksimalkan pilihan pengguna
untuk input data sesuai dengan preferensi

29

Karakteristik untuk Pertimbangan

• Pengguna: pengalaman, keterampilan,
motivasi,
ti i pendidikan,
didik kkepribadian
ib di
• Tugas: tekanan waktu, biaya kesalahan,
jangka waktu kerja
• Sistem: Platform
• Lingkungan: isu-isu
isu isu sosial dan fisik

30

15
 11/20/2012

Metoda untuk menguji kegunaan

• Waktu untuk belajar
• Kecepatan kinerja
• Tingkat kesalahan
• Retensi dari waktu ke waktu
• Kepuasan subyektif

31

Kesalahan pd Rancangan Tata

letak Halaman Web
• Non standar widget
• P
Penampilan
il ikl
iklan
• Pendarahan edge teknologi
• Scrolling teks dan animasi perulangan
• Usang informasi
• Lambat waktu download
• Tetap diformat teks
• Panjang halaman

32

16
 11/20/2012

Praktek Rancangan Web yang

baik
• Grafik yg ringan: gambar kecil untuk
men-download gambar cepat
• Bentuk dan Integritas data
• Template berbasis HTML
• Template untuk menampilkan dan
memproses atribut umum dari tingkat
yang lebih tinggi, item lebih abstrak
• Menciptakan antarmuka yang sangat
mudah untuk mempertahankan
33

17