Perancangan Antar Muka Interface
Konsep rancangan yang sangat penting untuk mendesain halaman web adalah resolusi monitor. Terdapat 3 buah resolusi yang umum digunakan pada
monitor, diantaranya 640x480, 800x600, 1024x768 pixel. Pada umumnya halaman web didesain untuk resolusi 800x600 karena pada umumnya pengguna
sistem memakai monitor ukuran 14 atau 15 inchi. Dalam merancang tampilan sebuah situs, harus menggambarkan layout
dari situs yang akan dibuat. Layout berfungsi untuk memudahkan dalam mendesain tampilan pada sebuah halaman web. Berikut ini merupakan bagian-
bagian dari aplikasi web yang interfacenya berbasis desktop tersebut: a.
Halaman Login Di bawah ini adalah gambar halaman login, tampilan awal saat ingin
menggunakan aplikasi.
Gambar 3.9 Halaman Login
Pada halaman login, terdapat dua buah textbox dan dua buah button. Textbox tersebut digunakan untuk mengisi user name dan password, dan
dua button yaitu submit untuk masuk ke halaman selanjutnya, sedangkan
reset digunakan untuk mengembalikan tampilan form user name dan password seperti semula textbox blank.
b. Halaman Admin
Di bawah ini adalah tampilan awal halaman admin.
Gambar 3.10 Halaman Admin
Pada halaman Admin, dapat terlihat 6 sub menu yaitu barang, customer, pegawai, jenis service, user dan user group. Pada sub menu barang,
customer, pegawai dan jenis service, seorang admin dapat melakukan add data yaitu penambahan data, edit data yaitu merubah data yang ada,
remove data yaitu menghapus data sedangkan print PDF yaitu mencetak data dalam PDF.
c. Halaman Pegawai
Beriku ini adalah tampilan awal halaman pegawai.
Gambar 3.11 Halaman Pegawai
Pada halaman pegawai di atas, terdapat tiga menu yaitu service, customer, file upload serta pegawai. Seorang pegawai dapat menambah data,
merubah data, menghapus data serta mencetak data service dalam bentuk PDF pada ketiga menu tersebut, dan mengupload penawaran untuk user
customer. d.
Halaman Owner Pada halaman Owner, terdapat berbagai menu seperti yang tampak pada
gambar 3.12 berikut.
Gambar 3.12 Halaman Owner
Pada gambar tersebut, terdapat empat menu yaitu, laporan barang, laporan customer, laporan pegawai, dan laporan service. Owner hanya dapat
melihat dan mencetak laporan yang telah ada, tanpa bisa mengedit, merubah dan menghapus data.
e. Halaman Customer
Pada halaman customer ada 2 menu yang di tampilkan, seperti pada gambar berikut.
Gambar 3.13 Halaman Customer
Pada gambar di atas dua menu yang ditampilkan yaitu service dan file download. Customer tidak dapat menambahkan data pada bagian add data,
merubah data yang ada di bagian edit data serta tidak dapat menghapus data pada bagian remove data. Customer hanya dapat melihat dan
mencetak data service dalam bentuk PDF dengan mengklik Print PDF dan mendownload produk penawaran CV berbentuk pdf.
f. Halaman Service
Halaman service add data berfungsi untuk menambah data service customer. Tampilan halamannya seperti gambar di bawah ini.
Gambar 3.14 Halaman Sevice
Terdapat kolom-kolom isian, pertama mengenai keterangan detail jenis service, kemudian kolom pegawai yang merupakan penanggung jawab jika
terjadi kesalahan input data. Kolom nama customer, serta status barang service, selain itu terdapat juga kolom untuk mencantumkan tanggal
masuk dan keluar barang yang diservice. Serta biaya service dapat dicantumkan pada kolom Jumlah Dibayar. Pada bagian bawah terdapat
tombol save dan close. Tombol save untuk menyimpan data service, sedangkan tombol close untuk menutup halaman add data.
53