BAB 4 HASIL DAN PEMBAHASAN. 4.1 Spesifikasi Sistem Berikut ini adalah spesifikasi sistem yang diperlukan untuk menjalankan aplikasi yang dirancang.

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, Opera, dan lain-lain Explorer, Mozilla Firefox, 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 No Kegiatan 1 Requirement Collection and Analysis 2 Database Design 3 Application Design and Coding 4 Installation and Testing 5 System Evaluation Tabel 4.3 Tabel Jadwal Implementasi September Oktober November 2016 2016 2016 Desember Januari Februari 2016 2017 2017 Minggu ke- Minggu ke- Minggu ke- Minggu ke- Minggu ke- Minggu ke- 1 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 "pepenstevanusharyono@gmail.com" 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