BAB V

IMPLEMENTASI DAN PENGUJIAN SISTEM

5.1 Langkah – langkah Implementasi Sistem

Proses implementasi sistem mencakup tiga tahap kunci. Pertama, langkah

awal adalah menerapkan rencana implementasi sistem yang telah dirancang

sebelumnya. Setelah itu, tahap kedua melibatkan pelaksanaan kegiatan

implementasi sistem sesuai dengan rencana yang telah disusun. Pada tahap ini,

langkah yang dilakukan adalah memindahkan logika program yang telah dibuat

menggunakan framework CodeIgniter ke dalam bahasa pemrograman yang

dipilih. Setelah implementasi, tahap ketiga adalah tindak lanjut, di mana dilakukan

pengujian data yang dimasukkan untuk memastikan keakuratan dan kecocokan.

Selain itu, pengujian kekurangan program juga dilakukan untuk mengidentifikasi

potensi masalah.

5.1.1 Penerapan Perangkat Keras (Hardware)

Tabel 5.1 Tabel Penerapan Hardware

No Hardware Spesifikasi

1 Monitor Generic PnP Monitor

2 Processor AMD Ryzen 3 3250U

3 SSD 256 GB

4 VGA AMD Radeon Graphics

5 Keyboard Standard

6 Mouse Standard USB

8 Memory (RAM) 12 GB DDR4

5.1.2 Penerapan Perangkat Lunak (Software)

Tabel 5.2 Tabel Penerapan Software

No Software Minimum Req Minimum Req

1 Operating System Windows 7 (32bit) Windows 10 (64bit)

2 Browser Microsoft Edge Google Chrome

3 Microsoft Office Word Microsoft Office 2013 Microsoft Office LTSC 2019

4 Web Server XAMPP 3.2.4 XAMPP 3.3.0

5 Text Editor Visual Studio Code 1.1.0 Visual Studio Code 1.81.1

5.2 Analisis Kebutuhan Fungsional

Analisis kebutuhan fungsional merupakan langkah krusial dalam

pengembangan sistem informasi penggajian dan absensi dengan QR Code di Agen

Perbankan 358 HD Grup. Pada tahap ini, proses dan aktivitas yang akan

diimplementasikan dalam sistem diuraikan secara mendalam. Analisis ini

bertujuan untuk memastikan bahwa sistem dapat beroperasi secara optimal sesuai

dengan kebutuhan monitoring transaksi penawaran di lingkungan agen perbankan.

Pendekatan yang digunakan dalam analisis kebutuhan fungsional ini

adalah Unified Modeling Language (UML), sebuah metode visualisasi yang

memungkinkan pemodelan layanan, fitur, dan fungsi sistem dalam bentuk grafis.

Dalam proses ini, beberapa tahap yang dilalui antara lain:

1. Identifikasi Aktor

Tahap pertama adalah mengidentifikasi aktor-aktor yang terlibat dalam

interaksi dengan sistem. Aktor bisa berupa pengguna, perangkat, atau

sistem lain yang berinteraksi dengan sistem yang sedang dibangun.

2. Pembuatan Use Case Diagram

 Use case diagram menggambarkan interaksi antara aktor dan sistem. Use

case (skenario penggunaan) direpresentasikan sebagai elips, sedangkan

aktor direpresentasikan sebagai ikon manusia atau perangkat. Diagram ini

membantu memvisualisasikan interaksi utama dalam sistem.

3. Use Case Scenario

Setiap use case dalam diagram memiliki skenario atau langkah-langkah

yang diambil oleh aktor dalam berinteraksi dengan sistem. Ini membantu

dalam memahami bagaimana sistem akan digunakan dalam situasi nyata.

4. Activity Diagram

Diagram aktivitas menggambarkan alur kerja atau proses yang dilakukan

oleh sistem. Diagram ini memberikan gambaran visual tentang bagaimana

aktivitas-aktivitas akan dijalankan dalam sistem.

Tabel 5.3 Tabel Kebutuhan Fungsional

No Kebutuhan Fungsional Responsibilities

1. Bagian Operasional a. Fungsi Login/Logout

b. Edit Profile
c. Pengelolaan Data Karyawan
d. Pengelolaan Data Jabatan
e. Pengelolaan Data Shift
f. Pengelolaan Data Lokasi
g. Ambil QR
h. Histori Absensi
i. Rekap Absensi
j. Penggajian
 2. Bagian Keuangan a. Fungsi Login/Logout
b. Edit Profile
c. Hsitori Absensi
d. Rekap Absensi
e. Penggajian

3. Pemilik a. Fungsi Login/Logout

b. Edit Profile
c. Melihat Data Karyawan
d. Melihat Data Jabatan
e. Melihat Data Shift
f. Melihat Data Lokasi
g. Melihat Histori Absensi
h. Melihat Rekap Absensi
i. Melihat Laporan Gaji Karyawan

3 Karyawan a. Melakukan Scan QR

b. Melihat Tabel Histori Presensi

5.3 Implementasi Sistem

Tahap implementasi sistem adalah langkah krusial dalam mengubah

konsep menjadi kenyataan, di mana Sistem Informasi Penggajian Dan Absensi

Dengan QR Code pada Agen Perbankan 358 HD Grup siap dijalankan. Tahap ini

terjadi setelah analisis data, perancangan basis data, dan perancangan menu sistem

selesai dilakukan. Dalam tahap implementasi ini, akan dibahas desain input data,

desain output, serta kebutuhan perangkat pendukung yang diperlukan untuk

menjalankan aplikasi sistem dengan efektif. Penerapan tahap ini adalah langkah

penting dalam memastikan sistem berjalan sesuai dengan rencana dan kebutuhan

yang telah diidentifikasi sebelumnya.

5.3.1 Tujuan Implementasi Sistem

Berikut adalah Tujuan dari Implementasi sistem pada Sistem Informasi

Penggajian Dan Absensi Dengan QR Code pada Agen Perbankan 358 HD Grup,

diantaranya :

1. Desain Sistem

Tahap pertama melibatkan perancangan sistem yang dilakukan

selama proses penelitian dan analisis. Ini melibatkan merancang

struktur keseluruhan sistem, termasuk fitur dan fungsi yang diperlukan

untuk memenuhi kebutuhan pengguna.

2. Pengujian dan Dokumentasi

Setelah desain dibuat, tahap berikutnya adalah menguji dan

mendokumentasikan prosedur serta program yang diperlukan.

Pengujian dilakukan untuk memastikan bahwa sistem berfungsi dengan

baik dan sesuai dengan yang diharapkan. Dokumentasi penting untuk

memberikan panduan penggunaan dan pemeliharaan sistem.

3. Penyelesaian Desain

Tahap ini melibatkan penyelesaian desain sistem yang telah

disetujui. Artinya, setelah pengujian dan penyempurnaan, desain sistem

akhirnya dirampungkan dan siap untuk diimplementasikan.

4. Validasi Kebutuhan Pengguna

Langkah terakhir adalah memastikan bahwa sistem yang telah

dibuat memenuhi kebutuhan pemakai. Hal ini dilakukan dengan

memastikan bahwa sistem yang dikembangkan sesuai dengan yang

 telah diidentifikasi selama proses analisis, dan dapat memberikan solusi

yang diharapkan.

5.3.2 Pembahasan Program

Pembahasan program merupakan tampilan halaman dari program

yang sudah dibuat berdasarkan hasil perancangan di bab sebelumnya. Dalam

program ini terdapat 4 (empat) user diantaranya ada Bagian Operasional,

Bagian Keuangan, Pemilik dan Karyawan dimana 3 (tiga) diantaranya Bagian

Operasional, Bagian Keuangan dan Pemilik diharuskan Login terlebih dahulu

agar bisa mengakses program sesuai dengan hak akses Login yang di tuju

akan menampilkan halaman menu masing-masing pengguna.

1. Tampilan Form Login

Form Login adalah halaman awal dari sistem yang memungkinkan

pengguna untuk masuk ke dalamnya. Untuk melanjutkan ke tahap

berikutnya, pengguna harus mengisi Username dan Password

mereka. Setelah autentikasi berhasil, pengguna akan mendapatkan

akses ke sistem. Ini adalah langkah penting untuk memastikan

keamanan dan akses terbatas ke informasi atau fungsi tertentu

dalam sistem.
 Gambar 5.1 Tampilan Halaman Form Login

2. Tampilan Halaman Administrator

Halaman Administrator merupakan tampilan program dengan hak

akses Login Administrator ini dikelola oleh Aktor Bagian

Operasional. Berikut tampilan program yang berada halaman

Administrator :

1) Tampilan halaman Dashboard

 Gambar 5.2 Tampilan Halaman Dashboard

2) Tampilan halaman Data Karyawan

Gambar 5.3 Tampilan Halaman Data Karyawan

3) Tampilan halaman Tambah Data Karyawan “Kosong”

1)
 Gambar 5.4 Tampilan Halaman Tambah Data Karyawan “Kosong”

4) Tampilan halaman Data Karyawan Berhasil Ditambah

Gambar 5.5 Tampilan Halaman Data Karyawan Berhasil Ditambah

5) Tampilan halaman Lihat Data Karyawan

 Gambar 5.6 Tampilan Halaman Lihat Data Karyawan

6) Tampilan Halaman Edit Data Karyawan

Gambar 5.7 Tampilan Halaman Edit Data Karyawan

7) Tampilan Halaman Data Karyawan Berhasil Diedit

Gambar 5.8 Tampilan Halaman Data Karyawan Berhasil Diedit

8) Tampilan Konfirmasi Hapus Data Karyawan

Gambar 5.9 Konfirmasi Hapus Data Karyawan

9) Tampilan Hapus Data Karyawan Berhasil

 Gambar 5.10 Hapus Data Karyawan Berhasil

10) Tampilan Halaman Data Jabatan

Gambar 5.11 Tampilan Halaman Data Jabatan

11) Tampilan Halaman Tambah Data Jabatan “Kosong”

 Gambar 5.12 Tampilan Halaman Tambah Data Jabatan “Kosong”

12) Tampilan Halaman Data Jabatan Berhasil Ditambahkan

Gambar 5.13 Tampilan Halaman Data Jabatan Berhasil Ditambahkan

13) Tampilan Halaman Lihat Data Jabatan

Gambar 5.14 Tampilan Halaman Lihat Data Jabatan

14) Tampilan Halaman Edit Data Jabatan

Gambar 5.15 Tampilan Halaman Edit Data Jabatan

15) Tampilan Halaman Berhasil Edit Data Jabatan

Gambar 5.16 Tampilan Halaman Berhasil Edit Data Jabatan

16) Tampilan Konfirmasi Hapus Data Jabatan

Gambar 5.17 Tampilan Konfirmasi Hapus Data Jabatan

17) Tampilan Hapus Data Jabatan Berhasil

Gambar 5.18 Tampilan Hapus Data Jabatan Berhasil

18) Tampilan Halaman Data Shift

Gambar 5.19 Tampilan Halaman Data Shift

 19) Tampilan Halaman Tambah Data Shift “Kosong”

Gambar 5.20 Tampilan Halaman Tambah Data Shift “Kosong”

20) Tampilan Halaman Data Shift Berhasil Ditambahkan

Gambar 5.21 Tampilan Halaman Data Shift Berhasil Ditambahkan

21) Tampilan Halaman Lihat Data Shift

Gambar 5.22 Tampilan Halaman Lihat Data Shift

22) Tampilan Halaman Edit Data Shift

Gambar 5.23 Tampilan Halaman Edit Data Shift

 23) Tampilan Halaman Berhasil Edit Data Shift

Gambar 5.24 Tampilan Halaman Berhasil Edit Data Shift

24) Tampilan Konfirmasi Hapus Data Shift

Gambar 5.25 Tampilan Konfirmasi Hapus Data Shift

25) Tampilan Hapus Data Shift Berhasil

Gambar 5.26 Tampilan Hapus Data Shift Berhasil

26) Tampilan Halaman Data Lokasi

Gambar 5.27 Tampilan Halaman Data Lokasi

 27) Tampilan Halaman Tambah Data Lokasi “Kosong”

Gambar 5.28 Tampilan Halaman Tambah Data Lokasi “Kosong”

28) Tampilan Halaman Data Lokasi Berhasil Ditambahkan

Gambar 5.29 Tampilan Halaman Data Lokasi Berhasil Ditambahkan

 29) Tampilan Halaman Lihat Data Lokasi

Gambar 5.30 Tampilan Halaman Lihat Data Lokasi

30) Tampilan Halaman Edit Data Lokasi

Gambar 5.31 Tampilan Halaman Edit Data Lokasi

 31) Tampilan Halaman Berhasil Edit Data Lokasi

Gambar 5.32 Tampilan Halaman Berhasil Edit Data Lokasi

32) Tampilan Konfirmasi Hapus Data Lokasi

Gambar 5.33 Tampilan Konfirmasi Hapus Data Lokasi

33) Tampilan Hapus Data Lokasi Berhasil

Gambar 5.34 Tampilan Hapus Data Lokasi Berhasil

34) Tampilan Halaman Ambil QR Code

Gambar 5.35 Tampilan Halaman Ambil QR Code

 35) Tampilan Halaman Ambil QR Code “Submit”

Gambar 5.36 Tampilan Halaman Ambil QR Code “Submit”

36) Tampilan Hasil Cetak QR Code

Gambar 5.37 Tampilan Hasil Cetak QR Code

37) Tampilan Halaman Scan QR Code Karyawan

Gambar 5.38 Tampilan Halaman Scan QR Code Karyawan

38) Tampilan Halaman Histori Absensi

Gambar 5.39 Tampilan Halaman Histori Absensi

39) Tampilan Halaman Lihat Histori Absensi “Lihat Perlokasi”

Halaman ini menampilkan data Absensi berdasarkan nama

karyawan, terdapat button Edit dan Hapus akan dijelaskan pada

point gambar selanjutnya.

 Gambar 5.40 Tampilan Halaman Lihat Histori Absensi “Lihat Perlokasi”

40) Tampilan Halaman Edit Histori Absensi “Edit data jam keluar”

Halaman ini berisikan formulir Presensi, fungsi Edit

dikhususkan untuk mengubah jam pulang apabila karyawan

lupa melakukan Scan Qr pada jam pulang.

Gambar 5.41 Tampilan halaman edit histori absensi “Edit data jam keluar”
 41) Tampilan Halaman Data Histori Berhasil Diedit

Gambar 5.42 Tampilan Halaman Data Histori Berhasil Diedit

42) Tampilan Halaman Tambah Histori Absensi“Nama Anggota

Sudah Diabsen”

Gambar 5.43 Tampilan Halaman Tambah Histori Absensi “Nama Anggota

Sudah Diabsen”
 43) Tampilan Halaman Tambah Histori Absensi “Kosong”

Gambar 5.44 Tampilan Halaman Tambah Histori Absensi “Kosong”

44) Tampilan Halaman Histori Absensi Berhasil Ditambah

Gambar 5.45 Tampilan Halaman Histori Absensi Berhasil Ditambah

 45) Tampilan Halaman Konfirmasi Hapus Data

Gambar 5.46 Tampilan Halaman Histori Absensi Berhasil Dihapus

46) Tampilan Halaman Rekap Absensi

Gambar 5.47 Tampilan Halaman Rekap Absensi

 47) Tampilan Halaman Rekap Absensi “Laporan ABSENSI”

Ini muncul apabila button ABSENSI diklik dan akan

menampilkan jendela apung yang berisi halaman Laporan

Absensi yang menampilkan status kehadiran selama 1 bulan

dan menampilkan perhitungan total kehadiran selama 1 bulan

dalam jumlah hari.

Gambar 5.48 Tampilan Halaman Rekap Absensi “Laporan ABSENSI”

48) Tampilan Hasil Cetak Laporan ABSENSI

 Gambar 5.49 Tampilan Hasil Cetak Laporan ABSENSI

5.3.3 Pembahasan Database

Pembahasan struktur tabel dalam database adalah langkah untuk

menggambarkan tampilan struktur tabel-tabel dalam basis data yang dibuat

berdasarkan perancangan sebelumnya. Pada program ini, terdapat satu database

yang memuat beberapa tabel. Struktur tabel menggambarkan skema dan hubungan

antara tabel-tabel tersebut, termasuk kolom-kolom yang ada di dalamnya. Dengan

pemahaman ini, sistem dapat mengatur dan menyimpan data dengan baik,

memungkinkan fungsionalitas yang diinginkan dalam program tersebut. Dalam

program ini terdapat satu database yang berisi tabel-tabel diantaranya :

1. Tabel Karyawan

Nama Tabel : karyawan

Primary Key : id

Keterangan : Tabel ini berisi data-data karyawan.

Tabel 5.4 Tabel Karyawan

No Field Type Size Keterangan

1 id int 11 Primary Key

2 id_karyawan varchar 20

3 nama_karyawan varchar 30

4 jabatan int 11

5 id_shift int 20

6 lokasi_id int 11

7 foto varchar 250

2. Tabel Shift
 Nama Tabel : shift

Primary Key : id_shift

Keterangan : Tabel ini berisi data shift.

Tabel 5.5 Tabel Jabatan

No Field Type Size Keterangan

1 id_shift int 11 Primary Key

2 nama_shift varchar 20

3. Tabel Jabatan

Nama Tabel : jabatan

Primary Key : id_jabatan

Keterangan : Tabel ini berisi data jabatan.

Tabel 5.6 Tabel Jabatan

No Field Type Size Keterangan

1 Id_jabatan int 11 Primary Key

2 nama_jabatan varchar 20

4. Tabel Gedung

Nama Tabel : lokasi

Primary Key : gedung_id

Keterangan : Tabel ini berisi data lokasi cabang Agen Perbankan

358 Grup.

Tabel 5.7 Tabel Gedung

No Field Type Size Keterangan

1 gedung_id int 11 Primary Key

 2 nama_gedung varchar 20

3 alamat varchar 50

5. Tabel Presensi

Nama Tabel : presensi

Primary Key : id_absen

Keterangan : Tabel ini berisi data-data absensi karyawan.

Tabel 5.8 Tabel Karyawan

No Field Type Size Keterangan

1 id_absen int 11 Primary Key

2 id_karyawan varchar 20

3 tgl date -

4 jam_msk Time -

5 jam_klr Time -

6 id_khd int 11

7 ket varchar 50

8 id_status Int 11

6. Tabel Kehadiran

Nama Tabel : kehadiran

Primary Key : id_khd

Keterangan : Tabel ini berisi data-data keterangan kehadiran seperti, sakit,

ijin, alpa).

Tabel 5.9 Tabel Kehadiran

No Field Type Size Keterangan

1 id_khd int 11 Primary Key

2 nama_khd varchar 20
 7. Tabel Status

Nama Tabel : stts

Primary Key : id_status

Keterangan : Tabel ini berisi data-data status kehadiran seperti masuk,

pulang, tidak hadir.

Tabel 5.10 Tabel Status

No Field Type Size Keterangan

1 id_status int 11 Primary Key

2 nama_status varchar 20

8. Tabel Users

Nama Tabel : users

Primary Key : id_user

Keterangan : Tabel ini berisi data-data user yang digunakan untuk login.

Tabel 5.11 Tabel Users

No Field Type Size Keterangan

1 id_user int 11 Primary Key

2 username varchar 100

3 password varchar 255

4 email varchar 254

5 forgotten_password_selector varchar 255

6 forgotten_password_code varchar 255

7 forgotten_password_time time

8 last_login int 11
 9 first_name varchar 50

10 last_name varchar 100

9. Tabel Group

Nama Tabel : group

Primary Key : id

Keterangan : Tabel ini berisi data level users untuk melakukan login

sesuai hak akses.

Tabel 5.12 Tabel Group

No Field Type Size Keterangan

1 id int 11 Primary Key

2 name varchar 20

3 description varchar 100

5.4 Pengujian Sistem

Pada langkah ini, penulis memilih metode pengujian Blackbox Testing.

Dalam pengujian ini, fokus diberikan pada fungsionalitas sistem tanpa melihat

detail bagaimana sistem diimplementasikan. Setelah melalui proses pengujian,

hasil yang diperoleh adalah sebagai berikut :

5.4.1 Pengujian Administrator

Pengujian halaman Administrator dilakukan oleh User dengan peran

sebagai Bagian Operasional. Berikut hasil dari pengujian halaman Administrator :

Tabel 5.13 Pengujian Sistem Halaman Administrator

Fungsi
No Skenario Pengujian Hasil Yang Diharapkan Hasil
yang Diuji
1. Login Mengosongkan semua isian
data Login atau mengisi salah
satu data Login (Email &
password), lalu memilih
tombol Login
2. Login Menginput dengan kondisi
salah satu data benar dan atau
kedua data Login salah, lalu
mengklik tombol “Login‟
3. Login Menginput data Login yang
benar lalu mengklik
tombol “Login”
4. Dashboard Mengklik Menu Master
Data pada halaman utama.
5. Dashboard Mengklik menu data
Kayawan pada halaman
utama.
6. Tambah Mengklik tombol tambah data
Data pada data Karyawan,
Karyawan kemudian
mengisi data sesuai dengan
form yang di sediakan, lalu
klik tombol “simpan”
7. Ubah Data Mengklik tombol Edit pada
Karyawan data Karyawan, kemudian
mengisi data sesuai dengan
form yang di sediakan, lalu
klik tombol “Update”
Sistem tidak bisa Login Berhasil
dan menampilkan
notifikasi “Username
atau Password Salah!”
Sistem tidak dapat Berhasil
Login dan menampilkan
notifikasi “Username
atau Password Salah!”
Sistem menerima Berhasil
akses Login dan
kemudian langsung
menampilkan
halaman
utama (Dashboard).
Sistem akan Berhasil
menampilkan Sub
Menu Data Karyawan,
Data Jabatan, Data
Shift, Data Lokasi.
Sistem akan Berhasil
menampilkan data
Karyawan
Sistem akan menerima Berhasil
akses permintaan data
akan tersimpan kedalam
database, kemudian
setelah itu
akan menampilkan
pesan notifikasi
“Berhasil Di Simpan‟,
maka sistem akan
mengalihkan ke halaman
data Karyawan
Sistem akan menerima Berhasil
akses permintaan “Edit
data‟, selanjutnya data
akan diperbaharui
kedalam database,
kemudian setelah itu
akan menampilkan
pesan notifikasi „Data
Berhasil Di Ubah‟,
maka sistem akan
mengalihkan ke halaman
 data Karyawan

8. Hapus Data Mengklik tombol Hapus data Apabila diklik Berhasil

Karyawan pada data Karyawan, “Hapus”Sistem akan
kemudian menghapus data
muncul kotak pesan Karyawan