Upload
imam-irnawan
View
245
Download
4
Embed Size (px)
DESCRIPTION
hvsrhsjdbgskjdbvksrbkdbv sdbfvebasvdvasbvciqsbajsdbviehvbaikshvbaksbv aib
Citation preview
Di bawah ini adalah dasar – dasar perancangan tampilan Sistem Administrasi Toko Komputer
Quadra. Rancangannya sebagai berikut :
1. Dimulai dari form awal atau main menu yang tampilannya sebagai berikut :
Berdasarkan gambar diatas, poin pertama adalah menu. Peletakan menu ada di kiri atas dan terdapat
logo Quadra kecil di setiap menu. Tujuannya hanya unutk mempermanis tampilan menu.
Poin kedua adalah background. Warna yang dipilih untuk background adalah warna putih, warna putih
dipilih karena adalah warna yang bersih. Warna putih warna yang cerah dan bersifat netral, karena warna
ini memperjelas warna di obyek lain.
Poin ketiga adalah logo big Quadra. Logo tidak ada yang dirubah dari bentuk dan warnanya. Letak logo
ada di tengah dan menjadi yang terbesar diantara obyek yang lain agar menjadi obyek yang eye catching.
Dimana user langsung mengenali bahwa ini adalah aplikasi resmi milik Quadra.
Poin keempat adalah tulisan Quadra. Sebetulnya tulisan ini menjadi satu dengan logo Quadra. Hanya
saja dipisahkan agar bisa digabungkan dengan tulisan “ Welcome to … “. Ini hanya merupakan variasi agar
tampilan logo menjadi lebih menarik. Di bawahnya langsung tersedia inputan untuk Log in, password serta
tombol masuk, ketiganya di posisikan di bawah logo supaya user tidak bingung mencari jalan masuk ke
aplikasi karena obyek – obyek tersebut langsung terlihat setelah user membaca tulisan “ Welcome to
Quadra”.
Poin kelima adalah tombol shortcut untuk form pembelian dan penjualan. Pewarnaan tombol ini
adalah oranye dan hijau. Pemilihan warna ini diserasikan dengan logo Quadra sendiri ( oranye dan hijau ).
Bentuk tombol ini berbeda dengan tombol lainnya, ini hanya sekedar variasi saja.
Poin keenam adalah tombol exit. Bentuk tombol ini bulat dan terdapat gambar pintu yang bertuliskan
exit. Gambar ini hanyalah penegasan kepada fungsi tombol tersebut, karena sebetulnya sudah terdapat
kata “exit” di bawahnya. Bentuk tombol bulat dan ini hanya sekedar variasi saja.
Poin ketujuh adalah gabungan obyek garis tebal dan tipis serta obyek rounded rectangle yang di
dalamnya terdapat tulisan “main menu”. Ini hanyalah bentuk obyek garis yang di kombinasikan dengan
pewarnaan yang di sesuaikan dengan logo Quadra. Sedangkan obyek rounded rectangle dengan tulisan
“main menu” di dalamnya hanya sebagai pemanis.
2. Form kedua adalah form penjualan yang tampilannya sebagai berikut :
Berdasarkan gambar di atas, poin pertama adalah gambar transaksi penjualan, bentuk
obyek ini abstrak dan terdapat tulisan “transaksi penjualan” di dalamnya. Tidak ada unsur
khusus, ini hanya untuk membedakan form yang lainnya.
Poin kedua adalah gambar kecil kaca pembesar. Gambar ini hanya untuk mempertegas
inputan di sampingnya yang berupa inputan untuk mencari atau searching.
Poin ketiga adalah tempat tampilnya database yang bersangkutan. Di letakkannya tampilan
database di form ini bertujuan agar user bisa melihat langsung isi database yang bersangkutan,
yang dimana ini adalah database transaksi penjualan.
Poin keempat adalah logo Quadra transparan dibelakang inputan. Sebetulnya ini hanya
untuk mengisi kekosongan dan mempercantik latar belakang kolom inputan.
Poin kelima adalah combo box. Bila ada combo box, maka di situ terdapat istilah multiple
choice yang dimana user bisa memilih beberapa pilihan. Karena terdapat label “tanggal”, maka
user bisa memilih angka tanggalan dari 1 sampai 30, bulan dari Januari sampai dengan
Desember dan tahun dari sekian hingga sekian ( tergantung isian dari programmer ).
Poin keenam adalah tombol – tombol bulat bergambar. Seperti tampilan menu utama di
atas, gambar yang ada di dalam tombol merupakan penegasan pada fungsi tombol tersebut.
Sedangkan bentuk bulat hanya sekedar variasi saja.
3. Form ketiga adalah form transaksi pembelian :
Tidak jauh berbeda dengan tampilan form kedua, poin pertama yang dimana gambar
transaksi pembelian yang berwarna hijau. Dipilih warna berbeda agar user bisa membedakan
form satu dengan yang lain.
Poin kedua adalah combo box. Kali ini combo box ada di label “jenis barang”, user bisa
memilih jenis barang yang akan di transaksikan. PIlihan bisa dari VGA, RAM, Mouse dan
sebagianya.
4. Form keempat adalah form laporan pembelian yang tampilan sebagai berikut :
Tidak beda dengan form sebelumnya, perbedaan ada pada poin pertama yang dimana
gambarnya berbeda guna membedakan dengan form lain.
Poin kedua adalah combo box, kali ini combo box ada di label “perangkat”, user bisa
memilih perangkat apa yang akan di transaksikan.
5. Form kelima adalah form laporan penjualan yang tampilannya sebagai berikut :
Tidak beda dengan form sebelumnya, perbedaan hanya pada poin pertama. Perbedaan
dengan form laporan pembelian adalah tulisan di dalam obyeknya saja.
6. Form keenam adalah form karyawan yang tampilannya sebagia berikut :
Sesuai gambar di atas, poin pertama adalah gambar logo form karyawan. Seperti gambar
pada form sebelumnya, gambar dibuat lain agar user bisa membedakan dengan form yang lain.
Poin kedua adalah tempat foto karyawan. Di sini user bisa menaruh gambar atau foto
karyawan yang bersangkutan dengan isian input di bawahnya.
Poin ketiga adalah combo box, kali ini combo box ada di label “jabatan”, berarti user bisa
memilih jabatan karyawan di Quadra.
7. Form ketujuh adalah form karyawan yang tampilannya sebagai berikut :
Serupa dengan form kedua, hanya saja pada poin pertama yaitu gambar logo form ini.
Ditambah combo box yang berada di label “perangkat” dan “tgl masuk” untuk multiple choice.
8. Form kedelapan adalah form supplier yang tampilannya sebagai berikut :
Serupa dengan form kedua, hanya saja pada poin pertama yaitu gambar logo form ini.
9. Form kesembilan adalah form pemesanan barang yang tampilanya sebagai berikut :
Serupa dengan form kedua, hanya saja pada poin pertama yaitu gambar logo form ini.
10. Form kesepuluh adalah form utility user yang tampilan sebagai berikut :
Sesuai gambar di atas, poin pertama adalah gambar logo form utility user. Seperti gambar
pada form sebelumnya, gambar dibuat lain agar user bisa membedakan dengan form yang lain.
Poin kedua adalah tempat foto karyawan. Di sini user bisa menaruh gambar atau foto
karyawan yang bersangkutan dengan isian input di bawahnya.
Poin ketiga adalah combo box, kali ini combo box ada di label “jabatan”, berarti user bisa
memilih jabatan karyawan di Quadra.
11. Form kesebelas adalah form ganti password yang tampilannya sebagai berikut :
Sesuai gambar di atas, poin pertama adalah logo asli Quadra. Diletakkan di samping kolom inputan sebagai pemanis form ini.
Poin kedua adalah dua tombol hijau. Pemilihan warna hijau disesuaikan dengan warna dominan di logo Quadra. Bentuk tombol kotak hanya sekedar variasi.