Perancangan Design Pengembangan Sistem Informasi Pendaftran Wisuda

4.3.2. Perancangan Design

Tahap berikutnya adalah melakukan perancangan pada ”Sistem Informasi Pendaftaran Wisuda Online”. Prosesnya melalui beberapa tahap, yaitu : Pemodelan proses Process Modelling, Pemodelan data Data Modelling, dan Desain antar muka Interface Design. 4.3.2.1.DFD Data Flow Diagram 1. Diagram Konteks Context Diagram Gambar 4 .7. Diagram Konteks Context Diagram Data diolah Oleh Penulis Pada diagram konteks, sistem hanya digambarkan dengan sebuah proses, kemudian entitas luar yang bernteraksi dengan proses tunggal diidentifikasi. Didapat 4 entitas, yaitu admin, operator, calon wisudawan dan BAAK. Dimana calon wisudawan sebagai entitas luar external entity dan admin dan operator sebagai entitas dalam internal entity. 62 2. Diagram Nol Overview Diagram Calon Wisudawan data_pribadi username password judul_skripsi periode_wisuda tahun_akademik no_registrasi_wisuda nama_bank no_rekening jumlah_bayar ukuran_toga 1.0 Pendaftaran Calon Wisuda 2.0 data_pribadi username password judul_skripsi periode_wisuda tahun_akademik no_registrasi_wisuda nama_bank no_rekening Calon Wisudawan User Administrasi nomor_unik_administrasi status_berkas Pendaftaran jumlah_bayar Wisuda Calon ukuran_toga Wisuda 3.0 Validasi Berkas judul_skripsi periode_wisuda tahun_akademik no_registrasi_wisuda nama_bank no_rekening jumlah_bayar ukuran_toga informasi_periode_wisuda Wisuda nomor_unik_administrasi validasi_berkas nomor_kursi informasi_peserta_wisuda 4.0 Operator judul_skripsi periode_wisuda data_pribadi Pengolahan Data Periode Wisuda periode_wisuda Admin tahun_akademik no_registrasi_wisuda nama_bank no_rekening jumlah_bayar ukuran_toga 5.0 Pengolahan Data Peserta Wisuda data_pribadi judul_skripsi periode_wisuda tahun_akademik no_registrasi_wisuda nama_bank no_rekening jumlah_bayar ukuran_toga BAAK laporan_daftar_peserta_wisuda 6.0 Pembuatan Laporan daftar_peserta_wisuda Kursi Gambar 4 .8. Diagram Nol Overview Diagram Data diolah Oleh Penulis 63 Pada diagram level nol, proses tunggal dari diagram konteks dipecah menjadi 7 proses terperinci, yaitu pendaftarn calon wisuda, login, pendaftaran wisuda calon wisuda, validasi wisuda, pengolahan data periode wisuda, pengolahan data peserta wisuda dan cetak laporan peserta wisuda. Diagram rinci. a. Diagram rinci proses 5.0 pengolahan data periode wisuda Gambar 4 .9. Diagram rinci proses 5.0 Data diolah Oleh Penulis 64 Pada proses pengolahan data periode wisuda terdapat 2 proses, yaitu input data periode wisuda dan edit data periode wisuda. Data yang digunkan pada proses ini adalah data periode wisuda. b. Diagram rinci proses 6.0 pengolahan data peserta wisuda data_administrasi data_administrasi 6.1 Edit Data Peserta Wisuda data_pribadi Administrasi User username password data_pribadi Calon Wisudawan Admin username password 6.2 Hapus Data Peserta Wisuda data_administrasi data_administrasi_terhapus data_pribadi data_administrasi_tercetak 6.3 Cetak Data Peserta Wisuda data_administrasi data_pribadi data_administrasi data_peserta_wisuda 6.4 Cari Data Peserta Wisuda Gambar 4 .10. Diagram rinci proses 6.0 Data diolah Oleh Penulis 65 Pada proses pengolahan data peserta wisuda terdapat 4 proses, yaitu edit data peserta wisuda, hapus data peserta wisuda, cetak data peserta wisuda, dan cari data peserta wisuda. Data yang digunkan pada proses ini adalah data calon wisuda dan administrasi. 4.3.2.2.Kamus Data a. Nama Arus Data : Data Pribadi Alias : Data pribadi calon wisuda Bentuk Data : Variabel field Penjelasan : Untuk menginput data dari calon wisuda Arus Data : Calon wisuda Proses 1.0 Calon wisuda Proses 6.0 Proses 1.0 DCalon Wisuda Proses 6.0 DKursi Admin Prose 6.1 DCalon wisuda Proses 6.2 DCalon wisuda Proses 6.3 DCalon wisuda Proses 6.4 Periode : Setiap ada pendaftaran calon wisuda Struktur Data : No. Nama Item Data Type Lebar 1. nim varchar 25 2. nama varchar 30 3. IdJk int 2 4. tempatLahir varchar 20 5. tanggalLahir date - 6. idJurusan int 2 7. alamatSekarang text - 66 8. alamatAsal text - 9. telepon varchar 15 10. nomorHP varchar 15 11. namaAyah varchar 30 12. pendidikanAyah int 2 13. pekerjaanAyah varchar 50 14. namaIbu varchar 30 15. pendidikanIbu int 2 16. pekerjaanIbu varchar 50 17. foto varchar 100 18. idAdministrasi int 2 19. idUser int 2 b. Nama Arus Data : Data username, data password Alias : Data login Bentuk Data : Variabel field Penjelasan : Untuk hak akses user Arus Data : Calon wisuda Proses 2.0 Operator Proses 2.0 Admin Prosses 2.0 Calon wisuda DUser Operator DUser Admin DUser Periode : Setiap ada yang login Struktur Data : No. Nama Item Data Type Lebar 1. idUser int 2 2. username text - 3. password text - 4. usernameAsal varchar 30 5. passwordAsal varchar 30 6. idType int 2 c. Nama Arus Data : Data Administrasi Alias : Data pendaftaran wisuda Bentuk Data : Variabel field 67 Penjelasan : Untuk menginput data administrasi Arus Data : Calon wisuda Proses 3.0 Proses 3.0 DAdministrasi DAdministrasi Proses 4.0 DAdministrasi Proses 6.0 Proses 6.0 Dkursi DAdministrasi Proses 6.2 DAdministrasi Proses 6.3 DAdministrasi Proses 6.4 Periode : Setiap ada yang daftar wisuda Struktur Data : No. Nama Item Data Type Lebar 1. idAdministrasi int 10 2. nomorRekening varchar 11 3. idBank int 2 4. jumlahBayar int 10 5. nomorRegistrasiWisuda varchar 30 6. judul varchar 100 7. tanggal date - 8. idPeriode int 2 9. idStatusBerkas int 2 10. ukuranToga varchar 1 11. tahunAkademik varchar 10 12. unikid varchar 50 d. Nama Arus Data : Data nomor unik administrasi Alias : Data nomor untuk validasi berkas wisuda Bentuk Data : Variabel angka dan huruf Penjelasan : Untuk menceklis pesyaratan wisuda Arus Data : Calon wisuda Proses 4.0 Operator Proses 4.0 Periode : Setiap ada yang daftar wisuda Struktur Data : - 68 e. Nama Arus Data : Data validasi berkas Alias : Data berkas persyaratan wisuda Bentuk Data : Dokumen Penjelasan : Untuk menceklis pesyaratan wisuda Arus Data : Calon wisuda Proses 4.0 Operator Proses 4.0 Periode : Setiap ada yang daftar wisuda Struktur Data : - f. Nama Arus Data : Data status berkas Alias : Data berkas persyaratan wisuda Bentuk Data : Variabel Penjelasan : Untuk memberikan informasi status berkas persyaratan wisuda calon wisuda Arus Data : Proses 4.0 Calon Wisuda Periode : Setiap ada yang daftar wisuda Struktur Data : - g. Nama Arus Data : Data nomor kursi Alias : Data nomor kursi wisuda Bentuk Data : Variabel Penjelasan : Untuk memberikan informasi status nomor kursi wisuda calon wisuda Arus Data : Proses 4.0 Calon Wisuda Periode : Setiap ada yang daftar wisuda Struktur Data : - h. Nama Arus Data : Data periode wisuda Alias : Data jadwal wisuda Bentuk Data : Variabel field 69 Penjelasan : Untuk menginput data periode wisuda Arus Data : Admin Proses 5.0 Admin Proses 5.1 Periode : Setiap ada jadwal wisuda baru Struktur Data : No. Nama Item Data Type Lebar 1. idPeriode int 2 2. tanggalPendaftaran date - 3. tanggalPenyerahan date - 4. tanggalPersiapan date - 5. tanggalPelaksanaan date - 6. idStatus int 2 i. Nama Arus Data : Data periode wisuda baru Alias : Data jadwal wisuda baru Bentuk Data : Variabel field Penjelasan : Untuk menginput data periode wisuda baru Arus Data : Proses 5.1 DPeriode Proses 5.1 Admin Periode : Setiap ada jadwal wisuda baru Struktur Data : No. Nama Item Data Type Lebar 1. idPeriode int 2 2. tanggalPendaftaran date - 3. tanggalPenyerahan date - 4. tanggalPersiapan date - 5. tanggalPelaksanaan date - 6. idStatus int 2 j. Nama Arus Data : Data periode wisuda terupdate Alias : Data jadwal wisuda terupdate Bentuk Data : Variabel field Penjelasan : Untuk mengupate data periode 70 wisuda Arus Data : Dperiode Proses 5.2 Proses 5.2 Admin Periode : Setiap ada jadwal wisuda diganti Struktur Data : No. Nama Item Data Type Lebar 1. idPeriode int 2 2. tanggalPendaftaran date - 3. tanggalPenyerahan date - 4. tanggalPersiapan date - 5. tanggalPelaksanaan date - 6. idStatus int 2 k. Nama Arus Data : Data informasi periode wisuda Alias : Data informasi jadwal wisuda Bentuk Data : Variabel field Penjelasan : Untuk memberikan informasi periode wisuda Arus Data : Proses 5.0 Calon Wisuda Periode : Setiap ada jadwal wisuda baru Struktur Data : - l. Nama Arus Data : Data peserta wisuda terhapus Alias : Data nama wisudawan terhapus Bentuk Data : Variabel field Penjelasan : Untuk memberikan informasi peserta wisuda yang dihapus Arus Data : Proses 6.2 Admin Periode : Setiap ada yang daftar wisuda Struktur Data : - 71 m. Nama Arus Data : Data peserta wisuda tercetak Alias : Data nama wisudawan tercetak Bentuk Data : Variabel field Penjelasan : Untuk memberikan informasi peserta wisuda yang dicetak Arus Data : Proses 6.3 Admin Periode : Setiap ada yang daftar wisuda Struktur Data : - n. Nama Arus Data : Data informasi peserta wisuda Alias : Data informasi nama wisudawan Bentuk Data : Variabel field Penjelasan : Untuk memberikan informasi peserta wisuda Arus Data : Proses 6.0 Calon Wisuda Proses 6.4 Admin Periode : Setiap ada yang daftar wisuda Struktur Data : - o. Nama Arus Data : Data laporan peserta wisuda Alias : Data laporan nama wisudawan Bentuk Data : Variabel field Penjelasan : Untuk memberikan daftar nama peserta wisuda yang sudah melakukan wisuda Arus Data : Proses 6.0 Calon Wisuda Periode : Per-periode wisuda Struktur Data : - 72

4.3.2.3. Process spesification PSPEC

Process spesification PSPEC digunakan untuk menggambarkan semua proses model aliran yang tampak pada tingkat akhir penyaringan. Kandungan dari spesifikasi proses dapat termasuk teks naratif, gambaran bahasa desain program dari algoritma proses, persamaan matematika, tabel diagram, atau bagan. Dengan memberikan sebuah PSPEC untuk mengiringi masing-masing gelembung di dalam model aliran, berarti perekayasa perangkat lunak menciptakan sebuah “spesifikasi mini” yang dapat berfungsi sebagai sebuah langkah pertama di dalam kreasi spesifikasi persyaratan perangkat lunak dan sebagai penuntun bagi desain komponen program yang akan mengimplementasikan program Pressman, 1997 Untuk lebih detailnya process spesification PSPEC ditunjukkan pada tabel 4.1. Tabel 4.1 Process Spesification PSPEC No. Nama Proses Data Input Data Output Mekanisme 1.0 Pendaftaran Calon Wisuda Data Pribadi dan Foto - Proses menerima input berupa data pribadi dan foto dari calon wisuda, lalu sistem penyimpan data dan foto tersebut ke database calon wisuda. 2.0 Login Calon Wisuda, Operator, dan Data Username dan Hak Akses Proses menerima input berupa data username dan password dari Calon 73 Admin Password Wisuda, Operator, dan Admin, lalu sistem menyimpan data tersebut ke dalam database user, dan output yang diterima adalah hak akses untuk masuk ke sistem. 3.0 Pendaftaran Calon Wisuda Data Administrasi Data Nomor Unik Administrasi Proses menerima input data administrasi dari calon wisuda, lalu sistem menyimpan data tersebut ke dalam database administrasi, dan calon wisuda mendapatkan output berupa data nomor unik administrasi. 4.0 Validasi Berkas Wisuda Data Nomor Unik Administrasi Data Status Berkas Proses menerima input data berupa nomor unik administrasi yang telah calon wisuda peroleh, lalu operator melakukan validasi berkas persyaratan wisuda, dan calon wisuda output berupa data status berkas wisuda yang sudah tervalidasi dan nomor kursi. 5.0 Pengolahan Data Periode Wisuda Data Tanggal Wisuda Data Informasi Jadwal Wisuda Proses menerima input data berupa tanggal dari admin, lalu menghasilkan output berupa data informasi jadwal wisuda 6.0 Pengolahan Data Peserta Wisuda - Data Informasi Daftar Peserta Wisuda Proses mengambil data pribadi dan data administrasi dari database calon wisuda dan database administrasi, dan proses juga menyimpan data pribadi dan data administrasi ke database kursi, lalu output yang dihasilkan berupa daftar peserta wisuda. 7.0 Pembuatan Laporan Daftar - Data Laporan Proses mengambil data pribadi dan data 74 Peserta Wisuda Daftar Peserta Wisuda administrasi dari database calon wisuda dan database administrasi, lalu output yang dihasilkan berupa data laporan daftar peserta wisuda. 5.1 Input Data Periode Wisuda Data Tanggal Wisuda Data Periode Wisuda Baru Proses menginput data berupa data periode wisuda baru dari admin, lalu data tersebut disimpan di database periode dan menghasilkan output berupa data periode wisuda baru. 5.2 Edit Data Periode Wisuda Data Tanggal Wisuda Data Periode Wisuda yang Telah Terupdate Proses menginput data berupa data periode wisuda baru yang telah diedit dari admin, lalu data tersebut disimpan di database periode dan menghasilkan output berupa data periode wisuda yang telah terupdate. 6.1 Edit Data Peserta Wisuda Data Pribadi, Username, Password dan Foto Data Pribadi, Username, Password dan Foto Baru Proses menginput data berupa data pribadi, data username, data password dan foto dari admin, lalu data tersebut disimpan di database calon wisuda dan database user, menghasilkan output berupa data pribadi, data username, data password dan foto baru. 6.2 Hapus Data Peserta Wisuda - Data Peserta Wisuda Terhapus Proses menerima data berupa data pribadi, data username dan password dan data administrsi dari database calon wisuda, user dan administrasi, lalu data tersebut dihapus oleh admin, dan output yang dihasilkan adalah data peserta wisuda yang telah dihapus. 75 6.3 Cetak Data Peserta Wisuda - Data Peserta Wisuda Tercetak Proses menerima data berupa data pribadi, data username dan password dan data administrsi dari database calon wisuda, user dan administrasi, lalu data tersebut dihapus oleh admin, dan output yang dihasilkan adalah data peserta wisuda yang telah tercetak. 6.4 Cari Data Peserta Wisuda - Data Informasi Peserta Wisuda Proses menerima inputan lalu melakukan pencarian data di tabel database. 76 50 xiii 4.3.2.3.ERD Entity Relationship Diagram G a m b a r 4 . 2 1 . E R D S I S P E N D A S u m b e r : D a t a d i o l a h P e n u l i s 77 4.3.2.4.Normalisasi Berikut langkah-langkah normalisasi : 1. Bentuk Tidak Normal UNF Berikut adalah bentuk tidak normal : Gambar 4 .22. UNF Bentuk Tidak Normal Data diolah Oleh Penulis 78 2. Bentuk Normal Pertama 1NF Pada gambar diatas masih banyak data yang berulang, sehingga dibentuk normal pertama yaitu membuat satu entitas tidak memiliki atribut yang sama. Berikut bentuk normal pertama : Gambar 4 .23. 1NF Bentuk Normal Pertama Data diolah Oleh Penulis 79 3. Bentuk Normal Kedua 2NF Langkah selanjutnya adalah membuat normal kedua. Bentuk normal kedua: Gambar 4 .24. 2NF Bentuk Normal Kedua Data diolah Oleh Penulis Ket : Primary Key Foreign Key 80 4. Bentuk Normal Ketiga 3NF Langkah selanjutnya adalah membuat normal ketiga. Bentuk normal ketiga: Gambar 4 .25. 3NF Bentuk Normal Ketiga Data diolah Oleh Penulis Ket : Primary Key Foreign Key 81 4.3.2.6.Struktur Basis Data Berikut adalah spesifikasi tabel basis data yang terdapat pada sistem informasi pendaftaran wisuda Online : 1. Tabel Administrasi Tabel 4.2. Tabel Administrasi Sumber : Data diolah Penulis Field Name Data Type Extra idAdministrasi int10 auto_increment nomorRekening varchar11 idBank int2 jumlahBayar int10 nomorSetor varchar30 judul varchar100 tanggal date idPeriode int2 idStatusBerkas int2 ukuranToga varchar1 tahunAkademik varchar10 unikid varchar50 2. Tabel Bank Tabel 4.3. Tabel Bank Sumber : Data diolah Penulis Field Name Data Type Extra idBank int2 auto_increment namaBank varchar20 3. Tabel Fakultas Tabel 4.4. Tabel Fakultas Sumber : Data diolah Penulis Field Name Data Type Extra idFakultas int2 auto_increment namaFakultas varchar20 82 4. Tabel Jenis Kelamin Tabel 4.5. Tabel Jenis Kelamin Sumber : Data diolah Penulis Field Name Data Type Extra idJk int2 auto_increment namaJk varchar10 5. Tabel Calon Wisuda Tabel 4.6. Tabel Calon Wisuda Sumber : Data diolah Penulis Field Name Data Type Extra nim varchar25 nama varchar30 idJk int2 tempatLahir varchar20 tanggalLahir date idJurusan int2 alamatSekarang text alamatAsal text telepon varchar15 nomorHP varchar15 namaAyah varchar30 pendidikanAyah int2 pekerjaanAyah varchar50 namaIbu varchar30 pendidikanIbu int2 pekerjaanIbu varchar50 foto varchar100 idAdministrasi int2 idUser int2 6. Tabel Tabel 4.7. Tabel Jurusan Sumber : Data diolah Penulis Field Name Data Type Extra idJurusan int2 auto_increment namaJurusan varchar20 idFakultas int2 83 7. Tabel Kursi Tabel 4.8. Tabel Kursi Sumber : Data diolah Penulis Field Name Data Type Extra nomorKursi int2 idPeriode int2 idFakultas int2 auto_increment nim varchar25 8. Tabel Pendidikan Tabel 4.9. Tabel Pendidikan Sumber : Data diolah Penulis Field Name Data Type Extra idPendidikan int2 auto_increment namaPendidikan varchar5 9. Tabel Periode Tabel 4.10. Tabel Periode Sumber : Data diolah Penulis Field Name Data Type Extra idPeriode int2 auto_increment tanggalPendaftaran date tanggalPenyerahan date tanggalPersiapan date tanggalPelaksanaan date idStatus int2 10. Tabel Status Tabel 4.11. Tabel Status Sumber : Data diolah Penulis Field Name Data Type Extra idStatus int2 auto_increment namaStatus varchar10 84 11. Tabel Status Berkas Tabel 4.12. Tabel Status Berkas Sumber : Data diolah Penulis Field Name Data Type Extra idStatusBerkas int2 auto_increment namaStatusBerkas varchar20 12. Tabel T ypeuser Tabel 4.13. Tabel Typeuser Sumber : Data diolah Penulis Field Name Data Type Extra idTypeuser int2 auto_increment namaT ypeuser varchar20 13. Tabel User Tabel 4.14. Tabel User Sumber : Data diolah Penulis Field Name Data Type Extra idUser int2 auto_increment username text password text usernameAsal varchar30 passwordAsal varchar30 idT ype int2 85

4.3.2.7. Rancangan Antarmuka

1. Halaman SISPENDA a. Halaman Utama Gambar 4.27. Rancangan Menu Utama Data diolah oleh Penulis b. Halaman Jadwal Wisuda Gambar 4.28. Rancangan Menu Jadwal Wisuda Data diolah oleh Penulis 86 c. Halaman Persyaratan Wisuda Gambar 4.29. Rancangan Menu Persyaratan Wisuda Data diolah oleh Penulis d. Halaman Nama Wisudawan Gambar 4.30. Rancangan Menu Nama Wisudawan Data diolah oleh Penulis 87 e. Halaman About Gambar 4.31. Rancangan Menu About Data diolah oleh Penulis 88 f. Halaman Registrasi Banner Logo Welcome to SISPENDA UIN Jakarta Tanggal Home Jadwal Wisuda Persyaratan Wisuda Nama Wisudawan Form Registrasi Registrasi About Nama : Login Calon Wisuda NIM : Jenis Kelamin : Tempat, Tanggal Lahir : Jurusan : Fakultas : Fakultas : Alamat Sekarang : Alamat Asal : Telepon : No. HP : Nama Ayah : Pendidikan Ayah : Pekerjaan Ayah : Nama Ibu : Pendidikan Ibu : Pekerjaan Ibu : Username : Password : Foto : Save Cancel © 2009 Universitas Islam Negeri Syarif Hidayatullah Jakarta Gambar 4.32. Rancangan Menu Registrasi Data diolah oleh Penulis 89 2. Halaman Calon Wisudawan a. Halaman Login Gambar 4.33. Rancangan Menu Login Calon Wisudawan Data diolah oleh Penulis b. Halaman Utama Gambar 4.34. Rancangan Menu Utama Calon Wisudawan Data diolah oleh Penulis 90 c. Halaman Data Pribadi Gambar 4.35. Rancangan Menu Data Pribadi Data diolah oleh Penulis d. Halaman Registrasi Data Akademik Gambar 4.36. Rancangan Menu Registrasi Akademik Data diolah oleh Penulis 91 e. Halaman Verifikasi Data Gambar 4.37. Rancangan Menu Verifikasi Data Data diolah oleh Penulis 3. Halaman Operator a. Halaman Login Gambar 4.38. Rancangan Menu Login Operator Data diolah oleh Penulis 92 b. Halaman Utama Gambar 4.39. Rancangan Menu Utama Operator Data diolah oleh Penulis c. Halaman Form Validasi Berkas Gambar 4.40. Rancangan Menu Validasi Berkas Data diolah oleh Penulis 93 4. Halaman Admin a. Halaman Login Gambar 4.41. Rancangan Login Admin Data diolah oleh Penulis b. Halaman Utama Gambar 4.42. Rancangan Menu Utama Data diolah oleh Penulis 94 c. Halaman Peserta Wisuda Gambar 4.43. Rancangan Peserta Wisuda Data diolah oleh Penulis d. Halaman Periode Wisuda Gambar 4.44. Rancangan Periode Wisuda Data diolah oleh Penulis 95

4.4. Pengkodean