BAB 4 HASIL DAN PEMBAHASAN
4.1 Spesifikasi Sistem Berikut ini adalah spesifikasi sistem yang diperlukan untuk menjalankan aplikasi yang dirancang.
4.1.1 Gambar Spesifikasi Sistem
Gambar 4.1 Spesifikasi Sistem
4.1.2 Spesifikasi Perangkat Keras Spesifikasi perangkat keras minimum yang diperlukan oleh PT Indo Tekno Semesta untuk mengimplementasikan aplikasi yang sudah dirancang adalah sebagai berikut:
321
322
Tabel 4.1 Spesifikasi Perangkat Keras Perangkat Keras
Server
Client
Processor
Intel Pentium IV 1,8 GHz
Intel Pentium IV 1,8 GHz
RAM
512MB
256MB
Monitor
LCD 14''
LCD 14''
Hard Disk
100GB
20GB
Keyboard
Ya
Ya
Mouse
Ya
Ya
Printer
Tidak
Ya
Modem
Ya
Ya
4.1.3 Spesifikasi Perangkat Lunak Spesifikasi perangkat lunak minimum yang diperlukan oleh PT Indo Tekno Semesta untuk mengimplementasikan aplikasi yang sudah dirancang adalah sebagai berikut:
Tabel 4.2 Spesifikasi Perangkat Lunak Perangkat Lunak
Server
Client
Sistem Operasi
Microsoft Windows XP
Microsoft Windows XP
DBMS
MySQL 10.1.10
-
Web Server
Apache
-
Web Browser
Google
Chrome Google
Chrome
(disarankan),
Internet (disarankan),
Internet
Explorer, Mozilla Firefox, Explorer, Mozilla Firefox, Opera, dan lain-lain
Opera, dan lain-lain
4.1.4 Spesifikasi Jaringan Untuk menjalankan aplikasi ini, dibutuhkan koneksi jaringan internet yang menghubungkan antara server dengan client. Jika client melakukan request ke server, maka server akan mengembalikan response ke web browser client.
323
4.2 Implementasi 4.2.1
Jadwal Implementasi Tabel 4.3 Tabel Jadwal Implementasi
No Kegiatan
September
Oktober
November
Desember
Januari
Februari
2016
2016
2016
2016
2017
2017
Minggu ke-
Minggu ke-
Minggu ke-
Minggu ke-
Minggu ke-
Minggu ke-
1 1
Requirement Collection and Analysis
2
Database Design
3
Application Design and Coding
4
Installation and Testing
5
System Evaluation
2
3
4
1
2
3
4
1
2
3
4
1
2
3
4
1
2
3
4
1
2
324
4.2.2 Konversi Data, Backup & Recovery Data 4.2.2.1 Konversi Data Konversi data dilakukan secara manual pada minggu ke-2 installation and testing dengan cara menginput data dari excel ke dalam sistem basis data dari aplikasi yang dirancang. Konversi data mencakup seluruh data perusahaan yang selama ini digunakan untuk keperluan operasional.
4.2.2.2 Backup Untuk mencegah terjadinya kehilangan atau kerusakan data yang tidak disengaja, maka perlu dilakukan backup data secara rutin. Backup data dilakukan secara periodikal per bulan. Backup data dilakukan secara manual (export) dari sistem basis data yang dilakukan oleh superuser dan disimpan ke dalam media penyimpanan eksternal berupa hard disk.
4.2.2.3 Recovery Data Jika terjadi system down atau kerusakan data, maka perlu dilakukan upaya recovery data untuk menjalankan aplikasi kembali. Recovery data dilakukan dengan cara manual (import) data dari media eksternal tempat tersimpannya data hasil backup ke dalam sistem basis data yang berjalan.
4.3 Panduan Pengoperasian Program Aplikasi Berikut adalah panduan pengoperasian program aplikasi pembelian, penyimpanan dan penjualan untuk PT Indo Tekno Semesta:
325
4.3.1 Halaman untuk Pelanggan 1. Halaman Beranda
Gambar 4.2 Tampilan Halaman Beranda
326
Pada saat mengakses aplikasi ini, user akan melihat halaman beranda yang mencakup informasi-informasi seperti produk terbaru yang dijual, merk produk yang bekerja sama dengan PT Indo Tekno Semesta, nomor telepon perusahaan, dan sebagainya.
Gambar 4.3 Tampilan Login
Gambar 4.3 adalah tampilan form login ketika user melakukan hover ke tombol masuk yang berada pada pojok kanan atas. Pada form login tersebut, user harus memasukkan username dan juga password terlebih dahulu sebelum melakukan login. Apabila user melakukan login dengan username dan password yang kosong atau salah, maka akan muncul pesan error sesuai dengan error yang dilakukan. Jika user belum mempunyai account, maka user dapat melakukan register yang kemudian akan muncul halaman register seperti pada gambar 4.4.
327
Gambar 4.4 Tampilan Halaman Register
Pada halaman register, user harus memasukkan informasiinformasi yang diperlukan untuk keperluan proses transaksi. Setelah user melakukan register, maka aplikasi akan mengirimkan email berupa link konfirmasi kepada user seperti pada gambar 4.5. Setelah user melakukan klik pada link yang terdapat pada email yang dikirim, maka proses registrasi berhasil dilakukan dan user akan diarahkan menuju halaman beranda.
328
Gambar 4.5 Tampilan Email Konfirmasi Registrasi
Gambar 4.6 Tampilan Halaman Keranjang (hover) Kosong
329
Gambar 4.7 Tampilan Halaman Keranjang (hover) Berisi Produk
Gambar 4.6 merupakan tampilan informasi keranjang apabila user melakukan hover
ke tombol keranjang. Jika user belum
menambahkan produk apapun ke keranjang, maka akan muncul pemberitahuan bahwa keranjang kosong. Namun apabila user sudah menambahkan data, maka akan muncul informasi produk yang ditambahkan seperti pada gambar 4.7. Pada gambar 4.7, selain informasi dari produk yang akan dibeli, user juga dapat melihat detail produk yang dibeli secara langsung dengan menekan tombol lihat keranjang, ataupun langsung melakukan proses checkout dengan menekan tombol checkout.
330
Gambar 4.8 Tampilan Halaman Keranjang Tampilan
halaman
keranjang
seperti
pada
gambar
4.8
memberikan informasi lengkap tentang produk yang akan dibeli dan juga harga total yang harus dibayar. Selain itu, user juga diberikan rekomendasi produk lain yang relevan dengan produk yang dibeli oleh user. Jika user menekan tombol checkout, maka user akan diarahkan menuju halaman checkout seperti pada gambar 4.9.
331
Gambar 4.9 Tampilan Halaman Checkout
Gambar 4.9 adalah halaman checkout yang berisi form yang harus diisi oleh user sesuai dengan keperluan pengiriman barang yang dibeli. Apabila user sudah melakukan login, maka data user akan terinput secara otomatis tanpa perlu diisi ulang oleh user. Apabila user belum melakukan login, maka user harus menginput data secara lengkap. Jika terdapat input yang salah atau tidak sesuai dengan format, maka akan muncul pesan error yang sesuai dengan error yang
332
dilakukan. Jika user sudah menginput data secara benar dan telah melakukan checkout, maka aplikasi akan mengirimkan email seperti pada gambar 4.10 yang berisi kode transaksi yang dapat digunakan oleh user untuk melacak status pesanan yang telah dilakukan. Aplikasi juga akan mengirimkan email kepada karyawan PT Indo Tekno Semesta seperti pada gambar 4.11 yang memberitahukan bahwa telah ada transaksi pesanan penjualan pada web.
Gambar 4.10 Tampilan Email Pesanan (Pelanggan)
Gambar 4.11 Tampilan Email Pesanan (Karyawan)
333
2. Halaman Produk
Gambar 4.12 Tampilan Halaman Produk
Gambar 4.12 adalah halaman produk, dimana user dapat melihat semua produk yang ditawarkan oleh PT Indo Tekno Semesta baik yang sedang memiliki promosi maupun yang tidak. Pada bagian sidebar, user dapat memilih kategori yang diinginkan dan juga langsung memilih produk baru yang sedang ditawarkan. Apabila user
334
menekan tombol add to cart, maka produk akan langsung masuk ke dalam daftar keranjang.
Gambar 4.13 Tampilan Halaman Detil Produk
Halaman detil produk pada gambar 4.13 akan muncul ketika user melakukan klik pada suatu produk. Halaman ini bertujuan untuk memberikan informasi lengkap kepada user mengenai suatu produk, baik dari harga maupun deskripsi dari produk tersebut. Pada halaman ini juga ditampilkan produk yang direkomendasikan kepada user yang
335
disesuaikan dengan detil produk yang sedang ditampilkan. Ketika user menekan tombol add to cart maka produk yang dipilih tersebut akan secara otomatis masuk ke dalam daftar keranjang user.
3. Halaman Promosi
Gambar 4.14 Tampilan Halaman Promosi
336
Gambar 4.14 merupakan halaman promosi dimana pada halaman ini, user dapat melihat semua produk yang sedang memiliki promosi berupa potongan harga dari PT Indo Tekno Semesta. Jika user memilih salah satu produk yang ada, maka user akan ditujukan ke halaman detil produk seperti pada gambar 4.13.
4. Halaman Tentang Kami
Gambar 4.15 Tampilan Halaman Tentang Kami
Halaman tentang kami pada gambar 4.15 berisi tentang informasi perusahaan, baik profil singkat perusahaan maupun alamat kantor PT Indo Tekno Semesta.
337
5. Halaman Hubungi Kami
Gambar 4.16 Tampilan Halaman Hubungi Kami
Gambar 4.16 merupakan halaman hubungi kami dimana user yang memiliki kritik atau saran kepada PT Indo Tekno Semesta, dapat menghubungi pihak perusahaan melalui aplikasi ini. Sebelum mengirimkan pesan, user harus mengisi nama lengkap, telepon, email serta pesan yang ingin disampaikan. Setelah tombol kirim diklik, maka pesan akan masuk ke email perusahaan yang dapat dibaca secara langsung oleh pihak internal perusahaan. Gambar 4.17 merupakan contoh email yang masuk ke email perusahaan.
338
Gambar 4.17 Tampilan Email Contact Us
6. Halaman Lacak Pesanan
Gambar 4.18 Tampilan Halaman Lacak Pesanan
339
Jika user sudah melakukan pemesanan dan ingin mengetahui status dari produk yang dipesan, maka user dapat menggunakan menu lacak pesanan seperti yang ditampilkan pada gambar 4.18. User menginput kode pesanan yang sudah dikirimkan melalui email dan kemudian menekan tombol kirim. Aplikasi akan langsung mencari status pemesanan yang sesuai dengan kode yang diinput dan mengembalikan status pesanan tersebut kepada user. Apabila kode yang diinput salah atau tidak ditemukan, maka akan muncul pesan "kode tidak ditemukan".
4.3.2 Halaman untuk Karyawan 1. Halaman Login
Gambar 4.19 Tampilan Halaman Login
Untuk mengakses aplikasi sebagai karyawan PT Indo Tekno Semesta, user diharuskan untuk melakukan login terlebih dahulu. User melakukan login dengan mengisi username dan juga password sesuai dengan yang sudah didaftarkan. Apabila user lupa dengan passwordnya, maka user dapat menekan tombol lupa password yang sudah disediakan dan akan muncul pop-up seperti pada gambar 4.16. Jika username dan password sudah diisi, maka user dapat menekan tombol masuk untuk melakukan proses login. Jika user merupakan karyawan baru yang masih menggunakan username dan password default, maka user akan diminta untuk mengganti username dan
340
password tersebut seperti pada gambar 4.22. Selain itu, user akan langsung masuk ke halaman utama seperti pada gambar 4.23.
Gambar 4.20 Tampilan Halaman Lupa Password
Pada gambar 4.20, user yang lupa dengan password-nya harus mengisi email yang sesuai dengan email yang terdaftar dalam database. Apabila email yang diinput tidak terdaftar dalam database, maka akan muncul pesan error "email belum terdaftar". Apabila email sudah terdaftar, maka aplikasi akan mengirimkan email yang berisi link untuk mereset password dari user tersebut. Gambar 4.21 adalah contoh email yang dikirimkan berisi username dan password baru.
Gambar 4.21 Tampilan Email Lupa Password
341
2. Halaman ubah username dan password
Gambar 4.22 Tampilan Halaman Ubah Username dan Password
Jika user merupakan karyawan yang baru masuk yang masih menggunakan username dan password default yang diberikan, maka user akan diminta untuk mengganti username dan password-nya ketika melakukan login untuk pertama kalinya. Format untuk username merupakan kombinasi dari huruf dan angka, sedangkan format untuk password merupakan kombinasi dari huruf dan angka, serta harus mengandung setidaknya 1 special character. Jika data yang dimasukkan tidak sesuai dengan format yang diberikan, maka akan muncul pesan error "format salah, username harus mengandung huruf dan angka dan password harus mengandung huruf dan angka serta 1 special character". Sedangkan apabila password dan konfirmasi password yang dimasukkan tidak sama, maka akan muncul pesan error "password dan konfirmasi password tidak sama". Jika data yang diinput sudah sesuai dengan format yang ditentukan, maka user akan diarahkan menuju halaman dashboard seperti pada gambar 4.23.
342
3. Halaman Dashboard
Gambar 4.23 Tampilan Halaman Dashboard
Halaman dashboard merupakan halaman yang akan ditemui pertama kali oleh user setelah login. Pada halaman ini, user akan melihat summary dari transaksi pada periode tertentu, seperti jumlah transaksi penjualan per bulan, produk terbaru, jumlah pesanan terakhir, dan sebagainya.
343
4. Halaman Penjualan
Gambar 4.24 Tampilan Halaman Penjualan
Pada gambar 4.24, user dapat melakukan transaksi penjualan terhadap user yang sudah melakukan pemesanan baik secara online maupun datang ke kantor. Jika user menekan tombol "cari kode", maka akan muncul pop-up seperti pada gambar 4.25. User harus memilih kode pesanan yang sesuai serta mengubah status sesuai dengan transaksi. Setelah selesai melakukan proses pembayaran, maka user menekan tombol "cetak" dan akan muncul invoice seperti pada gambar 4.26 yang dapat dicetak untuk diberikan kepada pelanggan.
344
Gambar 4.25 Tampilan Halaman Pop-Up Cari Kode Pesanan
Pada gambar 4.25, user dapat melakukan double click ataupun menekan tombol pilih terhadap kode yang sesuai dengan transaksi yang sedang berlangsung untuk memilih kode transaksi tersebut.
Gambar 4.26 Tampilan Halaman Invoice Penjualan
345
Tampilan invoice penjualan yang berisi informasi mengenai pelanggan dan juga produk yang dibeli serta harga yang dibayar. Invoice berbentuk file pdf yang dapat langsung dicetak oleh user.
5. Halaman Pesanan Penjualan
Gambar 4.27 Tampilan Halaman Pesanan Penjualan (1)
Pada gambar 4.27, user harus memasukkan data pelanggan yang datang membeli dan menekan tombol lanjutkan untuk mengisi data berikutnya seperti pada gambar 4.28. Jika terdapat input yang salah atau terdapat informasi yang tidak diberikan, maka akan muncul pesan error.
346
Gambar 4.28 Tampilan Halaman Pesanan Penjualan (2)
Pada gambar 4.28, user harus mengisi data penerima dari pesanan tersebut. Jika penerima sama dengan data pembeli, maka user dapat langsung melanjutkan tanpa mengisi data. Setelah mengisi data penerima, user akan diarahkan untuk mengisi data produk yang akan dibeli seperti pada gambar 4.29.
Gambar 4.29 Tampilan Halaman Pesanan Penjualan (3)
347
Pada gambar 4.29, user akan memasukkan data produk yang akan dibeli. User memilih kode produk dengan menekan tombol yang memiliki icon "search" dan akan muncul list produk yang tersedia seperti pada gambar 4.30. Jika semua data produk telah dimasukkan, maka user akan menekan tombol cetak untuk mencetak invoice seperti pada gambar 4.31 untuk dicetak lalu diberikan kepada pelanggan.
Gambar 4.30 Tampilan Pop-Up Daftar Produk
Pada gambar 4.30, user dapat melakukan double click ataupun menekan tombol pilih terhadap kode yang sesuai dengan produk yang diinginkan untuk memilih kode produk tersebut.
348
Gambar 4.31 Tampilan Halaman Invoice Pesanan Penjualan
Tampilan invoice penjualan yang berisi informasi mengenai pelanggan dan juga produk yang dibeli serta total biaya yang harus dibayar. Invoice berbentuk file pdf yang dapat langsung dicetak oleh user. 6. Halaman Retur Penjualan
Gambar 4.32 Tampilan Halaman Retur Penjualan (1)
349
Pada gambar 4.32, user harus menginput kode penjualan yang akan diretur. Kode penjualan dapat didapatkan dengan menekan tombol cari kode yang kemudian akan muncul pop-up seperti pada gambar 4.34. Setelah memilih kode penjualan, maka user dapat menekan tombol lanjutkan untuk menginput data produk yang akan diretur seperti pada gambar 4.33.
Gambar 4.33 Tampilan Halaman Retur Penjualan (2)
Pada halaman ini, user menginput data produk yang ingin diretur oleh customer beserta alasan retur. Kode barang beserta jumlah yang dapat dipilih disesuaikan dengan barang dan jumlah pada waktu terjadi pembelian. Setelah selesai memasukkan data produk, maka user dapat menekan tombol cetak dan akan muncul invoice seperti pada gambar 4.35.
350
Gambar 4.34 Tampilan Pop-Up Daftar Penjualan
Pada gambar 4.34, user dapat melakukan double click ataupun menekan tombol pilih terhadap kode yang sesuai dengan transaksi yang sedang berlangsung untuk memilih kode transaksi tersebut.
Gambar 4.35 Tampilan Halaman Invoice Retur Penjualan
Tampilan invoice retur penjualan yang berisi informasi mengenai pelanggan dan juga produk yang diretur serta alasan retur. Invoice berbentuk file pdf yang dapat langsung dicetak oleh user.
351
7. Halaman Ubah Status Penjualan
Gambar 4.36 Tampilan Halaman Ubah Status Penjualan
Pada halaman ini, user dapat memilih kode transaksi yang akan diubah statusnya menjadi selesai dengan menekan tombol simpan. User dapat memilih kode pesanan yang sesuai dengan menekan tombol cari kode dan akan muncul pop-up seperti pada gambar 4.37.
Gambar 4.37 Tampilan Pop-Up Daftar Transaksi Penjualan
Pada gambar 4.37, user dapat melakukan double click ataupun menekan tombol pilih terhadap kode yang sesuai dengan transaksi yang sedang berlangsung untuk memilih kode transaksi tersebut.
352
8. Halaman Permintaan Pembelian
Gambar 4.38 Tampilan Halaman Permintaan Pembelian
Pada gambar 4.38, user dapat melakukan permintaan pembelian dengan mengisi form pada halaman tersebut. Kode karyawan akan disesuaikan dengan kode user yang sedang login pada saat terjadinya permintaan. User dapat memilih kode produk dengan menekan icon search untuk menampilkan informasi daftar produk seperti pada gambar 4.39, dan user dapat memilih kode pemasok pada tabel data pemasok yang berada pada sebelah kanan halaman. Jika proses penginputan data telah selesai, user dapat menekan tombol kirim permintaan dan data permintaan pembelian akan masuk ke dalam notifikasi pihak direksi seperti pada gambar 4.40.
353
Gambar 4.39 Tampilan Pop-Up Daftar Produk
Pada gambar 4.39, user dapat melakukan double click ataupun menekan tombol pilih terhadap kode yang sesuai dengan produk yang diinginkan untuk memilih kode produk tersebut.
Gambar 4.40 Tampilan Notifikasi
Gambar 4.40 merupakan tampilan notifikasi yang berada pada navigation bar oleh pihak direksi. Untuk melihat detil notifikasi, maka user harus menekan tombol "lihat transaksi dan konfirmasi" dan akan muncul halaman seperti pada gambar 4.41.
354
Gambar 4.41 Tampilan Halaman Notifikasi
Gambar 4.41 merupakan tampilan halaman notifikasi untuk melihat siapa yang melakukan permintaan pembelian. Untuk melihat detil dari permintaan, maka user dapat menekan tombol lihat pada setiap notifikasi yang ada.
Gambar 4.42 Tampilan Pop-Up Konfirmasi Notifikasi
Gambar 4.42 adalah tampilan pop-up dimana user dapat melihat detil dari permintaan pembelian dan menentukan apakah permintaan tersebut disetujui atau tidak. Jika diterima, maka secara otomatis permintaan pembelian akan menjadi pesanan pembelian dan siap untuk diproses menjadi pembelian.
355
9. Halaman Pembelian
Gambar 4.43 Tampilan Halaman Pembelian
Pada halaman pembelian, user dapat memilih kode transaksi pesanan pembelian yang telah dilakukan untuk kemudian disimpan menjadi transaksi pembelian. Jika menekan tombol "cari kode", maka akan muncul pop-up yang berisi daftar kode transaksi pemesanan yang belum diproses menjadi pembelian seperti pada gambar 4.44.
Gambar 4.44 Tampilan Pop-Up Daftar Transaksi Pesanan Pembelian
Pada gambar 4.44, user dapat melakukan double click ataupun menekan tombol pilih terhadap kode yang sesuai dengan transaksi yang sedang berlangsung untuk memilih kode transaksi tersebut.
356
10. Halaman Retur Pembelian
Gambar 4.45 Tampilan Halaman Retur Pembelian (1)
Pada gambar 4.45, user harus menginput kode pembelian yang akan diretur. Kode pembelian dapat didapatkan dengan menekan tombol cari kode yang kemudian akan muncul pop-up seperti pada gambar 4.47. Setelah memilih kode pembelian, maka user dapat menekan tombol lanjutkan untuk menginput data produk yang akan diretur seperti pada gambar 4.46.
Gambar 4.46 Tampilan Halaman Retur Pembelian (2)
357
Pada halaman ini, user menginput data produk yang ingin diretur kepada pemasok beserta alasan retur. Kode barang beserta jumlah yang dapat dipilih disesuaikan dengan barang dan jumlah pada waktu terjadi pembelian. Setelah selesai menginput data produk, maka user dapat menekan tombol simpan.
Gambar 4.47 Tampilan Pop-Up Daftar Pembelian
Pada gambar 4.47, user dapat melakukan double click ataupun menekan tombol pilih terhadap kode yang sesuai dengan transaksi yang sedang berlangsung untuk memilih kode transaksi tersebut.
358
11. Halaman Produk
Gambar 4.48 Tampilan Halaman Produk
Gambar 4.48 merupakan tampilan halaman produk beserta dengan tipe dan juga merknya. User dapat melakukan pencarian berdasarkan kode produk maupun nama produk. Jika user menekan salah satu detil produk, maka akan muncul pop-up seperti pada gambar 4.49. Jika user menekan tombol tambah, maka akan muncul pop-up seperti pada gambar 4.50. Jika user menekan tombol ubah, maka akan muncul pop-up seperti pada gambar 4.51. Jika user menekan tombol hapus, maka akan muncul pop-up seperti pada gambar 4.52.
359
Gambar 4.49 Tampilan Pop-Up Detil Produk
Gambar 4.49 menampilkan detil produk yang dipilih. Data yang ditampilkan berupa gambar produk, nama, deskripsi, dan sebagainya.
Gambar 4.50 Tampilan Pop-Up Tambah Produk
Gambar 4.50 merupakan tampilan pop-up untuk tambah produk. User menginput data dan kemudian menekan tombol tambah untuk menyimpan data inputan ke dalam database. Jika proses simpan data berhasil, maka akan muncul pesan "data berhasil disimpan". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
360
Gambar 4.51 Tampilan Pop-Up Ubah Produk
Gambar 4.51 merupakan tampilan pop-up untuk ubah produk. User menginput data yang akan diubah dan kemudian menekan tombol ubah untuk mengubah data inputan ke dalam database. Jika proses ubah data berhasil, maka akan muncul pesan "data berhasil diubah". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.52 Tampilan Pop-Up Hapus Produk
Gambar 4.52 merupakan tampilan pop-up untuk hapus produk. User dapat menghapus data jika memilih tombol hapus dan membatalkan jika memilih tombol batal.
361
12. Halaman Karyawan
Gambar 4.53 Tampilan Halaman Karyawan
Gambar 4.53 merupakan tampilan halaman karyawan beserta dengan peran dari karyawan tersebut. User dapat melakukan pencarian berdasarkan kode karyawan maupun nama karyawan. Jika user menekan salah satu detail karyawan, maka akan muncul pop-up seperti pada gambar 4.54. Jika user menekan tombol tambah, maka akan muncul pop-up seperti pada gambar 4.55. Jika user menekan tombol ubah, maka akan muncul pop-up seperti pada gambar 4.56. Jika user menekan tombol hapus, maka akan muncul pop-up seperti pada gambar 4.57.
362
. Gambar 4.54 Tampilan Pop-Up Detil Karyawan
Gambar 4.54 menampilkan detil karyawan yang dipilih. Data yang ditampilkan berupa foto karyawan, nama, peran, dan sebagainya.
Gambar 4.55 Tampilan Pop-Up Tambah Karyawan
Gambar 4.55 merupakan tampilan pop-up untuk tambah karyawan. User memasukkan data dan kemudian menekan tombol tambah untuk menyimpan data input-an ke dalam database. Jika proses simpan data berhasil, maka akan muncul pesan "data berhasil disimpan". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
363
Gambar 4.56 Tampilan Pop-Up Ubah Karyawan
Gambar 4.56 merupakan tampilan pop-up untuk ubah karyawan. User menmasukkan data yang akan diubah dan kemudian menekan tombol ubah untuk menyimpan data input-an ke dalam database. Jika proses ubah data berhasil, maka akan muncul pesan "data berhasil diubah". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.57 Tampilan Pop-Up Hapus Karyawan
Gambar 4.57 merupakan tampilan pop-up untuk hapus karyawan. User dapat menghapus data jika memilih tombol hapus dan membatalkan jika memilih tombol batal.
364
13. Halaman Peran
Gambar 4.58 Tampilan Halaman Peran
Gambar 4.58 merupakan tampilan halaman peran. User dapat melakukan pencarian berdasarkan kode peran maupun nama peran. Jika user menekan tombol tambah, maka akan muncul pop-up seperti pada gambar 4.59. Jika user menekan tombol ubah, maka akan muncul pop-up seperti pada gambar 4.60. Jika user menekan tombol hapus, maka akan muncul pop-up seperti pada gambar 4.61.
365
Gambar 4.59 Tampilan Pop-Up Tambah Peran
Gambar 4.59 merupakan tampilan pop-up untuk tambah peran. User meng-input data dan kemudian menekan tombol tambah untuk menyimpan data input-an ke dalam database. Jika proses simpan data berhasil, maka akan muncul pesan "data berhasil disimpan". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.60 Tampilan Pop-Up Ubah Peran
Gambar 4.60 merupakan tampilan pop-up untuk ubah peran. User menginput data yang akan diubah dan kemudian menekan tombol ubah untuk mengubah data inputan ke dalam database. Jika proses ubah data berhasil, maka akan muncul pesan "data berhasil diubah".
366
Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.61 Tampilan Pop-Up Hapus Peran
Gambar 4.61 merupakan tampilan pop-up untuk hapus peran. User dapat menghapus data jika memilih tombol hapus dan membatalkan jika memilih tombol batal.
14. Halaman Pelanggan
Gambar 4.62 Tampilan Halaman Pelanggan
367
Gambar 4.62 merupakan tampilan halaman pelanggan. User dapat melakukan pencarian berdasarkan kode pelanggan maupun nama pelanggan. Jika user menekan tombol ubah, maka akan muncul pop-up seperti pada gambar 4.63. Jika user menekan tombol hapus, maka akan muncul pop-up seperti pada gambar 4.64.
Gambar 4.63 Tampilan Pop-Up Ubah Pelanggan
Gambar 4.63 merupakan tampilan pop-up untuk ubah pelanggan. User meng-input data yang akan diubah dan kemudian menekan tombol ubah untuk menyimpan data input-an ke dalam database. Jika proses ubah data berhasil, maka akan muncul pesan "data berhasil diubah". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
368
Gambar 4.64 Tampilan Pop-Up Hapus Pelanggan
Gambar 4.64 merupakan tampilan pop-up untuk hapus pelanggan. User dapat menghapus data jika memilih tombol hapus dan membatalkan jika memilih tombol batal.
15. Halaman Pemasok
Gambar 4.65 Tampilan Halaman Pemasok
Gambar 4.65 merupakan tampilan halaman pemasok. User dapat melakukan pencarian berdasarkan kode pemasok maupun nama
369
pemasok. Jika user menekan tombol tambah, maka akan muncul popup seperti pada gambar 4.66. Jika user menekan tombol ubah, maka akan muncul pop-up seperti pada gambar 4.67. Jika user menekan tombol hapus, maka akan muncul pop-up seperti pada gambar 4.68.
Gambar 4.66 Tampilan Pop-Up Tambah Pemasok
Gambar 4.66 merupakan tampilan pop-up untuk tambah pemasok. User menginput data dan kemudian menekan tombol tambah untuk menyimpan data inputan ke dalam database. Jika proses simpan data berhasil, maka akan muncul pesan "data berhasil disimpan". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
370
Gambar 4.67 Tampilan Pop-Up Ubah Pemasok
Gambar 4.67 merupakan tampilan pop-up untuk ubah pemasok. User meng-input data yang akan diubah dan kemudian menekan tombol ubah untuk menyimpan data input-an ke dalam database. Jika proses ubah data berhasil, maka akan muncul pesan "data berhasil diubah". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.68 Tampilan Pop-Up Hapus Pemasok
Gambar 4.68 merupakan tampilan pop-up untuk hapus pemasok. User dapat menghapus data jika memilih tombol hapus dan membatalkan jika memilih tombol batal.
371
16. Halaman Jenis Produk
Gambar 4.69 Tampilan Halaman Jenis Produk
Gambar 4.69 merupakan tampilan halaman jenis produk. User dapat melakukan pencarian berdasarkan kode jenis produk maupun nama jenis produk. Jika user menekan tombol tambah, maka akan muncul pop-up seperti pada gambar 4.70. Jika user menekan tombol ubah, maka akan muncul pop-up seperti pada gambar 4.71. Jika user menekan tombol hapus, maka akan muncul pop-up seperti pada gambar 4.72.
372
Gambar 4.70 Tampilan Pop-Up Tambah Jenis Produk
Gambar 4.70 merupakan tampilan pop-up untuk tambah jenis produk. User meng-input data dan kemudian menekan tombol tambah untuk menyimpan data input-an ke dalam database. Jika proses simpan data berhasil, maka akan muncul pesan "data berhasil disimpan". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.71 Tampilan Pop-Up Ubah Jenis Produk
Gambar 4.71 merupakan tampilan pop-up untuk ubah jenis produk. User meng-input data yang akan diubah dan kemudian menekan tombol ubah untuk mengubah data input-an ke dalam
373
database. Jika proses ubah data berhasil, maka akan muncul pesan "data berhasil diubah". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.72 Tampilan Pop-Up Hapus Jenis Produk
Gambar 4.72 merupakan tampilan pop-up untuk hapus jenis produk. User dapat menghapus data jika memilih tombol hapus dan membatalkan jika memilih tombol batal.
374
17. Halaman Merk
Gambar 4.73 Tampilan Halaman Merk
Gambar 4.73 merupakan tampilan halaman merk. User dapat melakukan pencarian berdasarkan kode merk maupun nama merk. Jika user menekan tombol tambah, maka akan muncul pop-up seperti pada gambar 4.74. Jika user menekan tombol ubah, maka akan muncul pop-up seperti pada gambar 4.75. Jika user menekan tombol hapus, maka akan muncul pop-up seperti pada gambar 4.76.
Gambar 4.74 Tampilan Pop-Up Tambah Merk
375
Gambar 4.74 merupakan tampilan pop-up untuk tambah merk. User meng-input data dan kemudian menekan tombol tambah untuk menyimpan data input-an ke dalam database. Jika proses simpan data berhasil, maka akan muncul pesan "data berhasil disimpan". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
Gambar 4.75 Tampilan Pop-Up Ubah Merk
Gambar 4.75 merupakan tampilan pop-up untuk ubah merk. User meng-input data yang akan diubah dan kemudian menekan tombol ubah untuk menyimpan data input-an ke dalam database. Jika proses ubah data berhasil, maka akan muncul pesan "data berhasil diubah". Jika terdapat data yang kurang ataupun tidak sesuai dengan format, maka akan muncul pesan error sesuai dengan error yang dilakukan.
376
Gambar 4.76 Tampilan Pop-Up Hapus Merk
Gambar 4.76 merupakan tampilan pop-up untuk hapus merk. User dapat menghapus data jika memilih tombol hapus dan membatalkan jika memilih tombol batal.
18. Halaman Laporan
Gambar 4.77 Tampilan Halaman Laporan
Pada halaman laporan, user memilih jenis laporan yang ingin dilihat dan juga durasi serta format dari laporan yang akan dicetak. Setelah itu user dapat menekan tombol buat laporan dan laporan akan otomatis diunduh sesuai dengan format yang sudah dipilih. Gambar 4.78 adalah contoh file laporan pesanan penjualan dengan format .xls.
377
Gambar 4.78 Tampilan Contoh Laporan .xls
19. Halaman Konfigurasi Web
Gambar 4.79 Tampilan Halaman Konfigurasi Web (Slider)
Gambar 4.79 dan Gambar 4.81 merupakan tampilan halaman untuk konfigurasi web yang akan ditampilkan kepada pelanggan. Konfigurasi web tersebut terdiri dari slider (gambar 4.79) dan juga isi dari tentang kami seperti pada gambar 4.81. Bila tombol “ubah” ditekan, maka akan muncul pop-up seperti pada Gambar 4.80.
378
Gambar 4.80 Tampilan Pop-Up Ubah Slider
Pada tampilan pop-up ubah slider, slider yang dipilih pada Gambar 4.79 dapat diubah dengan memasukkan slider baru ataupun mengambil slider lama. Untuk memasukkan slider baru, user harus memilih kode produk terlebih dahulu dan memasukkan file gambar yang diinginkan, kemudian menekan tombol simpan. Untuk mengambil slider lama yang pernah digunakan, user dapat menekan salah satu detail yang ada kemudian menekan tombol pilih, atau user dapat menekan dua kali pada detail yang diinginkan.
Gambar 4.81 Tampilan Halaman Konfigurasi Web (Tentang Kami)
Pada Gambar 4.81, user dapat mengisi perubahan pada ‘tentang kami’ yang akan ditampilkan kepada customer. Setelah selesai mengubah, user dapat menyimpan dengan menekan tombol simpan.
379
20. Halaman Hak Akses
Gambar 4.82 Tampilan Halaman Hak Akses
Gambar 4.82 merupakan tampilan hak akses dimana pemimpin perusahaan dapat memberikan hak akses halaman kepada masingmasing peran. Setelah selesai mencentang akses yang diberikan, maka user dapat menekan tombol simpan untuk menyimpan data hak akses tersebut.
4.4 Evaluasi Database 4.4.1 System Integration Test Evaluasi system integration test bertujuan untuk menguji sistem basis data terhadap beberapa kriteria, yaitu: domain integrity, entity integrity, referential integrity, dan security.
380
1.
Domain Integrity Evaluasi domain integrity bertujuan untuk memeriksa kesesuaian antara nilai atribut dengan domain atribut yang telah ditentukan sebelumnya. Sebagai contoh, beberapa evaluasi yang dilakukan antara lain: a. Domain atribut sales_order_id harus berjumlah 16 digit dengan format [0-9][0-9][0-9][0-9]/PJ/JKT/mmyy. Contoh : terdapat data "0001/PJ/JKT/1216" pada atribut sales_order_id dalam basis data yang telah dibuat. b. Domain atribut sales_return_id harus berjumlah 16 digit dengan format [0-9][0-9][0-9][0-9]/RJ/JKT/mmyy. Contoh : terdapat data "0001/RJ./JKT/1216" pada atribut sales_order_id dalam basis data yang telah dibuat. c. Domain atribut date pada tabel sales, sales_orders, sales_returns, purchases,
purchase_orders,
purchase_requests,
dan
purchase_returns harus memiliki format yyyy-mm-dd. d. Domain atribut qty hanya boleh mengandung angka. e. Atribut email pada tabel customers, employees, dan suppliers tidak boleh melebihi 30 karakter dan harus mengandung karater '.' dan
'@'.
Contoh:
terdapat
data
"
[email protected]" pada atribut email dalam tabel customers. 2. Entity Integrity Evaluasi entity integrity bertujuan untuk memastikan bahwa setiap entitas harus memiliki primary key dan tidak ada primary key yang bernilai NULL serta bersifat unique (tidak ada kemunculan nilai yang sama pada atribut primary key). Hasil evaluasi dari pengujian yang dilakukan menunjukkan bahwa setiap entitas memiliki sebuah atribut primary key yang tidak NULL serta bersifat unique. 3. Referential Integrity Evaluasi referential integrity
bertujuan untuk
memeriksa
hubungan antar tabel yang terhubung melalui relasi foreign key. Nilai pada foreign key harus sama dengan nilai primary key pada tabel yang
381
terhubung dengannya. Contoh: tabel sales_orders memiliki foreign key customer_id yang merupakan primary key dari tabel customers. Hasil evaluasi dari pengujian yang dilakukan menunjukkan bahwa semua tabel telah terhubung dengan baik dimana nilai dari foreign key sama dengan nilai primary key yang terhubung. 4. Security Evaluasi security bertujuan untuk memeriksa mekanisme keamanan yang dimiliki oleh sistem basis data yang ada sehingga tidak terjadi penyalahgunaan terhadap data yang ada. Pengujian dilakukan dengan sistem pemberian hak akses terhadap setiap peran serta adanya autentikasi user yang akan menggunakan aplikasi. Hasil evaluasi dari pengujian yang dilakukan menunjukkan bahwa sistem telah memiliki mekanisme keamanan berupa pemberian hak akses dan autentikasi user yang baik sehingga data tidak dapat diakses dengan sembarangan.
4.4.2 User Acceptance Test Evaluasi user acceptance test bertujuan untuk memeriksa apakah aplikasi yang dirancang sudah memenuhi kebutuhan user. Pengujian dilaksanakan bersama dengan Bapak Hendri selaku pemimpin perusahaan PT Indo Tekno Semesta. Hasil dari evaluasi user acceptance test adalah: 1. Aplikasi yang dirancang telah sesuai dengan requirement perusahaan. 2. Data yang disimpan di dalam sistem basis data dapat diakses secara real time sehingga mengurangi terjadinya redundansi data antara kantor pusat dan kantor cabang. 3. Adanya sistem pemberian hak akses dan autentikasi user sehingga data lebih aman. 4. Proses pencarian data menjadi lebih cepat sehingga membantu kinerja operasional PT Indo Tekno Semesta.
382
4.5 Evaluasi Aplikasi 4.5.1 Interview Proses interview dilakukan dengan melakukan interview kepada pemilik perusahaan, divisi sales, dan divisi gudang terhadap aplikasi yang dirancang. Interview dengan pemilik Perusahaan PT Indo Tekno Semesta 1. Apakah tampilan dari aplikasi ini menarik? Jawaban: Cukup menarik.
2. Apakah fitur dari aplikasi ini mudah dipahami? Jawaban: Iya, menurut saya cukup mudah dipahami karena saya dapat memantau jalannya operasional perusahaan.
3. Apakah aplikasi ini dapat membantu operasional perusahaan PT Indo Tekno Semesta? Jawaban: Iya, karena website ini sangat membantu saya dalam melihat laporan operasional perusahaan.
4. Bagaimana tanggapan anda terhadap aplikasi yang telah dirancang? Jawaban: Sudah bagus.
5. Apakah ada masukan untuk aplikasi ini? Jawaban: Saya rasa tidak ada, karena sudah sangat membantu perusahaan.
Interview dengan divisi sales PT Indo Tekno Semesta 1. Apakah tampilan dari aplikasi ini menarik? Jawaban: Iya.
2. Apakah fitur dari aplikasi ini mudah dipahami? Jawaban: Iya.
383
3. Apakah aplikasi ini dapat membantu operasional perusahaan PT Indo Tekno Semesta? Jawaban: Menurut saya iya, karena pekerjaan saya dipermudah tanpa perlu mengisi data yang sama berulang-ulang.
4. Bagaimana tanggapan anda terhadap aplikasi yang telah dirancang? Jawaban: Keren banget, soalnya saya jadi dipermudah dengan bantuan aplikasi ini.
5. Apakah ada masukan untuk aplikasi ini? Jawaban: Tidak ada, soalnya sudah sangat lengkap.
Interview dengan divisi gudang PT Indo Tekno Semesta 1. Apakah tampilan dari aplikasi ini menarik? Jawaban: Iya.
2. Apakah fitur dari aplikasi ini mudah dipahami? Jawaban: Iya.
3. Apakah aplikasi ini dapat membantu operasional perusahaan PT Indo Tekno Semesta? Jawaban: Menurut saya aplikasi ini sangat membantu, terutama dalam kepengurusan stok gudang. Karena data stoknya jadi lebih pasti dan sesuai dengan yang ada. Terus ada fitur permintaan pembelian yang bagus, sehingga saya tidak
perlu selalu mencari ke ruangan direksi.
4. Bagaimana tanggapan anda terhadap aplikasi yang telah dirancang? Jawaban: Sudah baik, saya bisa melihat data stok tanpa perlu susah- susah hitung semua barang yang ada di gudang. Terus aplikasinya juga fleksibel, saya jadi cepat kalo mau request barang buat dibeli.
384
5. Apakah ada masukan untuk aplikasi ini? Jawaban: Untuk saat ini belum ada. Soalnya aplikasi ini sudah sangat membantu pekerjaan saya.
4.5.2 Evaluasi Lima Faktor Manusia Terukur Hasil evaluasi lima faktor manusia terukur dengan PT Indo Tekno Semesta antara lain: 1. Waktu belajar Berdasarkan hasil evaluasi dengan PT Indo Tekno Semesta, diketahui bahwa waktu yang diperlukan untuk mempelajari aplikasi cukup cepat. 2. Kecepatan kinerja Berdasarkan hasil evaluasi dengan PT Indo Tekno Semesta, diketahui bahwa kecepatan kinerja aplikasi cukup baik dan lebih cepat dibandingkan dengan sistem yang sedang berjalan. 3. Tingkat kesalahan pengguna Berdasarkan hasil evaluasi dengan PT Indo Tekno Semesta, diketahui bahwa tingkat kesalahan pengguna dalam menggunakan aplikasi cukup kecil untuk terjadi. 4. Daya ingat Berdasarkan hasil evaluasi dengan PT Indo Tekno Semesta, diketahui bahwa aplikasi yang dirancang mudah digunakan, sehingga pengguna tidak perlu mengingat cara pengoperasian aplikasi. 5. Tingkat kepuasan subjektif Berdasarkan hasil evaluasi dengan PT Indo Tekno Semesta, diketahui bahwa pengguna cukup puas dengan rancangan aplikasi ini.
385
4.5.3 Eight Golden Rules Penerapan aplikasi dengan teori 8 golden rules, yaitu: 1. Berusaha untuk konsisten Setiap halaman yang dirancang menampilkan desain antarmuka yang memiliki warna, tulisan, dan lain-lain yang sama, serta penempatan menu yang tidak berubah setiap halaman.
Gambar 4.83 Tampilan Halaman Pesanan Penjualan
Gambar 4.84 Tampilan Halaman Penjualan
2. Menyediakan fungsi yang bersifat umum Adanya penggunaan tombol, label serta penamaan yang jelas membuktikan bahwa aplikasi ini sudah menyediakan aplikasi yang bersifat umum.
386
Gambar 4.85 Tampilan Halaman Produk
3. Memberikan umpan balik yang informatif User mendapatkan umpan balik yang informatif untuk setiap aksi yang telah dilakukan, seperti contoh pada saat login, jika username dan password salah, maka aplikasi akan memberikan umpan balik untuk diketahui oleh user.
Gambar 4.86 Tampilan Halaman Login (username dan password salah)
387
4. Merancang dialog sebagai penutupan Adanya dialog yang disediakan dalam setiap form menandakan akhirnya suatu aktifitas. Selain itu, munculnya invoice yang dapat di print oleh user juga merupakan tanda penutupan suatu aktifitas.
Gambar 4.87 Tampilan Dialog Transaksi Sukses
5. Mencegah kesalahan Mengurangi penggunaan textbox untuk menghindari user dalam melakukan kesalahan-kesalahan tertentu dan menggantinya dengan pilihan yang sesuai. Contoh: menggunakan radio button untuk memilih gender antara laki-laki atau perempuan, atau menggunakan kalender untuk memilih tanggal.
388
Gambar 4.88 Tampilan Halaman Tambah Karyawan 6. Memungkinkan pembalikan aksi Jika user melakukan kesalahan dalam menghapus suatu data, maka user dapat kembali ke tindakan sebelumnya dengan menekan tombol batal.
Gambar 4.89 Tampilan Halaman Konfirmasi Hapus Karyawan
7. Mendukung internal locus control Setiap user dapat menggunakan aplikasi ini dengan bebas, karena terdapat menu navigasi yang berada di bagian atas atau kanan aplikasi. Sehingga user dapat mempunyai kontrol penuh terhadap jalannya aplikasi.
389
Gambar 4.90 Tampilan Halaman Dashboard 8. Mengurangi beban memori jangka pendek Aplikasi yang dirancang bersifat sederhana dan interaktif sehingga mengurangi beban memori jangka pendek pada user. Selain itu, terdapat menu yang mudah dimengerti sehingga user dapat menjalankan aplikasi tanpa perlu mengingat apapun.
4.5.4 Survey Survey terhadap evaluasi aplikasi dilakukan kepada semua pihak PT Indo Tekno Semesta yang menggunakan aplikasi ini. Dari hasil survey¸ 90% pengguna yang merupakan karyawan PT Indo Tekno Semesta merasa puas terhadap aplikasi yang dirancang. Hal ini dikarenakan dengan adanya penggunaan aplikasi ini, maka proses pencarian data menjadi lebih cepat dan prosedur jalannya transaksi menjadi lebih terstruktur.
390
