SISTEM INFORMASI PANTAUAN SISWA DIDIK BERBASIS WEB DAN MOBILE SD AL FIRDAUS SURAKARTA
TUGAS AKHIR Disusun untuk memenuhi salah satu syarat dalam memperoleh gelar Ahli Madya pada Program Studi Diploma III Teknik Informatika Universitas Sebelas Maret
Diajukan oleh :
AGUNG NUGROHO NIM. M3113006
PROGRAM DIPLOMA III TEKNIK INFORMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SEBELAS MARET SURAKARTA 2016
HALAMAN PERSETUJUAN
SISTEM INFORMASI PANTAUAN SISWA DIDIK BERBASIS WEB DAN MOBILE SD AL FIRDAUS SURAKARTA
Disusun oleh :
AGUNG NUGROHO NIM. M3113006
Tugas Akhir ini telah disetujui untuk diujikan di hadapan dewan penguji pada tanggal ……………….
Pembimbing Utama
Berliana Kusuma Riasti,S.T.,M.Eng NIDN. 0621038101
ii
HALAMAN PENGESAHAN
SISTEM INFORMASI PANTAUAN SISWA DIDIK BERBASIS WEB DAN MOBILE SD AL FIRDAUS SURAKARTA Disusun oleh : AGUNG NUGROHO NIM. M3113006 Dibimbing Oleh : Pembimbing Utama
Berliana Kusuma Riasti,S.T.,M.Eng NIDN. 0621038101 Tugas Akhir ini telah diterima dan disahkan oleh dewan penguji Tugas Akhir Program Diploma III Teknik Informatika pada _________ 1. Penguji 1 Berliana Kusuma Riasti,S.T.,M.Eng
(
)
(
)
(
)
NIDN. 0621038101 2. Penguji 2 Agus Purnomo, S.Si.,M.Eng NIDN. 9906002096 3. Penguji 3 Fendi Aji Purnomo, S.Si.,M.Eng NIDN. 9906008002 Disahkan Oleh : Ketua Program Studi DIII Teknik Informatika UNS
Abdul Aziz, S.Kom., M.Cs. NIP. 19810413 200501 10001
iii
HALAMAN PERNYATAAN Dengan ini saya menyatakan bahwa dalam Laporan Tugas Akhir ini tidak terdapat karya yang pernah diajukan untuk memperoleh gelar kesarjanaan disuatu Perguruan Tinggi, dan sepanjang pengetahuan saya juga tidak terdapat karya atau pendapat yang pernah ditulis atau diterbitkan oleh orang lain, kecuali yang secara tertulis diacu dalam naskah ini dan disebutkan dalam Daftar Pustaka.
Surakarta, 29 Mei 2016
AGUNG NUGROHO NIM. M3113006
iv
MOTTO “ Allah akan meninggikan orang-orang yang beriman di antaramu dan orangorang yang diberi ilmu pengetahuan beberapa derajat.” (Q.S. Al-Mujadalah Ayat 11) “if you can’t explain it simply, you don’t understand it well enough” Albert Einstein “sukses = berhasil dengan ceritanya masing-masing” Agung Nugroho
v
HALAMAN PERSEMBAHAN
Karya Tulis ini saya persembahkan untuk : 1. Bapak dan Ibu tercinta, yang selalu memberikan do’a dan dukungan. 2. Sahabat seperjuangan : Aisyah Sadiyah dan Alifa Millyana Azella. 3. Seluruh keluarga yang telah memberikan dukungan dan semangat. 4. Teman-teman D3 Teknik Informatika UNS 2013 khususnya kelas TIA. 5. Pembaca yang budiman.
vi
KATA PENGANTAR Puji syukur penulis panjatkan kehadirat Allah SWT atas limpahan karunia dan rahmat-Nya, sehinggan penulisan Laporan Tugas Akhir dengan judul “Sistem Informasi Pantauan Siswa Didik Berbasis Web dan Moblie SD AL FIRDAUS Surakarta” ini dapat terselesaikan. Dalam penyusunan Laporan Tugas Akhir ini penulis mendapatkan bantuan dan dukungan dari berbagai pihak. Oleh sebab itu pada kesempatan ini, penulis mengucapkan terima kasih kepada semua pihak yang telah memberikan bantuan dan dukungannya, terutama kepada : 1.
Abdul Aziz, S.Kom., M.Cs. selaku Ketua Program Studi Diploma III Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas Maret Surakarta.
2.
Berliana Kusuma Riasti, S.T., M.Eng. selaku Dosen Pembimbing Tugas Akhir yang telah memberikan bimbingan, pengarahan, saran serta dukungan selama penyusunan Laporan Tugas Akhir ini.
3.
Bapak dan Ibu tercinta yang selalu memberikan dukungan serta kasih sayang.
4.
Darmawan Budiarto, S.Pd., M.Si. selaku Kepala SD Al FIRDAUS Surakarta yang telah memberikan izin dan bersedia membantu dalam penyelesaian Tugas Akhir ini.
5.
Teman-teman kelas TIA angkatan 2013 yang telah memberikan dukungan.
6.
Serta semua pihak yang terkait yang telah memberikan dukungan serta saran. Semoga Tuhan Yang Maha Esa memberikan balasan yang lebih baik kepada
pihak-pihak yang telah memberikan bantuan dan dukungan dari awal Tugas Akhir (TA) sampai penyusunan Laporan Tugas Akhir ini selesai. Penulis berharap, semoga Laporan Tugas Akhir ini dapat memberikan manfaat kepada pembaca. Surakarta, 29 Mei 2016
Agung Nugroho
vii
DAFTAR ISI HALAMAN PERSETUJUAN ................................................................................ ii HALAMAN PENGESAHAN ................................................................................ iii HALAMAN PERNYATAAN ............................................................................... iv MOTTO ...................................................................................................................v HALAMAN PERSEMBAHAN ............................................................................ vi KATA PENGANTAR .......................................................................................... vii DAFTAR ISI ........................................................................................................ viii DAFTAR TABEL ................................................................................................ xiv DAFTAR GAMBAR ........................................................................................... xvi ABSTRAK .............................................................................................................xx ABSTRACT ........................................................................................................... xxi BAB I .......................................................................................................................1 PENDAHULUAN ...................................................................................................1 1.1
Latar Belakang ..........................................................................................1
1.2
Perumusan Masalah ...................................................................................1
1.3
Tujuan Penelitian .......................................................................................2
1.4
Manfaat Penelitian .....................................................................................2
1.5
Batasan Masalah ........................................................................................2
1.6
Metodologi Penelitian ...............................................................................3
1.6.1
Pengumpulan Data .............................................................................3
1.6.2
Analisa Data .......................................................................................3
1.6.3
Desain dan Perancangan ....................................................................3
1.6.4
Implementasi ......................................................................................4
1.6.5
Testing ................................................................................................4
1.7
Sistematika Penulisan ................................................................................4
BAB II ......................................................................................................................6 TINJAUAN PUSTAKA DAN LANDASAN TEORI .............................................6 2.1
Tinjauan Pustaka .......................................................................................6
2.2
Landasan Teori ..........................................................................................7
2.2.1
Sistem Informasi ................................................................................7
2.2.2
Basis Data ..........................................................................................7 viii
Entity Relationship Diagram (ERD) ..............................................8 MySQL ...........................................................................................9 2.2.3
Unified Modelling Language (UML) ...............................................10 Use Case Diagram ........................................................................11 Class Diagram ..............................................................................14 Squence Diagram .........................................................................15
2.2.4
Cascading Style Sheet (CSS) ...........................................................17
2.2.5
Hypertext Preprocessor (PHP) ........................................................18
2.2.6
Hypertext Markup Languange (HTML) ..........................................18
2.2.7
jQuery...............................................................................................18
2.2.8
Android ............................................................................................19
2.2.9
Java...................................................................................................19
BAB III ..................................................................................................................20 ANALISIS DAN PERANCANGAN SISTEM .....................................................20 3.1
Alat dan Bahan ........................................................................................20
3.1.1
Alat ...................................................................................................20 Perangkat Keras Pembuatan .........................................................20 Perangkat Lunak Pembuatan ........................................................20 Perangkat Keras Pengujian ...........................................................21
3.1.2
Bahan................................................................................................21
3.2
Jalannya Penelitian ..................................................................................21
3.3
Jadwal Penelitian .....................................................................................23
3.4
Analisa Kebutuhan Sistem ......................................................................24
3.4.1
Kebutuhan Fungsional Sistem .........................................................25
3.4.2
Kebutuhan Non Fungsional ..............................................................26 Persyaratan Kinerja ......................................................................26 Persyaratan Keselamatan ..............................................................26 Persyaratan Keamanan .................................................................26
3.5
Perancangan Sistem .................................................................................27
3.5.1
Use Case Diagram ............................................................................27
3.5.2
Use Case Scenario Diagram ............................................................28 Lihat Penilaian Karakter ...............................................................28
ix
Lihat Pantuan Sholat ....................................................................28 Input Pantauan Sholat ...................................................................29 Edit Pantauan Sholat ....................................................................29 Lihat Presensi Siswa .....................................................................30 Lihat Informasi Guru ....................................................................30 Lihat Informasi Khusus ................................................................31 Lihat Data Presensi .......................................................................31 Input Data Presensi .......................................................................32 Edit Data Presensi .....................................................................32 Rekap Presensi Siswa ...............................................................33 Cetak Rekap Presensi................................................................33 Lihat Data Penilaian Karakter...................................................34 Input Data Penilaian Karakter...................................................34 Edit Data Penilaian Karakter ....................................................35 Delete Data Penilaian Karakter.................................................36 Lihat Data Info Guru.................................................................36 Input Data Info Guru.................................................................37 Edit Data Info Guru ..................................................................37 Delete Data Info Guru...............................................................38 Cetak Info Guru ........................................................................38 Lihat Data Pantauan Sholat.......................................................39 Input Data Pantauan Sholat.......................................................39 Edit Data Pantauan sholat .........................................................40 Delete Data Pantauan Sholat.....................................................41 Lihat Data Info Khusus .............................................................41 Input Data Info Khusus .............................................................42 Edit Data Info Khusus...............................................................43 Delete Data Info Khusus ...........................................................44 3.5.3
Class Diagram .................................................................................45
3.5.4
Sequence Diagram ...........................................................................46 Lihat Penilaian Karakter ...............................................................46 Lihat Pantauan Sholat ...................................................................46
x
Input Pantauan Sholat ...................................................................47 Edit Pantauan Sholat ....................................................................47 Lihat Presensi Siswa .....................................................................48 Lihat Informasi Guru ....................................................................48 Lihat Informasi Khusus ................................................................49 Lihat Data Presensi .......................................................................49 Input Data Presensi .......................................................................50 Edit Data Presensi .....................................................................50 Rekap Data Presensi .................................................................51 Cetak Rekap Presensi................................................................51 Lihat Data Penilaian Karakter...................................................52 Input Data Penilaian..................................................................52 Edit Data Penilaian ...................................................................53 Delete Data Penilaian................................................................53 Lihat Data Info Guru.................................................................54 Input Data Info Guru.................................................................54 Edit Data Info Guru ..................................................................55 Delete Data Info Guru...............................................................55 Cetak Info Guru ........................................................................56 Lihat Data Pantauan Sholat.......................................................56 Input Data Pantuan Sholat ........................................................57 Edit Data Pantauan Sholat ........................................................57 Delete Data Pantauan Sholat.....................................................58 Lihat Data Info Khusus .............................................................58 Input Data Info Khusus .............................................................59 Edit Data Info Khusus...............................................................59 Delete Data Info Khusus ...........................................................60 3.5.5
Perancangan Basis Data ...................................................................61 Entity Relationship Diagram (ERD) ............................................61 Relasi Antar Tabel ........................................................................62 Desain Fisik ..................................................................................63 Tabel Siswa .............................................................................63
xi
Tabel Kelas .............................................................................63 Tabel Kelas Siswa ...................................................................64 Tabel Tahun Akademik ..........................................................64 Tabel Pegawai .........................................................................64 Tabel Walikelas ......................................................................64 Tabel User...............................................................................65 Tabel Presensi .........................................................................65 Tabel Penilaian Karakter ........................................................65 Tabel Detail Penilaian ...........................................................65 Tabel Karakter ......................................................................66 Tabel Nilai Karakter .............................................................66 Tabel Info Khusus .................................................................66 Tabel Info Guru.....................................................................66 Tabel Detail Info Guru ..........................................................66 Tabel My Activity ..................................................................67 Tabel Pantauan Sholat...........................................................67 3.5.6
Perancangan Desain User Interface .................................................68 User Interface Sistem Berbasis Web ............................................68 Desain Portal Login ................................................................68 Desain Halaman Siswa ...........................................................68 Desain Halaman Guru .............................................................79 User Interface Sistem Berbasis Android ......................................91
BAB IV ..................................................................................................................96 IMPLEMENTASI DAN PENGUJIAN .................................................................96 4.1
Implementasi ...........................................................................................96
4.1.1
Implementasi Sistem Berbasis Web .................................................96 Implementasi Halaman Portal Login ............................................96 Implementasi Halaman Siswa ......................................................97 Implementasi Halaman Guru ......................................................107
4.1.2 4.2
Implementasi Sistem Berbasis Android .........................................120
Pengujian Sistem ...................................................................................125
BAB V..................................................................................................................128
xii
KESIMPULAN DAN SARAN ............................................................................128 5.1
Kesimpulan ............................................................................................128
5.2
Saran ......................................................................................................128
DAFTAR PUSTAKA ..........................................................................................129
xiii
DAFTAR TABEL Tabel 2.1. Simbol-simbol dalam Entity Relationship Diagram (ERD) ...................8 Tabel 2.2. Tabel Simbol Komponen Usecase ........................................................11 Tabel 2.3. Simbol Komponen Class Diagram .......................................................15 Tabel 2.4. Tabel Simbol-Simbol pada Seqeunce Diagram ....................................16 Tabel 3.1. Jadwal Penelitian...................................................................................23 Tabel 3.2. Kebutuhan Fungsional Sistem ..............................................................25 Tabel 3.3. Use Case Scenario Lihat Penilaian Karakter ........................................28 Tabel 3.4. Use Case Scenario Lihat Pantauan Sholat ............................................28 Tabel 3.5. Use Case Scenario Input Pantauan Sholat ............................................29 Tabel 3.6. Use Case Scenario Edit Pantauan Sholat..............................................29 Tabel 3.7. Use Case Scenario Lihat Presensi Siswa ..............................................30 Tabel 3.8. Use Case Scenario Lihat Informasi Guru .............................................30 Tabel 3.9. Use Case Scenario Lihat Informasi Khusus .........................................31 Tabel 3.10. Use Case Scenario Lihat Data Presensi ..............................................31 Tabel 3.11. Use Case Scenario Input Data Presensi ..............................................32 Tabel 3.12. Use Case Scenario Edit Data Presensi ................................................32 Tabel 3.13. Use Case Scenario Rekap Presensi Siswa ..........................................33 Tabel 3.14. Use Case Scenario Cetak Rekap Presensi ..........................................33 Tabel 3.15. Use Case Scenario Lihat Data Penilaian Karakter .............................34 Tabel 3.16. Use Case Scenario Input Data Penilaian Karakter .............................34 Tabel 3.17. Use Case Scenario Edit Data Penilaian Karakter ...............................35 Tabel 3.18. Use Case Scenario Delete Data Penilaian Karakter ...........................36 Tabel 3.19. Use Case Scenario Lihat Data Info Guru ...........................................36 Tabel 3.20. Use Case Scenario Input Data Info Guru ...........................................37 Tabel 3.21. Use Case Scenario Edit Data Info Guru .............................................37 Tabel 3.22. Use Case Scenario Delete Data Info Guru .........................................38 Tabel 3.23. Use Case Scenario Cetak Info Guru ...................................................38 Tabel 3.24. Use Case Scenario Lihat Data Pantauan Sholat .................................39 Tabel 3.25. Use Case Scenario Input Data Pantauan Sholat .................................39 Tabel 3.26. Use Case Scenario Edit Data Pantauan Sholat ...................................40 Tabel 3.27. Use Case Scenario Delete Data Pantauan Sholat ...............................41 Tabel 3.28. Use Case Scenario Lihat Data Info Khusus........................................41
xiv
Tabel 3.29. Use Case Scenario Input Data Info Khusus........................................42 Tabel 3.30. Use Case Scenario Edit Data Info Khusus .........................................43 Tabel 3.31. Use Case Scenario Delete Data Info Khusus......................................44 Tabel 3.32. Desain Fisik Tabel Siswa ....................................................................63 Tabel 3.33. Desain Fisik Tabel Kelas ....................................................................63 Tabel 3.34. Desain Fisik Tabel Kelas Siswa ..........................................................64 Tabel 3.35. Desain Fisik Tabel Tahun Akademik..................................................64 Tabel 3.36. Desain Fisik Tabel Pegawai ................................................................64 Tabel 3.37. Walikelas .............................................................................................64 Tabel 3.38. Desain Fisik Tabel User ......................................................................65 Tabel 3.39. Desain Fisik Tabel Presensi ................................................................65 Tabel 3.40. Desain Fisik Tabel Penilaian Karakter................................................65 Tabel 3.41. Desain Fisik Tabel Detail Penilaian ....................................................65 Tabel 3.42. Desain Fisik Tabel Karakter ...............................................................66 Tabel 3.43. Desain Fisik Tabel Nilai Karakter ......................................................66 Tabel 3.44. Desain Fisik Tabel Info Khusus ..........................................................66 Tabel 3.45. Desain Fisik Tabel Info Guru..............................................................66 Tabel 3.46. Desain Fisik Tabel Detail Info Guru ...................................................66 Tabel 3.47 Desain Fisik Tabel My Activity ............................................................67 Tabel 3.48. Desain Fisik Tabel Pantauan Sholat....................................................67 Tabel 4.1. black box testing pada Pengujian Sistem ............................................125
xv
DAFTAR GAMBAR Gambar 3.1. Proses Jalannya Penelitian ................................................................21 Gambar 3.2. Proses Bisnis Sistem..........................................................................24 Gambar 3.3. Use Case............................................................................................27 Gambar 3.4. Class Diagram...................................................................................45 Gambar 3.5. Sequence Diagram Lihat Penilaian Karakter ....................................46 Gambar 3.6. Sequence Diagram Lihat Pantauan Sholat ........................................46 Gambar 3.7. Sequence Diagram Input Pantauan Sholat ........................................47 Gambar 3.8. Sequence Diagram Edit Pantauan Sholat ..........................................47 Gambar 3.9. Sequence Diagram Lihat Presensi Siswa ..........................................48 Gambar 3.10. Sequence Diagram Lihat Informasi Guru .......................................48 Gambar 3.11. Sequence Diagram Lihat Informasi Khusus ...................................49 Gambar 3.12. Sequence Diagram Lihat Data Presensi ..........................................49 Gambar 3.13. Sequence Diagram Input Data Presensi ..........................................50 Gambar 3.14. Sequence Diagram Edit Data Presensi ............................................50 Gambar 3.15. Sequence Diagram Rekap Data Presensi ........................................51 Gambar 3.16. Sequence Diagram Cetak rekap Presensi ........................................51 Gambar 3.17. Sequence Diagram Lihat Data Penilaian Karakter .........................52 Gambar 3.18. Sequence Diagram Input Data Penilaian ........................................52 Gambar 3.19. Sequence Diagram Edit Data Penilaian ..........................................53 Gambar 3.20. Sequence Diagram Delete Data Penilaian ......................................53 Gambar 3.21. Sequence Diagram Lihat Data Info Guru .......................................54 Gambar 3.22. Sequence Diagram Input Data Info Guru .......................................54 Gambar 3.23. Sequence Diagram Edit Data Info Guru .........................................55 Gambar 3.24. Sequence Diagram Delete Data Info Guru .....................................55 Gambar 3.25. Sequence Diagram Cetak Info Guru ...............................................56 Gambar 3.26 Sequence Diagram Lihat Data Pantauan Sholat ..............................56 Gambar 3.27. Sequence Diagram Input Data Pantauan Sholat .............................57 Gambar 3.28. Sequence Diagram Edit Data Pantauan Sholat ...............................57 Gambar 3.29. Sequence Diagram Delete Data Pantauan Sholat ...........................58 Gambar 3.30. Sequence Diagram Lihat Data Info Khusus....................................58 Gambar 3.31. Sequence Diagram Input Data Info Khusus....................................59 Gambar 3.32. Sequence Diagram Edit Data Info Khusus .....................................59 Gambar 3.33. Sequence Diagram Delete Data Info Khusus..................................60 Gambar 3.34. Entity Relationship Diagram (ERD) ...............................................61 Gambar 3.35. Relasi Antar Tabel (RAT) ...............................................................62 Gambar 3.36. Desain Portal Login .........................................................................68 Gambar 3.37. Desain Halaman Beranda ................................................................69 Gambar 3.38. Desain Halaman Penilaian Karakter Pada Hari Aktif .....................69
xvi
Gambar 3.39. Desain Halaman Penilaian Karakter Negatif ..................................70 Gambar 3.40. Desain Halaman Daftar Penilaian Karakter ....................................70 Gambar 3.41. Desain Halaman Penilaian Karakter pada Hari Lainnya .................71 Gambar 3.42. Desain Halaman Pantauan Sholat pada Hari Aktif .........................71 Gambar 3.43. Desain Halaman Pantauan Sholat Negatif ......................................72 Gambar 3.44. Desain Halaman Daftar Pantauan Sholat ........................................72 Gambar 3.45. Desain Halaman pantauan Sholat pada Hari Lainnya .....................73 Gambar 3.46. Desain Halaman Input Pantauan Sholat ..........................................73 Gambar 3.47. Desain Halaman Edit Pantauan Sholat ............................................74 Gambar 3.48 Desain Halaman Presensi Siswa ......................................................74 Gambar 3.49 Desain Halaman Informasi Guru pada Hari Aktif ...........................75 Gambar 3.50. Desain Halaman Informasi Guru Negatif........................................75 Gambar 3.51. Desain Halaman Daftar Informasi Guru .........................................76 Gambar 3.52. Desain Halaman Informasi Guru pada Hari Lainnya ......................76 Gambar 3.53. Desain Halaman Informasi Khusus pada Hari Aktif .......................77 Gambar 3.54. Desain Halaman Informasi Khusus Negatif ....................................77 Gambar 3.55. Desain Halaman Daftar Informasi Khusus......................................78 Gambar 3.56. Desain Halaman Informasi Guru pada Hari Lainnya ......................78 Gambar 3.57. Desain Halaman Beranda Guru .......................................................79 Gambar 3.58. Desain Halaman Daftar Presensi Siswa ..........................................79 Gambar 3.59. Desain Halaman Hasil Presensi Siswa ............................................80 Gambar 3.60. Desain Halaman Input Presensi Siswa ............................................80 Gambar 3.61. Desain Halaman Edit Presensi Siswa ..............................................81 Gambar 3.62. Desain Halaman Daftar Penilaian Karakter ....................................81 Gambar 3.63. Desain Halaman Data Penilaian Karakter .......................................82 Gambar 3.64. Desain Halaman Hasil Penilaian Karakter ......................................82 Gambar 3.65. Desain Halaman Input Penilaian Karakter ......................................83 Gambar 3.66 Desain Halaman Edit Penilaian Karakter .........................................83 Gambar 3.67. Desain Halaman Hapus Penilaian Karakter ....................................84 Gambar 3.68 Desain Halaman Daftar Informasi Guru ..........................................84 Gambar 3.69. Desain Halaman Informasi Guru.....................................................85 Gambar 3.70. Desain Halaman Input Informasi Guru ...........................................85 Gambar 3.71. Desain Halaman Edit Informasi Guru .............................................86 Gambar 3.72. Desain Halaman Daftar Pantauan Sholat ........................................86 Gambar 3.73. Desain Halaman Data Pantauan Sholat ...........................................87 Gambar 3.74. Desain Halaman Hasil Pantauan Sholat ..........................................87 Gambar 3.75. Desain Halaman Input Pantaua Sholat ............................................88 Gambar 3.76. Desain Halaman Edit Pantauan Sholat ............................................88 Gambar 3.77. Desain Halaman Daftar Informasi Khusus......................................89 Gambar 3.78. Desain Halaman Data Informasi Khusus ........................................89
xvii
Gambar 3.79. Desain Halaman Hasil Informasi Khusus .......................................90 Gambar 3.80. Desain Halaman Input Informasi Khusus .......................................90 Gambar 3.81. Desain Halaman Edit Informasi Khusus .........................................91 Gambar 3.82. Desain Halaman Login Android .....................................................91 Gambar 3.83. Desain Halaman Beranda Android ..................................................92 Gambar 3.84. Desain Halaman Presensi Siswa Android .......................................92 Gambar 3.85. Desain Halaman Penilaian Karakter Android .................................93 Gambar 3.86. Desain Halaman Informasi Guru Android ......................................93 Gambar 3.87. Desain Halaman Informasi Khusus Android ..................................94 Gambar 3.88. Desain Halaman Pantuan Sholat Android .......................................94 Gambar 3.89. Desain Halaman Input Pantauan Sholat Android ............................95 Gambar 3.90. Desain Halaman Edit Pantaun Sholat Android ...............................95 Gambar 4.1. Implementasi Halaman Portal Login.................................................96 Gambar 4.2. Implementasi Halaman Beranda Siswa .............................................97 Gambar 4.3. Implementasi Halaman Penilaian Karakter Pada Hari Aktif ............98 Gambar 4.4. Implementasi Halaman Penilaian Karakter Negatif ..........................98 Gambar 4.5. Implementasi Halaman Daftar Penilaian Karakter............................99 Gambar 4.6. Implementasi Halaman Penilaian Karakter pada Hari Lainnya ........99 Gambar 4.7. Implementasi Halaman Pantauan Sholat pada Hari Aktif ...............100 Gambar 4.8. Implementasi Halaman Pantauan Sholat Negatif ............................100 Gambar 4.9. Implementasi Halaman Daftar Pantauan Sholat..............................101 Gambar 4.10. Implementasi Halaman Pantauan Sholat pada Hari Lainnya ........101 Gambar 4.11. Implementasi Halaman Input Pantauan Sholat .............................102 Gambar 4.12. Implementasi Halaman Edit Pantauan Sholat ...............................102 Gambar 4.13. Implementasi Halaman Presensi Siswa .........................................103 Gambar 4.14. Implementasi Halaman Informasi Guru pada Hari Aktif ..............103 Gambar 4.15. Implementasi Halaman Informasi Guru Negatif ...........................104 Gambar 4.16. Implementasi Halaman Daftar Informasi Guru .............................104 Gambar 4.17. Implementasi Halaman Informasi Guru pada Hari Lainnya .........105 Gambar 4.18. Implementasi Halaman Informasi Khusus pada Hari Aktif ..........105 Gambar 4.19. Implementasi Halaman Informasi Khusus Negatif .......................106 Gambar 4.20. Implementasi Halaman Daftar Informasi Khusus .........................106 Gambar 4.21. Implementasi Halaman Informasi Guru pada Hari Lainnya .........107 Gambar 4.22. Implementasi Halaman Beranda Guru ..........................................107 Gambar 4.23. Implementasi Halaman Daftar Presensi Siswa..............................108 Gambar 4.24. Implementasi Halaman Hasil Presensi Siswa ...............................108 Gambar 4.25. Implementasi Halaman Input Presensi Siswa ...............................109 Gambar 4.26. Implementasi Halaman Edit Presensi Siswa .................................109 Gambar 4.27. Implementasi Halaman Daftar Penilaian Karakter........................110 Gambar 4.28. Implementasi Halaman Data Penilaian Karakter ..........................110
xviii
Gambar 4.29. Implementasi Halaman Hasil Penilaian Karakter .........................111 Gambar 4.30. Implementasi Halaman Input Penilaian Karakter .........................111 Gambar 4.31. Implementasi Halaman Edit Penilaian Karakter ...........................112 Gambar 4.32. Implementasi Halaman Hapus Penilaian Karakter........................112 Gambar 4.33. Implementasi Halaman Daftar Info Guru......................................113 Gambar 4.34. Implementasi Halaman Informasi Guru ........................................113 Gambar 4.35. Implementasi Halaman Input Informasi Guru ..............................114 Gambar 4.36. Implementasi Halaman Edit Informasi Guru ................................114 Gambar 4.37. Implementasi Halaman Daftar Pantauan Sholat............................115 Gambar 4.38. Implementasi Halaman Data Pantauan Sholat ..............................115 Gambar 4.39. Implementasi Halaman Hasil Pantauan Sholat .............................116 Gambar 4.40. Implementasi Halaman Input Pantauan Sholat .............................116 Gambar 4.41. Implementasi Halaman Edit Pantauan Sholat ...............................117 Gambar 4.42. Implementasi Halaman Daftar Informasi Khusus .........................117 Gambar 4.43. Implementasi Halaman Data Informasi Khusus............................118 Gambar 4.44. Implementasi Halaman Hasil Informasi khusus............................118 Gambar 4.45. Implementasi Halaman Input Informasi Khusus ...........................119 Gambar 4.46. Implementasi Halaman Edit Informasi Khusus ............................119 Gambar 4.47. Halaman Login ..............................................................................120 Gambar 4.48 Halaman Beranda ...........................................................................120 Gambar 4.49. Presensi Siswa ...............................................................................121 Gambar 4.50. Penilaian Karakter .........................................................................121 Gambar 4.51. Informasi Guru ..............................................................................122 Gambar 4.52. Informasi Khusus ..........................................................................122 Gambar 4.53. Pantauan Sholat .............................................................................123 Gambar 4.54. Input Pantauan Sholat....................................................................123 Gambar 4.55. Edit Pantauan Sholat .....................................................................124
xix
ABSTRAK Agung Nugroho. 2016. Sistem Informasi Pantauan Siswa Didik Berbasis Web dan Mobile SD Al Firdaus Surakarta. Pantauan atau monitoring adalah kegiatan pengumpulan data atau informasi untuk memantau perubahan yang terjadi. Pemantauan dapat dilakukan untuk berbagai macam hal, salah satunya pemantauan kegiatan siswa didik di sekolah. Sekolah Dasar Al Firdaus merupakan sekolah dasar swasta bertaraf nasional yang memiliki banyak siswa. Setiap kegiatan siswa yang ada di sekolah akan disampaikan kepada orang tua untuk membantu orang tua dalam memantau perkembangan anaknya. Bagi orang tua siswa, diperlukan informasi yang cepat dan tepat terhadap pantauan anaknya di sekolah dengan menggunakan media informasi yang berkembang di zaman ini. Sistem Informasi Pantauan Siswa Didik ini dikembangkan untuk memenuhi kebutuhan informasi terhadap pantauan kegiatan anak di sekolah. Sistem Informasi ini dikembangkan dengan metode observasi, pengumpulan data, analisa data, desain dan perancangan, implementasi, hingga testing. Sistem Informasi dibuat dengan bahasa pemrograman HTML, CSS, dan Java Script untuk tampilannya, dan bahasa pemrograman PHP serta framework CodeIgniter untuk pemrograman webnya, sedangkan database yang digunakan adalah MySQL. Sistem Informasi ini juga dikembangkan dengan sistem mobile untuk memudahkan orang tua dalam mengakses informasi dengan smartphone android. Sistem Informasi berbasis mobile ini dibuat dengan bahasa pemrograman java untuk platform android. Kata Kunci : Sistem Informasi, Pantauan Siswa, mobile app, SD Al Firdaus Surakarta, HTML, PHP, CodeIgniter, Android, Java
xx
ABSTRACT Agung Nugroho. 2016. Web-Based Students Monitoring System and Mobile Elementary School Al Firdaus Surakarta. The observation or monitoring are gathering activity data or information to monitor changes. Monitoring can be done for various reasons, one of which monitoring activities of students in the school. Al Firdaus Elementary School is a private elementary school that had many students. Every activity of students in the school will be send by information to parents to assist parents in monitoring children. Parents need information fast through the media information developed in this era. Students Monitoring Information System was developed to give more information about monitoring activities of children in school. This information system developed by the method of observation, data collection, data analysis, design, implementation, to testing. Information systems created with PHP, HTML, CSS, Java, and Java Script programming languages, while the database used is MySQL database. This information system also developed a mobile system to enable parents to access information with android smartphone. This mobile-based information system created by the Java programming language for the android platform. Keywords: Information Systems, Monitoring Students, mobile app, SD Al Firdaus Surakarta, HTML, PHP, CodeIgniter, Android, Java
xxi
