UNIVERSITAS ESA UNGGUL

RANCANG BANGUN SISTEM PEMBAYARAN OTOMATIS

MENGGUNAKAN METODE VIRTUAL ACCOUNT BERBASIS
WEBSITE
(Studi Kasus : Mts Nurul Huda Matangaji)

MANUSKRIP

Diajukan sebagai salah satu syarat untuk memperoleh gelar Sarjana

NAMA : DEVI MARTASARI

NIM : 20170801417

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS ILMU KOMPUTER
UNIVERSITAS ESA UNGGUL
TAHUN 2022
RANCANG BANGUN SISTEM PEMBAYARAN OTOMATIS
MENGGUNAKAN METODE VIRTUAL ACCOUNT BERBASIS
WEBSITE
(Studi Kasus: Mts Nurul Huda Matangaji)
Devi Martasari¹, Malabay²
Teknik Informatika, Fakultas Ilmu Komputer, Universitas Esa Unggul
Jl. Arjuna Utara No. 9, Kebon Jeruk, Jakarta Barat 11510
¹devimartasari15@gmail.com, ²malabay@esaunggul.ac.id

Abstract
The MTs Nurul Huda Matangaji Payment System is a website that can assist
parents in making payments at school. This Payment System aims to assist the
school in facilitating the management of existing payments, so that it can be
done easily both for parents and for the school. This Payment System is made
with the Waterfall methodology, PHP programming language using the
Laravel Framework, MySQL database and Bootstrap Framework to be
responsive on all devices while beautifying the appearance of the interface..
For digital payments on this system using a Virtual Account provided by
Midtrans, if the student's parents succeed in making a payment it will be
automatically confirmed and will receive proof of payment via email. The
results of this study were tested by the Black Box method by testing the system
that had been built running according to the design that had been made.

Keywords: Payment System, Website, Virtual Account

Abstrak
Sistem Pembayaran MTs Nurul Huda Matangaji merupakan sebuah website
yang dapat memantau orangtua siswa dalam melakukan pembayaran di
sekolah. Sistem Pembayaran ini bertujuan untuk membantu pihak sekolah
dalam mempermudah manajemen pembayaran yang ada, sehingga dapat
dilakukan dengan mudah baik untuk orangtua siswa maupun untuk pihak
sekolah. Sistem Pembayaran ini dibuat dengan metodologi Waterfall, bahasa
pemrograman PHP menggunakan Framework Laravel, database MySQL dan
Framework Bootstrap untuk dapat responsive pada semua device sekaligus
memperindah tampilan Interface. Untuk pembayaran digital pada sistem ini
menggunakan Virtual Account yang disediakan oleh Midtrans, jika Orangtua
siswa berhasil melakukan pembayaran maka akan otomatis terkonfirmasi dan
akan mendapatkan bukti bayar melalui email. Hasil penelitian ini diuji dengan
metode Black Box dengan menguji sistem yang sudah dibangun berjalan sesuai
dengan rancangan yang telah dibuat.

Kata kunci : Sistem Pembayaran, Website, Virtual Account

Pendahuluan
Teknologi yang kini kian
berkembang sangat cepat dan pesat,
bermacam pola garis besar transaksi cepat
mengalami pengembangan. Teknologi yang
terus berkembang di zaman sekarang tidak
di terlalu di perlukan mata uang dalam
bentuk kertas melainkan pembayaran
secara uang digital yakni menggunakan
piranti lunak yang lebih efektif dalam
bertransaksi. Perubahan pembayaran non
tunai atau tanpa uang tunai kini kian bukan
sekedar inovasi di dunia perbankan
melainkan juga kebutuhan masyarakat akan
dorongan yang digunakan sebagai alat
pembayaran yang efisien dan sangat praktis
(Tarantang et al., 2019).
Secara tutur kata, lembaga
merupakan organisasi atau sekumpulan
kelompok yang tergabung menjadi satu dan
mempunyai tujuan untuk melakukan
sebuah penelitian tentang keilmuan atau
sebuah usaha. Satu Lembaga merupakan
sekumpulan atau sekelompok manusia yang
masing – masing memiliki tanggung jawab
pendidikan terhadap peserta didik yang
sesuai dengan misi dari organisasi tersebut
(Bafadhol, 2017).
Seiring dengan cepat bergeser nya
aspek – aspek kehidupan manusia menuju
dunia digital dengan berbagai
perkembangan teknologi yakni dalam hal
pembayaran. Pada zaman sekarang ini
banyak masyarakat indonesia yang sudah
mengimplementasikan sebuah transaksi
secara digital atau non tunai dan
mempunyai alasan masyarakat
menggunakan pembayaran non tunai, yaitu:
keamanan terjamin, mudah, praktis, dan
terdapat riwayat pembayaran yang telah di
lakukan dan dapat di jadikan sebagai acuan
pengeluaran setiap bulannya.
Menurut UU Bank Indonesia No.
23/1999 Sistem Pembayaran merupakan
sebuah kerangka yang berhubungan dengan
lembaga, aturan dan mekanisme yang
sering di pakai untuk proses perpindahan
dana dengan tujuan untuk memenuhi
kewajiban yang muncul dari aktifitas
ekonomi seseorang. Saat ini sistem
pembayaran pada Instansi Pendidikan rata –
rata menggunakan uang tunai, dengan
menggunakan kartu pembayaran siswa atau
yang sering disebut Kartu SPP. Tentunya
dengan cara manual seperti itu riskan
terjadinya kesalahan, dengan menggunakan
kertas dan tanda tangan berbentuk fisik
secara manual kemudian di stempel
kemungkinan ada kehilangan kartu dan sulit
untuk mencari Riwayat pembayaran yang
sudah dilakukan. Ataupun dapat terjadi
kesalahpahaman dalam sudah atau belum
nya melakukan pembayaran ke pihak
sekolah.
Website merupakan sekumpulan
halaman yang dapat di akses melalui
internet yang di dalamnya berisikan berkas-
berkas di antaranya video, gambar, atau
lainnya. Situs web sejumlah halaman
website yang sudah dapat di akses secara
publik melalui jaringan internet dan
memiliki alamat atau URL (Suendri, 2018).
Sebagai acuan penjelasan yang di
sampaikan diatas, maka penulis tertarik
untuk menuangkan gagasan ke dalam
penelitian yang berjudul “Rancang
Bangun Sistem Pembayaran Otomatis
Menggunakan Metode Vitual Account
Berbasis Website (Studi Kasus: MTs
Nurul Huda Matangaji)”, Melalui sistem
pembayaran ini sivitas sekolah dapat
melakukan pembayaran dengan
menggunakan Virtual Account. Dengan
tujuan untuk memudahkan orangtua siswa
untuk melakukan pembayaran dan melihat
riwayat transaksi, sehingga pihak sekolah
juga mudah dalam melakukan manajemen
pembayaran siswa.
Pengembangan sistem untuk
website ini menggunakan framework
laravel (Firma Sahrul B, 2017). Untuk
metode uji coba menggunakan black box
(kotak hitam) menguji seluruh dari fungsi
dan modul aplikasi yang telah di buat
(Luthfi, 2017).
Metode Penelitian
Tahapan penelitian dilakukan dalam
merancang sistem yang di bangun, dalam
proses pengumpulan data menggunakan
metodologi wawancara, di dukung dengan
observasi tempat penelitian dan studi pustaka
yang terdiri dari jurnal acuan dalam
penelitian, untuk metode yang
implementasikan adalah Metode Waterfall
Berikut adalah alur kerangka pemikiran
antara lain:
Gambar 1. Kerangka Berpikir
Model SDLC merupakan
paradigma air terjun (waterfall) yang
menyediakan beberapa tahapan secara
sequence yang artisan berurutan sesuai
dengan tahapan masing – masing, yaitu
analisis, design, coding, pengujian, dan
pemeliharaan (Suendri, 2018).
Gambar 2. Tahapan Waterfall
Paradigma ini memiiki pendekatan
yang berurutan sesuai dengan tahapan nya.
Alasan di sebut waterfall di dalam proses
pembangunan dilakukan tahap demi tahap
yang di lewati sampai selesai, lalu dapat ke
lanjut ke selanjutnya (Pressman, 2015).
1. Analisis Kebutuhan Perangkat Lunak
Tahapan ini merupakan tahapan
pengumpulan data dengen
menganalisis objek penelitian. Dan
kebutuhan oleh pengguna seperti apa.
2. Desain
Tahapan desain merupakan proses
selanjutnya dari analisis,
menerjemahkan proses analisis ke
dalam bentuk desain diagram dari
sistem yang ingin di bangun sesuai
dengan analisis yang telah di tentukan.
Tahapan ini melakukan implementasi
nyata agar desain yang di hasilkan
dapat di implementasikan ke dalam
tahapn selanjutnya yaitu pengkodean
sistem. Dan perlu nya ada dokumentasi
dari desain yang dibuat.
3. Pengkodean
Tahapan ini menterjemahkan design ke
dalam kode program perangkat lunak
sistem. Tahapan ini menghasilkan
sebuah aplikasi sesuai dengan design
yang telah di bangun sebelumnya.
4. Pengujian
Tahapan pengujian, tentu setelah di
lakukan pengkodean masuk kepada
tahap pengujian. Untuk memastikan
dilakukannya proses pengujian.
5. Pemeliharaan (maintenance)
 Tahapan ini merupakan tahapan Dibawah ini adalah Activity
pemeliharaan sistem tentu dalam dunia Diagram adalah diagram aktifitas atau
teknologi perangkat lunak akan tetap perancangan alur sebuah sistem perangkat
lunak dalam sistem pembayaran sekolah.
terus berkembang mengikuti
perkembangan zaman, tahapan ini
sangat penting untuk memastikan kode
program yang dibuat masih layak
untuk di gunakan atau desain yang di
gunakan masih dapat di terima oleh
pengguna yang menggunakannya.
Perlu di ingat tahapan pemeliharaan ini
dapat mengulangi seluruh proses dari
awal akan tetapi tidak untuk
melakukan pembuatan aplikasi baru.
Gambar 4. Activity Diagram Login
Hasil dan Pembahasan
Pada Tahapan ini melakukan
perancangan design aplikasi menggunakan
bantuan diagram UML untuk memudahkan
dalam proses pengkodean. Unified
Modelling Language (UML) merupakan
gambaran desain sistem yang menjadi
standar acuan untuk memvisualisasikan
dalam merancang sebuah sistem piranti
lunak (Malabay, 2018).
Use Case menggambarkan
tampilan sistem berdasarkan aktor yang
terlibat. Berikut use case diagram dari
sistem yang diusulkan antara lain:

Gambar 5. Activity Diagram Data Tagihan

Gambar 3. Use Case Diagram

 Gambar 6. Activity Diagram Data Siswa Gambar 8. Activity Diagram Laporan
Pembayaran
Sequence diagram merupakan
diagram yang memiliki kerja sama secara
dinamis yang melibatkan seluruh objek
pada aplikasi yang di bangun ini. Memiliki
fungsi untuk merangkai kata antar objek
melalui pesan yang di kirim.

Gambar 9. Sequence Diagram Login

Gambar 7. Activity Diagram Data Pembayaran

Gambar 10. Sequence Diagram Data Tagihan

 Gambar 11. Sequence Diagram Data Siswa

Gambar 14. Class Diagram

Gambar 12. Sequence Diagram Data
Pembayaran
Selanjutnya tahap implementasi
merupakan tahapan aplikasi yang telah di
bangun di rilis untuk digunakan secara
publik oleh pengguna. Adapun beberapa
tampilan aplikasi antara lain:

Gambar 13. Sequence Diagram Laporan Gambar 15. Tampilan Halaman Login
Pembayaran
Halaman login atau sign in
Untuk menentukan hubungan antar
objek class yang ada, pertukaran pesan merupakan halaman pertama kali yang di
yang ada diperiksa dari skenario. Class tampilkan ketika pengguna mengakses ke
Diagram adalah proses menentukan atribut alamat url website.
dari sebuah sistem yang di bangun dengan
tujuan untuk meminimalisir adanya atribut
yang di gunakan secara berulang. Melalui
proses relasi yang dapat digunakan dengan
mengelompokkan data menjadi bentuk
tabel data. Memberitahukan bahwa entity
tabel mudah untuk di modifikasi.

Gambar 16. Halaman Dashboard Admin (Tata

Usaha)
 Halaman dashboard admin tata
usaha adalah halaman pertama yang di
tampilkan ketika admin sekolah atau tata
usaha berhasil melakukan login, halaman
ini berisi statistik dari transaksi yang telah
terjadi secara keseluruhan.

Gambar 19. Halaman Data Pembayaran (Tata

Usaha)
Halaman data pembayaran
merupakan halaman data – data
pembayaran. Pada halaman ini admin dapat
melakukan tambah data dan juga input
harga dari pembayaran yang di inginkan.
Gambar 17. Tampilan Halaman Data Siswa
(Tata Usaha)
Halaman data siswa merupakan
halaman data – data siswa yang terdiri
dari nama, kelas, nisn. Pada tampilan
halaman ini administrator atau tata
usaha dapat melakukan tambah data,
edit, dan hapus data.
Gambar 20. Tampilan Halaman Data Transaksi
(Tata Usaha)
Halaman data transaksi merupakan
halaman pembayaran yang diolah tata
usaha. Disini administrator atau atau tata
usaha dapat melakukan input data secara
global untuk seluruh siswa, atau spesifik
Gambar 18. Tampilan Halaman Data Kelas untuk siswa tertentu.
(Tata Usaha)
Halaman data kelas merupakan
halaman data – data kelas. Pada tampilan
halaman ini administrator atau tata usaha
dapat melakukan tambah data, edit, dan
hapus data.

Gambar 21. Tampilan Halaman Data Laporan

Tampilan data laporan adalah
tampilan yang berisikan data transaksi dan
jumlah nominal total pemasukan per-hari
atau bisa di filter per-tanggal yang di
inginkan. Pada halaman ini admin juga
dapat import data ke dalam bentuk excel
atau pdf.
Gambar 22. Halaman Dashboard Siswa
Halaman dashboard siswa
merupakan halaman pertama yang di
tampilkan ketika orangtua siswa berhasil
melakukan login ke dalam aplikasi. Pada
halaman ini berisikan informasi statistik
data dari siswa yang bersangkutan.
Gambar 23. Tampilan Halaman Data Transaksi
Siswa
Halaman data transaksi siswa
adalah tampilan yang berisikan data
transaksi yang sedang berlangsung, siswa
dapat melihat dan juga melakukan
pembayaran pada halaman ini.
Gambar 24. Tampilan Halaman Ganti
Password Siswa
Halaman ganti password siswa
merupakan halaman untuk mengubah data
password siswa. Pada halaman ini siswa
dapat mengubah password nya dengan
mengisikan password lama dan password
baru.
Gambar 25 Tampilan Halaman Payment
Gateway Midtrans
Halaman payment gateway
midtrans merupakan halaman untuk
melalukan pembayaran dengan virtual
account. Secara online dengan nomor
virtual account yang tesedia. Virtual
account yang tersedia adalah, bca, pertama
bank, bni, dan bri.
Kesimpulan
Sistem Pembayaran MTs Nurul
Huda berbasis website dapat membantu
pihak sekolah dalam memanajemeni
pembayaran yang masuk di sekolah. Dan
juga dapat membantu orangtua siswa
dengan mempermudah pembayaran hanya
dengan cara transfer ke virtual account yang
telah disediakan, serta orangtua siswa dapat
melihat di website untuk tagihan yang akan
datang ataupun riwayat pembayaran yang
sudah dilakukan. Dengan adanya sistem ini
dapat meminimalisir dalam hal kehilangan
data pembayaran ataupun kecurangan
dalam pembayaran. Sistem pembayaran
MTs Nurul Huda berbasis website masih
kekurangan dan tidak sempurna untuk
mencapai hasil yang lebih baik lagi. Oleh
karena itu adapun beberapa saran acuan
agar lebih baik lagi dalam pengembangan
selanjutnya:
1. Adanya fitur baru orangtua siswa Tarantang, J., Awwaliyah, A., Astuti, M., &
dengan guru. Munawaroh, M. (2019).
2. Adanya fitur baru yang dapat Perkembangan sistem pembayaran
diintegrasikan dengan e-wallet. digital pada era revolusi industri 4.0 di
3. Adanya fitur baru aplikasi mobile indonesia. Jurnal Al Qardh, 4(1), 60–
Android ataupun IOS sehingga lebih 75.
mempermudah kembali dalam
mengakses sistem.

Daftar Referensi
Bafadhol, I. (2017). Lembaga Pendidikan
Islam Di Indonesia. Jurnal Edukasi
Islami Jurnal Pendidikan Islam,
6(11), 59–72.
Firma Sahrul B, M. A. S. O. D. W. (2017).
Implementasi Sistem Informasi
Akademik Berbasis Web
Menggunakan Framework Laravel.
Jurnal Transformasi, 12(1), 1–4.
Luthfi, F. (2017). Penggunaan Framework
Laravel Dalam Rancang Bangun
Modul Back-End Artikel Website
Bisnisbisnis.ID. JISKA (Jurnal
Informatika Sunan Kalijaga), 2(1),
34–41.
Malabay. (2018). Model Rancangan
Pembelajaran Aktif, Kreatif Dan
Inovatif Dengan Pendekatan Unified
Modeling Language. Jurnal Ilmu
Komputer Vol 15 No 1, 81–82.
Pressman, R. . (2015). Rekayasa Perangkat
Lunak: Pendekatan Praktisi Buku I.
Andi.
Suendri. (2018). Implementasi Diagram
UML (Unified Modelling Language)
Pada Perancangan Sistem Informasi
Remunerasi Dosen Dengan Database
Oracle (Studi Kasus: UIN Sumatera
Utara Medan). 1–9.
http://jurnal.uinsu.ac.id/index.php/alg
oritma/article/download/3148/1871