JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  41 

PENERAPAN WEB APPLICATION ARCHITECTURE FRAMEWORK DALAM PEMBANGUNAN SISTEM ADMINISTRASI DOKUMEN

PEMBIAYAAN KPR (Studi Kasus : BTN Syariah KCS Bandung)

Mira Musrini Barmawi[1], Irsyad Ahmadi[2]

Jurusan Teknik Informatika Institut Teknologi Nasional Bandung

ABSTRAK

Salah satu faktor penting dalam proses bisnis KPR adalah pencatatan adminsitrasi pembiayaan KPR. Pada saat ini sistem pencatatan dan pembuatan laporan administrasi pembiayaan KPR di BTN Syariah KCS Bandung masih dilakukan secara manual. Pencatatan dan pembuatan laporan secara manual memiliki kekurangan diantaranya data pembiayaan yang tidak dapat diakses oleh para stakeholder. Selain itu ada data ganda yang ditimbulkan akibat pencatatan secara manual dan juga proses dokumentasi laporan tidak terlaksana dengan baik. Salah satu alternatif jalan keluar dari permasalahan tersebut adalah dengan membangun suatu sistem pembiyaan KPR yang berbasis web. Web Application Architecture Framework merupakan suatu kerangka kerja untuk membangun sistem berbasis web. Web Application Architecture Framework mengacu pada kerangka kerja Zachman. Dalam penelitian tugas akhir ini akan dibahas mengenai penerapan Web Application Architecture Framework dalam pembangunan sistem administrasi pembiayaan KPR dengan mengambil studi kasus di BTN Syariah KCS Bandung. BTN Syariah KCS Bandung adalah salah satu lembaga penyalur kredit pembiayan rumah (KPR). Pada penelitian tugas akhir ini dihasilkan sistem administrasi dokumen pembiayaan KPR berbasis web yang dirancang dan dibangun dengan menerapkan web application architecture framework. Kata kunci : pencatatan admnistrasi, dokumentasi laporan, sistem administrasi pembiayaan berbasis web, WAAF

ABSTRACT

WAAF ( Web application Architecture Framework ) is a framework to build a web based system . It was a modification of Zachmann FrameWork . The framework WAAF is a matrix with size 7 x4. The columns are Structure (what), Behaviour (how), Location (where) and Pattern. The rows are planning architecture, Business Architecturem User interface Architecture, Information Architecture, System Architecture, Web Object Architecture, Test Architecture. The framework is applid to a case study in BTN Syariah KCS Bank in Bandung. In this bank administratin reports and records of KPR budgets is still manually processed by employees. All the reports

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  42 

cannot be accessed by stakeholder. To overcome this situation , we decide to buil a web based system , by using WAAF framework. All of the analysis and design of the system are build based on the rules of WAAF matriks, and the final result is web based information system to support document administration of KPR. Keyword: WAAF, framework, web based information system. PENDAHULUAN

Salah satu bagian operasional yang ada pada BTN Syariah adalah Financing Documentation (FD). FD merupakan sebuah bagian yang mempunyai tugas untuk mencatat dan membuat laporan yang menyangkut administrasi dari pembiayaan yang diberikan oleh pihak BTN Syariah kepada nasabah. Pada saat ini tugas pencatatan dan pembuatan laporan masih dibuat dan diolah secara manual baik menggunakan microsoft excel atau dicatat dalam sebuah buku

Pencatatan yang dibuat secara manual seperti ini membuat seorang staf FD sering melakukan satu tugas secara berulang-ulang. Misalnya saja dalam pencatatan akad, ada lebih dari satu file excel yang harus diisi oleh seorang staf FD dengan kolom isian yang sebenarnya hampir sama antara satu file dengan file lain. Selain hal tersebut, pembuatan laporan secara manual membuat dokumentasi dari laporan tidak terlaksana dengan baik. Selain itu dengan pencatatan dan pengolahan data administrasi pembiayaan secara manual menyebabkan kepentingan dari pihak-pihak yang terlibat dalam pembiayaan tersebut kurang terakomodasi. Misalnya saja kepentingan dari pihak developer untuk mengetahui jumlah dana jaminan yang masih ditahan oleh pihak Bank. Kurangnya akses bagi para stakeholder terkadang menyebabkan kesalahpahaman antara pihak bank dengan stakeholder yang bersangkutan.

Salah satu alternatif untuk mengatasi permasalahan tersebut adalah dengan membuat suatu aplikasi yang mampu mengintegrasikan setiap data pembiayaan serta dapat diakses oleh pihak yang

berkepentingan dengan pembiayaan tersebut. Aplikasi tersebut adalah sistem administrasi pembiayaan KPR BTN Syariah. Sistem administrasi pembiayaan KPR BTN Syariah ini dirancang untuk diintegrasikan dengan sebuah basis data serta dibuat dengan basis web. Sistem ini dibangun dengan basis web agar data pembiayaan dapat diakses oleh pihak yang berkepentingan dengan pembiayaan tersebut. Pembangunan Sistem Administrasi Pembiayaan KPR BTN Syariah ini dirancang dan dibangun dengan menerapkan Web Application Architecture Framework (WAAF). Kerangka kerja ini membantu dan memberi tuntunan pada suatu organisasi dalam merencanakan, mendesain, membangun, menggunakan, dan perawatan suatu sistem. Kerangka kerja ini mempunyai karakteristik yang spesifik untuk sistem berbasis web. WAAF Web Application Architecture Framework (WAAF) merupakan suatu kerangka kerja yang mempunyai karakteristik yang spesifik dalam pembangunan sistem berbasis web. Untuk penggunaannya WAAF dibuat dalam sebuah matriks. Dimensi horizontal menyangkut pada perbedaan persepektif dalam pembangunan sistem berbasis web tersebut. Sedangkan dimensi vertikal mengklasifikasikan arsitektur menjadi empat kategori, yaitu structure (what), behaviour (how), location (where), pattern. Penjelasan singkat dari setiap kolom dalam matriks

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  43 

WAAF adalah sebagai berikut : A. Structure

Berisi entitas yang ada dalam sistem beserta hubungan antar entitas tersebut.

B. Behaviour Mendeskripsikan suatu gambaran alur kerja fungsional dari sistem yang menetukan sifat interaksi dari setiap entitas yang sudah didefinisikan sebelumnya.

C. Location Memberikan suatu gambaran dari lokasi secara fisik maupun logis dari entitas yang ada.

D. Pattern Hal ini mengacu pada penggunaan kembali praktek-praktek yang sudah berhasil dalam pengembangan sistem.

Ada delapan perspective dalam WAAF, yaitu planner perspective, business owner perpective, user perspective, information architect perspective, system architect perspective, developer perspective, dan tester perspective. Penjelasan singkat dari setiap perspektif yang ada akan dijelaskan pada Tabel 1. Sedangkan penjelasan secara rinci dari setiap cell akan dijelaskan setelah tabel tersebut.

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  44 

Tabel 1 WAAF

Structure (What)

Behaviour (How)

Location (Where)

Pattern

Planning Architecture (Planner’s Perspective)

Berisi daftar hal-hal yang penting untuk bisnis.

Berisi daftar dari proses untuk menjalankan bisnis.

Berisi daftar tempat di mana bisnis dijalankan.

Business Architecture (Business Owners Perspective)

Menggambarkan keterkaitan setiap entitas.

Menggambarkan setiap proses bisnis yang ada.

Memodelkan relasi lokasi bisnis.

Menjelaskan pola Bisnis

User Interface Architecture (User’s Perspective)

Merepresentasikan tampilan dan hubungannya dalam sistem.

Membuat pemodelan setiap proses bisnis dalam sistem.

Membuat site map dari sistem yang dibuat.

Mengumpulkan pola-pola untuk tampilan antarmuka.

Information Architecture (Information Architect’s Perspective)

Mendefinisikan informasi yang akan ditampilkan dalam setiap tampilan sistem.

Membuat aliran dari setiap informasi yang ditampilkan pada sistem.

Membuat suatu pemodelan dari letak sistem dan pengguna

Mengumpulkan pola-pola skem informasi.

System Architecture (System Architectect’s Perspective)

Membuat suatu pemodelan alur data dari setiap modul dan setiap sub modul.

Membuat suatu pemodelan hubungan antara tampilan dan server.

Membuat suatu desain penempatan setiap file yang dibuat.

Mengumpulkan pola-pola untuk merepresentasikan model dari web yang dibangun.

Web Object Architecture (Developer’s Perspective)

Mendefinisikan setiap input dan ouput data pada sistem.

Membuat algoritma dari setiap file yang dibutuhkan.

Melakukan implementasi program pada jaringan internet.

Penggunaan kembali kode dan komponen yang ada

Test Architecture (Tester’s Perspective)

Mendefinisikan apa saja yang harus diuji.

Membuat pemodelan dari sistem yang akan diuji.

Membuat diagram pengujian.

Menjelaskan pola pengujian.

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  45 

SISTEM APLIKASI PERBANKAN Sistem aplikasi perbankan adalah penggunaan komputer dan alat-alat pendukungnya dalam operasional perbankan yang meliputi pencatatan, penghitungan, peringkasan, penggolongan, dan pelaporan semua kegiatan dibidang perbankan. Kegiatan tersebut bisa meliputi administrasi, akuntansi, manajemen, pemasaran, atau bidang lain yang mendukung kegiatan perbankan.

Gambar 1 : sistem informasi perbankan Sistem aplikasi perbankan yang lengkap dan terintegrasi satu sama lain mencakup sistem pengolahan transaksi (transaction processing system), sistem pengolahan aplikasi (application processing system), sistem keputusan manajemen (management decision system), sistem informasi nasabah (customer information system). Sistem aplikasi perbankan dilengkapi kemampuan eksploison dan imploison. Eksploison adalah kemampuan untuk memberi satu masukan pada sistem tetapi bisa untuk sejumlah transaksi. Sedangkan imploison adalah kemampuan melakukan lebih dari satu masukan untuk satu transaksi

ANALISA DAN PERANCANGAN Cell (PA-Structure): Padas el ini dilakukan identifikasi entitas : 1. Nasabah KPR 2. Financing Documentation (FD) 3. Rumah 4. Developer/Penjual 5. Notaris 6. Asuransi 7. Appraisal 8. Akad 9. Dokumen Pokok Cell (PA-Behaviour) Pada sel ini akan dibahas mengenai uraian dari setiap proses bisnis yang ada, hal tersebut diuraikan berdasarkan kategori pengguna, yaitu : 1. Staff FD

A. Pembuatan Laporan Penilain Agunan (LPA) B. Pencatatan Administrasi Akad Pembiayaan KPR C. Pembuatan Memo Pencairan Dana Realisasi Akad D. Pembuatan Memo Pencairan Dana Jaminan E. Pencatatan Penerimaan Dokumen KPR F. Pembuatan Surat Pelunasan G. Laporan Rekonsiliasi Dana Jaminan

2. Nasabah KPR A. Melihat Data Akad B. Melihat Data Dokumen Pokok

3. Notaris A. Melihat Data Dokumen Pokok B. Melihat Data Dana Jaminan

4. Developer A. Melihat Data Akad B. Melihat Data Dana Jaminan

5. Perusahaan Asuransi A. Melihat Data Polis Asuransi B. Melihat Dana Jaminan

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  46 

Cell (PA-Location) Pada sel ini akan dijabarkan lokasi dari bisnis dijalankan dan lokasi dari aplikasi dijalankan, yaitu : 1. Lokasi Bisnis Lokasi dari rumah yang dijadikan objek dalam akad KPR terdapat di beberapa wilayah di Jawa Barat, seperti Garut, Tasikmalaya, Padalarang, dan Cianjur. Namun setiap akad KPR rumah harus dilakukan di BTN Syariah KCS Bandung. 2. Lokasi Aplikasi Aplikasi ini dirancang dirancang dan dibangun untuk dapat digunakan oleh staff FD, nasabah KPR, developer, notaris, dan pihak asuransi. Cell (BA-Structure) Pada dijelaskan mengenai hubungan dari setiap entitas. Hubungan dari setiap entitas tersebut digambarkan menggunakan entity relationship diagram (ERD) pada lampiran A Gambar 1. Ada tujuh aturan bisnis yang digunakan untuk mengembangkan ERD tesebut, salah satunya adalah : Satu developer memiliki satu atau lebih properti. Satu properti dimiliki satu developer. Dalam satu properti terdiri dari banyak tipe rumah. Satu buah tipe rumah dapat dimiliki oleh lebih dari satu property. Satu nasabah KPR dapat melakukan akad lebih dari satu kali. Sedangkan satu akad hanya berlaku untuk satu nasabah. Satu rumah agunan dibeli dengan satu akad dan satu akad hanya dapat membeli satu rumah agunan. Cell (BA-Behaviour) Pada sel ini digambarkan mengenai proses bisnis yang sudah dijelaskan pada BA Structure dengan menggunakan flowchart. 1. Nasabah KPR

Gambar 2 : Flowchart Sistem Administrasi Pembiayaan KPR

2. Staff FD

Gambar 3:Flowchart Sistem Administrasi Pembiayaan KPR (Admin)

3. Notaris

Gambar 4: Flowchart Sistem Administrasi Pembiayaan KPR

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  47 

4. Developer

Gambar 5: Flowchart Sistem Administrasi Pembiayaan KPR

5. Perusahaan Asuransi

Gambar 6:Flowchart Sistem Administrasi Pembiayaan KPR

Cell (BA-Location) Aktivitas pada sel ini adalah menggambarkan denah dari lokasi bisnis dan lokasi aplikasi 1.Lokasi Bisnis

Lokasi dari rumah yang dibeli dalam akad KPR tersebar dibeberapa wilayah di Jawa Barat tetapi untuk proses akad KPR hanya dapat dilakukan di BTN KCS Bandung.

Gambar 7: lokasi bisnis

2.Lokasi Aplikasi Sistem ini beroperasi pada server dan dapat diakses oleh pihak developer, notaris, asuransi, dan nasabah KPR.

Sistem ini dapat diakses menggunakan jaringan internet.

Gambar 8: lokasi aplikasi

Cell (UIA-Structure) Pada sel ini digambarkan layout system. Layout dari halaman pertama adalah sebagai berikut:

Gambar 9 Layout Halaman Login Sistem

Pada kolom menu utama berisi tiga buah sub menu, yaitu sub menu beranda, sub menu transaksi, dan sub menu cara pemakaian.

Gambar 10 Layout Halaman Sistem

Pada sub menu transaksi akad terdiri dari delapan pilihan sub menu: 1 Pembuatan LPA 2. Registrasi Akad

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  48 

3. Pembuatan Memo Pecairan Dana Realisasi Akad 4. Pembuatan Memo Pencairan Dana Jaminan 5. Registrasi Dokumen Pokok 6. Registrasi Asuransi 7. Pembuatan Surat Pelunasan 8. Pembuatan Laporan Rekonsiliasi Dana Jaminan Menu data master ini terdiri dari delapan sub menu. Berikut ini adalah penjelasan dari submenu data master: 1. User 2. Perusahaan Appraisal 3. Rumah 4. Jenis Asuransi 5. Jenis Akad 6. Jenis Dana Jaminan 7. Jenis Dokumen Pokok 8. Jangka Waktu Cell (UIA-Behaviour) Pada sel ini dikembangkan diagram alur dari setiap halaman sistem yang disebut sebagai user interface flow diagram dari perspektif user dan perspektif admin.

Gambar 11 User Interface Flow Diagram

Sistem (Admin)

Gambar 12 User Interface Flow Diagram Sistem (Non Admin) Diagram untuk setiap submenu dari transaksi akad adalah sebagai berikut: 1 Pembuatan LPA

Gambar 13 User Interface Flow Diagram Menu Akad

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  49 

2. Registrasi Akad

Gambar 14 User Interface Flow Diagram Menu Registrasi Akad 3. Pembuatan Memo Pecairan Dana Realisasi Akad

Gambar 15 User Interface Flow Diagram Menu Buat Memo Akad

4. Pembuatan Memo Pencairan Dana Jaminan

Gambar 16 User Interface Flow Diagram Menu Buat Memo Dana Jaminan 6.Registrasi Dokumen Pokok

Gambar 17 User Interface Flow Diagram Menu Registrasi Dokpok 6. Registrasi Asuransi

Gambar 18 User Interface Flow Diagram Menu Registrasi Asuransi

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  50 

7. Pembuatan Surat Pelunasan

Gambar 19 User Interface Flow Diagram Menu Surat Pelunasan Diagram untuk setiap submenu data master adalah sebagai berikut: 1. User

Gambar 20 User Interface Flow Diagram

Sub Menu User

2. Perusahaan Appraisal

Gambar 20 User Interface Flow Diagram Sub Menu Perusahaan Appraisal 3. Rumah

Gambar 21 User Interface Flow Diagram Sub Menu Rumah

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  51 

4. Jenis Asuransi

Gambar 22 User Interface Flow Diagram Sub Menu Jenis Asuransi 5. Jenis Akad

Gambar 23 User Interface Flow Diagram Sub Menu Jenis Akad

6. Jenis Dana Jaminan

Gambar 24 User Interface Flow Diagram Sub Menu Jenis Data Jaminan 7. Jenis Dokumen Pokok

Gambar 25 User Interface Flow Diagram Sub Menu Jenis Dokumen pokok

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  52 

8. Jangka Waktu

Gambar 26 User Interface Flow Diagram Sub Menu Jangka Waktu Cell (UIA-Location) Pada sel ini dijelaskan mengenai struktur dari sistem yang dibuat dengan menggunakan sitemap.

Gambar 27 Site Map Non Admin

Gambar 28 Site Map Admin Information Architecture (IA) Pada baris ini dibahas mengenai artifak yang dihasilkan dari information architect perspective, yaitu information diagram, DFD, dan diagram deployment. IA terdiri dari sel (IA-Structure), sel (IA-Behaviour), dan sel(IA-Location). Cell (IA-Structure) Pada sel ini ini didefinisikan data apa saja yang ditampilkan pada setiap halaman sistem. Contoh pada halaman lpa data yang diambil dari database untuk ditampilkan pada halaman sistem adalah no_lpa, nama_perusahaan_appraisal, alamat_rumah agunan, nama_developer, harga_jual, tgl_lpa, no_sertifikat, tgl_berlaku_sertifikat, tgl_berlaku_appraisal, luas_bangunan, luas_tanah, harga_wajar_tanah, harga_wajar_bangunan, harga_cepat_tanah, harga_cepat_bangunan, JKK, sertifikat, imb, air, listrik, bestek.

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  53 

Cell (IA-Behaviour) Pada sel ini digambarkan bagaimana data mengalir pada sistem yang dibuat. Penggambaran tersebut ditampilkan dalam DFD Cell (IA-Location) Sistem ini beroperasi pada server dan dapat diakses oleh pihak developer, notaris, asuransi, dan nasabah KPR. Untuk mengaksesnya dibutuhkan suatu teknologi yaitu internet karena sistem ini dibangun dengan berbasis web.

Gambar 27 Lokasi Aplikasi IMPLEMENTASI Pembuatan Database Sistem Database pada sistem dibuat berdasarkan ERD yang telah dibuat. Pembuatan database dalam sistem administrasi pembiayaan KPR ini menggunakan PHP MyAdmin 3.2.4. Database yang dibuat diberi nama sistem_kpr. Pada layout yang telah didefiniskan pada bab perancangan terdapat dua buah layout untuk sistem ini, yang pertama adalah tampilan untuk login sistem dan tampilan untuk halaman sistem.

Gambar 28 Tampilan Halaman Login

Gambar 30 Tampilan Halaman Utama Sistem PENGUJIAN Pada pengujian sistem dilakukan pengujian dengan menggunakan metode pengujian black box. Pengujian pertama merupakan pengujian alpha sedangkan pengujian kedua merupakan pengujian beta. 1. Pengujian alpha

Pengujian alpha dilakukan oleh pembangun sistem. Pengujian alpha dilakukan untuk mengetahui apakah sistem yang dibangun masih memiliki eror pada sistem atau tampilan. Dalam pengujian alpha dilakukan pengujian terhadap beberapa fungsi yang sudah dibuat pada sistem. Fungsi-fungsi yang diuji adalah : tambah data, ubah data, hapus data, cari data, lihat data, cetak laporan. Hasil pengujian alpha adalah :

JURNAL INFORMATIKA 

No.2 ,  Vol.  3, Mei – Agustus 2012  54 

Tabel 2 pengujian alpha NO Fungsi

yang diuji Hasil pengujian

1 Tambah data

Fungsi tambah data berfungs baik

2 Ubah data Fungsi ubah data berfungs baik

3 Hapus data

Fungsi hapus data berfungs baik

4 Cari data Fungsi cari data berfungs baik

5 Lihat data Fungsi lihat data berfungs baik

6 Cetak laporan

Fungsi cetak laporan berfungs baik

2. Pengujian Beta Pengujian beta merupakan pengujian yang dilakukan oleh pengguna sistem. Pada pengujian beta ini dilakukan pengujian pada beberapa fungsi yang tersedia pada sistem. Berikut adalah hasil dari pengujian beta yang dilakukan. Tabel3 pengujian betha

KESIMPULAN Kesimpulan penelitian ini adalah berdasarkan implementasi dan pengujian yang dilakukan, WAAF dapat diterapkan dalam pembuatan Sistem Administrasi Dokumen Pembiayaan KPR. Sistem ini yang dapat digunakan oleh setiap stakeholder (tabel 3) dan laporan sudah terdokumentasi dengan baik (tabel 3). DAFTAR PUSTAKA [1] Kong, X., Liu, L., Lowe, D., 2007, Separation of Concern : a Web Application Architecture Framework, journals.tdl.org/jodi/article/download/69/72. 20 Maret 2011 [2] Universitas Gunadarma, 2009, Konsep Dasar Aplikasi Perbankan, http://elearning.gunadarma.ac.id/docmodul/bankingaudit_pdf/Bab_1.pdf, 24 Agustus 2011 [3] Universitas Mercubuana, 2009, Terapan Perbankan, http://journal.mercubuana.ac.id/data/xBAB%203.doc, 24 Agustus 2011 [4] Pressman, Roger S, 2000, Software Engineering, http://bib.tiera.ru/dvd47/Pressman%20R.S.%20-%20Software%20engineering(2000)(Fifth%20edition)(840).pdf. 29 Oktober 2010 [5] Kong, X., Liu, L., Lowe, D. (2007). A Web System Trace Model and Its Application to web Design. Sumber : journals.tdl.org/jodi/article/download/202/164. 20 Maret 2011 [6] HM. Jogiyanto, 1990, Analisis Dan Disain, Andi Offset, Yogyakarta. [7] Ambysoft, 2009, User Interface Flow Diagram (Storyboard), http://www.agilemodeling.com/artifacts/uiFlowDiagram.htm, 27 Juni 2011