PROTOTYPE APLIKASI PEMBAYARAN
Kali ini, kami akan mencoba mengimplementasikan sistem informasi mobile-banking berupa pembayaran, dengan menggunakan 'bubble.is'. Dari activity diagram yang telah dibuat, dan juga pengamatan aplikasi m-banking yang disediakan oleh bank Mandiri, kami menyimpulkan untuk membuat prototype ini terbagi menjadi 4 bagian.
1. Register,
Register bertujuan untuk mendaftarkan email dan password pada database m-banking yang ada. Langkah ini sebenarnya di lakukan oleh pihak teller bank, namun untuk kemudahan menggunakan `bubble.is` kami membuat sebuah page register juga untuk kemudahan demo aplikasi
Dari register tersebut, kami membuat workflow sehingga ketika mendaftar, maka data email dan password akan diinputkan ke tabel Users pada database
Ketika sudah membuat email dan password, maka langkah selanjutnya adalah, menginputkan data dari rekening, pada hal ini, kami juga membuat sebuah form untuk mengisi data tersebut yang sebenarnya dilakukan oleh pihak teller bank, berikut page nya
Fungsi dari form tersebut adalah membuat data akun pada database, yang sebenarnya sudah disediakan oleh bank, namun demi kemudahan menggunakan aplikasi `bubble.is`, kami membuat form terendiri untuk form akun tersebut, berikut database detail akun bank dari akun tersebut
Setelah di hubungkannya akun bank terhadap akun m-banking, maka langkah selanjutnya adalah login dan memberikan pin mobile banking tersebut
2. Login
Selanjutnya adalah login, dimana login ini bertujuan untuk masuk ke m-banking tersebut, pada kasus ini kami membuat login berdasarkan email dan password yang telah terdaftar tadi, sehingga pada database akan terdapat seperti ini pada tabel account
Karena pada database account, pengguna belum menyetel pin moblie banking nya, maka user akan diarahkan ke halaman penyetelan pin mobile banking
Setelah mobile pin berhasil di set, maka aplikasi sekarang akan masuk ke halaman utama
3. Halaman utama
Halaman utama tersebut masih benar-benar awal dan tidak terlalu mementingkan hal lain selain logot dan fungsional pembayaran, untuk masuk ke pembayaran maka kita masuk ke selection pembayaran
4. Pembayaran
Rencana awal dari pembayaran adalah, masing-masing bisa menghandle pembayaran internet, tiket, listrik, dan lain-lain, namun karena ini prototipe sederhana, maka kami akan mencontohkan pembayaran internet.
berikut diberikan contoh data tagihan yang disediakan oleh pihak penyedia layanan internet kepada pengelola bank, disini kami membuat kasus dimana kode pembayaran tersebut terdiri dari 3 bagian penting yakni
kodeuser-periode-kodepenyediajasa, dimana pada contoh tersebut adalah
4435211332019697
yang berarti kode user 44352113 adalah kode user dari Garuda terhadap Telkom, 32019 berarti Maret 2019, dan 697 berarti akun Telkom.
Pada sisi user, berikut yang bisa didapat dari pembayaran internet, terdapat popup box penyedia mana,dan kode penggunanya.
Sehingga ketika kita memilih telkom dengan kode tersebut, maka aplikasi akan mencari kode pembayaran dengan format, kodeuser-periodesekarang-kodetelkom, yang dimana pembayaran tersebut masih berstatus false yang berarti belum dibayar. Berikut workflow yang kami gunakan
Ketika telah mengaccept pilihan tersebut, maka kita akan mencoba pembayaran tersebut, maka ketika kode berhasil ditemukan dan belum terbayar, maka akan diarahkan ke halaman detail
Dari halaman detail tersebut, kitab bisa tahu, deskripsi hingga jumlah yang harus dibayarkan. Ketika kita mengkonfirmasi pembayaran, maka langkah selanjutnya adalah memasukkan Pin mobile banking kita.
Setelah kita konfirmasi, seharusnya kita di redirect ke halaman tertentu yang menyatakan detail dan resi pembayaran, namun demi mempersingkat prototipe, kami langsung meridirect kembali ke halaman pembayaran dengan historis nya
Bisa dilihat bahwa ketika sudah membayar maka akan mendapatkan historis dari pembayaran sebelumnya.
Berikut workflow konfirmasi pembayaran
Jadi ketika pin mobile di konfirmasi, maka otomatis, akan mengupdate database garuda ballancenya berkurang sebanyak ammount yang dibutuhkan, dan akan men-set pembayaran tersebut menjadi true yang berarti telah dibayar, lalu akan membuat sebuah data pada tabel history untuk kepentingan history pembayaran
Selanjutnya apabila dana kurang dari yang dibutuhkan, maka akan muncul pop up seperti ini ketika pencarian kode telah ditemukan, dan hendak membayar,
Sekian dan terimakasih
