BAB IV ANALISA DAN PERANCANGAN 4.1 Analisa Sistem Analisis sistem ini merupaakan penguraian dari suatu sistem pengembangan web yang utuh kedalam bagian-bagian komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahan-permasalahan, kesempatan-kesempatan, hambatan-hambatan dan kebutuhan-kebutuhan yang diharapakan sehingga dapat diusulakan perbaiakannya. 4.1.1 Analisa Sistem yang Sedang Berjalan a. Deskripsi Masalah Sarana penyampaian informasi di MTs Al Ishlah Garawangi masih bersifat manual dengan menggunakan tulisan yang berupa surat dan lisan.karena hal tersebut menimbulkan maslah yaitu membutuhkan waktu lama dalam penyampaian informasi,penyimpanan data, dan membutuhkan biaya yang tidak sedikit. b. Pemecahan Masalah Berdasarkan uraian deskripsi maslah diatas maka diperlukan sebuah sitem baru yang dapat digunakan untuk penyampaian informasi MTs Al Ishlah Garawangi tanpa membutuhkan waktu yang lama yang biaya yang banyak berupa website yang dapat diakses kapanpun dan dimana saja. 45
46 4.1.2 Analisa Kebutuhan Fungsional Analisis kebutuhan fungsional dilakukan untuk memberikan gambaran mengenai permasalahan dan prosedur yang sedang berjalan saat ini di MTs Al Ishlah Garawangi 4.1.3 Analisa Kebutuhan Non Fungsional Analisis kebutuhan nonfungsional menggambarkan kebutuhan luar system yang diperlukan untuk menjalankan aplikasi yang dibangun. Kebutuhan nonfungsional untuk mengoperasikan Aplikasi ini meliputi kebutuhan perangkat keras, kebutuhan perangkat lunak, dan pengguna yang akan menggunakan aplikasi. 4.1.4 Analisa Sistem yang Diusulkan Untuk mengtasi masalah mengenai informasi dan data yang masih manual maka dibuat sistem baru yang memanfaatkan teknologi informasi khususnya media internet agar dapat diakses dengan cepat dan mudah.untuk hak akses website ini terbagi menjadi dua yaitu : 1. Admin : admin merupakan user yang dapat menggunakan sistem sepenuhnya yaitu dapat melakukan pengeditan, penginputan data dan penghapusan data, menggunakan tools yang tersedia. 2. User : user dapat melihat informasi tentang sekolah, berits, dan mengisi jejak pendapat. 4.1.5 Analisa Perangkat Keras Perangkat keras yang digunakan untuk pembuatan website ini adalah sebagai berikut:
47 1. Intel Core i3 2.6 Ghz 2. Memori 1 GB 3. Hardisk 320 GB 4. Monitor 5. Mouse 6. Keyboard 4.1.6 Analisa Perangkat Lunak Perangkat keras yang digunakan untuk pembuatan website ini adalah sebagai berikut: 1. Browser Internet (Google Chrome atau Mozilla Firefox) 2. Software editor (notepad++). 3. Aplikasi Server (xampp) 4. Desain gambar/tampilan (Corel Draw, Phothoshop) 5. Star UML 4.2 Perancangan 4.2.1 Pemodelan Sistem a. Use Case Diagram Use Case diagram terdiri dari actor dan sitem.dalam Use Case diagram sistem ini terdapat dua aktor yaitu admin dan user.admin dan User memiliki hak akses system yang berbeda yang digambarkan pada Gambar 4.1
48 System Home profil User guru siswa fitur Jejak Pendapat Gambar 4.1 Use Case User
49 System FITUR tambah edit admin login Data siswa Data Guru hapus tambah edit Logout hapus menu dan profiil setting admin <<extend>> <<extend>> <<extend>> lihat admin tambah admin Gambar 4.2 Use Case Admin Login Melihat Data Admin Home fitur Tambah Data Admin Profil Guru Admin <<extend>> Siswa agenda data siswa data guru <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> lokasi sekolah cari siswa User Jejak Pendapat berita log out Pengaturan admin informasi sekolah Gambar 4.3 Use Case Sistem
50 Deskripsi Use Case Diagram 1. Use Case Login Aktor Deskripsi :Admin : Jika login admin memasukkan username beserta password 2. Use Case Fitur agar dapat masuk kesistem sehingga admin bisa merubah,menghapus,dan menambah update data terbaru. Aktor Deskripsi :Admin dan User :Di menu Fitur terdapat beberapa sub bagian menu yang bisa diakses oleh user diantaranya agenda,peta sekolah,kontak sekolah,dan galeri kegiatan.untuk menu fitur yang bisa diakses oleh admin agenda, berita, buku tamu, galeri kegiatan, info sekolah, jajak pendapat dan prestasi yang dapat diupdate oleh admin. 3. Use Case Setting Admin Aktor Deskripsi :Admin :Menu untuk pengaturan admin 4. Use Case Data Guru Aktor :Admin Deskripsi :Terdapat menu untuk mengubah,menambah,dan menghapus data 5. Use Case Data Siswa Aktor :Admin
51 Deskripsi :Terdapat menu untuk mengubah,menambah,dan 6. Use Case Logut menghapus data Aktor Deskripsi :Admin :Untuk keluar dari system 7. Use CasevHome Aktor Deskripsi :User :Untuk keluar dari sistem 8. Use Case Profil Aktor Deskripsi :User : Tampilan Awal saat website diakses 9. Use Case Siswa Aktor Deskripsi :User :Untuk melihat data-data siswa yang menempuh pendidikan 10. Use Case Guru di MTS Aktor Deskripsi : User : Untuk melihat data-data Guru yang mengabdi di MTS
52 b. Activity Diagram 1. Activity Diagram Admin a. Login Admin Sistem Input Username Login Gagal Input Pasword Login Berhasil Menampilkan Form Admin Gambar 4.4 Activity Diagram Login Admin
53 b. Input Data Siswa Admin Sistem Login Pilih menu Data Siswa Pilih Kelas Pilih Kelas Menampilkan Data Siswa Update Edit Hapus Iya Simpan Gambar 4.5 Activity Diagram Input data siswa
54 c. Pencarian Siswa Gambar 4.6 Activity Diagram Pencarian Siswa
55 2. Activity Diagram User a. Lihat Data Siswa User Sistem Buka Website Menampilkan Form utama Memilih menu siwa Pilih Direktori siswa Menampilkan Data siswa Pilih Kelas Gambar 4.7 Activity Diagram lihat Data Siswa
56 b. Lihat Data Guru atau Tata Usaha User Sistem Buka Website Menampilkan Form utama Memilih menu guru Pilih Direktori Guru Menampilkan Data Pilih Data Gambar 4.8 Activity Diagram lihat Data Guru atau TU
57 c. Sequence Diagram Admin Sistem Admin Databse Sistem User User 1 : Buka Website Admin() 2 : Meminta Username dan password() 3 : Verifikasi Data() 4 : Valid() 5 : Menampilkan Menu Admin() 6 : Update,Edit,Delet,Simpan() 7 : Menyimpan Data() 8 : Mengirim Data() 9 : Menampilkan Menu() 10 : Memilih Menu() Gambar 4.9 Sequence Diagram
58 d. Class Diagram index +username +Password +Login() menu_admin +fitur() +setting_admin() +data_guru() +data_siswa() fitur +agenda() +berita() +buku_tamu() +galeri() +info_sekolah() +jejak_pendapat() +prestasi() setting_admin +tambah_admin() +lihat_admin() +menu_profil() data_guru +direktori_guru() data_siswa +direktori_siswa() agenda +no +tanggal +judul +kegiatan +tambah() +edit() +hapus() berita +no +judul +tanggal +komentar +tambah() +edit() +hapus() galeri +no +tanggal +judul_album +jumlah +tambah_foto +lihat_foto() +edit() +hapus() info_sekolah +no +tanggal +judul +tambah() +edit() +hapus() jajak_pendapat +pertanyaan +id +tanggal +status +edit() +hapus() prestasi +no +foto +keterangan +edit() +hapus() main_menu +Profil() +guru() +siswa() +fitur() guru +direktori_guru() +prestasi_guru() +kalender _akademik() siswa +prestasi() +eskul() +osis() +direktori_siswa() profil +visi_misi() +sejarah() +sarana() +struktur() +kepsek() +prestasi() fiture +agenda() +galeri_foto() +peta_situs() +kontak_sekolah() Home +berita() tambah_admin +username +password +email +hak_akses +tambah() menu_profil +home() +profili() +guru() +siswa() +fitur() Gambar 4.10 Class Diagram 4.2.2 Basis Data
59 a. Relasi Tabel User PK user_id kode_user jenis_user username password email ip waktu kunjung status berita PK berita_id isi subject pengirim posttime postdate visit buku_tamu PK id_tamu nama email alamat komentar posttime postdate ipkom tanggapan galeri PK galeri_id album_id ket galeri_album PK album_id album tanggal agenda PK file_id date_start date_end eventitle EvenDetail color status picture agenda_picture PK agenda_id picture_sm_name picture_bg_name picture_detail N N 1 1 1 N N 1 1 1 1 1 Gambar 4.11 Relasi Tabel
60 b. Perancangan Tabel 1. Tabel User (Admin) Tabel 4.1 Tabel User (Admin) Nama Field Tipe Data Ukuran Userid Int 11 Username Varchar 50 Password Varchar 200 Email Varchar 100 Ip Varchar 15 Waktu Varchar 20 Kunjung Int 11 Status Int 1 2. Tabel Pegawai Tabel 4.2 Tabel Pegawai Nama Field Tipe Data Ukuran Userid Int 5 Nama Varchar 30 Nip Varchar 25 Kelamin Char 2 Alamat Varchar 60
61 Nama Field Tipe Data Ukuran Tugas Varchar 30 Telp Varchar 15 Hp Varchar 15 Email Varchar 30 Pelajaran Varchar 200 tgl_lahir Varchar 15 tmp_lahir Varchar 20 Kode Varchar 10 Pangkat Varchar 50 Kategori Char 1 Profilstaff Longtext 3. Tabel Siswa Tabel 4.3 Tabel Siswa Nama Field Tipe Data Ukuran user_id Varchar 25 Nama Varchar 30 Kelas Varchar 10 Alamat Varchar 60 tgl_lahir Varchar 15 Telp Varchar 15
62 Nama Field Tipe Data Ukuran Agama Varchar 10 Kelamin Char 1 tmp_lahir Varchar 20 tgl_input Varchar 15 Sttb Varchar 10 Nem Varchar 10 Wali Varchar 50 4. Tabel Berita Tabel 4.4 Tabel Berita Nama Field Tipe Data Ukuran Id Int 10 Isi Subject Longtext Text Pengirim Varchar 40 Posttime Varchar 20 Postdate Varchar 20 Visits Int 11
63 5. Tabel Galeri Tabel 4.5 Tabel Galeri Nama Field Tipe Data Ukuran Idalbum Int 15 Album Varchar 100 Tanggal Varchar 20 6. Tabel Agenda Tabel 4.6 Tabel Agenda Nama Field Tipe Data Ukuran calendar_event Int 11 date_start date_end Datetime Datetime eventtitle Varchar 255 EvenDetail Text color Varchar 255 status Int 2 picture Int 11 file_id Int 11 4.2.3 Perancangan Antarmuka (interface) a. Perancangan Antamuka Halaman Admin 1. Rancangan interface halaman Login Admin
64 Gambar 4.12 Login Admin 2. Rancangan interface halaman Home Admin Gambar 4.13 Home Admin
65 3. Interface Fitur Gambar 4.14 Interface Fitur 4. Interface Setting Admin Gambar 4.15 Interface Setting Admin
66 5. Interface Data Guru Gambar 4.16 Interface Setting Admin 6. Interface Data Siswa Gambar 4.17 Interface Setting Admin
67 b. Perancangan Antamuka Halaman User 1. Interface Home User Gambar 4.18 Interface Home User
68 2. Interface Profil Gambar 4.19 Interface Profil
69 3. Interface Guru Gambar 4.20 Interface Guru 4. Interface Siswa Gambar 4.21 Interface Siswa