RANCANG BANGUN APLIKASI E-MADING (ELEKTRONIK MAJALAH DINDING) PADA MADRASAH ALIYAH NU NURUL ULUM JEKULO KUDUS GUNA MENUNJANG KREATIVITAS SISWA

LAPORAN SKRIPSI RANCANG BANGUN APLIKASI E-MADING (ELEKTRONIK MAJALAH DINDING) PADA MADRASAH ALIYAH NU NURUL ULUM JEKULO KUDUS GUNA MENUNJANG KREATIVITAS SISWA Laporan ini Disusun guna Memenuhi Salah Satu Syarat untuk Menyelesaikan Program Studi Sistem Informasi S-1 pada Fakultas Teknik Universitas Muria Kudus Disusun Oleh : Nama : Shaiful Anwar NIM : 2009-53-102 Program Studi : Sistem Informasi Fakultas : Teknik FAKULTAS TEKNIK UNIVERSITAS MURIA KUDUS KUDUS 2014

HALAMAN PERSETUJUAN Nama : Shaiful Anwar NIM : 2009-53-102 Program Studi : Sistem Informasi Judul Laporan Pembimbing I Pembimbing II : : : Rancang Bangun Aplikasi E-Mading (Elektronik Majalah Dinding) pada Madrasah Aliyah NU Nurul Ulum Jekulo Kudus Guna Menunjang Kreativitas Siswa Andy Prasetyo Utomo, S.Kom, MT Putri Kurnia Handayani, M.Kom Kudus, 07 Maret 2014 Menyetujui : Pembimbing I Pembimbing II Andy Prasetyo Utomo, S.Kom, MT Putri Kurnia Handayani, M.Kom

HALAMAN PENGESAHAN Nama : Shaiful Anwar NIM : 2009-53-102 Program Studi : Sistem Informasi Judul Laporan Pembimbing I Pembimbing II : : : Rancang Bangun Aplikasi E-Mading (Elektronik Majalah Dinding) pada Madrasah Aliyah NU Nurul Ulum Jekulo Kudus Guna Menunjang Kreativitas Siswa Andy Prasetyo Utomo, S.Kom, MT Putri Kurnia Handayani, M.Kom Kudus, 26 Mei 2014 Telah diujikan pada ujian sarjana, tanggal 23 Mei 2014 dan dinyatakan LULUS Mengesahkan : Penguji Utama Penguji I Penguji II Supriyono,M. Kom Andy Prasetyo Utomo, MT Anteng Widodo,ST.M. Kom Mengetahui : Dekan Fakultas Teknik Rochmad Winarso, ST., MT.

MOTTO DAN PERSEMBAHAN Motto : H Cara untuk menjadi di depan adalah memulai sekarang. Jika memulai sekarang, tahun depan Anda akan tahu banyak hal yang sekarang tidak diketahui, dan Anda tak akan mengetahui masa depan jika Anda menunggu-nunggu. Orang-orang hebat di bidang apapun bukan baru bekerja karena mereka terinspirasi, namun mereka menjadi terinspirasi karena mereka lebih suka bekerja. Mereka tidak menyia-nyiakan waktu untuk menunggu inspirasi. Dalam masalah hati nurani, pikiran pertamalah yang terbaik. Dalam masalah kebijaksanaan, pemikiran terakhirlah yang paling baik. Persembahan Skripsi ini kupersembahkan kepada : 1. Tuhan yang telah menciptakan aku, beserta Rosul-Nya. 2. Kedua orang tuaku yang selalu memberikan doa dan selalu memberikan restunya. 3. Teman-temanku 4. Almamater UMK

RINGKASAN Laporan skripsi dengan judul Rancang Bangun Aplikasi E-Mading (Elektronik Majalah Dinding) pada Madrasah Aliyah NU Nurul Ulum Jekulo Kudus Guna Menunjang Kreativitas Siswa telah dilaksanakan dengan tujuan dengan menghasilkan suatu sistem informasi berbasis web untuk mengefektifkan penggunaan kertas karena untuk penggantian berita lama dengan berita baru dilakukan secara digital menggunakan database. Sistem ini dirancang dengan menggunakan pemodelan UML. Sedangkan bahasa pemrograman yang digunakan adalah PHP dan database MySQL. Hasil dari rancang bangun ini adalah website Aplikasi E-mading (Elektronik Majalah Dinding) yang mana website ini dititik beratkan pada pengelolaan informasi tentang kreativitas siswa dan beberapa aspek yang berkenaan dengan menu menu yang kompatible yakni menu profil, menu program, menu konten, dan menu berita yang membantu penunjangan Website E- mading. Kata Kunci : E-Mading, UML, MA NU Nurul Ulum Jekulo Kudus

KATA PENGANTAR Bismillahirrohmanirrohim Assalamu alaikum Wr.Wb. Alhamdulillah segala puji bagi Tuhan yang telah melimpahkan rahmat dan pertolongan kepada penulis serta ni mat dan karunia yang lebih sehingga tak mampu bagi penulis untuk sekedar menghitung dan mengucap syukur atas segala yang dianugrahkan Allah kepada penulis satu per satu. Rahmat dan salam kepada Rosulullah, Muhammad kekasih Allah. Beliaulah yang telah membawa kita dari kegelapan ke jalan cahaya. Alhamdulillah segala puji kepada-mu, atas segala hal yang Engkau berikan padaku. Terima kasih atas orang-orang terhebat yang Engkau hadirkan di sekelilingku. Terima kasih. Terima kasih atas segala pertolongan-mu. Aku menyadari, aku hanyalah makhluk lemah yang tak berdaya. Karena Engkaulah, ya Allah, dan memang hanya karena Engkaulah skripsi ini dapat terselesaikan. Segala puji bagi-mu, Tuhanku. Penyusunan skripsi ini merupakan salah satu syarat yang harus dipenuhi untuk menyelesaikan Program Studi Sistem Informasi S-1 pada Fakultas Teknik Universitas Muria Kudus. Pada kesempatan ini, penulis ingin menyampaikan rasa terima kasih yang sebesarbesarnya kepada : 1. Rektor Universitas Muria Kudus. 2. Bapak Rochmad Winarso, ST., MT. selaku Dekan Fakultas Teknik Universitas Muria Kudus. 3. Bapak R. Rhoedy Setiawan, M.Kom selaku Kepala Program Studi Sistem Informasi Fakultas Teknik Universitas Muria Kudus. 4. Bapak Andy Prasetyo Utomo, ST, M.Kom yang berkenan menjadi dosen pembimbing pertama saya. Terima kasih atas waktu, ilmu, saran, 5. Ibu Putri Kurnia Handayani, S.Kom, M.Kom selaku pembimbing dua saya. Terima kasih atas waktu, ilmu, saran, semangat, dan nasihat yang Ibu berikan selama bimbingan. Terima kasih banyak, Bu.

6. Semua Staf dari MA NU Nurul Ulum Jekulo Kudus, Terima kasih atas ijin yang telah diberikan untuk melakukan penelitian di MA NU Nurul Ulum Jekulo Kudus. 7. Segenap dosen Universitas Muria Kudus, khususnya Progam Studi Sistem Inforamasi yang telah mengenalkan ilmu baru kepada penulis. 8. Semua pihak yang membantu terselesaikannya laporan ini yang tidak dapat penulis sebutkan. Penulis menyadari bahwa dalam penyusunan Laporan Skripsi masih jauh dari sempurna. Oleh karena itu, saran dan kritik yang membangun sangat penulis harapkan guna perbaikan penulisan di masa-masa mendatang. Penulis mohon maaf atas segala kekurangan dan kesalahan yang ada. Akhirnya, penulis berharap semoga tulisan ini bermanfaat. Amin. Wassalamu alaikum Wr.Wb. Kudus, April 2014 Penulis

DAFTAR ISI HALAMAN JUDUL... i HALAMAN PERSETUJUAN... ii HALAMAN PENGESAHAN... iii SURAT PERNYATAAN PERSETUJUAN KARYA ILMIAH... iv HALAMAN MOTO DAN PERSEMBAHAN... v RINGKASAN... vi KATA PENGANTAR... vii DAFTAR ISI... ix DAFTAR TABEL... xiii DAFTAR GAMBAR... xiv DAFTAR LAMPIRAN... xvii BAB I PENDAHULUAN... 1 1.1. Latar Belakang Masalah... 1 1.2. Perumusan Masalah... 2 1.3. Batasan Masalah... 2 1.4. Tujuan Skripsi... 2 1.5. Manfaat Skripsi... 2 1.6. Tinjauan Pustaka... 3 1.7. Metodologi Penelitian... 4 1.7.1. Objek Penelitian... 4 1.7.2. Metode pengumpulan data... 4 1.7.2.1. Sumber data primer... 4 1.7.2.2.Sumber data sekunder... 5 1.7.3. Metode pengembangan sistem... 5 1.7.4. Metode perancangan sistem... 7 1.8. Sistematika Penulisan... 8 BAB II LANDASAN TEORI... 9 2.1. Pengertian rancang bangun... 9 2.2. Konsep dasar sistem... 9

2.2.1. Pengertian sistem... 9 2.2.2. Karakteristik sistem... 9 2.3. Konsep dasar informasi... 11 2.3.1. Pengertian informasi... 11 2.3.2. Kualitas informasi... 11 2.4. E-Mading (Elektronik Mading)... 12 2.4.1. Pengertian majalah dinding (Mading)... 12 2.4.2. Pengertian elektronik majalah dinding E-(Mading)... 12 2.5. FOD (Flow Of Document)... 12 2.6. Pengertian aplikasi... 14 2.7. UML (Unified Modelling Language)... 14 2.7.1. Pengertian... 14 2.7.2. Diagram grafis UML... 15 a. Use case diagram... 15 b. Class diagram... 16 c. Sequence diagram... 17 d. Activity diagram... 17 e. Statechart diagram... 18 2.8. Entity Relationship Diagram (ERD)... 19 BAB III TINJAUAN UMUM OBYEK PENELITIAN... 24 3.1. Profil Madrasah Aliyah Nurul Ulum... 24 3.1.1. Sejarah Madrasah Aliyah Nurul Ulum... 24 3.2. Visi, Misi dan Tujuan... 26 3.3. Letak Geografis... 27 3.4. Struktur Organisasi... 28 3.5. Job Description... 29 3.6. Flow of Document Pembuatan Majalah Dinding... 33 BAB IV ANALISA DAN PERANCANGAN... 35 4.1. Deskripsi Sistem... 35 4.2. Identifikasi Masalah... 35 4.3. Analisa Kebutuhan Data dan Informasi... 35

4.4. Analisa Kebutuhan Hardware dan Software... 35 4.4.1. Kebutuhan Perangkat Keras... 35 4.4.2. Kebutuhan Perangkat Lunak... 36 4.5. Analisa dan Perancangan Sistem... 36 4.5.1. Analisa Actor... 36 4.5.2. Bussiness Use case... 36 4.5.3. Perancangan Use case Diagram... 38 4.5.4. Deskripsi Skenario Use case... 38 4.5.5. Analisa Kelas... 42 4.5.6. Class Diagram... 45 4.5.7. Sequence Diagram... 45 4.5.8. Activity Diagram... 49 4.5.9. Statechart Diagram... 52 4.6. Perancangan Database... 57 4.6.1. Entity Relationship Diagram... 57 4.6.2. Perancangan Database... 61 4.6.3. Relasi Tabel... 64 4.7. Desain yang diusulkan... 64 4.7.1. Perancangan layout sistem (antarmuka sisitem)... 64 4.7.2. Perancangan form... 64 BAB V PEMBAHASAN DAN IMPLEMENTASI... 67 5.1. Kebutuhan Implementasi... 67 5.1.1. Analisa Kebutuhan sistem... 67 5.1.2. Kebutuhan Perangkat Lunak (Software)... 67 5.1.3. Kebutuhan Sumber Daya Manusia (Brainware)... 68 5.2. Halaman Utama Sistem... 68 5.3. Isi Konten Berdasarkan Kategori... 69 5.4. Halaman Detail Konten... 69 5.5. Halaman Daftar... 70 5.5.1. Halaman Menu Member... 70 5.5.2. Halaman Admin... 72

5.5.3. Menu Admin... 72 5.5.4. Halaman Daftar Konten Masuk... 73 5.6. Halaman Laporan... 74 BAB VI PENUTUP... 75 6.1. Kesimpulan... 75 6.2. Saran... 75 DAFTAR PUSTAKA LAMPIRAN

DAFTAR TABEL Tabel 2.1 : Simbol Flow Of Document... 13 Tabel 2.2 : Notasi Use Case Diagram... 15 Tabel 2.3 : Notasi Class Diagram... 16 Tabel 2.4 : Notasi Sequence Diagram... 17 Tabel 2.5 : Notasi Activity Diagram... 18 Tabel 2.6 : Notasi Statechart Diagram... 18 Tabel 2.7 : Simbol-simbol ERD... 22 Tabel 4.1 : Proses bisnis Use Case Diagram... 37 Tabel 4.2 : Skenario Pendaftaran... 38 Tabel 4.3 : Skenario Upload Konten... 39 Tabel 4.4 : Skenario Publish Konten... 39 Tabel 4.5 : Skenario Kelola Laporan... 40 Tabel 4.6 : Skenario Kelola Buku Tamu... 40 Tabel 4.7 : Skenario Buku Tamu... 41 Tabel 4.8 : Skenario Melihat Konten... 41 Tabel 4.9 : Skenario Pendataan Siswa... 42 Tabel 4.10 : Tabel Siswa... 61 Tabel 4.11 : Tabel Guru... 61 Tabel 4.12 : Tabel Pendaftaran... 62 Tabel 4.13 : Tabel Konten... 62 Tabel 4.14 : Tabel Publish Konten... 63 Tabel 4.15 : Tabel Buku Tamu... 63

DAFTAR GAMBAR Gambar 2.1 : diagram relationship unary... 20 Gambar 2.2 : diagram relationship binary... 20 Gambar 2.3 : diagram relationship ternary... 20 Gambar 2.4 : diagram kardinalitas one to one... 21 Gambar 2.5 : diagram kardinalitas one to many... 22 Gambar 2.6 : diagram kardinalitas many to many... 22 Gambar 3.1 : Denah Lokasi... 27 Gambar 3.2 : Struktur Organisasi Madrasah Aliyah Nurul Ulum... 28 Gambar 3.3 : Flow of Document Pembuatan Majalah Dinding... 33 Gambar 4.1 : Bisnis Use Case... 37 Gambar 4.2 : Gambar Use case Sistem... 38 Gambar 4.3 : Kelas User... 42 Gambar 4.4 : Kelas Guru Pengelola... 43 Gambar 4.5 : Kelas Pendaftaran... 43 Gambar 4.6 : Kelas Siswa... 43 Gambar 4.7 : Kelas Upload Konten... 44 Gambar 4.8 : Kelas Publish Konten... 44 Gambar 4.9 : Kelas Buku Tamu... 44 Gambar 4.10 : Class Diagram... 45 Gambar 4.11 : Sequence diagram Pendaftaran... 45 Gambar 4.12 : Sequence diagram Upload Konten... 46 Gambar 4.13 : Sequence diagram Publish Konten... 46 Gambar 4.14 : Sequence diagram Melihat Konten... 47 Gambar 4.15 : Sequence diagram Buku Tamu... 47 Gambar 4.16 : Sequence diagram Kelola Buku Tamu... 48 Gambar 4.17 : Sequence diagram Kelola Laporan... 48 Gambar 4.18 : Activity diagram Pendaftaran... 49 Gambar 4.19 : Activity diagram Upload Konten... 50 Gambar 4.20 : Activity diagram Publish Konten... 50

Gambar 4.21 : Activity diagram Melihat Konten... 51 Gambar 4.22 : Activity diagram Buku Tamu... 51 Gambar 4.23 : Activity diagram Kelola Buku Tamu... 52 Gambar 4.24 : Activity diagram Kelola Laporan... 52 Gambar 4.25 : Statechart Diagram Class User Login... 53 Gambar 4.26 : Statechart Diagram Class User Logout... 53 Gambar 4.27 : Statechart Diagram Class Pendataan Siswa... 53 Gambar 4.28 : Statechart Diagram Class Publish Konten... 53 Gambar 4.29 : Statechart Diagram Class Kelola Buku Tamu... 54 Gambar 4.30 : Statechart Diagram Class Kelola Laporan... 54 Gambar 4.31 : Statechart Diagram Class Tambah Pendaftaran... 54 Gambar 4.32 : Statechart Diagram Class Simpan Pendaftaran... 54 Gambar 4.33 : Statechart Diagram Class Tambah Siswa... 55 Gambar 4.34 : Statechart Diagram Class Simpan Siswa... 55 Gambar 4.35 : Statechart Diagram Class Tambah Upload Konten... 55 Gambar 4.36 : Statechart Diagram Class Simpan Upload Konten... 55 Gambar 4.37 : Statechart Diagram Class Tambah Publish Konten... 56 Gambar 4.38 : Statechart Diagram Class Simpan Publish Konten... 56 Gambar 4.39 : Statechart Diagram Class Hapus Publish Konten... 56 Gambar 4.40 : Statechart Diagram Class Tambah Buku Tamu... 56 Gambar 4.41 : Statechart Diagram Class Simpan Buku Tamu... 56 Gambar 4.42 : Statechart Diagram Class Hapus Buku Tamu... 56 Gambar 4.43 : Menentukan Entitas... 57 Gambar 4.44 : Entitas Guru... 57 Gambar 4.45 : Entitas Siswa... 57 Gambar 4.46 : Entitas Konten... 58 Gambar 4.47 : Entitas Pendaftaran... 58 Gambar 4.48 : Entitas Publish Konten... 58 Gambar 4.49 : Menentukan atribut key... 59 Gambar 4.50 : Derajat kardinalitas... 59 Gambar 4.51 : Atribut-atribut deskriptif... 60

Gambar 4.52 : ERD E-Mading... 60 Gambar 4.53 : Relasi Tabel... 64 Gambar 4.54 : Desain Website... 64 Gambar 4.55 : Desain Form Guru... 64 Gambar 4.56 : Desain Form Siswa... 65 Gambar 4.57 : Desain Form Upload Konten... 65 Gambar 4.58 : Desain Form Guru... 65 Gambar 4.59 : Desain Form Publish Konten... 66 Gambar 4.60 : Desain Form Komentar... 66 Gambar 5.1 : Halaman Utama Sistem... 68 Gambar 5.2 : Isi Konten Berdasarkan kategori... 69 Gambar 5.3 : Halaman Detail Konten... 69 Gambar 5.4 : Halaman Pendaftaran Member... 70 Gambar 5.5 : Halaman Login Member... 70 Gambar 5.6 : Menu Member... 70 Gambar 5.7 : Upload Konten... 71 Gambar 5.8 : Konten saya... 71 Gambar 5.9 : Upload File... 71 Gambar 5.10 : Halaman login admin... 72 Gambar 5.11 : Menu Admin... 72 Gambar 5.12 : Halaman Daftar Konten Masuk... 73 Gambar 5.13 : Halaman Publish Konten... 73 Gambar 5.14 : Halaman Laporan... 74

DAFTAR LAMPIRAN Lampiran 1 Lampiran 2 Lampiran 3 : Buku Bimbingan Skripsi : Surat Keterangan Penelitian : Biografi Penulis