BAB IV ANALISIS DAN PERANCANGAN. diklasifikasikan secara detail berdasarkan kebutuhan (requirement). Kerangka

Transkripsi

1 52 BAB IV ANALISIS DAN PERANCANGAN Pada tahapan ini akan dilakukan analisis dan perancangan sistem yang diklasifikasikan secara detail berdasarkan kebutuhan (requirement). Kerangka pemodelan menggunakan RUP (Rational Unified Process) dalam tahapan ini membahas fase inception dan fase elaboration Fase Inception Pada fase awal RUP ini akan memodelkan proses bisnis yang dibutuhkan (business modelling) dan mendefinisikan kebutuhan sistem yang akan dibuat (requirement) Proses Bisnis Aplikasi Pengolahan Data Nikah Berbasis Web Proses bisnis ini dapat memberikan gambaran sebagai dasar evaluasi terhadap proses bisnis yang sedang berjalan sehingga hasil dari evaluasi ini akan menghasilkan kebutuhan-kebutuhan yang jelas dan mudah dipahami untuk menghasilkan proses bisnis baru. a. Deskripsi Proses Bisnis Pengolahan Data Nikah Pengolahan data nikah merupakan proses bisnis yang dilakukan untuk mengolah data nikah. Proses bisnis yang akan dijelaskan pada analisis ini hanya menjelaskan informasi data nikah. Informasi yang dihasilkan berupa jumlah data nikah, laporan data nikah atau rekap data selama satu tahun yang akan dilaporkan pada kepala KUA dan dijadikan sebagai arsip yang suatu saat bisa digunakan bila 52

2 53 diperlukan. Laporan data yang sudah direkap setiap bulan diproses menjadi informasi berbentuk presentase. b. Deskripsi Proses Bisnis Pengolahan Data Cerai Pengolahan data cerai merupakan proses bisnis yang dilakukan untuk mengolah data cerai. Proses bisnis yang akan dijelaskan pada analisis ini hanya menjelaskan informasi data cerai. Informasi yang dihasilkan berupa jumlah data cerai, laporan data cerai atau rekap data selama satu tahun yang akan dilaporkan pada kepala KUA dan dijadikan sebagai arsip yang suatu saat bisa digunakan bila diperlukan. Laporan data yang sudah direkap setiap bulan diproses menjadi informasi berbentuk presentase. c. Deskripsi Proses Bisnis Pengolahan Data Penghulu Pengolahan data penghulu merupakan proses bisnis yang dilakukan untuk mengolah data penghulu. Proses bisnis yang akan dijelaskan pada analisis ini hanya menjelaskan informasi data penghulu. Informasi yang dihasilkan berupa jumlah data penghulu. d. Deskripsi Proses Bisnis Pengolahan Data P3N Pengolahan data P3N merupakan proses bisnis yang dilakukan untuk mengolah data P3N. Proses bisnis yang akan dijelaskan pada analisis ini hanya menjelaskan informasi data P3N. Informasi yang dihasilkan berupa jumlah data P3N. e. Deskripsi Proses Bisnis Pengolahan Data Desa Pengolahan data desa merupakan proses bisnis yang dilakukan untuk mengolah data desa. Proses bisnis yang akan dijelaskan pada analisis ini hanya

3 54 menjelaskan informasi data desa. Informasi yang dihasilkan berupa jumlah data desa Analisis Permasalahan Dari pengamatan yang dilakukan, terdapat beberapa masalah pada sistem pengolahan data nikah berbasis web sehingga dirasakan perlu untuk dibangun sebuah aplikasi untuk mengatasi mengatasi permasalahan yang ada. Berikut permasalahan tersebut: Pengolahan data nikah dan cerai masih secara manual yaitu dicatat sebuah buku, hal ini mengakibatkan proses dalam penginputan data dan pembuatan laporan yang dibutuhkan sedikit lamban sehingga menimbulkan proses dan waktu yang cukup lama. Keamanan dan keakuratan dalam penyimpanan data masih kurang terjamin karena pengolahan data masih manual. Untuk arsip penting juga masih berupa kertas yang dapat menyebabkan hilang dan rusak. Dalam pencarian data masih mengalami kesulitan karena harus membuka satu persatu dari arsip data yang ada Usulan Pemecahan Masalah Dari permasalahan yang timbul diusulkan untuk membuat aplikasi pengolahan data nikah berbasis web, dimana aplikasi tersebut dapat dipergunakan sebagai alat bantu dalam proses pengolahan data nikah dan cerai pada KUA Kec. Lembang. Dan dalam penyimpanan datanya lebih terjamin karena menggunakan database juga dalam proses pencarian akan lebih mudah.

4 Ruang Lingkup Sistem Dari hasil analisis yang dilakukan maka sistem yang akan dikembangkan difokuskan untuk menjadi solusi sesuai dengan yang dijabarkan pada bagian Usulan Pemecahan Masalah. Secara teknis ruang lingkup aplikasi pengolahan data nikah yang akan dibangun terdiri dari dua bagian,yaitu: 1. Ruang lingkup sistem bagi admin, dimana dalam ruang lingkup sistem ini admin dapat melakukan login kemudian melakukan pengolahan data dan mencetak laporan. 2. Ruang lingkup sistem bagi pengguna, dimana dalam ruang lingkup sistem ini pengguna tidak melakukan login hanya dapat melihat data dan mencari data. Pengguna juga dapat melakukan daftar nikah dan mengunduh formulir nikah Analisis Kebutuhan Sistem Setelah melakukan analisis sistem untuk mengetahui permasalahan yang ada, selanjutnya yaitu analisis kebutuhan fungsional dan kebutuhan non fungsional. A. Kebutuhan Non Fungsional Kebutuhan non fungsional merupakan kondisi yang harus dipenuhi oleh sistem sesuai dengan spesifikasi yang akan digunakan. Analisis kebutuhan non fungsional yang diinginkan antara lain meliputi: 1. Analisis Kebutuhan Perangkat Keras (Hardware) 2. Analisis Kebutuhan Perangkat Lunak (Software)

5 56 3. Analisis Pengguna (Brainware) Analisis Kebutuhan Perangkat Keras (Hardware) Dibutuhkan perangkat keras untuk membangun aplikasi ini. Berikut merupakan rekomendasi perangkat keras yang dibutuhkan. a. Spesifikasi minimal: Menggunakan minimal kompatibel dengan processor Intel Pentium. Menggunakan RAM minimal 1 GB. Tersedianya Hard Disk untuk media penyimpanan, minimal 120 GB. Display minimal 1024px X 600px dengan 16 bit warna. Mouse dan keyboard. b. Spesifikasi yang direkomendasikan: Processor: Intel Pentium Core. Random Access Memory (RAM): 2 GB. Hard Disk: 250 GB. Display : 1280px X 800px with 16bit color. Mouse dan keyboard Analisis Kebutuhan Perangkat Lunak (Software) Untuk dapat mengakses aplikasi ini pasti dibutuhkan beberapa aplikasi untuk menunjang proses pembuatan aplikasi, berikut daftar perangkat lunak yang dibutuhkan dan digunakan pada saat pembangunan aplikasi ini: 1. Untuk sistem operasi menggunakan Microsoft Windows (XP, 7, 8)

6 57 2. Notepad++ minimal versi sebagai teks editor untuk menulis kode-kode pemrograman 3. XAMPP minimal versi [PHP: 5.2.4] sebagai webserver 4. Implementasi basis data menggunakan MySQL 5. Aplikasi CodeIgniter minimal versi sebagai framework dengan modul MVC (Model, View, Controller) 6. Aplikasi web browser dapat menggunakan Mozilla Firefox, Google Chrome, Safari, Opera dan lain-lain 7. Aplikasi untuk perancangan sistem dapat menggunakan staruml dan EA (Enterprise Architect) 8. Pencil versi sebagai aplikasi untuk membuat mockups dan layouting Analisis Pengguna (Brainware) Analisis pengguna (brainware) merupakan analisis terhadap kemampuan yang dimiliki oleh pengguna terhadap aplikasi pengolahan data nikah. Terdapat tiga pengguna (aktor) dalam ini diantaranya admin, pengguna dan Kepala KUA. Berikut ini Tabel 4.1 karakteristik pengguna: Tabel 4.1 Karakteristik Pengguna No Nama Aktor Hak Akses 1. Admin Sebagai pengelola keseluruhan sistem, sebagai penginput data dan mengelola data apabila terjadi kesalahan 2. Pengguna Sebagai pengguna sistem, tidak mempunyai hak akses login dan dapat melihat seluruh hasil dari proses yang terjadi pada sistem. 3. Kepala KUA Menerima laporan

7 58 B. Kebutuhan Fungsional Kebutuhan fungsional merupakan kebutuhan secara fungsional yang harus dipenuhi oleh perangkat lunak yang akan dibangun untuk memudahkan dalam mendeskripsikan requirement. Diperlukan aturan penomoran berikut: Req-xxx adalah kode yang merepresentasikan kebutuhan fungsional. Req adalah kepanjangan dari requirement, xxx adalah digital atau nomor urutan requirement. Kebutuhan fungsional tersebut dideskripsikan pada Tabel 4.2 sebagai berikut: Tabel 4.2 Kebutuhan Fungsional No. Kode Kebutuhan Deskripsi Kebutuhan Keterangan 1. REQ 001 Proses Login Admin Admin Login REQ 101 Proses Pengolahan Data Nikah Mengolah Data Nikah REQ 102 Proses Tambah Data Nikah Menambah Data Nikah 2. REQ 103 Proses Edit Data Nikah Mengedit Data Nikah REQ 104 Proses Hapus Data Nikah Menghapus Data Nikah REQ 105 Proses Lihat Data Nikah Melihat Data Nikah REQ 106 Proses Cari Data Nikah Mencari Data Nikah REQ 107 Proses Unduh Data Nikah Mengunduh Data Nikah REQ 201 Proses Pengolahan Data Cerai Mengolah Data Cerai REQ 202 Proses Tambah Data Cerai Menambah Data Cerai 3. REQ 203 Proses Edit Data Cerai Mengedit Data Cerai REQ 204 Proses Hapus Data Cerai Menghapus Data Cerai REQ 205 Proses Lihat Data Cerai Melihat Data Cerai REQ 206 Proses Unduh Data Cerai Mengunduh Data Cerai REQ 301 Proses Pengolahan Data Penghulu Mengolah Data Penghulu 4. REQ 202 Proses Tambah Data Penghulu Menambah Data Penghulu REQ 303 Proses Edit Data Penghulu Mengedit Data Penghulu REQ 304 Proses Hapus Data Penghulu Menghapus Data Penghulu REQ 305 Proses Lihat Data Penghulu Melihat Data Penghulu REQ 401 Proses Pengolahan Data P3N Mengolah Data P3N 5. REQ 402 Proses Tambah Data P3N Menambah Data P3N REQ 403 Proses Edit Data P3N Mengedit Data P3N REQ 404 Proses Hapus Data P3N Menghapus Data P3N REQ 405 Proses Lihat Data P3N Melihat Data P3N

8 59 Tabel 4.2 Kebutuhan Fungsional (Lanjutan) No Kode Kebutuhan Deskripsi Kebutuhan Keterangan REQ 501 Proses Pengolahan Data Desa Mengolah Data Desa REQ 502 Proses Tambah Data Desa Menambah Data Desa REQ 503 Proses Edit Data Desa Mengedit Data Desa REQ 504 Proses Hapus Data Desa Menghapus Data Desa REQ 505 Proses Lihat Data Desa Melihat Data Desa REQ 601 Proses Upload Formulir Mengupload Formulir REQ 602 Proses Tambah Upload Formulir Menambah Upload Formulir REQ 603 Proses Edit Upload Formulir Mengedit Upload Formulir REQ 604 Proses Hapus Upload Formulir Menghapus Upload Formulir REQ 605 Proses Lihat Upload Formulir Melihat Upload Formulir REQ 606 Proses Unduh Formulir Mengunduh Formulir REQ 701 Proses Daftar Nikah Mengolah Daftar nikah REQ 702 Proses Tambah Daftar Nikah Menambah Daftar Nikah 4.2. Fase Elaboration Pada fase ini akan menganalisis dan mendesain sistem serta implementasi sistem yang mengacu kepada kebutuhankebutuhan yang sudah dijabarkan pada fase inception Use case Diagram Use case merupakan deskripsi fungsi sebuah sistem dari perspektif penguna. Use case bekerja dengan cara mendeskripsikan tipikal interaksi antara pengguna sebuah sistem dengan sistemnya sendiri melalui sebuah cerita bagaimana sebuah sistem dipakai. Berikut ini Gambar 4.1 use case perancangan sistem:

9 60 System login pengolahan data nikah pengolahan data cerai pengolahan data penghulu pengolahan data p3n Admin pengolahan data desa upload formulir daftar nikah Pengguna cari data lihat data Kepala KUA cetak data download formulir laporan Gambar 4.1 Use case Diagram Pada use case di atas mengambarkan bahwa admin harus selalu login untuk melakukan pengolahan data nikah, cerai, penghulu, P3N, desa dan upload formulir. Sedangkan pengguna dapat langsung mendaftar nikah, mencari data, melihat data dan download formulir tanpa harus login begitu juga Kepala KUA dapat langsung melihat hasil dari pengolahan data dan mencari data tanpa harus login terlebih dahulu.

10 Use case Skenario Use case merupakan serangkaian skenario yag digabungkan bersama-sama oleh tujuan umum pengguna. Setiap skenario mendeskripsikan urutan kejadian, setiap urutan diinisialisasi oleh orang, sistem yang lain, perangkat keras atau urutan waktu. a. Use case Login Fungi proses Login merupakan reaksi sistem kepada setiap pengguna yang mempunyai hak akses. Syarat utama untuk mengakses sistem ini yaitu setiap pengguna harus memasukan username dan password. Berikut ini Tabel 4.3 skenario use case login: Tabel 4.3 Skenario Use case Login Nama Login Tujuan Validasi login Deskripsi Aktor Admin Skenario Utama Kondisi Awal Admin memiliki username dan password Aksi Aktor Reaksi Sistem 1. Memasuki halaman login Admin. 2. Memasukan username dan password 3. Menekan tombol login. 4. Validasi data login yang diisi oleh Admin. 5. Sistem menampilkan halaman utama admin jika login berhasil. 6. Sistem menampilkan peringatan Login gagal! Jika username dan password salah, dan kembali ke aksi no Tampilkan halaman beranda Admin.

11 62 8. Masuk ke halaman utama Admin. Kondisi Akhir Exception Admin login 4a. Sistem menampilkan halaman utama admin jika pengguna name dan password benar. 4b. Sistem menampilkan peringatan Login gagal! Jika username dan password salah. b. Use case Pengolahan Data Nikah Fungsi pengolahan data nikah merupakan reaksi sistem kepada admin untuk memberikan kemudahan kepada admin menambahkan data-data nikah, mengedit, menghapus dan mencetak, admin mengakses data pada halaman admin setelah admin memilih menu data nikah. Form yang disediakan sistem akan membantu aktor ketika melakukan tambah data. Berikut ini Tabel 4.4 skenario use case pengolahan data nikah: Tabel 4.4 Skenario Use case Pengolahan Data Nikah Nama Pengolahan data Nikah Tujuan Memberikan informasi data Deskripsi Aktor Admin Skenario Utama Kondisi Awal Admin telah melakukan login. Aksi Aktor Reaksi Sistem 1. Memilih menu data nikah 2. Sistem menampilkan halaman datadata nikah 3. Menekan tombol tambah nikah 4. Sistem menampilkan form data nikah

12 63 5. Admin mengisi form data nikah 6. Sistem memvalidasi data yang telah ditambah 7. Sistem akan menyimpan dan menampilkan data yang telah ditambah apabila tambah data berhasil. 8. Sistem akan menampilkan peringatan jika salah atau kurang lengkap, dan kembali ke aksi no Sistem menampilkan data nikah Kondisi akhir Exception c. Use case Pengolahan Data Cerai Tampilan halaman data nikah 6a. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 6b. Sistem akan menampilkan peringatan jika salah atau kurang lengkap. Fungsi pengolahan data cerai merupakan reaksi sistem kepada admin untuk memberikan kemudahan kepada admin menambahkan data-data cerai, mengedit, menghapus dan mencetak, admin mengakses data pada halaman admin setelah admin memilih menu data nikah. Form yang disediakan sistem akan membantu aktor ketika melakukan tambah data. Berikut ini Tabel 4.5 skenario use case pengolahan data cerai: Tabel 4.5 Skenario Use case Pengolahan Data Cerai Nama Pengolahan data Cerai Tujuan Memberikan informasi data Deskripsi Aktor Admin Skenario Utama Kondisi Awal Admin telah melakukan login. Aksi Aktor Reaksi Sistem 1. Memilih menu data cerai 2. Sistem menampilkan halaman datadata cerai 3. Menekan tombol tambah cerai 4. Sistem menampilkan form data cerai

13 64 5. Admin mengisi form data cerai Kondisi akhir Exception 6. Sistem memvalidasi data yang telah ditambah 7. Sistem akan menyimpan dan menampilkan data yang telah ditambah apabila tambah data berhasil. 8. Sistem akan menampilkan peringatan jika salah atau kurang lengkap, dan kembali ke aksi no Sistem menampilkan data cerai Tampilan halaman data cerai 6a. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 6b. Sistem akan menampilkan peringatan jika salah atau kurang lengkap. d. Use case Pengolahan Data Penghulu Fungsi pengolahan data Penghulu merupakan reaksi sistem kepada admin untuk memberikan kemudahan kepada admin menambahkan data-data penghulu, mengedit, dan menghapus, admin mengakses data pada halaman admin setelah admin memilih menu data penghulu. Form yang disediakan sistem akan membantu aktor ketika melakukan tambah data. Berikut ini Tabel 4.6 skenario use case pengolahan data penghulu: Tabel 4.6 Skenario Use case Pengolahan Data Penghulu Nama Pengolahan data Penghulu Tujuan Memberikan informasi data Deskripsi Aktor Admin Skenario Utama Kondisi Awal Admin telah melakukan login. Aksi Aktor Reaksi Sistem 1. Memilih menu data penghulu 2. Sistem menampilkan halaman datadata penghulu

14 65 3. Menekan tombol tambah penghulu 4. Sistem menampilkan form data penghulu 5. Admin mengisi form data penghulu 6. Sistem memvalidasi data yang telah ditambah 7. Sistem akan menyimpan dan menampilkan data yang telah ditambah apabila tambah data berhasil. 8. Sistem akan menampilkan peringatan jika salah atau kurang lengkap, dan kembali ke aksi no Sistem menampilkan data penghulu Kondisi akhir Tampilan halaman data penghulu Exception 6a. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 6b. Sistem akan menampilkan peringatan jika salah atau kurang lengkap. e. Use case Pengolahan Data P3N Fungsi pengolahan data P3N merupakan reaksi sistem kepada admin untuk memberikan kemudahan kepada admin menambahkan data-data P3N, mengedit, dan menghapus, admin mengakses data pada halaman admin setelah admin memilih menu data P3N. Form yang disediakan sistem akan membantu aktor ketika melakukan tambah data. Berikut ini Tabel 4.7 skenario use case pengolahan data P3N: Tabel 4.7 Skenario Use case Pengolahan Data P3N Nama Pengolahan data P3N Tujuan Memberikan informasi data Deskripsi Aktor Admin Skenario Utama Kondisi Awal Admin telah melakukan login. Aksi Aktor Reaksi Sistem 1. Memilih menu data P3N 2. Sistem menampilkan halaman data-

15 66 3. Menekan tombol tambah P3N 5. Admin mengisi form data P3N Kondisi akhir Exception data P3N 4. Sistem menampilkan form data P3N 6. Sistem memvalidasi data yang telah ditambah 7. Sistem akan menyimpan dan menampilkan data yang telah ditambah apabila tambah data berhasil. 8. Sistem akan menampilkan peringatan jika salah atau kurang lengkap, dan kembali ke aksi no Sistem menampilkan data P3N Tampilan halaman data P3N 6a. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 6b. Sistem akan menampilkan peringatan jika salah atau kurang lengkap. f. Use case Pengolahan Data Desa Fungsi pengolahan data desa merupakan reaksi sistem kepada admin untuk memberikan kemudahan kepada admin menambahkan data-data desa, mengedit, dan menghapus, admin mengakses data pada halaman admin setelah admin memilih menu data desa. Form yang disediakan sistem akan membantu aktor ketika melakukan tambah data. Berikut ini Tabel 4.8 skenario use case pengolahan data desa: Tabel 4.8 Skenario Use case Pengolahan Data Desa Nama Tujuan Aktor Kondisi Awal Pengolahan data Desa Memberikan informasi data Deskripsi Admin Skenario Utama Admin telah melakukan login.

16 67 Aksi Aktor Reaksi Sistem 1. Memilih menu data Desa 2. Sistem menampilkan halaman datadata Desa 3. Menekan tombol tambah Desa 4. Sistem menampilkan form data Desa 5. Admin mengisi form data Desa 6. Sistem memvalidasi data yang telah ditambah 7. Sistem akan menyimpan dan menampilkan data yang telah ditambah apabila tambah data berhasil. 8. Sistem akan menampilkan peringatan jika salah atau kurang lengkap, dan kembali ke aksi no Sistem menampilkan data Desa Kondisi akhir Tampilan halaman data Desa Exception 6a. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 6b. Sistem akan menampilkan peringatan jika salah atau kurang lengkap. g. Use case Upload Formulir Fungsi upload data merupakan reaksi sistem kepada admin untuk memberikan kemudahan admin menambahkan formulir, mengedit, dan menghapus, admin mengaksesnya pada halaman admin setelah admin memilih menu Upload Formuliar. Form yang disediakan sistem akan membantu aktor ketika melakukan Upload. Berikut ini Tabel 4.9 skenario use case Upload Formuliar: Tabel 4.9 Skenario Use case Upload Formulir Nama Tujuan Aktor Upload Formulir Memberikan fasilitas formulir Deskripsi Admin

17 68 Skenario Utama Kondisi Awal Admin telah melakukan login. Aksi Aktor Reaksi Sistem 1. Memilih menu upload formulir 2. Sistem menampilkan halaman upload formulir 3. Menekan tombol tambah formulir 4. Sistem menampilkan form upload formulir 5. Admin mengisi form upload formulir 6. Sistem memvalidasi data yang telah ditambah 7. Sistem akan menyimpan dan menampilkan data yang telah ditambah apabila tambah data berhasil. 8. Sistem akan menampilkan peringatan jika salah atau kurang lengkap, dan kembali ke aksi no Sistem menampilkan data formulir Kondisi akhir Tampilan halaman upload formulir Exception 6a. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 6b. Sistem akan menampilkan peringatan jika salah atau kurang lengkap. h. Use case Daftar Nikah Fungsi daftar nikah merupakan reaksi sistem kepada pengguna untuk melakukan daftar nikah. Pengguna dapat mengakses daftar nikah pada halaman pengguna. Form yang disediakan sistem akan membantu aktor ketika melakukan daftar nikah. Berikut ini Tabel 4.10 skenario use case daftar nikah: Tabel 4.10 Skenario Use case Daftar Nikah Nama Tujuan Aktor Daftar Nikah Memberikan fasilitas daftar nikah online Deskripsi Pengguna

18 69 Skenario Utama Kondisi Awal Pengguna membuka halaman utama aplikasi Aksi Aktor Reaksi Sistem 1. Memilih menu daftar nikah 2. Menampilkan form daftar nikah 3. Mengisi form daftar nikah 4. Sistem memvalidasi data yang telah ditambah 5. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 6. Sistem akan menampilkan peringatan jika salah atau kurang lengkap, dan kembali ke aksi no 3 7. Sistem menampilkan hasil daftar Kondisi akhir Tampilan hasil daftar nikah Exception 4a. Sistem akan menyimpan data yang telah ditambah apabila tambah data berhasil. 4b. Sistem akan menampilkan peringatan jika salah atau kurang lengkap. i. Use case Cari Data Fungsi cari data merupakan reaksi sistem kepada admin, pengguna dan Kepala KUA untuk memberikan kemudahan dalam pencarian data. Admin, pengguna dan Kepala KUA dapat mengakses cari data pada halaman pengguna. Form yang disediakan sistem akan membantu aktor ketika melakukan pencarian data. Berikut ini Tabel 4.11 skenario use case cari data: Tabel 4.11 Skenario Use case Cari Data Nama Tujuan Aktor Cari Data Memudahkan pencarian data Deskripsi Admin, pengguna dan Kepala KUA Skenario Utama Kondisi Awal Admin, pengguna dan Kepala KUA membuka halaman utama aplikasi

19 70 Aksi Aktor 8. Memasukan kata pencarian Kondisi akhir Exception Reaksi Sistem 9. Sistem mencari kata yang dimasukan 10. Sistem akan menampilkan hasil data pencarian yang ada pada database 11. Sistem akan menampilkan peringatan jika hasil pencarian tidak ditemukan, dan kembali ke aksi no Sistem menampilkan hasil pencarian Tampilan hasil pencarian 3a. Sistem akan menampilkan hasil data pencarian yang telah diinputakan 3b. Sistem akan menampilkan peringatan jika hasil pencarian tidak ditemukan j. Use case Lihat Data Fungsi lihat data merupakan reaksi sistem kepada admin, pengguna dan Kepala KUA untuk memberikan kemudahan dalam melihat hasil data. Admin, pengguna dan Kepala KUA dapat mengakses lihat data pada halaman pengguna. Form yang disediakan sistem akan membantu aktor ketika melihat hasil data. Berikut ini Tabel 4.12 skenario use case lihat data: Tabel 4.12 Skenario Use case Lihat Data Nama Lihat Data Tujuan Memudahkan melihat hasil data Deskripsi Aktor Admin, pengguna dan Kepala KUA Skenario Utama Kondisi Awal Admin, pengguna dan Kepala KUA membuka halaman utama aplikasi Aksi Aktor Reaksi Sistem 1. Memilih menu lihat 2. Sistem menampilkan menu pilihan kategori data 3. Aktor memilih kategori data yang

20 71 akan ditampilkan 4. Sistem menampilkan hasil kategori data yang dipilih Kondisi akhir Admin, pengguna dan Kepala KUA dapat melihat data yang dipilih Exception 4a. Sistem secara otomatis menampilkan hasil data input sudah dilakukan 4b. Sistem tidak akan menampilkan hasil data jika input belum dilakukan k. Use case Cetak Data Fungsi cetak data merupakan reaksi sistem kepada admin untuk memberikan kemudahan dalam mencetak hasil data nikah. Admin dapat mengakses cetak data pada halaman admin. Form yang disediakan sistem akan membantu aktor ketika mencetak hasil data. Berikut ini Tabel 4.13 skenario use case cetak data: Tabel 4.13 Skenario Use case Cetak Data Nama Cetak Data Tujuan Memudahkan mencetak hasil data nikah Deskripsi Aktor Admin Skenario Utama Kondisi Awal Admin telah melakukan login Aksi Aktor Reaksi Sistem 1. Memilih menu data 2. Sistem menampilkan halaman data yang terpilih 3. Aktor menekan tombol cetak 4. Sistem melakukan proses pencetakan data Kondisi akhir Exception Admin dapat melihat hasil cetakan 2a. Sistem secara otomatis menampilkan hasil data input sudah dilakukan 2b. Sistem tidak akan menampilkan hasil data jika input belum dilakukan

21 72 l. Use case download formulir Fungsi download formulir merupakan reaksi sistem kepada pengguna untuk memberikan fasilitas mendownload formulir nikah. Pengguna dapat mengakses download formulir pada halaman pengguna. Form yang disediakan sistem akan membantu aktor ketika mendownload formulir nikah. Berikut ini Tabel 4.14 skenario use case download formulir: Tabel 4.14 Skenario Use case Download Formulir Nama Download Formulir Tujuan Memberikan fasilitas untuk Download Formulir Deskripsi Aktor Pengguna Skenario Utama Kondisi Awal Pengguna membuka halaman utama aplikasi Aksi Aktor Reaksi Sistem 1. Memilih menu formulir 2. Menampilkan link formulir 3. Memilih formulir yang dibutuhkan 4. Sistem menampilkan formulir dalam bentuk pdf 5. Memilih menyimpan formulir atau 6. Memilih mencetak formulir 7. Sistem menampilkan formulir Kondisi akhir Tampilan halaman formulir Exception Activity diagram Activity diagram merupakan teknik untuk mendeskripsikan logika prosuderal, proses bisnis dan aliran kerja dalam banyak kasus. Activity diagram mempunyai peran seperti halnya flowchart.

22 73 a. Activity Diagram Login Activity diagram login memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini admin merupakan aktor yang berperan. Berikut Gambar 4.2 perancangan Activity diagram Login: Admin Sistem mengisi form username dan password validasi username dan password salah benar panggil halaman utama Gambar 4.2 Activity Diagram Login b. Activity diagram Pengolahan Data Nikah Activity diagram Pengolahan data nikah memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini admin merupakan aktor

23 74 yang berperan. Berikut Gambar 4.3 perancangan Activity diagram Pengolahan Data Nikah: Admin Sistem memilih menu data nikah mengisi form data nikah validasi kelengkapan data nikah tidak lengkap menyimpan data nikah Gambar 4.3 Activity diagram Pengolahan Data Nikah c. Activity diagram Pengolahan Data Cerai Activity diagram Pengolahan data cerai memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini admin merupakan aktor yang berperan. Berikut Gambar 4.4 perancangan Activity diagram Pengolahan Data Cerai:

24 75 Admin Sistem memilih menu data cerai mengisi form data cerai validasi kelengkapan data cerai tidak lengkap menyimpan data cerai Gambar 4.4 Activity diagram Pengolahan Data Cerai d. Activity diagram Pengolahan Data Penghulu Activity diagram Pengolahan data penghulu memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini admin merupakan aktor yang berperan. Berikut Gambar 4.5 perancangan Activity diagram Pengolahan Data Penghulu:

25 76 Admin Sistem memilih menu data penghulu mengisi form data penghulu validasi kelengkapan data penghulu tidak lengkap menyimpan data penghulu Gambar 4.5 Aktivity Diagram Pengolahan Data Penghulu e. Activity diagram Pengolahan Data P3N Activity diagram Pengolahan data P3N memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini admin merupakan aktor yang berperan. Berikut Gambar 4.6 perancangan Activity diagram Pengolahan Data P3N:

26 77 Admin Sistem memilih menu data p3n mengisi form data p3n validasi kelengkapan data p3n tidak lengkap menyimpan data p3n Gambar 4.6 Aktivity Diagram Pengolahan Data P3N f. Activity diagram Pengolahan Data Desa Activity diagram Pengolahan data Desa memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini admin merupakan aktor yang berperan. Berikut Gambar 4.7 perancangan Activity diagram Pengolahan Data Desa:

27 78 Admin Sistem memilih menu data desa mengisi form data desa validasi kelengkapan data desa tidak lengkap menyimpan data desa Gambar 4.7 Activity diagram Pengolahan Data Desa g. Activity diagram Upload Formulir Activity diagram Upload Formulir memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini admin merupakan aktor yang berperan. Berikut Gambar 4.8 perancangan Activity diagram Upload Formulir:

28 79 Admin Sistem memilih menu upload formuir mengisi form upload formulir validasi kelengkapan data tidak lengkap menyimpan formulir Gambar 4.8 Activity diagram Upload Formulir h. Activity diagram Daftar Nikah Activity diagram daftar nikah memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini pengguna merupakan aktor yang berperan. Berikut Gambar 4.9 perancangan Activity diagram Daftar Nikah:

29 80 Pengguna Sistem memilih menu daftar nikah mengisi form daftar nikah validasi kelengkapan data tidak lengkap menyimpan hasil daftar Gambar 4.9 Activity diagram Daftar Nikah i. Activity diagram Download Formulir Activity diagram download formulir memperlihatkan segala aktifivitas yang dilakukan oleh aktor yang berada didalam Aplikasi Pengolahan Data Nikah KUA Kec. Lembang. Dalam aktivitas ini pengguna merupakan aktor yang berperan. Berikut Gambar 4.10 perancangan Activity diagram Download Formulir:

30 81 Pengguna Sistem memilih menu formulir memilih formulir yang diperlukan menampilkan formulir menyimpan formulir mencetak formulir Gambar 4.10 Activity diagram Download Formulir Sequence diagram Sequence diagram digunakan untuk menggambarkan perilaku pada sebuah skenario. Diagram ini menunjukan sejumlah contoh objek dan message (pesan) yang diletakan diantara objek-objek ini di dalam use case. Komponen utama sequence diagram terdiri dari objek yang di gambarkan dengan kotak segi empat bernama. Message diwakili oleh garis dengan tanda panah dan waktu yang di tunjukkan dengan progress vertical.

31 82 a. Sequence diagram Login Admin Berikut ini Gambar 4.11 Sequence diagram Login Admin: Gambar 4.11 Sequence diagram Login Admin Gambar diatas merupakan Sequence diagram Login Admin yang menggambarkan proses yang sedang terjadi dalam login admin. Prosesnya dimulai dengan admin masuk kedalam form Login terlebih dahulu, kemudian selanjutnya admin dapat melakukan login yang sebelumnya menginputkan Username dan Password untuk dapat masuk kedalam sistem. Proses Login itu sendiri diikuti juga validasi yang dilakukan oleh sistem dimana terdapat proses verifikasi Username dan Password apakah sesuai atau tidak. Jika berhasil Admin tersebut dapat masuk dan menggunakan sistem.

32 83 b. Sequence diagram Pengolahan Data Nikah Berikut ini Gambar 4.12 Sequence diagram Pengolahan Data Nikah: Gambar 4.12 Sequence diagram Pengolahan Data Nikah Gambar diatas merupakan Sequence diagram Pengolahan Data Nikah. Prosesnya dimulai dengan admin masuk kedalam screen Data Nikah terlebih dahulu, kemudian admin mengisi form data nikah. Pengolahan ini digunakan sebagai tahapan pengumpulan data nikah.

33 84 c. Sequence diagram Pengolahan Data Cerai Berikut ini Gambar 4.13 Sequence diagram Pengolahan Data Cerai: Gambar 4.13 Sequence diagram Pengolahan Data Cerai Gambar diatas merupakan Sequence diagram Pengolahan Data Cerai. Prosesnya dimulai dengan admin masuk kedalam screen Data Cerai terlebih dahulu, kemudian admin mengisi form data cerai. Pengolahan ini digunakan sebagai tahapan pengumpulan data cerai. d. Sequence diagram Pengolahan Data Penghulu Berikut ini Gambar 4.14 Sequence diagram Pengolahan Data Penghulu:

34 85 Gambar 4.14 Sequence diagram Pengolahan Data Penghulu Gambar diatas merupakan Sequence diagram Pengolahan Data Penghulu. Prosesnya dimulai dengan admin masuk kedalam screen Data Penghulu terlebih dahulu, kemudian admin mengisi form data penghulu. Pengolahan ini digunakan sebagai tahapan pengumpulan data penghulu. e. Sequence diagram Pengolahan Data P3N Berikut ini Gambar 4.15 Sequence diagram Pengolahan Data P3N:

35 86 Gambar 4.15 Sequence diagram Pengolahan Data P3N Gambar diatas merupakan Sequence diagram Pengolahan Data P3N. Prosesnya dimulai dengan admin masuk kedalam screen Data P3N terlebih dahulu, kemudian admin mengisi form data P3N. Pengolahan ini digunakan sebagai tahapan pengumpulan data P3N. f. Sequence diagram Pengolahan Data Desa Berikut ini Gambar 4.16 Sequence diagram Pengolahan Data Desa:

36 87 Gambar 4.16 Sequence diagram Pengolahan Data Desa Gambar diatas merupakan Sequence diagram Pengolahan Data Desa. Prosesnya dimulai dengan admin masuk kedalam screen Data Desa terlebih dahulu, kemudian admin mengisi form data desa. Pengolahan ini digunakan sebagai tahapan pengumpulan data desa. g. Sequence diagram Upload Formulir Berikut ini Gambar 4.17 Sequence diagram Upload Formulir:

37 88 Gambar 4.17 Sequence diagram Upload Formulir Gambar diatas merupakan Sequence diagram Upload Formulir. Prosesnya dimulai dengan admin masuk kedalam screen Upload Formulir terlebih dahulu, kemudian admin mengisi form Upload Formulir. Pengolahan ini digunakan sebagai tahapan pengumpulan Upload Formulir. h. Sequence diagram Daftar Nikah Berikut ini Gambar 4.18 Sequence diagram Daftar Nikah:

38 89 Gambar 4.18 Sequence diagram Daftar Nikah Gambar diatas merupakan Sequence diagram Daftar Nikah. Prosesnya dimulai dengan pengguna masuk kedalam screen daftar nikah terlebih dahulu, kemudian pengguna mengisi form daftar nikah. Jika sudah lengkap maka data yang sudah diinputkan akan tersimpan pada database. i. Sequence diagram Download Formulir Berikut ini Gambar 4.19 Sequence diagram Download Formulir:

39 90 Gambar 4.19 Sequence diagram Download Formulir Gambar diatas merupakan Sequence diagram Download Formulir. Prosesnya dimulai dengan pengguna masuk kedalam screen formulir terlebih dahulu, kemudian pengguna memilih formulir yang akan didownload Class diagram Class diagram merupakan diagram yang menunjukan class-class yang ada dari sebuah sistem dan hubungannya secara logika. Class diagram menggambarkan struktur statis dari sebuah sistem. Karena itu class diagram merupakan tulang punggung atau kekuatan dasar dari hampir setiap metode berorientasi objek termasuk UML. Class diagram merupakan gambar grafis

40 91 mengenai struktur objek statis dari suatu sistem, menunjukan class-class objek yang menyusun sebuah sistem dan juga hubungan antara class objek tersebut. Berikut Gambar 4.20 perancangan class diagram: Cnikah Ccerai Cpenghulu +id_penghulu: integer +nama_penghulu: string +alamat: string +setid(integer) +setpenghulu(string) +setalamat(string) +getid(): integer +getpenghulu(): string +getalamat(): string +allpenghulu() +addpenghulu() +updatepenghulu() +deletepenghulu() Cp3n +id_p3n: integer +nama_p3n: string +alamat: string +setid(integer) +setp3n(string) +setalamat(string) +getid(): integer +getp3n(): string +getalamat(): string +allp3n() +addp3n() +updatep3n() +deletep3n() +id_nikah: integer +no_akta: string +tgl: date +nama_suami: string +nama_istri: string +nama_penghulu: string +nama_p3n: string +nama_desa: string +keterangan: string +id_penghulu: integer +id_p3n: integer +id_desa: integer +setid(integer) +setno_akta(string) +set_date(date) +setsuami(string) +setistri(string) +setpenghulu(string) +setp3n(string) +setdesa(string) +setketerangan(string) +getid(): integer +getno_akta(): string +gettgl(): date +getsuami(): string +grtistri(): string +getpenghulu(): string +getp3n(): string +getdesa(): string +getketerangan(): string +allnikah() +addnikah() +updatenikah() +deletenikah() Cadmin +id_admin: integer +nama_admin: string +username: string +password: string +setid(integer) +setnama(string) +setusername(string) +setpassword(string) +getid(): integer +getnama(): string +getusername(): string +getpassword(): string +login() +sukses() +admin() Cform +id_form: integer +nama_form: string +setid(integer) +setform(string) +getid(): integer +getform(): string +allform() +addform() +updateform() +deleteform() +download() +id_cerai: integer +penggugat: string +tergugat: string +alasan: string +nama_desa: string +id_desa: integer +setid(integer) +setpenggugat(string) +settergugat(string) +setalasan(string) +SetDesa(string) +setid(integer) +getid(): integer +getpenggugat(): string +gettergugat(): string +getalasan(): string +getdesa(): string +getid(): string +allcerai() +addcerai() +updatecerai() +deletecerai() Cdesa +id_desa: integer +nama_desa: string +setid(integer) +setdesa(string) +getid(): integer +getdesa(): string +alldesa() +adddesa() +updatedesa() +deletedesa() Gambar 4.20 Class diagram Pengolahan Data Nikah Perancangan Struktur Data dan Tabel a. Tabel Admin 1. Nama Tabel : admin 2. Fungsi : Menyimpan Data Induk Admin 3. Kunci Primer : id Struktur record :

41 92 Tabel 4.15 Perancangan Database Tabel Admin No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id Admin 2. Nama Varchar 30 Nama admin 3. Username Varchar 50 Username admin 4. Password Varchar 50 Password admin b. Tabel Nikah 1. Nama Tabel : nikah 2. Fungsi : Menyimpan Data Nikah 3. Kunci Primer : id 4. Kunci Sekunder : id_penghulu, id_p3n, id_desa Struktur record : Tabel 4.16 Perancangan Database Tabel Nikah No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id Nikah 2. No_akta Varchar 15 No akta nikah 3. Tanggal Date Tanggal Nikah 4. Suami Varchar 50 Nama suami 5. Istri Varchar 50 Nama iatri 6. Penghulu Varchar 50 Nama penghulu 7. P3N Varchar 50 Nama P3N 8. Desa Varchar 50 Nama Desa 9. Keterangan Varchar 50 Keterangan 10. Id Int 5 Id Penghulu 11. Id Int 5 Id P3N 12. Id Int 5 Id Desa c. Tabel Cerai 1. Nama Tabel : cerai 2. Fungsi : Menyimpan Data Cerai 3. Kunci Primer : id 4. Kunci Sekunder : id_desa Struktur record :

42 93 Tabel 4.17 Perancangan Database Tabel Cerai No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id Cerai 2. Tanggal Date Tanggal Nikah 3. Penggugat Varchar 50 Nama Penggugat 4. Tergugat Varchar 50 Nama Tergugat 5. Alasan Varchar 50 Nama Alasan 6. Desa Varchar 50 Nama Desa 7. Id Int 5 Id Desa d. Tabel Penghulu 1. Nama Tabel : penghulu 2. Fungsi : Menyimpan Data Penghulu 3. Kunci Primer : id 4. Kunci Sekunder : - Struktur record : Tabel 4.18 Perancangan Database Tabel Penghulu No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id penghulu 2. Nama Varchar 50 Nama penghulu 3. Alamat Varchar 100 Alamat penghulu e. Tabel P3N 1. Nama Tabel : p3n 2. Fungsi : Menyimpan Data P3N 3. Kunci Primer : id 4. Kunci Sekunder : - Struktur record : Tabel 4.19 Perancangan Database Tabel P3N No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id P3N 2. Nama Varchar 50 Nama P3N 3. Alamat Varchar 100 Alamat P3N

43 94 f. Tabel Desa 1. Nama Tabel : desa 2. Fungsi : Menyimpan Data Desa 3. Kunci Primer : id 4. Kunci Sekunder : - Struktur record : Tabel 4.20 Perancangan Database Tabel Desa No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id Desa 2. Nama Varchar 30 Nama desa g. Tabel Form 1. Nama Tabel : form 2. Fungsi : menyimpan data upload form 3. Kunci Primer : id 4. Kunci Sekunder : - Struktur record : Tabel 4.21 Perancangan Database Tabel Form No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id formulir 2. Nama Varchar 30 Nama formulir h. Tabel Daftar 1. Nama Tabel : daftar 2. Fungsi : daftar nikah online 3. Kunci Primer : id 4. Kunci Sekunder : - Struktur record :

44 95 Tabel 4.22 Perancangan Database Tabel Daftar No Nama_Field Jenis Lebar Keterangan 1. Id Int 5 Id daftar 2. Nama Varchar 30 Nama pendaftar 3. Alamat Text Alamat pendaftar 4. Tlp Varchar 30 Tlp pendaftar 5. Tgl Date Tanggal daftar 6. Catin_laki Varchar 30 Nama calon pengantin laki-laki 7. Catin_per Varchar 30 Nama calon pengantin perempuan 8. Almt_laki Text Alamat calon pengantin laki-laki 9. Almt_per Text Alamat calon pengantin perempuan 10. Tgl_nikah Date Tanggal rencana menikah 11. Tmpt_nikah Text Tempat rencana menikah Gambar 4.21 Relasi Antar Tabel

45 Perancangan Antar Muka Struktur Menu Perancangan menu di gunakan untuk memudahkan dalam penelusuran program yang di buat. Struktur menu di bagi menjadi dua yaitu struktur menu halaman utama dan struktur halaman admin, berikut Gambar 4.22 perancangan Struktur Menu Aplikasi: Aplikasi Pengolahan Data Halaman Utama Home Daftar View Formulir Grafik Login SMS Gateway Halaman Admin Home Manajemen Nikah Manajemen Cerai Manajemen Penghulu Manajemen P3N Manajemen Desa Upload Formulir Logout Gambar 4.22 Struktur Menu Aplikasi

46 Perancangan Tampilan Perancangan tampilan program merupakan gambaran mengenai tampilantampilan program yang nanti akan digunakan didalam aplikasi, adapun tampilannya sebagai berikut: a. Desain Tampilan Halaman Utama Desain tampilan ini merupakan tampilan yang akan muncul ketika pertama kali membuka aplikasi. Dalam tampilan ini admin, pengguna dan Kepala KUA dapat menikmati menu-menu yang tersedia. Menu-menu tersebut diantaranya Home, Daftar, View, Formulir, Grafik, Login dan SMS Gateway. Berikut ini Gambar 4.23 perancanagn desain halaman utrama: Gambar 4.23 Desain Tampilan Halaman Utama

47 98 b. Desain Tampilan Daftar Nikah Desain tampilan ini merupakan tampilan yang akan muncul ketika memilih menu daftar. Halaman ini akan menampilkan form daftar nikah, pengguna harus mengisi form tersebut dengan benar dan jika salah sistem akan menolak dan pengguna dapat mengisinya kembali. Berikut ini Gambar 4.24 tampilan Daftar Nikah: Gambar 4.24 Desain Tampilan Daftar Nikah

48 99 c. Desain Tampilan View Data Desain tampilan ini merupakan tampilan yang akan muncul ketika memilih menu View. Halaman ini akan menampilkan hasil data dari pengolahan data nikah. Berikut ini Gambar 4.25 tampilan form View Data: Gambar 4.25 Desain Tampilan View Data d. Desain Tampilan Formulir Desain tampilan ini merupakan tampilan yang akan muncul ketika memilih menu Formulir. Halaman ini menampilkan daftar formulir nikah yang bisa didownload. Berikut ini Gambar 4.26 tampilan formulir :

49 100 Gambar 4.26 Desain Tampilan Formulir e. Desain Tampilan Grafik Desain tampilan ini merupakan tampilan yang akan muncul ketika memilih menu Grafik. Halaman ini menampilakn hasil pengolahan data berupa grafik. Berikut ini Gambar 4.27 tampilan Grafik:

50 101 Gambar 4.27 Desain Tampilan Grafik f. Desain Tampilan Form Login Desain tampilan ini merupakan tampilan yang akan muncul ketika memilih menu login. Tampilan ini berfungsi untuk keamanan sistem, sehingga sebelum admin dapat mengakses halaman admin terlebih dahulu harus mengisi usename dan password yang telah terdaftar, jika username dan password yang dimasukan benar, maka admin masuk ke tampilan halaman admin dan jika salah sistem akan menolak dan admin dapat mengisinya kembali. Berikut ini Gambar 4.28 tampilan form login:

51 102 Gambar 4.28 Desain Tampilan Form Login g. Desain Tampilan Halaman Admin Desain tampilan ini merupakan tampilan yang akan muncul ketika admin berhasil melakukan login. Dalam tampilan ini ada beberapa menu diantaranya Home, Manajemen Nikah, Manajemen Cerai, Manajemen Penghulu, Manajemen P3N, Manajemen Desa, Upload Formulir dan Logout. Pada menu Manajemen Nikah, Manajemen Cerai, Manajemen Penghulu, Manajemen P3N, Manajemen Desa, Upload Formulir terdapat fungsi input, update dan delete. Berikut ini Gambar 4.29 desain tampilan halaman admin:

52 103 Gambar 4.29 Desain Tampilan Halaman Admin h. Desain Tampilan Form Input Data Nikah Desain tampilan ini akan muncul ketika admin menekan menu Manajemen Nikah dan memilih tambah data. Setelah mengisi form, maka akan tersimpan dalam database tetapi jika tidak lengkap sistem akan memberi peringatan dan meminta mengisi form yang kosong. Berikut ini Gambar 4.30 desain tampilan Form Input Data Nikah:

53 104 Gambar 4.30 Desain Tampilan Form Input Data Nikah i. Desain Tampilan Form Input Data Cerai Desain tampilan ini akan muncul ketika admin menekan menu Manajemen Cerai dan memilih tambah data. Setelah mengisi form, maka akan tersimpan dalam database tetapi jika tidak lengkap sistem akan memberi peringatan dan meminta mengisi form yang kosong. Berikut ini Gambar 4.31 desain tampilan Form Input Data Cerai:

54 105 Gambar 4.31 Desain Tampilan Form Input Data Cerai j. Desain Tampilan Form Input Data Penghulu Desain tampilan ini akan muncul ketika admin menekan menu Manajemen penghulu dan memilih tambah data. Setelah mengisi form, maka akan tersimpan dalam database tetapi jika tidak lengkap sistem akan memberi peringatan dan meminta mengisi form yang kosong. Berikut ini Gambar 4.32 Desain Tampilan Form Input Data Penghulu:

55 106 Gambar 4.32 Desain Tampilan Form Input Data Penghulu i. Desain Tampilan Form Input Data P3N Desain tampilan ini akan muncul ketika admin menekan menu Manajemen P3N dan memilih tambah data. Setelah mengisi form, maka akan tersimpan dalam database tetapi jika tidak lengkap sistem akan memberi peringatan dan meminta mengisi form yang kosong. Berikut ini Gambar 4.33 Desain Tampilan Form Input Data P3N:

56 107 Gambar 4.33 Desain Tampilan Form Input Data P3N j. Desain Tampilan Form Input Data Desa Desain tampilan ini akan muncul ketika admin menekan menu Manajemen Desa dan memilih tambah data. Setelah mengisi form, maka akan tersimpan dalam database tetapi jika tidak lengkap sistem akan memberi peringatan dan meminta mengisi form yang kosong. Berikut ini Gambar 4.34 Desain Tampilan Form Input Data Desa:

57 108 Gambar 4.34 Desain Tampilan Form Input Data Desa k. Desain Tampilan Form Upload Formulir Desain tampilan ini akan muncul ketika admin menekan menu Upload Formulir dan memilih tambah data. Setelah mengisi form, maka akan tersimpan dalam database tetapi jika tidak lengkap sistem akan memberi peringatan dan meminta mengisi form yang kosong. Berikut ini Gambar 4.35 Desain Tampilan Form Input Upload Formulir:

58 Gambar 4.35 Desain Tampilan Form Upload Formulir 109