1 PERANCANGAN SISTEM AKADEMIK SEKOLAH BERBASIS TEKNOLOGI MOBILE WEB (STUDI KASUS : SMA MUHAMMADIYAH 3 TANGERANG) Oleh : NENDY SUBHANSYAH PROGRAM STUDI...
PERANCANGAN SISTEM AKADEMIK SEKOLAH BERBASIS TEKNOLOGI MOBILE WEB (STUDI KASUS : SMA MUHAMMADIYAH 3 TANGERANG)
Oleh : NENDY SUBHANSYAH 106091002885
PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA 2011 M / 1432 H
PERANCANGAN SISTEM AKADEMIK SEKOLAH BERBASIS TEKNOLOGI MOBILE WEB (STUDI KASUS : SMA MUHAMMADIYAH 3 TANGERANG)
Skripsi Sebagai Salah Satu Syarat Untuk Memperoleh Gelar Sarjana Komputer
Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta
Oleh : NENDY SUBHANSYAH 106091002885
PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA 2011 M / 1432 H
ii
PERANCANGAN SISTEM AKADEMIK SEKOLAH BERBASIS TEKNOLOGI MOBILE WEB (STUDI KASUS : SMA MUHAMMADIYAH 3 TANGERANG)
Skripsi Sebagai Salah Satu Syarat Untuk Memperoleh Gelar Sarjana Komputer Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta
Oleh : NENDY SUBHANSYAH 106091002885
Menyetujui, Pembimbing I
Pembimbing II
Herlino Nanang, M.T
Andrew Fiade, M.Kom
NIP. 19731209 200501 1 002
NIP. 19820811 200912 1 604 Mengetahui,
Ketua Program Studi Teknik Informatika,
Yusuf Durachman, M.Sc, MIT NIP. 19710522 200604 1 002
iii
PENGESAHAN UJIAN
Skripsi yang berjudul ”Perancangan Sistem Akademik Sekolah Berbasis Teknologi Mobile Web (Studi Kasus : SMA Muhammadiyah 3 Tangerang)” telah diuji dan dinyatakan lulus dalam sidang Munaqosyah Fakultas Sains dan Teknologi, Universitas Islam Negeri Syarif Hidayatullah Jakarta pada hari Selasa, 25 Januari 2011. Skripsi ini telah diterima sebagai salah satu syarat untuk memperoleh gelar Sarjana (S1) Program Studi Teknik Informatika. Jakarta, Januari 2011 Menyetujui, Penguji I
Penguji II
Yusuf Durachman, M.Sc, MIT
Fitri Mintarsih, M.Kom
NIP. 19710522 200604 1 002
NIP. 19721223 200720 2 004
Pembimbing I
Pembimbing II
Herlino Nanang, M.T
Andrew Fiade, M.Kom
NIP. 19731209 200501 1 002
NIP. 19820811 200912 1 604
Mengetahui, Dekan Fakultas Sains dan Teknologi
Ketua Program Studi Teknik Informatika
Dr. Syopiansyah Jaya Putra, M.Sis
Yusuf Durachman, M.Sc, MIT
NIP. 19680117 200112 1 001
NIP. 19710522 200604 1 002
iv
PERNYATAAN
DENGAN INI SAYA MENYATAKAN BAHWA SKRIPSI INI BENARBENAR HASIL KARYA SENDIRI YANG BELUM PERNAH DIAJUKAN SEBAGAI SKRIPSI ATAU KARYA ILMIAH PADA PERGURUAN TINGGI ATAU LEMBAGA MANAPUN.
Jakarta,
Januari 2011
Nendy Subhansyah 106091002885
v
ABSTRAK
Nendy Subhansyah (106091002885), Perancangan Sistem Akademik Sekolah
Berbasis
Teknologi
Mobile
Web
(Studi
Kasus
:
SMA
Muhammadiyah 3 Tangerang) (di bawah bimbingan Herlino Nanang, MT dan Andrew Fiade, M. Kom).
Sekolah merupakan organisasi yang di dalamnya terdapat kegiatan akademik. Dalam hal menjalankan kegiatan akademik, SMA Muhammadiyah 3 Tangerang masih bersifat sederhana. Oleh karena itu dibutuhkan sistem untuk mengatasi permasalahan tersebut, salah satunya dengan sistem berbasis web. Pengelolaan sistem akademik berbasis web pada sekolah-sekolah masih perlu dimaksimalkan, yaitu dengan menggunakan layanan mobile web, agar informasi akademik dapat diterima dengan mudah dan cepat. Oleh karena itu, permasalahan yang akan dibahas dalam penelitian ini adalah bagaimana merancang sistem akademik SMA Muhammadiyah 3 Tangerang berbasis mobile web pada user dan web pada admin sekolah.. Perancangan sistem ini menggunakan bahasa xHTML MP, PHP, jQuery, dan MySQL. Metodologi pengembangan sistem yang dipakai adalah incremental. Hasil penelitian berupa sistem akademik sekolah berbasis mobile web sehingga siswa, guru, wali siswa, pegawai, dan tamu dapat dengan mudah mengaksesnya melalui handphone.
Kata kunci : sistem akademik sekolah, mobile web, incremental, xHTML MP. V Bab + xx halaman + 138 Halaman + 124 Gambar + 20 Tabel + Daftar Pustaka + 5 Lampiran Daftar Pustaka : 12 Buku + 6 Referensi Internet (2002 – 2010)
vi
KATA PENGANTAR
Puji syukur penulis panjatkan kehadirat Allah SWT, karena atas limpahan rahmat, taufik serta karunia-Nya, penulis dapat menyelesaikan penulisan Skripsi ini yang berjudul “Perancangan Sistem Akademik Sekolah Berbasis Teknologi Mobile Web (Studi Kasus : SMA Muhammadiyah 3 Tangerang)”. Skripsi ini merupakan salah satu syarat yang harus ditempuh oleh seluruh mahasiswa Jurusan Teknik Informatika untuk mencapai gelar Sarjana Komputer pada Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta.
Selama dalam proses pembuatan skripsi ini, penulis banyak mendapat bimbingan dan bantuan dari berbagai pihak. Oleh karenanya perkenankanlah penulis mengucapkan terima kasih kepada pihak – pihak yang telah membantu penulis, diantaranya adalah : 1. Bapak Dr. Syopiansyah Jaya Putra, M.Sis, selaku Dekan Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta. 2. Bapak Yusuf Durachman, M.Sc, MIT, selaku Ketua Program Studi Teknik Informatika Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta. 3. Bapak Herlino Nanang, MT, selaku Dosen Pembimbing I dan Bapak Andrew Fiade, M. Kom selaku Dosen Pembimbing II yang telah memberikan bimbingan dan arahan dalam menyusun skripsi ini.
vii
4. Pihak-pihak dari SMA Muhammadiyah 3 Tangerang selaku tempat riset yang telah memberikan data-data yang penulis butuhkan dalam menyelesaikan penyusunan skripsi, seperti Bapak Abd. Rohim S.Ag, M.Pd selaku Kepala Sekolah, Ibu Dewi Sri Rahayu, S.Si selaku PKS Bidang Kurikulum, serta para staf TU dan guru-guru di sana. 5. Keluarga tercinta, Ayahanda Moh. Soleh Lubis, S.IP, Ibunda Neneng Hanafiah, dan adik – adik tercinta, Nuri Shabania, Nia Septiani Amalia, dan si kecil Natasha Isramitha, atas doa dan dukungan dalam penulisan skripsi ini. 6. Teman - teman kelas TI-B angkatan 2006 yang telah memberikan motivasi untuk dapat menyusun dan menyelesaikan skripsi ini. 7. Serta semua pihak yang tidak bisa disebutkan satu persatu yang telah membantu dalam penyusunan skripsi ini.
Penulis menyadari bahwa masih terdapat banyak kekurangan dalam penyusunan skripsi ini, sehingga saran dan kritik yang ditujukan untuk kemajuan skripsi ini sangat penulis hargai untuk kelanjutan di masa yang akan datang. Penulis berharap agar skripsi ini dapat bermanfaat bagi diri sendiri, dan bagi orang banyak. Amin. Tangerang, Juli 2010
BAB I. PENDAHULUAN 1.1 Latar Belakang ………....…………………………………
1
1.2 Rumusan Masalah ...………………………………………
3
1.3 Batasan Masalah ...………………………………………..
4
1.4 Tujuan dan Manfaat Penelitian …………………………....
4
1.4.1 Tujuan Penelitian …………………………………...
4
1.4.2 Manfaat Penelitian …………………………………
5
1.5 Metodologi Penelitian ………….…………………………
6
1.5.1 Metode Pengumpulan Data …...…………………..
ix
6
1.5.2 Metode Pengembangan Sistem ……...…..………. 1.6 Sistematika Penulisan ……………………….……………
7 8
BAB II. LANDASAN TEORI 2.1 Konsep Perancangan Sistem Akademik Berbasis Mobile Web
9
2.1.1 Definisi Perancangan Sistem ………………………
9
2.1.2 Perancangan Sistem Akademik Berbasis Mobile Web
9
Konsep Sistem Akademik Sekolah …………..…………..
10
2.2.1 Definisi Sistem ……………………………………
10
2.2.2 Definisi Akademik ….…………………………….
10
2.2.3 Definisi Sistem Akademik Sekolah ………..……..
11
Konsep Jaringan Internet …………………………………
11
2.3.1 Definisi Jaringan …………….…….……………...
11
2.3.2 Model Jaringan …………………………………...
12
2.3.3 Protokol Jaringan …………………………………
13
2.3.4 Konsep Internet …………………………………..
14
Konsep Mobile Web …………………………..…………
15
2.4.1 Definisi Web …………………………………..…
15
2.4.2 Definisi Mobile Web ………………..……………
16
2.4.3 Teknologi WAP …………… ……………………
17
2.4.4 Pemrograman Mobile Web/WAP 2.0 ……………
20
2.5 Konsep Database ….…………………………………….
23
2.5.1 Definisi Data……………………………………..
23
2.2
2.3
2.4
x
2.6
2.7
2.8
2.5.2 Definisi Database ………………………………..
23
2.5.3 Komponen Database …………………………….
24
2.5.4 Alat Perancangan Sistem ………………………...
25
Metodologi Pengembangan Sistem ……………………..
27
2.6.1 Definisi Metodologi Pengembangan Sistem …….
27
2.6.2 Metodologi Pengembangan Incremental ………..
28
Software dan Bahasa Pemrograman Mobile Web……….
29
2.7.1 xHTML MP ……………………………………..
29
2.7.2 PHP ……………………………………………...
29
2.7.3 jQuery …………………………………………...
30
2.7.4 MySQL ………………………………………….
31
2.7.5 XAMPP dan phpMyAdmin ……………………..
32
2.7.6 Macromedia Dreamweaver MX ………………..
33
2.7.7 Opera Mobile for Windows …………………….
33
Studi Sejenis ……………………………………………
34
BAB III. METODOLOGI PENELITIAN 3.1
Metode Pengumpulan Data …………………………….
47
3.2
Metode Pengembangan Sistem ………………………...
49
BAB IV. PEMBAHASAN 4.1
Communication (Komunikasi) ………………………....
52
4.2
Planning (Perencanaan) ……………………………......
53
xi
4.3
4.4
4.5
Modeling (Analysis and Design) ………………..……
54
4.3.1 Analisis Sistem …………………...…………..
54
4.3.1.1 Gambaran Umum Sekolah ………………
54
4.3.1.2 Analisis Kebutuhan Sistem ……………...
56
4.3.2 Desain Sistem …………….…………………..
64
4.3.2.1 Desain Arsitektur ………………………..
64
4.3.2.2 Desain Basis Data ……………………….
79
4.3.2.3 Desain Antarmuka ………………………
89
4.3.2.4 Desain Prosedural ……………………….
99
Construction (Code and Test) ………………………..
111
4.4.1 Pengkodean …………………………………...
111
4.4.2 Pengujian ……………………………………..
122
4.4.2.1 Hosting Sistem ………………………….
122
4.4.2.2 Pengujian Mandiri ………………………
131
4.4.2.3 Pengujian Lapangan …………………….
136
Deployment (Delivery and Feedback) ……………….
136
BAB V. PENUTUP 5.1 Kesimpulan ……………………………………………
137
5.2 Saran …………………………………………………..
138
DAFTAR PUSTAKA LAMPIRAN
xii
DAFTAR GAMBAR
Halaman Gambar 2.1 Model Jaringan Peer to Peer dan Client Server…
12
Gambar 2.2 Layer Protokol OSI dan TCP/IP ……………….
13
Gambar 2.3 Arsitektur Jaringan Internet …………………….
14
Gambar 2.4 Model Cara Kerja WAP 1.0 ……………………
18
Gambar 2.5 Model Cara Kerja WAP 2.0 ……………………
20
Gambar 2.6 Tampilan Awal Opera Mobile for Windows ……
34
Gambar 3.1 Model Incremental ……………………………..
50
Gambar 4.1 Struktur Organisasi SMA Muga Tangerang ……
56
Gambar 4.2 Flow Chart Sistem Akademik yang Berjalan ….
58
Gambar 4.3 Flow Chart Sistem Akademik yang diusulkan …
62
Gambar 4.4 Cara Kerja Sistem Akademik yang diusulkan …..
63
Gambar 4.5 Diagram Konteks yang diusulkan …….………..
64
Gambar 4.6 DFD Level 0 yang diusulkan …………………..
65
Gambar 4.7 DFD Level 1 Proses 1.0 ………………………..
66
Gambar 4.8 DFD Level 1 Proses 2.0 ………………………..
67
Gambar 4.9 DFD Level 1 Proses 3.0 ………………………..
67
Gambar 4.10 DFD Level 1 Proses 4.0 ………………………..
68
Gambar 4.11 DFD Level 1 Proses 5.0 ………………………..
68
Gambar 4.12 DFD Level 1 Proses 6.0 ………………………..
69
Gambar 4.13 ERD Sistem Akademik Sekolah ……………….
79
xiii
Gambar 4.14 LRS Sistem Akademik Sekolah ……………….
80
Gambar 4.15 Bentuk Normal Pertama Sistem Akademik Sekolah
82
Gambar 4.16 Bentuk Normal Kedua Sistem Akademik Sekolah
83
Gambar 4.17 Struktur Menu Mobile Web …………………….
89
Gambar 4.18 Struktur Menu Web …………………………….
90
Gambar 4.19 Halaman Beranda ………………………………
91
Gambar 4.20 Halaman Cari Berita ……………………………
91
Gambar 4.21 Halaman Detail Berita …………………………
91
Gambar 4.22 Halaman Profil Sekolah ……………….………
91
Gambar 4.23 Halaman Visi & Misi ……………………….....
92
Gambar 4.24 Halaman Fasilitas ……………………………..
92
Gambar 4.25 Halaman Ekstrakurikuler ……………………..
92
Gambar 4.26 Halaman Prestasi Sekolah ……………………..
92
Gambar 4.27 Halaman Login Siswa …………………………
93
Gambar 4.28 Halaman Login Guru ………………………….
93
Gambar 4.29 Halaman Login Wali Siswa ……………………
93
Gambar 4.30 Halaman Login Pegawai ………………………
93
Gambar 4.31 Halaman Kotak Saran Wali Siswa ……………
94
Gambar 4.32 Halaman Album Foto …………………………
94
Gambar 4.33 Halaman Galeri Foto ………………………….
94
Gambar 4.34 Halaman Kontak ………………………………
94
Gambar 4.35 Desain Halaman Login Admin ………………..
95
Gambar 4.36 Desain Halaman Beranda Admin ……………..
95
xiv
Gambar 4.37 Desain Halaman Daftar Admin ……………….
95
Gambar 4.38 Desain Halaman Daftar Siswa …………………
96
Gambar 4.39 Desain Halaman Daftar Nilai Siswa …………...
96
Gambar 4.40 Desain Halaman Daftar Absensi Siswa ………..
96
Gambar 4.41 Desain Halaman Daftar Jadwal Pelajaran ……..
97
Gambar 4.42 Desain Halaman Daftar Guru …………………
97
Gambar 4.43 Desain Halaman Daftar Wali Siswa …………..
97
Gambar 4.44 Desain Halaman Daftar Pegawai ……………..
98
Gambar 4.45 Desain Halaman Daftar Berita Sekolah ……....
98
Gambar 4.46 Desain Halaman Daftar Prestasi Sekolah ……...
98
Gambar 4.47 Desain Halaman Daftar Ekstrakurikuler ………
99
Gambar 4.48 Desain Halaman Album Galeri Foto …………..
99
Gambar 4.49 STD Halaman Beranda ………………………..
100
Gambar 4.50 STD Halaman Detail Berita Sekolah ………….
100
Gambar 4.51 STD Halaman Cari Berita Sekolah ……………
100
Gambar 4.52 STD Halaman Profil Sekolah………………….
101
Gambar 4.53 STD Halaman Login Siswa …………………...
101
Gambar 4.54 STD Halaman Biodata Siswa …………………
101
Gambar 4.55 STD Halaman Nilai Siswa ……………..…….
102
Gambar 4.56 STD Halaman Absensi Siswa ………………..
102
Gambar 4.57 STD Halaman Jadwal Pelajaran Siswa ………
102
Gambar 4.58 STD Halaman Login Guru …………..………
103
Gambar 4.59 STD Halaman Biodata Guru …………………
103
xv
Gambar 4.60 STD Halaman Data Kelas ……………………
103
Gambar 4.61 STD Halaman Absensi Guru …….…………..
104
Gambar 4.62 STD Halaman Jadwal Pelajaran Guru …...…..
104
Gambar 4.63 STD Halaman Login Wali Siswa ………….…
104
Gambar 4.64 STD Halaman Data Wali Siswa ……………..
105
Gambar 4.65 STD Halaman Data Siswa Pada Wali ……... ..
105
Gambar 4.66 STD Halaman Data Nilai Siswa Pada Wali …
105
Gambar 4.67 STD Halaman Info Akademik Pada Wali …..
106
Gambar 4.68 STD Halaman Kotak Saran Wali Siswa ……..
106
Gambar 4.69 STD Halaman Login Pegawai ……………….
106
Gambar 4.70 STD Halaman Biodata Pegawai ……………..
107
Gambar 4.71 STD Halaman Absensi Pegawai ……………..
107
Gambar 4.72 STD Halaman Balas Saran Wali Siswa ………
107
Gambar 4.73 STD Halaman Login Admin …………………
108
Gambar 4.74 STD Halaman Beranda Admin ……………
108
Gambar 4.75 STD Halaman Daftar Admin ………………
108
Gambar 4.76 STD Halaman Daftar Siswa ……………….
109
Gambar 4.77 STD Halaman Daftar Guru ………………..
109
Gambar 4.78 STD Halaman Daftar Wali Siswa …………
109
Gambar 4.79 STD Halaman Daftar Pegawai …………….
110
Gambar 4.80 STD Halaman Daftar Berita Sekolah ………
110
Gambar 4.81 STD Halaman Daftar Prestasi Sekolah …….
110
Gambar 4.82 STD Halaman Daftar Kontak ………….…..
111
xvi
Gambar 4.83 Tampilan Koding Halaman Beranda ………
112
Gambar 4.84 Tampilan Koding Halaman Login Siswa ….
113
Gambar 4.85 Tampilan Koding Halaman Biodata Siswa ..
114
Gambar 4.86 Tampilan Koding Halaman Nilai Siswa ……
115
Gambar 4.87 Tampilan Koding Halaman Absensi Siswa …
116
Gambar 4.88 Tampilan Koding Halaman Jadwal Pelajaran ..
117
Gambar 4.89 Tampilan Koding Halaman Login Admin …
118
Gambar 4.90 Tampilan Koding Halaman Daftar Admin …
119
Gambar 4.91 Tampilan Koding Halaman Daftar Siswa …..
120
Gambar 4.92 Tampilan Koding Halaman Daftar Nilai Siswa
121
Gambar 4.93 Tampilan Awal Situs Nama Domain ………..
122
Gambar 4.94 Tampilan Login Situs Nama Domain ……….
123
Gambar 4.95 Tampilan Pendaftaran Situs Nama Domain …
123
Gambar 4.96 Tampilan Pemberitahuan Pembuatan Akun …
124
Gambar 4.97 Tampilan Setting Nama Domain …………….
124
Gambar 4.98 Tampilan Awal Situs Web Hosting ……..…..
125
Gambar 4.99 Tampilan Pendaftaran Web Hosting ………..
125
Gambar 4.100 Tampilan Pemberitahuan Akun Web Hosting
126
Gambar 4.101 Tampilan Pemberian Data Hosting di Email
126
Gambar 4.102 Tampilan Control Panel Web Hosting ………
127
Gambar 4.103 Tampilan File Manager Web Hosting ………
127
Gambar 4.104 Tampilan Subdirektori File Manager ……….
128
Gambar 4.105 Tampilan Halaman Awal Software FTP ……
129
xvii
Gambar 4.106 Tampilan Halaman Direktori File ………….
129
Gambar 4.107 Tampilan Halaman Direktori File 2 ……….
130
Gambar 4.108 Tampilan Halaman Direktori File Web Hosting
130
Gambar 4.109 Pengujian Halaman Beranda, Profil Sekolah dan Login Siswa ………………………….....
132
Gambar 4.110 Pengujian Halaman Biodata Siswa, Nilai Siswa, dan Absensi Siswa ………………………….
132
Gambar 4.111 Pengujian Halaman Jadwal Pelajaran Siswa, Info Akademik, dan Login Guru …………………
132
Gambar 4.112 Tampilan Awal Situs mobiReady ………….
133
Gambar 4.113 Tampilan Hasil Pengujian Mobile Web ..….
134
Gambar 4.114 Pengujian Halaman Beranda ………………
134
Gambar 4.115 Pengujian Halaman Jadwal Pelajaran ……..
135
Gambar 4.116 Pengujian Halaman Login Wali Siswa ……
135
Gambar 4.117 Pengujian Halaman Album Galeri Foto …..
135
xviii
DAFTAR TABEL
Halaman Tabel 2.1 Simbol Data Flow Diagram (DFD) ……………...
25
Tabel 2.2 Simbol Entity Relationship Diagram (ERD) ……..
26
Tabel 2.3 Simbol Flow Chart ……………………………….
27
Tabel 2.4 Daftar Studi Sejenis yang Dipakai ………………..
42
Tabel 3.1 Kelebihan dan Kekurangan Metode Incremental ...
49
Tabel 4.1 Bentuk Tidak Normal Sistem Akademik Sekolah ..
81
Tabel 4.2 Tabel Siswa ……………………………………….
84
Tabel 4.3 Tabel Guru …………………………………….….
84
Tabel 4.4 Tabel Pegawai …………………………………….
85
Tabel 4.5 Tabel Wali Siswa …………………………………
85
Tabel 4.6 Tabel Nilai Siswa ………...………………………
85
Tabel 4.7 Tabel Absensi Siswa …………………………….
86
Tabel 4.8 Tabel Absensi Guru ……………………………..
86
Tabel 4.9 Tabel Absensi Pegawai …………………...…….
87
Tabel 4.10 Tabel Jadwal Pelajaran ………………………….
87
Tabel 4.11 Tabel Data Kelas ……………….……………….
87
Tabel 4.12 Tabel Tamu ………………..…………...……….
87
Tabel 4.13 Tabel Kontak ……………………………..…….
88
Tabel 4.14 Tabel Album Foto ……………...……………….
88
Tabel 4.15 Tabel Galeri Foto ……………………....……….
88
xix
DAFTAR LAMPIRAN
Halaman Lampiran A Surat Penelitian .…………………………..……
A-1
Lampiran B Wawancara …………………………………….
B-1
Lampiran C Pengujian Lapangan ………..………………….
C-1
Lampiran D Tampilan Sistem ……………………………….
D-1
Lampiran E Source Code Program ………………………….
E-1
xx
BAB I PENDAHULUAN
1.1 Latar Belakang Pembangunan dunia pendidikan yang mengalami perkembangan seiring dengan laju perkembangan teknologi informasi yang sangat pesat, memerlukan peningkatan mutu di bidang pendidikan sehingga SDM yang diciptakan dapat berpartisipasi dalam membangun dunia pendidikan. Pengelolaan sistem akademik berbasis web yang telah ada pada sekolah-sekolah negeri maupun swasta masih perlu dimaksimalkan, salah satunya pengelolaan sistem akademik yang bisa diakses melalui mobile phone. Dengan banyaknya telepon selular di Indonesia, maka bukan mustahil penggunaan sistem akademik yang menggunakan mobile phone akan lebih banyak dari pada sistem akademik yang berbasis web.
Penggunaan sistem akademik yang menggunakan mobile phone antara lain memanfaatkan teknologi WAP, dan yang baru sekarang ini adalah teknologi mobile web. Teknologi mobile web/WAP 2.0 merupakan sebuah metode untuk menghadirkan halaman web di dalam layar mobile phone. Dengan adanya teknologi ini, informasi dari sistem akademik mengenai data siswa, guru, pegawai, profil sekolah, dan lainnya tidak terbatas pada web yang ditampilkan di internet saja, melainkan siswa
1
2
dapat mengaksesnya melalui handphone-nya sendiri, tanpa harus browsing web di internet. Dengan adanya dukungan GPRS pada mobile phone, maka pemanfaatan sistem akademik berbasis mobile web ini akan dapat terlaksana dengan baik.
SMA Muhammadiyah 3 Tangerang merupakan SMA swasta yang berorientasi ke depan dalam membangun bangsa. SMA Muhammadiyah 3 Tangerang termasuk SMA yang terbilang baru, namun telah menyandang akreditasi yang sangat baik yaitu akreditasi A dan pada tahun 2009 siswa-siswinya 100% lulus Ujian Nasional. Dalam hal menyajikan sistem akademiknya dan
memonitoring
kegiatan
siswa, SMA
Muhammadiyah 3 Tangerang masih bersifat sederhana dan belum terdapat sistem akademik yang berbasis web atau mobile web. Sistem
yang
digunakan pun belum bisa langsung sampai pada wali siswa, sehingga wali siswa masih kesulitan memantau kegiatan akademik anaknya di sekolah. Dengan adanya sistem akademik berbasis teknologi mobile web di SMA Muhammadiyah 3 Tangerang, diharapkan siswa dan guru dapat memberikan dan mendapatkan informasi mengenai sekolah serta wali siswa dapat mengetahui perkembangan anaknya di sekolah melalui mobile phone mereka.
Berdasarkan pada penjelasan di atas, maka penulis berkeinginan membuat solusi yang dapat membantu kinerja sekolah tersebut. Penulis
3
memilih SMA Muhammadiyah 3 Tangerang sebagai tempat riset karena dahulu penulis sekolah pada SMA tersebut dan berharap dapat memajukan sekolah tersebut. Solusi yang dipakai penulis adalah dengan merancang sistem akademik berbasis mobile web dengan menggunakan bahasa pemrograman xHTML MP (Extensible HTML Mobile Profile), PHP, jQuery, database MySQL, editor Macromedia Dreamweaver MX 2004, serta micro browser simulator Opera Mobile for Windows. Atas dasar itulah, maka penulis mencoba menyusun skripsi ini dengan judul “Perancangan Sistem Akademik Sekolah Berbasis Teknologi Mobile Web (Studi Kasus : SMA Muhammadiyah 3 Tangerang)”.
1.2
Rumusan Masalah Berdasarkan latar belakang di atas, maka dapat dirumuskan
permasalahan yang akan dibahas dalam penelitian ini adalah : 1. Bagaimana merancang sistem akademik SMA Muhammadiyah 3 Tangerang yang masih sederhana menjadi sistem yang berbasis mobile web dan web. 2. Bagaimana
cara menyajikan perkembangan akademis siswa di
sekolah kepada wali siswa. 3. Bagaimana sistem dapat bekerja secara tepat dalam menyampaikan informasi seputar sekolah kepada siswa, wali siswa, serta masyarakat umum melalui mobile phone.
4
1.3
Batasan Masalah
Batasan masalah dalam penelitian ini antara lain sebagai berikut : 1. Perancangan sistem akademik SMA Muga Tangerang berbasis mobile web pada user dan berbasis web pada admin sekolah. 2. Pada sistem akademiknya tidak dirancang web pada sisi user, hanya dirancang mobile web pada sisi user. 3. Sistem akademik ini tidak membahas sistem keuangan sekolah karena konteks tersebut di luar pembahasan sistem ini dan dapat dibahas tersendiri. 4. Menggunakan bahasa pemrograman xHTML MP, PHP, dan jQuery. 5. Penyimpanan database-nya menggunakan MySQL. 6. Pengujian sistem akademik ini menggunakan browser simulator yaitu Opera Mobile for Windows pada localhost , Opera Mini pada handphone secara online, dan beberapa simulator handphone.
1.4
Tujuan dan Manfaat Penelitian 1.4.1
Tujuan Penelitian
Tujuan yang ingin dicapai penulis dari penelitian ini adalah: a. Merancang sistem akademik sekolah yang masih sederhana menjadi sistem yang berbasis mobile web. b. Menyajikan kegiatan akademik siswa di sekolah kepada wali siswa yang masih kesulitan mengaksesnya secara cepat dan mudah dengan menggunakan mobile phone.
5
c. Memudahkan
untuk
menyajikan
informasi
dari
sistem
akademik sekolah.
1.4.2 Manfaat Penelitian 1. Bagi Pengguna a. Membantu sekolah dalam mengatur sistem akademik sekolah, sehingga dapat memberikan informasi penting yang berkaitan dengan sekolah tersebut. b. Mempermudah siswa dan wali siswa untuk mendapatkan informasi yang dibutuhkan tanpa harus browsing internet. c. Semua kegiatan dan informasi yang berkaitan dengan sekolah dan siswa dapat dengan mudah diakses melalui handphone. d. Masyarakat dapat mengetahui informasi sekolah melalui portal sekolah.
2. Bagi Penulis a. Dapat menambah pengetahuan tentang bahasa pemrograman web/mobile web seperti xHTML MP, PHP, jQuery, dan MySQL, dan desainnya seperti Dreamweaver dan Fireworks. b. Dapat mengimplementasikan ilmu yang didapat di bangku kuliah khususnya mata kuliah yang berhubungan dengan pemrograman web/mobile web, seperti Web Programming, Mobile Web Programming, Sistem Basis Data, dan lainnya.
6
3. Bagi Universitas a. Sebagai referensi/literatur mahasiswa dalam penguasaan materi dan penerapan ilmu yang telah di dapat di bangku kuliah. b. Memberikan gambaran tentang kesiapan mahasiswa dalam menghadapi dunia kerja dari hasil yang diperoleh selama pembelajaran pada masa kuliah. c. Mengetahui kemampuan mahasiswa dalam menerapkan ilmunya dan sebagai bahan evaluasi.
1.5
Metodologi Penelitian Dalam proses penelitian ini, penulis menggunakan metodologi-
metodologi yang umum digunakan penelitian lainnya, metodologi yang digunakan antara lain :
1.5.1 Metode Pengumpulan Data Dalam proses penulisan skripsi ini, bentuk metodologi pelaksanaan yang akan dilakukan antara lain : a. Observasi, yakni proses pengumpulan data dalam penelitian dengan mengamati langsung keadaan permasalahan penelitian dan mengambil data-data penting dari tempat penelitian. b. Wawancara, yakni mengumpulkan data melalui tanya jawab dengan narasumber terkait.
7
c. Studi pustaka, yakni mengumpulkan data melalui buku, literatur ilmiah, maupun referensi internet yang berhubungan dengan penulisan skripsi.
1.5.2 Metode Pengembangan Sistem Metode yang digunakan dalam rekayasa web/mobile web yang penulis rancang adalah metode incremental. Metode ini merupakan metode pengembangan dari metode waterfall yang mengkombinasikan elemen dari waterfall itu sendiri dengan sifat iterasi/pengulangan. Hasil proses berupa produk yang makin lama makin lengkap sampai menghasilkan versi terlengkap sebagai produk akhir dari proses yang dilakukan.
Metode ini adalah metode pengembangan sistem pada software engineering berdasarkan requirement software yang dipecah
menjadi
beberapa
bagian/fungsi
sehingga
model
pengembangannya secara increment/bertahap. Metode ini terdiri dari beberapa tahap yaitu Communication, Planning, Modeling (Analysis and Design), Construction (Code and Test), dan Deployment (Delivery and Feedback).
8
1.6
Sistematika Penulisan BAB I. Pendahuluan Pada bab ini memberikan uraian mengenai latar belakang, rumusan masalah, batasan masalah, tujuan penelitian, manfaat penelitian, metodologi penelitian, dan sistematika penulisan.
BAB II. Landasan Teori Pada bab ini memberikan uraian mengenai teori yang berhubungan dengan permasalahan yang diambil penulis dan teori yang digunakan sebagai panduan dasar dalam perancangan sistem.
BAB III. Metodologi Penelitian Pada bab ini berisi metodologi penelitian yang digunakan serta langkah- langkah yang digunakan terkait dengan penelitian yang dilakukan.
BAB IV. Pembahasan Pada bab ini berisi pembahasan tentang gambaran umum instansi, proses pembuatan sistem, serta tampilan sistem secara umum.
BAB V. Penutup Pada bab ini berisi tentang kesimpulan yang telah diperoleh dari penjelasan bab sebelumnya, serta saran dari masalah yang terkait.
BAB II LANDASAN TEORI
2.1 Konsep Perancangan Sistem Akademik Berbasis Mobile Web 2.1.1 Definisi Perancangan Sistem Perancangan merupakan rekayasa representasi yang berarti terhadap sesuatu yang hendak dibangun. Perancangan menekankan pada solusi logik mengenai cara sistem memenuhi kebutuhan. Tujuan perancangan adalah menghasilkan model atau representasi entitas yang akan dibangun. (Hariyanto, 2004 : 405).
Perancangan sistem adalah strategi tingkat tinggi untuk membuat keputusan –
keputusan
subsistem-subsistem,
yaitu
alokasi
pengorganisasian sistem menjadi
subsistem
ke
komponen-komponen
perangkat keras dan lunak, keputusan – keputusan konseptual dan kebijaksanaan utama untuk membentuk kerangka kerja rancangan rinci. (Hariyanto, 2004 : 421).
2.1.2 Perancangan Sistem Akademik Berbasis Mobile Web Pengertian perancangan sistem akademik berbasis mobile web di sini merupakan suatu proses merancang sistem akademik berbasis mobile web menggunakan teknologi WAP 2.0 melalui mobile phone secara online untuk mendapatkan informasi seputar sekolah yang dapat
9
10
diakses dengan menggunakan mobile phone sehingga dapat mengatasi kelemahan sistem akademik berbasis web yaitu tidak bersifat mobile. Perancangan sistem akademik berbasis mobile web ini mengambil studi kasus di SMA dengan menggunakan bahasa pemrograman xHTML MP yang digabung dengan bahasa pemrograman PHP, jQuery dan MySQL.
2.2 Konsep Sistem Akademik Sekolah 2.2.1 Definisi Sistem Pendekatan sistem yang lebih menekankan pada prosedur mendefinisikan suatu sistem adalah suatu jaringan kerja dari prosedur prosedur yang saling berhubungan, berkumpul bersama-sama untuk melakukan suatu kegiatan atau menyelesaikan suatu sasaran tertentu. Pendekatan sistem
yang lebih menekankan pada elemen atau
komponennya mendefinisikan sistem adalah kumpulan dari elemenelemen yang berinteraksi untuk mencapai suatu tujuan tertentu. (Jogiyanto, 2006 : 1-2).
2.2.2 Definisi Akademik Akademik adalah seluruh lembaga pendidikan formal baik pendidikan anak usia dini, pendidikan dasar, pendidikan menengah, pendidikan kejuruan maupun perguruan tinggi yang menyelenggarakan pendidikan vokasi dalam satu cabang atau sebagian cabang ilmu pengetahuan, teknologi, dan atau seni tertentu. (Putro, 2007).
11
2.2.3 Definisi Sistem Akademik Sekolah Sistem informasi adalah kombinasi antara prosedur kerja, informasi, orang, dan teknologi informasi yang diorganisasikan untuk mencapai tujuan dalam sebuah organisasi (Kadir, 2009 : 7). Adapun yang dimaksud sistem akademik sekolah di sini adalah sebuah sistem informasi yang dirancang untuk digunakan pada keperluan pengelolaan data-data akademik dalam hal ini sekolah, dengan penerapan teknologi komputer baik hardware maupun software. Adapun hardware-nya adalah peralatan - peralatan seperti komputer, harddisk,
dan
sebagainya.
printer, flashdisk,
Sedangkan software-nya merupakan
program komputer yang memfungsikan hardware tersebut yang dibuat khusus untuk keperluan pengelolaan data-data akademik.
2.3 Konsep Jaringan Internet 2.3.1 Definisi Jaringan Jaringan komputer (computer network/network) merupakan interkoneksi sejumlah komputer dan peralatan/peripheral lainnya yang dihubungkan dengan jalur transmisi dan alat komunikasi membentuk satu sistem sehingga dapat saling bertukar data, informasi, atau menggunakan peralatan secara bersama/sharing untuk melaksanakan tugas pengolahan data. Dalam melakukan sharing perlu dibedakan antara komputer sumber (source) dan komputer tujuan (destination). (Sutanta, 2005 : 503).
12
2.3.2 Model Jaringan Berdasarkan metode pengorganisasiannya, jaringan komputer dibagi dalam 2 model pengorganisasian : 1. Model Peer to peer adalah jaringan komputer yang terdiri atas beberapa komputer. Model jaringan ini mengutamakan pada aspek penggunaan program, data, dan printer secara bersama-sama. Dalam Model peer to peer, setiap host memberikan layanan ke peer lain atau mengambil layanan dari peer lain. (Sutanta, 2005 : 508). 2. Model Client-Server, model ini memisahkan secara jelas antara server dan client. Server memberikan layanan jaringan dan client menerima layanan. Beberapa komputer diset-up sebagai server yang memberikan segala sumber daya yang tersedia dalam jaringan kepada komputer lain yang terkoneksi ke jaringan yang berfungsi sebagai client. (Sutanta, 2005 : 509).
Gambar 2.1 Model Jaringan Peer to Peer dan Client-Server (sumber : Yusuf, 2010)
13
2.3.3 Protokol Jaringan Protokol jaringan adalah set aturan yang mengatur cara bagaimana suatu komputer bisa berkomunikasi satu sama lain. (Sutanta, 2005 : 523). 1. Protokol OSI, merupakan salah satu protokol standar yang didasarkan pada model yang diusulkan ISO. (Sutanta, 2005 : 524). Protokol OSI dibagi ke dalam 7 lapis layer jaringan yaitu : physical layer, datalink layer, network layer, transport layer, session layer, presentation layer, dan application layer. 2. Protokol TCP/IP, adalah protokol untuk mengalamati komputer – komputer dalam suatu jaringan dengan aturan nomor tertentu, yang disebut nomor Net-ID dan nomor Host-ID. (Sutanta, 2005 : 526). Protokol TCP/IP dibagi menjadi 4 layer yaitu : network interface layer/physical layer, internet layer/network layer, transport layer, dan application layer.
Gambar 2.2 Layer Protokol OSI dan TCP/IP (sumber : Subekti, 2010)
14
2.3.4 Konsep Internet Internet adalah suatu jaringan komputer yang anggotanya terdiri dari jaringan – jaringan lain yang lebih kecil. Ribuan jaringan – jaringan kecil ini dimiliki dan didirikan baik oleh institusi, lembaga pendidikan, perusahaan komersil, organisasi dan bahkan individual. Secara garis besar, sistem kerja Internet adalah sebagai berikut. Data dari komputer sumber keluar ke modem dalam bentuk sinyal elektromagnetik. Sinyal tersebut kemudian diubah menjadi sinyal telepon (pulsa) oleh modem. Selanjutnya sinyal masuk ke modem kembali dan kemudian diubah menjadi sinyal elektromagnetik sebelum akhirnya masuk ke komputer tujuan. (Sutanta, 2005 : 538).
Gambar 2.3 Arsitektur Jaringan Internet (sumber : Andhi, 2009)
15
Adapun layanan – layanan yang terdapat pada internet adalah: 1. Web, sebuah sistem di mana informasi dalam bentuk teks, gambar, suara, dan lainnya yang tersimpan dalam sebuah Internet webserver ditampilkan dalam bentuk hypertext. (Sutanta, 2005 : 546). 2. Electronic Mail (e-mail), layanan internet yang berfungsi mengirim atau menerima surat ke/dari seluruh penjuru dunia. Layanan e-mail biasanya dikelompokkan dalam 2 basis, yaitu e-mail berbasis client dan e-mail berbasis web. (Sutanta, 2005 : 567). 3. File Transfer Protocol (FTP), memungkinkan para pengguna Internet untuk melakukan upload atau download file antara komputer lokal dengan komputer lain yang terhubung dalam jaringan Internet. (Sutanta, 2005 : 571). 4. Remote Login, mengacu pada program yang menyediakan fungsi yang memungkinkan seorang pengguna Internet untuk mengakses ke sebuah terminal dalam lingkungan jaringan Internet. Protokol yang banyak digunakan untuk keperluan remote login adalah Telnet (Telecommunication Networking). (Sutanta, 2005 : 572).
2.4 Konsep Mobile Web 2.4.1 Definisi Web Web adalah sebuah sistem di mana informasi dalam bentuk teks, gambar, suara, dan lainnya yang tersimpan dalam sebuah Internet webserver ditampilkan dalam betuk hypertext. Informasi dalam bentuk teks di web ditulis dalam format HTML. (Sutanta, 2005 : 546).
16
Secara umum, untuk menjelajahi Internet (Browsing/Surfing), harus diketahui alamat yang dituju. Aturan penulisan alamat tersebut adalah: protokol (http://), domain (www.akprind.ac.id), directory (/assisten/), nama halaman (personel.html. (Sutanta, 2005 : 548). Berikut ini adalah skenario dari surfing Web. 1. Pengguna meminta suatu layanan dengan mengklik tautan (link) atau dengan mengetikkan sebuah perintah dengan keyboard. Browser Web menangkap perintah tersebut dan menerjemahkannya ke dalam permintaan HTTP. 2. Browser kemudian meneruskan permintaan yang baru saja diciptakan kepada server Web dan penyedia konten. Ketika server menerima sebuah permintaan, permintaan tersebut akan diproses. 3. Ketika pemrosesan dilakukan, server Web kemudian mengirimkan kembali respon tersebut ke browser. 4. Ketika
browser
menerima
respon
tersebut,
browser
menerjemahkannya ke dalam bentuk yang dapat dibaca oleh manusia. (Simarmata, 2010 : 53-54).
2.4.2 Definisi Mobile Web Mobile web adalah sistem yang bertujuan untuk mengakses layanan data secara wireless dengan menggunakan perangkat mobile seperti handphone, PDA yang tersambung ke sebuah jaringan telekomunikasi selular. Mobile web yang diakses melalui perangkat mobile perlu
17
dirancang dengan mempertimbangkan keterbatasan perangkat mobile seperti sebuah handphone yang memiliki layar dengan ukuran yang terbatas ataupun beberapa keterbatasan pada sebuah perangkat mobile.
Pada Mei 2005 mobile web di keluarkan oleh W3C dengan nama Mobile Web Initiative (MWI) dengan tujuan membuat web dapat diakses dari sebuah perangkat mobile secara sederhana seperti mengakses web dari sebuah komputer desktop. Pada mobile web juga dikenal dengan sebutan mobile web 2.0, yang dapat diartikan membawa teknologi web 2.0 ke sebuah mobile device. Tetapi perangkat mobile berbeda dengan komputer desktop, sehingga banyak faktor yang menjadi batasan ketika membangun sebuah mobile web, salah satunya adalah ketersediaan data secara real time atau update berkala ketika terjadi perubahan data pada web. (Obie, 2008).
2.4.3 Teknologi WAP (Wireless Application Protocol) 1. WAP 1.0 WAP adalah standar dunia nyata untuk layanan telepon dan informasi nirkabel pada telepon seluler digital dan terminal nirkabel lainnya. WAP Forum adalah sumber wewenang untuk spesifikasi WAP. Sasaran WAP Forum adalah penyediaan sebuah framework aplikasi yang mempengaruhi standar data jaringan digital dari teknologi Internet dan teknologi jaringan mobile. (Simarmata, 2010 : 360).
18
Cara kerja WAP 1.0 adalah sebagai berikut. Saat sebuah handheld mobile device tersambungkan ke jaringan wireless dan meminta akses sebuah web yang mendukung WAP, handheld mobile device anda akan mengirimkan permintaan tersebut via gelombang radio ke sel terdekat, dimana langsung dirutekan ke internet melalui sebuah server gateway. Server gateway tersebut akan menerjemahkan permintaan ke format standar HTTP dan meneruskannya ke site web. Bila site tersebut meresponnya, ia akan mengirimkan dokumen HTML ke server gateway, kemudian dikonversi menjadi WML dan merutekannya ke antena terdekat. Antena tersebut akan mengirimkan data via gelombang ke piranti WAP anda dan akhirnya microbrowser sebagai navigator yang menyediakan interface antara user dan wireless internet menampilkan halaman microbrowser tersebut. ( Elidjen dkk, 2005).
Gambar 2.4 Model Cara Kerja WAP 1.0 (sumber : WAP Forum, 2002)
19
2. WAP 2.0/Mobile Web Sejak tahun 2001, proposal WAP 2.0 oleh WAP Forum telah diumumkan untuk mengadopsi standard WC3 dari markup dengan tidak melanjutkan WML 1.x. Tidak lama setelah merintis laporan WAP 2.0, WAP Forum telah dikonsolidasikan ke dalam Open Mobile Alliance (OMA). WAP Forum atau OMA memutuskan untuk menggantikan WML dengan Extensible HyperText Markup Language (XHTML). (Simarmata, 2010 : 369). WML 1.x dikombinasikan dengan xHTML Basic untuk menciptakan xHTML Mobile Profile (xHTML MP), sehingga bahasa yang dipergunakan pada WAP 2.0 sampai sekarang adalah xHTML MP dan WAP 2.0 inilah yang disebut teknologi mobile web.
Cara kerja WAP 2.0 berbeda dengan WAP 1.0 dan hampir sama dengan web pada internet. Adapun cara kerjanya sebagai berikut. “The WAP Programming Model, closely aligned with the Web Programming Model, uses the Pull Model, (which is where the client request content from the server). However, WAP also extends the Web architecture by adding telephony support with WTA and enabling a Push Model, where a server can proactively send content to the client. “ (WAP Forum, 2002). Jika WAP 1.0 membutuhkan WAP Proxy atau WAP Gateway untuk menangani protocol internetworking antara client dan origin server, maka WAP 2.0 tidak membutuhkan WAP Proxy, karena komunikasi antara client dan origin server dapat disatukan dengan menggunakan HTTP/1.1.
20
Gambar 2.5 Model Cara Kerja WAP 2.0 (sumber : WAP Forum, 2002)
2.4.4 Pemrograman Mobile Web/WAP 2.0 WAP 2.0 menggunakan xHTML MP sebagai bahasa markup-nya dan bukan WML. xHTML MP (Extensible Hypertext Markup Language Mobile Profile) merupakan sebuah bahasa markup yang didefinisikan dalam Wireless Application Protocol (WAP) 2.0, yaitu sebuah protocol komunikasi untuk aplikasi-aplikasi nirkabel yang dibuat oleh WAP Forum. Jadi sebenarnya tujuan utama dari xHTML MP adalah menggabungkan teknologi browser yang ada pada mobile dan World Wide Web. xHTML MP statis dapat mengenali semua file yang memiliki ekstensi xhtml, html, atau htm. Tipe MIME dari dokumen yang dibutuhkan oleh xHTML MP yaitu : application/vnd.wap.xhtml+xml, application/xhtml+xml, dan text/html. (Jusak, 2008 : 1-2, 18-19).
21
1. Aturan Penulisan xHTML MP Penulisan syntax xHTML MP sangat berbeda dengan script WML namun lebih cenderung mirip dengan HTML karena xHTML MP memang didesain untuk mobile web. Namun pada xHTML MP, aturan penulisannya lebih diperketat daripada HTML karena keterbatasan memory device. Menurut Jusak (2008 : 10-14), beberapa aturan (rule) tersebut dijelaskan dalam bagian ini. a. Elemen-elemen dalam xHTML MP harus tersarang dengan benar.
Tes
(benar)
Tes
(salah) b. Elemen-elemen dalam xHTML MP harus tertutup. 1)
Tes
(benar) 2) Tes
(benar)
Tes
(salah)
Tes (salah)
c. Elemen-elemen dalam xHTML MP harus tertulis dengan huruf kecil.
Tes
(benar)
Tes
(salah)
d. Nilai dari setiap atribut pada xHTML MP harus ditulis dalam tanda petik (ganda atau tunggal).
Tes
(benar)
Tes
(benar)
Tes
(salah) e. xHTML MP tidak mengijinkan adanya minimisasi atribut. (benar) (salah)
22
2. Struktur Penulisan Bahasa xHTML MP Pada dasarnya penulisan xHTML MP sama dengan penulisan HTML, hanya terdapat beberapa perbedaan. Penulisan syntax tersebut yaitu sebagai berikut. Hello
3. Konfigurasi Penulisan xHTML MP dan PHP Untuk membuat sistem berbasis mobile web yang berjalan dinamis, maka pemrograman xHTML MP dapat dikolaborasikan dengan PHP. Bentuk script konfigurasi bahasa PHP dan xHTML MP adalah : '); echo(''); ?>
2.5 Konsep Database 2.5.1 Definisi Data Data merupakan bentuk yang masih mentah yang belum dapat berceritera banyak, sehingga perlu diolah lebih lanjut. Data diolah melalui suatu model untuk dihasilkan informasi. (Jogiyanto, 2006 : 8). Jadi, data adalah suatu bahan mentah yang kelak dapat diolah lebih lanjut untuk menjadi sesuatu yang lebih bermakna. Data inilah yang nantinya akan disimpan dalam database. (Kadir, 2009 : 2).
2.5.2 Definisi Database Database atau basis data adalah sebuah cara mendokumentasikan berbagai macam data yang kemudian dimanajemen dengan sebuah sistem untuk kemudian disimpan dalam sebuah media penyimpanan. (Nugroho, 2005 : 72). Dalam database, data tidak hanya disimpan dalam sebuah
24
media penyimpanan, tetapi dikelola dengan sebuah sistem pengaturan database yang sering disebut dengan istilah Database Management Systems (DBMS).
2.5.3 Komponen Database 1. Entitas/tabel
(entity),
merupakan
komponen
database
yang
digunakan untuk menyimpan sebuah kelompok data. 2. Atribut/kolom (field), merupakan komponen atau bentuk terkecil dari database yang digunakan untuk menyimpan sebuah data. 3. Kunci primer (primary key), merupakan kolom atau field utama yang mewakili field lainnya dalam sebuah entitas untuk menghindari penggandaan data, dan perancangannya ditandai dengan tanda bintang satu ( * ). 4. Kunci tamu (foreign key), merupakan kunci primer yang berasal dari entitas lain di mana kunci primer ini berelasi dengan entitas lain sehingga akan menjadi kunci tamu dalam entitas tersebut dan perancangannya ditandai dengan tanda bintang dua ( * * ). 5. Kunci
alternatif
(unique
key),
adalah
kunci
yang
dapat
dinominasikan sebagai kunci primer dan menjadi kunci utama kedua setelah kunci primer. 6. Rekaman (recordset), adalah bentuk pengistilahan data yang ada dalam sebuah entitas yang dihitung dalam satu baris.
25
2.5.4 Alat Perancangan Sistem 1. DFD (Data Flow Diagram), adalah diagram aliran data yang digunakan untuk menggambarkan proses – proses bisnis dalam organisasi dan sekaligus menerangkan kaitan antara proses dan data. (Kadir, 2009 : 25).
Tabel 2.1 Simbol Data Flow Diagram (DFD) (sumber : Yudi, 2010)
2. ERD (Entity Relationship Diagram), adalah suatu model yang digunakan untuk menggambarkan data dalam bentuk entitas, atribut, dan hubungan antarentitas yang dinyatakan dalam bentuk diagram. Model seperti ini tidak mencerminkan bentuk fisik yang nantinya akan
3. STD (State Transition Diagram) merupakan suatu modelling tool yang menggambarkan sifat ketergantungan pada waktu dari suatu sistem. Notasi STD terdiri dari state yang disimbolkan dengan segi empat, dan transisi state yang disimbolkan dengan panah berarah. (Haryanto, 2010).
4. Flow Chart merupakan suatu alat atau sarana yang menunjukkan langkah-langkah yang harus dilaksanakan dalam menyelesaikan suatu
permasalahan
untuk
komputasi
dengan
cara
mengekspresikannya ke dalam serangkaian simbol-simbol grafis khusus. (Sutanta, 2005 : 99).
27
Tabel 2.3 Simbol Flow Chart (sumber : Rezkiani, 2009)
2.6 Metodologi Pengembangan Sistem 2.6.1 Definisi Metodologi Pengembangan Sistem Metodologi adalah kesatuan metode-metode, prosedur-prosedur, konsep-konsep pekerjaan, aturan-aturan, dan postulat-postulat yang digunakan oleh suatu ilmu pengetahuan, seni atau disiplin yang lainnya. Sedang metode adalah suatu cara, teknik yang sistematik untuk mengerjakan sesuatu. Metodologi pengembangan sistem berarti adalah metode-metode, prosedur-prosedur, konsep-konsep pekerjaan, aturanaturan,
dan
postulat-postulat
yang
akan
digunakan
mengembangkan suatu sistem informasi. (Jogiyanto, 2006 : 59).
untuk
28
2.6.2 Metodologi Pengembangan Incremental Metode incremental merupakan metode yang mengkombinasikan metode waterfall dengan penerapan pada sifat iterasi/pengulangan. Masing-masing tahap mengirimkan penambahan/increment ke proses incremental selanjutnya sampai menghasilkan spesifikasi software yang lengkap. Produk dari increment pertama merupakan produk inti (core). Produk inti ini digunakan oleh pelanggan dan sebagai hasil dari penggunaan
tersebut,
produk dievaluasi oleh
pelanggan untuk
dikembangkan oleh pengembang pada tahap increment selanjutnya. Proses ini akan berulang sesuai dengan delivery dari masing-masing increment sampai produk lengkap dihasilkan. (Pressman, 2005 : 80-81).
Karakteristik yang ada pada metode incremental yaitu : 1. Kebutuhan user menjadi prioritas dan prioritas tertinggi dimasukkan ke dalam awal increment. 2. Merupakan kombinasi dari waterfall model, yaitu dengan melakukan tahap-tahap waterfall secara berulang. 3. Produk dari increment pertama menjadi dasar perbaikan untuk increment kedua, dan seterusnya sampai produk dianggap sempurna. 4. Model ini cocok jika anggota pengembang sistem sangat terbatas dan proyek yang dikerjakan berukuran kecil. 5. Produk yang dihasilkan pada increment pertama bukanlah prototype, namun berupa produk inti (core) yang sudah bisa digunakan user.
29
2.7 Software dan Bahasa Pemrograman Mobile Web 2.7.1 xHTML MP xHTML MP merupakan sebuah bahasa markup yang didefinisikan dalam Wireless Application Protocol (WAP) 2.0, yaitu sebuah protocol komunikasi untuk aplikasi-aplikasi nirkabel yang dibuat oleh WAP Forum. xHTML sendiri sebenarnya merupakan gabungan antara Hypertext Markup Language (HTML) yang telah umum digunakan sebagai bahasa pemrograman untuk membuat situs-situs internet dewasa ini dan Extensible Markup Language (XML). Penambahan istilah Mobile Profile berarti xHTML MP merupakan bahasa pemrograman yang dikhususkan untuk membangun aplikasi-aplikasi yang dapat dibaca melalui perangkat-perangkat mobile, seperti telepon selular (ponsel), PDA, ataupun smartphone. Jadi xHTML MP merupakan bagian dari xHTML. ...tujuan utama dari xHTML MP adalah menggabungkan teknologi browser yang ada pada mobile dan World Wide Web (HTML). (Jusak, 2008 : 1-2).
2.7.2 PHP (PHP Hypertext Preprocessor) PHP
digunakan
sebagai
bahasa
script
server-side
dalam
pengembangan web yang disisipkan pada dokumen HTML. PHP diciptakan pertama kali oleh Rasmus Lerdorf pada tahun 1994. Awalnya PHP digunakan untuk mencatat jumlah serta untuk mengetahui siapa saja pengunjung pada homepage-nya. Dia mengeluarkan Personal Home
30
Page Tools versi 1.0 secara gratis, kemudian menambah kemampuan PHP 1.0 dan meluncurkan PHP versi 2.0. (Peranginangin, 2006 : 2).
Beberapa keunggulan yang dimiliki oleh program PHP adalah memiliki tingkat akses yang lebih cepat; memiliki tingkat lifecycle yang cepat; memiliki tingkat keamanan yang tinggi; mampu berjalan di beberapa server yang ada misalnya Apache, Microsoft IIS, PWS, Xitami, dsb; mampu berjalan di beberapa OS yang ada yaitu Windows, Linux, Unix, dan Solaris; mendukung akses ke beberapa database yang sudah ada, yaitu MySQL, PosgreSQL, mSQL, dan Microsoft SQL Server; bersifat free/gratis. (Divisi Litbang MADCOMS, 2004 : 2).
2.7.3 jQuery jQuery adalah Javascript library yakni kumpulan kode/fungsi Javascript siap pakai, sehingga mempermudah kita dalam membuat kode Javascript. Secara standar, apabila kita membuat kode Javascript, maka diperlukan kode yang cukup panjang, bahkan terkadang sangat sulit dipahami. Disinilah peran jQuery sebagai Javascript library, di mana kita bisa langsung memanggil fungsi yang terdapat di dalam Library tersebut. (Hakim, 2010 : 3).
Berikut ini akan dijabarkan lebih lengkap mengenai kemampuan yang dimiliki oleh
jQuery, di antaranya mempermudah akses dan
31
manipulasi
elemen
tertentu
pada
dokumen,
mempermudah
modifikasi/perubahan tampilan halaman web, mempersingkat Ajax (Asynchronous Javascript and XML), memiliki API (Application Programming Interface)
sehingga dapat memanipulasi content pada
suatu halaman web, mampu merespon interaksi antara user dengan halaman web dengan lebih cepat, menyediakan fasilitas untuk membuat animasi sekelas Flash dengan mudah. (Hakim, 2010 : 6-7).
2.7.4 MySQL MySQL adalah sebuah program database server yang mampu menerima dan mengirimkan datanya dengan sangat cepat, multi user, dan menggunakan perintah standar SQL (Structured Query Language). MySQL pertama kali dirintis oleh programmer database bernama Michael Widenius. MySQL adalah sebuah database yang dapat digunakan baik sebagai Client maupun Server. (Nugroho, 2005 : 1-2).
Kelebihan-kelebihan MySQL antara lain : sebagai DBMS, sebagai RDBMS, sebagai database server yang dapat menghubungkannya ke internet sehingga dapat diakses dari jauh, sebagai database client yang melakukan query untuk mengakses database pada server, mampu menerima query yang bertumpuk dalam satu pemintaan, mampu menyimpan data berkapasitas sangat besar, dan menggunakan enkripsi password dan menciptakan 16 kunci. (Nugroho, 2005 : 3-4).
32
2.7.5 XAMPP dan phpMyAdmin XAMPP adalah perangkat lunak bebas yang berfungsi sebagai server yang berdiri sendiri (localhost), yang terdiri atas program Apache HTTP Server, MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa pemrograman PHP dan Perl. Nama XAMPP merupakan singkatan dari X (dijalankan di banyak sistem operasi, seperti Windows, Linux, Mac OS, dan Solaris), Apache, MySQL, PHP dan Perl.
Software XAMPP terdiri atas: a. Apache, merupakan aplikasi web server. Tugas utama Apache adalah menghasilkan halaman web yang benar kepada user berdasarkan kode PHP yang dituliskan oleh pembuat halaman web. Jika diperlukan juga berdasarkan kode PHP yang dituliskan, maka dapat saja suatu database diakses terlebih dahulu untuk mendukung halaman web yang dihasilkan PHP. b. MySQL. c. phpMyAdmin, adalah suatu program Open Source berbasis web. Program ini berguna untuk mengakses database MySQL, akan mempermudah dan mempersingkat kerja kita dengan beberapa kelebihan, antara lain pengguna awam tidak harus mengenal syntax – syntax SQL dalam pembuatan database dan tabel. (Nugroho, 2005 : 467).
33
2.7.6 Macromedia Dreamweaver MX 2004 Macromedia Dreamweaver MX 2004 adalah program aplikasi profesional untuk mengedit HTML secara visual dan mengelola website serta pages. Program ini menyertakan banyak perangkat yang berkaitan dengan pengkodean dan fitur seperti HTML, CSS, Javascript Reference, dan Javascipt Debugger. Program aplikasi ini juga memungkinkan pengeditan PHP, Javascript, ASP, XML, dan lainnya secara langsung yaitu dengan fasilitas Code Editors. (Tim Wahana Komputer, 2004 : 1).
2.7.7 Opera Mobile for Windows Opera Mobile merupakan browser web untuk smartphone dan PDA yang dikembangkan oleh perusahaan Opera Software. Opera Mobile mendukung banyak standar web dan AJAX. Opera Mobile tersedia untuk berbagai perangkat yang menjalankan Windows Mobile, S60 dan UIQ user interface. Sementara browser mobile lainnya dari Opera adalah Opera Mini. Opera Mini merupakan penjelajah web yang dirancang khusus untuk ponsel, dan juga bisa dioperasikan untuk PDA dan smartphone. Penjelajah web ini menggunakan platform Java J2ME. (Hendra, 2010). Jika kita ingin menggunakannya melalui PC maka kita bisa menggunakan Opera Mobile for Windows yang bisa didapat gratis di internet, karena software ini merupakan simulator Opera Mobile dan Opera Mini pada handphone.
34
Gambar 2.6 Tampilan Awal Opera Mobile for Windows
2.8 Studi Sejenis Banyak studi sejenis yang berkaitan dengan skripsi penulis, di antaranya beberapa dijadikan acuan dalam penelitian ini. Studi sejenis dari penelitian akademik bisa diklasifikasikan sebagai berikut. 1. Skripsi Tentang Sistem Akademik Sekolah Aplikasi Akademik Berbasis Wireless Application Protocol (Studi Kasus : SMA Negeri 1 Ciputat). Eko Saputro. 2010. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web pada sisi admin dan WAP pada sisi user; menggunakan bahasa pemrograman WML, PHP, dan MySQL; serta menggunakan metode waterfall sebagai metode pengembangan sistemnya. Kelebihannya adalah menggunakan WAP; menyajikan
informasi
siswa,
guru,
dan
lainnya.
Sedangkan
kelemahannya adalah tampilan interface sederhana, dan belum memiliki fasilitas untuk menampilkan nilai siswa.
35
Sistem Informasi Pembuatan Rapor SDN Pondok Kacang Timur IV. Qunut Fajri. 2007. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis desktop; menggunakan Microsoft Visual Basic 6.0 dan Ms. Access 2003; serta menggunakan metode waterfall sebagai metode pengembangan sistemnya. Kelebihannya adalah terintegrasinya guru dan TU sehingga guru dan TU dapat menginput nilai siswa dan membuat laporan nilai siswa; serta menangani data-data akademik dengan baik. Sedangkan kelemahannya adalah sistemnya masih berbasis desktop, dan belum adanya proses validasi data.
Pengembangan Perangkat Lunak Sistem Informasi Akademik SD Standar Nasional Rajawati 08 Pagi Berbasis Jaringan WLAN dengan Menggunakan Infrastruktur Ad-Hoc. Indah Dwijayanthi Nirmala. 2010. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis desktop yang dihubungkan dalam jaringan WLAN, menggunakan Delphi 7, dan metode waterfall. Skripsi ini bertujuan mengembangkan aplikasi akademik yang dapat diakses beberapa komputer dengan berbasis WLAN. Kelebihannya adalah dapat diakses beberapa komputer dalam satu jangkauan sekolah, adanya fitur laporan sehingga membantu pihak sekolah dalam mencetak hasil sistem akademiknya. Kelemahannya adalah belum diintegrasikan dengan sistem lain di sekolah, dan sistem keamanannya yang masih kurang.
36
Pengembangan Sistem Informasi Siswa Berbasis Teknologi SMS Menggunakan Konsep At Command. Erika Nachrowi. 2010. UIN Jakarta : Jakarta. Skripsi ini berbasis sistem yang menggunakan bahasa Java, SMS Gateway, UML dan metode spiral. Skripsi ini bertujuan merancang sistem informasi siswa yang menjadi media dalam pemantauan nilai, absensi dan SPP siswa, serta informasi kegiatan sekolah dengan menggunakan SMS. Kelebihannya adalah menampilkan informasi siswa dalam hal nilai harian, UTS, UAS, SPP, absensi, dan info akademik sekolah; juga berbasis teknologi SMS gateway. Kelemahannya adalah belum semua ponsel dapat menggunakan aplikasi ini, dan belum adanya fasilitas autentikasi user dan keamanan sistemnya.
Perancangan Sistem Informasi Laporan Akademik Berbasis Web SMAN 108 Ulujami Pesanggrahan Jakarta Selatan. Andry Hidayat. 2009. UIN Jakarta : Jakarta. Skripsi ini berbasis web yang menggunakan PHP-MySQL, dan metode SDLC. Skripsi ini bertujuan merancang aplikasi sistem akademik yang membantu mengelola data akademik sekolah dan mengetahui info akademik dengan mudah. Kelebihannya adalah mempermudah pihak sekolah mengelola data akademik dan mempermudah siswa mendapat informasi akademik. Kelemahannya adalah sistem keamanannya yang kurang, dan belum adanya penerapan langsung pada pihak sekolah.
37
Aplikasi Pelayanan Informasi Akademik Menggunakan Protokol WAP (Studi Kasus : Madrasah Aliyah Al Hikmah 2 Brebes). Dawimah. 2010. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web pada admin dan WAP pada user. dengan bahasa PHP-MySQL, dan metode waterfall. Skripsi ini bertujuan mengembangkan layanan informasi akademik MA berbasis WAP untuk mengakses informasi akademik MA Hikmah 2 Brebes. Kelebihannya adalah dapat mengakses info akademik dengan ponsel, dan menggunakan protokol WAP. Kelemahannya adalah pada sistemnya tidak ada fitur untuk pembayaran SPP sekolah, dan sistem keamanannya yang masih rentan.
Aplikasi PHP dan MySQL Dalam Pembuatan Sistem Infomasi SMAN 1 Dukuhwaru Kabupaten Tegal Berbasis Web. Hery Sasria. 2007. UNS : Semarang. Skripsi ini menggunakan sistem berbasis web, menggunakan
bahasa
pemrograman
PHP
dan
MySQL,
serta
menggunakan metode pendekatan terstruktur sebagai pengembangan sistemnya. Kelebihannya adalah memiliki fasilitas agar siswa, guru, dan wali siswa dapat login ke halamannya masing-masing; serta menangani data-data akademik dengan baik.
Sedangkan kelemahannya adalah
informasi akademik tidak dapat diakses dengan cepat oleh pengguna kapanpun dan dimanapun.
38
2. Skripsi Tentang Sistem Akademik Kampus Pengembangan Sistem Informasi Akademik (Studi Kasus : UIN Syarif Hidayatullah Jakarta). Fitria Nurul Husna. 2010. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web dengan bahasa Java, konsep UML, dan metode Extreme Programming. Skripsi ini bertujuan menganalisis sistem yang ada dan merancang pengembangan sistem akademik sehingga menunjang kegiatan akademik di UIN Jakarta. Kelebihannya adalah sistemnya memiliki banyak fitur seperti skripsi, wisuda; serta sudah diintegrasikan ke seluruh fakultas. Kelemahannya adalah belum adanya batasan minimal kehadiran mahasiswa untuk UAS pada modul absen, dan jumlah pertemuan yang harus dilakukan dosen.
Analisis dan Perancangan Sistem Informasi Akademik (Studi Kasus : Prodi SI Fakultas Saintek UIN Syarif Hidayatullah Jakarta). Abdullah. 2010. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web dengan menggunakan bahasa PHP-MySQL, dan metode waterfall. Skripsi ini bertujuan untuk merancang sistem informasi akademik yang memudahkan pengolahan dan menyajikan data akademik kemahasiswaan. Kelebihannya adalah memudahkan pengolahan data akademik oleh admin, dan menyajikan layanan informasi akademik secara online untuk mahasiswa. Kelemahannya adalah belum adanya fitur penawaran mata kuliah dengan sistem paket dalam pengisian KRS, dan kajian penelitian belum dilakukan sepenuhnya.
39
Pengembangan Sistem Informasi Buku Induk Mahasiswa Pada Prodi SI Fakultas Saintek UIN Syarif Hidayatullah Jakarta. Morteza Muthahhari. 2008. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web dengan bahasa PHP-MySQL dan metode SDLC. Skripsi ini bertujuan merancang sistem informasi buku induk mahasiswa yang mempermudah prodi SI melakukan pengelolaan data akademik. Kelebihannya adalah mempermudah prodi dalam penentuan nilai, IPK, peminatan, dan sebagainya; serta mengcover SIMPERTI bila transkrip telat datangnya. Kelemahannya adalah sistem belum dijalankan online hanya intranet, dan belum ada akun dosen untuk memasukkan nilai.
Pengembangan Sistem Informasi Penjadwalan Kuliah Pada Prodi TI dan SI Fakultas Saintek UIN Syarif Hidayatullah Jakarta. Annisa Primasari. 2010. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web dengan menggunakan bahasa PHP-MySQL, konsep UML, dan metode waterfall. Skripsi ini bertujuan untuk menganalisis pembuatan jadwal di prodi TI dan SI serta mengembangkan sistem informasi penjadwalan kuliah untuk mengatur hari, sesi, dan ruang berdasarkan mata kuliah dan dosen. Kelebihannya adalah membantu penentuan hari, sesi, lokal, dan kelas untuk setiap kesediaan mengajar dosen;
serta
membantu
verifikasi
kesediaan
mengajar
dosen.
Kelemahannya adalah belum adanya modul absensi dosen, dan belum adanya sistem keamanan yang memadai.
40
Sistem Informasi Pendaftaran Wisuda Online (Studi Kasus : UIN Syarif Hidayatullah Jakarta). Dwi Martha Jingga. 2009. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web dengan bahasa PHP-MySQL, dan metode waterfall. Skripsi ini bertujuan merancang aplikasi sistem informasi pendaftaran wisuda secara online pada UIN Jakarta. Kelebihannya adalah dapat mempermudah mengakses sistem untuk melihat informasi wisuda seperti jadwal dan syarat wisuda; serta sistem dijalankan secara online. Kelemahannya adalah belum adanya fasilitas layanan transaksi pembayaran wisuda secara online, dan sistem keamanan yang belum memadai.
Aplikasi Sistem Penerimaan Mahasiswa Baru Berbasis Ujian Online Pada UIN Syarif Hidayatullah Jakarta. Muhammad Miftahudin. 2007. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web dengan bahasa PHP-MySQL, dan metode prototyping. Skripsi ini bertujuan untuk merancang aplikasi penerimaan mahasiswa baru yang membantu pihak akademik dalam menerapkan ujian masuk online oleh semua pihak jurusan. Kelebihannya adalah sistem ini memproses hasil ujian online lebih cepat, dan dapat menghemat biaya dan waktu dalam melakukan ujian masuk UIN. Kelemahannya adalah belum adanya sistem pembayaran online, dan sistem terbatas hanya pada tes tulis saja.
41
Sistem Informasi Akademik Berbasis WAP (Wireless Application Protocol) Pada Sekolah Pasca Sarjana UIN Syarif Hidayatullah Jakarta. Elis Royanah. 2009. UIN Jakarta : Jakarta. Skripsi ini menggunakan sistem berbasis web pada admin dan WAP pada user dengan bahasa PHP-MySQL dan metode waterfall. Skripsi ini bertujuan merancang sistem akademik Sekolah Pasca Sarjana UIN berbasis WAP yang bisa diakses ponsel. Kelebihannya adalah menggunakan layanan WAP, dan dapat mengakses informasi akademik lewat handphone. Kelemahannya adalah belum ada layanan yang memungkinkan user berinteraksi dengan sistem, dan informasi yang disampaikan terbatas hanya pada informasi akademik kuliah saja.
Pemanfaatan Teknologi Web Mobile Untuk Mengakses Data Mahasiswa Pada Sistem Informasi Akademik STMIK ProVisi Semarang. Neira Anjar Pujisusilo. 2006. STMIK ProVisi Semarang : Semarang. Skripsi ini menggunakan sistem mobile web dengan bahasa ASP.Net dan metode pendekatan terstruktur. Skripsi ini bertujuan merancang sistem akademik dengan menggunakan perangkat mobile dan berbasis mobile web. Kelebihannya adalah sistem dapat diakses melalui handphone, sistemnya sudah di-upload ke internet, dan memudahkan mahasiswa mengakses informasi akademik kampus. Kelemahannya adalah belum adanya fitur sistem akademik untuk dosen dan pihak akademik fakultas, dan belum memiliki fasilitas untuk memasukan nilai dan jadwal.
42
Ringkasan studi sejenis yang telah dibahas diperlihatkan pada tabel berikut ini. Tabel 2.4 Daftar Studi Sejenis yang Dipakai Judul Skripsi/Tugas Akhir Aplikasi Akademik Berbasis Wireless Application Protocol (Studi Kasus : SMA Negeri 1 Ciputat). Eko Saputro . 2010. UIN Jakarta : Jakarta.
Sistem Informasi Pembuatan Rapor SDN Pondok Kacang Timur IV. Qunut Fajri. 2007. UIN Jakarta : Jakarta.
Deskripsi Sistem berbasis web pada admin dan WAP pada user, menggunakan bahasa PHPMySQL, dan metode pengembangan waterfall. Tujuan : merancang aplikasi akademik yang digunakan untuk mengelola data akademik SMAN 1 Ciputat. Sistem berbasis desktop, menggunakan bahasa VB 6.0 dan Access 2003, dan metode waterfall. Tujuan : merancang sistem pembuatan rapor untuk membantu sekolah mengelola nilai rapor dan mencetaknya.
Pengembangan Perangkat Lunak Sistem Informasi Akademik SD Standar Nasional Rajawati 08 Pagi Berbasis Jaringan WLAN dengan Menggunakan Infrastruktur Ad-Hoc. Indah Dwijayanthi Nirmala. 2010. UIN Jakarta : Jakarta.
Sistem berbasis desktop yang dihubungkan dalam jaringan WLAN, menggunakan bahasa Delphi 7, dan metode pengembangan waterfall. Tujuan : mengembangkan aplikasi akademik yang dapat diakses beberapa komputer dengan berbasis WLAN.
Pengembangan Sistem Informasi Siswa Berbasis Teknologi SMS Menggunakan Konsep At Command. Erika Nachrowi. 2010. UIN Jakarta : Jakarta.
Sistemnya menggunakan bahasa Java, SMS Gateway, UML dan metode spiral. Tujuan : merancang sistem informasi siswa yang menjadi media dalam pemantauan nilai, absensi dan SPP siswa, serta informasi kegiatan sekolah dengan menggunakan SMS.
Kelebihan dan Kelemahan Kelebihan : menggunakan WAP, menyajikan informasi akademik seperti siswa, jadwal, dan lainnya. Kelemahan : tampilan interface sederhana, dan belum memiliki fasilitas untuk menampilkan nilai siswa Kelebihan : terintegrasinya guru dan TU sehingga guru dan TU dapat menginput nilai siswa dan membuat laporan nilai siswa. Kelemahan : masih berbasis desktop, dan belum adanya proses validasi data. Kelebihan : dapat diakses beberapa komputer dalam satu jangkauan sekolah, adanya fitur laporan sehingga membantu pihak sekolah dalam mencetak hasil sistem akademiknya. Kelemahan : belum diintegrasikan dengan sistem lain di sekolah, dan sistem keamanannya yang masih kurang. Kelebihan : menampilkan informasi akademis siswa, dan berbasis teknologi SMS gateway. Kelemahan : belum semua ponsel dapat menggunakan aplikasi ini, dan belum adanya fasilitas autentikasi user dan keamanan sistemnya.
43
Perancangan Sistem Informasi Laporan Akademik Berbasis Web SMAN 108 Ulujami Pesanggrahan Jakarta Selatan. Andry Hidayat. 2009. UIN Jakarta : Jakarta.
Sistem berbasis web dengan menggunakan PHP-MySQL, dan metode pengembangan SDLC. Tujuan : merancang aplikasi sistem akademik yang membantu mengelola data akademik sekolah dan mengetahui info akademik dengan mudah.
Aplikasi Pelayanan Informasi Akademik Menggunakan Protokol WAP (Studi Kasus : Madrasah Aliyah Al Hikmah 2 Brebes). Dawimah. 2010. UIN Jakarta : Jakarta.
Sistem berbasis web pada admin dan WAP pada user. dengan bahasa PHP-MySQL, dan metode waterfall. Tujuan : mengembangkan layanan informasi akademik MA berbasis WAP untuk mengakses informasi akademik MA Hikmah 2 Brebes.
Aplikasi PHP dan MySQL Dalam Pembuatan Sistem Infomasi SMAN 1 Dukuhwaru Kabupaten Tegal Berbasis Web. Hery Sasria. 2007. UNS : Semarang.
Sistem berbasis web, menggunakan bahasa PHPMySQL, dan menggunakan metode pendekatan terstruktur. Tujuan : merancang aplikasi sistem akademik sekolah agar dapat menyajikan informasi akademik sekolah.
Pengembangan Sistem Informasi Akademik (Studi Kasus : UIN Syarif Hidayatullah Jakarta). Fitria Nurul Husna. 2010. UIN Jakarta : Jakarta.
Sistem berbasis web dengan bahasa Java, konsep UML, dan metode Extreme Programming. Tujuan : menganalisis sistem yang ada dan merancang pengembangan sistem akademik sehingga menunjang kegiatan akademik di UIN Jakarta.
Kelebihan: mempermudah pihak sekolah mengelola data akademik dan mempermudah siswa mendapat informasi akademik. Kelemahan : sistem keamanannya yang kurang, dan belum adanya penerapan langsung pada pihak sekolah. Kelebihan : dapat mengakses informasi akademik dengan ponsel dengan cepat, dan menggunakan protokol WAP. Kelemahan : tidak ada fitur untuk pembayaran SPP sekolah, dan sistem keamanannya yang masih rentan. Kelebihan : memiliki fasilitas agar siswa, guru, dan wali siswa dapat login ke halamannya masing masing; serta menangani data-data akademik dengan baik. Kelemahan : informasi akademik tidak dapat diakses dengan cepat oleh pengguna kapanpun dan dimanapun. Kelebihan : sistemnya memiliki banyak fitur seperti skripsi, wisuda; serta sudah diintegrasikan ke seluruh fakultas. Kelemahan : belum adanya batasan minimal kehadiran mahasiswa untuk UAS pada modul absen, dan jumlah pertemuan yang harus dilakukan dosen.
44
Analisis dan Perancangan Sistem Informasi Akademik (Studi Kasus : Prodi SI Fakultas Saintek UIN Syarif Hidayatullah Jakarta). Abdullah. 2010. UIN Jakarta : Jakarta.
Sistem berbasis web dengan menggunakan bahasa PHPMySQL, dan metode waterfall. Tujuan : merancang sistem informasi akademik yang memudahkan pengolahan dan menyajikan data akademik kemahasiswaan.
Pengembangan Sistem Informasi Buku Induk Mahasiswa Pada Prodi SI Fakultas Saintek UIN Syarif Hidayatullah Jakarta. Morteza Muthahhari. 2008. UIN Jakarta : Jakarta.
Sistem berbasis web dengan bahasa PHP-MySQL dan metode SDLC. Tujuan : merancang sistem informasi buku induk mahasiswa yang mempermudah prodi SI melakukan pengelolaan data akademik.
Pengembangan Sistem Informasi Penjadwalan Kuliah Pada Prodi TI dan SI Fakultas Saintek UIN Syarif Hidayatullah Jakarta. Annisa Primasari. 2010. UIN Jakarta : Jakarta.
Sistem berbasis web dengan menggunakan bahasa PHPMySQL, konsep UML, dan metode waterfall. Tujuan : menganalisis pembuatan jadwal di prodi TI dan SI serta mengembangkan sistem informasi penjadwalan kuliah untuk mengatur hari, sesi, dan ruang berdasarkan mata kuliah dan dosen. Sistem berbasis web dengan bahasa PHP-MySQL, dan metode waterfall. Tujuan : merancang aplikasi sistem informasi pendaftaran wisuda secara online pada UIN Jakarta.
Sistem Informasi Pendaftaran Wisuda Online (Studi Kasus : UIN Syarif Hidayatullah Jakarta). Dwi Martha Jingga. 2009. UIN Jakarta : Jakarta.
Kelebihan : memudahkan pengolahan data akademik oleh admin, dan menyajikan layanan informasi akademik secara online untuk mahasiswa. Kelemahan : belum adanya fitur penawaran mata kuliah dengan sistem paket dalam pengisian KRS, dan kajian penelitian belum dilakukan sepenuhnya. Kelebihan : mempermudah prodi dalam penentuan nilai, IPK, peminatan, dan sebagainya; serta mengcover SIMPERTI bila transkrip telat datangnya. Kelemahan : sistem belum dijalankan online hanya intranet, dan belum ada akun dosen untuk memasukkan nilai. Kelebihan : membantu penentuan hari, sesi, lokal, dan kelas untuk setiap kesediaan mengajar dosen; serta membantu verifikasi kesediaan mengajar dosen. Kelemahan : belum adanya modul absensi dosen, dan belum adanya sistem keamanan yang memadai. Kelebihan : mempermudah mengakses sistem untuk melihat informasi wisuda seperti jadwal dan syarat wisuda; serta sistem dijalankan secara online. Kelemahan : belum adanya fasilitas layanan transaksi pembayaran wisuda secara online dan sistem keamanannya yang kurang.
45
Aplikasi Sistem Penerimaan Mahasiswa Baru Berbasis Ujian Online Pada UIN Syarif Hidayatullah Jakarta. Muhammad Miftahudin. 2007. UIN Jakarta : Jakarta.
Sistem berbasis web dengan bahasa PHP-MySQL, dan metode prototyping. Tujuan : merancang aplikasi penerimaan mahasiswa baru yang membantu pihak akademik dalam menerapkan ujian masuk online oleh semua pihak jurusan.
Sistem Informasi Akademik Berbasis WAP (Wireless Application Protocol) Pada Sekolah Pasca Sarjana UIN Syarif Hidayatullah Jakarta. Elis Royanah. 2009. UIN Jakarta : Jakarta.
Sistem berbasis web pada admin dan WAP pada user dengan bahasa PHP-MySQL dan metode waterfall. Tujuan : merancang sistem akademik Sekolah Pasca Sarjana UIN berbasis WAP yang bisa diakses ponsel.
Pemanfaatan Teknologi Web Mobile Untuk Mengakses Data Mahasiswa Pada Sistem Informasi Akademik STMIK ProVisi Semarang. Neira Anjar Pujisusilo. 2006. STMIK ProVisi Semarang : Semarang.
Sistem mobile web dengan bahasa ASP.Net dan metode pendekatan terstruktur. Tujuan : merancang sistem akademik dengan menggunakan perangkat mobile dan berbasis mobile web.
Kelebihan : sistem ini memproses hasil ujian online lebih cepat, dan dapat menghemat biaya dan waktu dalam melakukan ujian masuk UIN. Kelemahan : belum adanya sistem pembayaran online, dan sistem terbatas hanya pada tes tulis saja dan hasilnya ada pada web. Kelebihan : menggunakan layanan WAP, dan dapat mengakses informasi akademik lewat handphone. Kelemahan : belum ada layanan yang memungkinkan user berinteraksi dengan sistem, dan informasi yang disampaikan terbatas hanya pada informasi akademik kuliah saja. Kelebihan : sistem dapat diakses melalui handphone, sistemnya sudah di-upload ke internet, dan memudahkan mahasiswa mengakses informasi akademik kampus. Kelemahan : belum adanya fitur sistem akademik untuk dosen dan pihak akademik fakultas, dan belum memiliki fasilitas untuk memasukan nilai dan jadwal.
46
Berdasarkan penelitian yang dibahas pada studi sejenis tadi, penulis melakukan perbandingan terhadap skripsi penulis dan hasilnya sebagai berikut. 1. Sistem akademik yang dirancang berbasis web pada admin sekolah dan berbasis mobile web pada user. 2. Menggunakan bahasa xHTML MP, PHP, jQuery, MySQL serta menggunakan metode incremental sebagai pengembangan sistemnya. 3. Memiliki fasilitas agar siswa, guru, wali siswa, dan pegawai dapat login ke halamannya masing-masing dengan username dan password yang sudah diberikan. 4. Memiliki fasilitas portal sekolah untuk melihat informasi sekolah yang diperuntukkan bagi tamu/masyarakat. 5. Wali siswa dapat melihat informasi akademik siswa dan memberikan saran kepada sekolah melalui akun wali siswa pada sistem ini.
BAB III METODOLOGI PENELITIAN
Metodologi penelitian yang digunakan oleh penulis dalam perancangan sistem akademik ini meliputi dua metode, yaitu metode pengumpulan data dan metode pengembangan sistem.
3.1 Metode Pengumpulan Data Metode yang penulis gunakan dalam pengumpulan data pada penulisan skripsi ini antara lain sebagai berikut. 1. Observasi, yaitu dengan mengamati keadaan pada tempat penelitian dan mengambil data-data yang diperlukan untuk penelitian. Observasi yang penulis lakukan adalah dengan cara mengamati sistem akademik sekolah yang berjalan di SMA Muhammadiyah 3 Tangerang. Selain itu, observasi yang juga dilakukan oleh penulis adalah dengan cara mengambil data-data penting untuk perancangan sistem akademiknya. Hasil dari observasi yang telah penulis lakukan dapat dilihat pada bab 4. Adapun waktu dan tempat observasi yang penulis lakukan adalah sebagai berikut. Waktu : 4 Agustus – 9 Desember 2010. Tempat : SMA Muhammadiyah 3 Tangerang.
47
48
2. Wawancara, yaitu dengan melakukan kegiatan tanya - jawab terhadap narasumber terkait agar mendapat informasi yang dibutuhkan untuk penelitian. Wawancara dilakukan penulis pada waktu melakukan riset di SMA Muhammadiyah 3 Tangerang dengan Kepala Sekolah dan PKS Bidang Kurikulum selaku pihak yang berperan penting dalam sistem akademik sekolah di sana. Adapun daftar wawancara serta waktu dan tempatnya dapat ditemukan pada daftar lampiran skripsi ini.
3. Studi pustaka, dilakukan dengan cara membaca dan mempelajari literatur dan buku-buku yang mendukung dengan topik yang dibahas dalam penyusunan skripsi ini. Selain itu juga penulis mengumpulkan data-data dari internet yang berhubungan dengan skripsi penulis. Adapun daftar dari studi pustaka yang telah penulis lakukan terdapat pada halaman daftar pustaka skripsi ini.
4. Studi sejenis, yakni dilakukan dengan mengumpulkan data melalui tugas akhir atau skripsi orang lain yang terkait dengan penelitian skripsi yang penulis lakukan sebagai referensi dan perbandingan dari skripsi penulis. Beberapa daftar studi sejenis yang penulis lakukan dapat dilihat pada bab 2.
49
3.2 Metode Pengembangan Sistem Metode pengembangan sistem yang digunakan penulis adalah metode incremental. Kelebihan dan kekurangan metode incremental ditampilkan dalam tabel berikut ini. Tabel 3.1 Kelebihan dan Kekurangan Metode Incremental Kelebihan Bersifat iteratif/pengulangan dan dapat mengakomodasi perubahan secara fleksibel. Mengutamakan kebutuhan user dan cocok untuk proyek berskala kecil. Produk yang dihasilkan semakin lama semakin lengkap sampai menghasilkan versi terlengkap karena mengalami perbaikan produk yang berkesinambungan. Memiliki resiko lebih rendah terhadap pengembangan sistem. Nilai penggunaan dapat ditentukan pada setiap increment sehingga fungsionalitas sistem disediakan lebih awal.
Kekurangan Butuh waktu yang relatif lama untuk menghasilkan produk yang terlengkap. Tidak cocok untuk diaplikasikan pada proyek berskala besar. Kebutuhan tidak didefinisikan secara penuh yang dapat membuat manajemen tidak nyaman.
Diperlukan perencanaan yang baik dan kerjasama user. Biaya dapat meningkat jika desain fisikal dan fungsi tidak terstruktur penuh.
Alasan penulis menggunakan metode incremental adalah: 1. Metode ini memiliki tahapan waterfall yang terstruktur dan bersifat perulangan, sehingga jika produk pada increment pertama kurang memuaskan user, pada increment berikutnya dapat dikembangkan sistem yang sesuai dengan evaluasi user melalui tahapan terstruktur. 2. Mengutamakan kepentingan user di mana kebutuhan-kebutuhan yang terpenting dimasukkan ke dalam tahap awal increment, dan produk increment-nya sudah bisa digunakan karena produk inti (core).
50
3. Metode ini sesuai dengan karakteristik web/mobile web di mana pada increment pertama web sudah bisa digunakan user dan pada increment berikutnya sistem web yang dikembangkan membutuhkan update/modifikasi data secara berkala.
Gambar 3.1 Model Incremental (sumber : Pressman, 2005 : 81)
Adapun tahap – tahap perancangan sistem yang penulis buat dengan metode incremental antara lain sebagai berikut. 1.
Communication (komunikasi), tahap awal yang dilakukan penulis dalam proses perancangan sistem adalah komunikasi (wawancara) dengan pihak yang berkepentingan dalam sistem akademik sekolah.
2.
Planning (perencanaan), dengan perencanaan dapat diperkirakan jangkauan proyek sistem akademik, pihak yang terlibat, waktu pengerjaannya, dan bahasa pemrograman yang dibutuhkan.
51
3.
Modeling (analysis and design), terdiri dari :
a. Analisis sistem, meliputi gambaran umum sekolah, analisis sistem
akademik yang berjalan, permasalahan pada sistem akademiknya, serta pemecahan masalah yang diusulkan oleh penulis. b. Desain sistem, meliputi desain arsitektur yaitu flow chart, DFD, dan
kamus data; desain basis data yaitu ERD, LRS, normalisasi, dan spesifikasi tabel database; desain antarmuka yaitu struktur menu dan tampilan layar; serta desain prosedural yaitu STD. 4. Construction (code and test), meliputi : a. Pengkodean, dengan bahasa pemrograman web/mobile web yaitu xHTML MP yang digabung dengan PHP, jQuery, dan MySQL. b. Pengujian, dilakukan dengan metode black box dan terdiri dari pengujian mandiri dan lapangan. Pengujian mandiri dilakukan oleh penulis sendiri dan dilakukan pada sistem mobile web dan web. Pengujian mobile web dilakukan pada Opera Mobile for Windows di localhost dan Opera Mini online pada handphone, serta web dilakukan pada Mozilla Firefox. Sedangkan pengujian lapangan dilakukan oleh pihak sekolah yaitu staf TU. 5. Deployment (delivery and feedback), setelah melakukan pengujian lapangan, sistem akademik dapat diserahkan (delivery) kepada pihak sekolah untuk dapat langsung digunakan, dan umpan balik (feedback)
dari
pihak
sekolah
sangat
mengembangkan sistem yang lebih baik lagi.
diperlukan
untuk
BAB IV PEMBAHASAN
4.1 Communication (Komunikasi) Tahap awal dari perancangan sistem adalah komunikasi. Tahap ini dilakukan dengan cara mengadakan wawancara dengan narasumber terkait. Adapun hasil wawancaranya dapat dilihat berikut ini. 1. Pelaksanaan sistem akademik di SMA Muhammadiyah 3 Tangerang untuk mengelola data akademik sekolah masih sederhana yaitu data disimpan dan dikelola di komputer sekolah. 2. Proses penyampaian informasi akademik kepada siswa dan guru dilakukan secara manual, yaitu informasi akademik langsung diberikan kepada guru dan untuk siswa ditempel pada mading sekolah serta surat pengumuman diberikan kepada wali kelas untuk disampaikan kepada siswa. 3. Penyampaian informasi akademis siswa dilakukan secara manual kepada wali siswa, yaitu dengan memberikan buku penghubung dari sekolah untuk mencatat aktivitas siswa dan wali siswa datang ke sekolah pada pengambilan raport setelah ujian semester. 4. Masyarakat
yang
ingin
mengetahui
informasi
dari
SMA
Muhammadiyah 3 Tangerang dapat dilakukan dengan cara datang ke sekolah secara langsung untuk berbicara kepada pihak sekolah, jika belum bisa datang maka dapat menghubungi nomor telepon sekolah.
52
53
4.2 Planning (Perencanaan) Perencanaan yang dilakukan oleh penulis meliputi hal berikut ini. 1. Sistem akademik dirancang berbasis mobile web pada sisi user dan berbasis web pada sisi admin sekolah. 2. Admin sekolah akan mengatur data-data pada sistem akademik sekolah berbasis web sedangkan user akan memperoleh informasi mengenai akademik sekolah berbasis mobile web. 3. Siswa, guru, dan pegawai dapat memperoleh informasi akademis mereka dengan mengakses sistem mobile web melalui handphone mereka. 4. Wali siswa mendapatkan informasi akademis siswa yang mereka butuhkan dengan mengakses sistem mobile web pada mobile phonenya masing-masing. 5. Pada sistem akademiknya terdapat portal sekolah yang disediakan bagi user tamu yang ingin mengetahui informasi sekolah. 6. Waktu pengerjaan sistem cukup lama yaitu memakan waktu kurang lebih 6 bulan. 7. Sistem akademik ini menggunakan bahasa xHTML MP sebagai bahasa markup mobile web yang digabungkan dengan bahasa pemrograman PHP, jQuery, dan MySQL. 8. Setiap pengguna memiliki hak akses yang berbeda terhadap sistem dengan diberikan username dan password oleh admin sekolah.
54
4.3 Modeling (Analysis and Design) 4.3.1 Analisis Sistem 4.3.1.1 Gambaran Umum Sekolah 1. Sejarah dan Latar Belakang SMA Muhammadiyah 3 Tangerang yang berlokasi di Jl. Perintis Kemerdekaan I No. 33 Cikokol Tangerang didirikan pada tahun 2000. Pada saat itu selama kurang lebih 2 tahun masih menginduk di SMA Muhammadiyah 1 Ciledug Tangerang, di bawah koordinator Bapak M. Ishak S.Pd.I, dengan jumlah siswa 16 orang.
Pada tahun 2003 tepatnya tanggal 21 April 2003, surat keputusan dari Ketua Pendidikan dan Kebudayaan No. 421/527-Dis-P&K tentang Ijin Pendirian SMA Muhammadiyah 3 Tangerang di Jl. Perintis Kemerdekaan I No. 33 Cikokol Tangerang, di bawah kepemimpinan Bapak Abd. Rohim, S.Ag, M.Pd. Dari mulai saat itulah dan sampai sekarang berada di Kompleks Perguruan Muhammadiyah Tangerang.
Latar belakang didirikannya sekolah tersebut di antaranya karena : 1. Pembangunan di bidang pendidikan merupakan tanggung jawab bersama. 2. Untuk meningkatkan sumber daya manusia yang berkualitas khususnya bagi umat Islam di wilayah Tangerang.
55
3. Banyaknya lulusan tingkat SMP setiap tahunnya yang tidak tertampung di sekolah negeri. 4. Menampung aspirasi warga Muhammadiyah untuk melanjutkan putra-putrinya dari SMP ke SMA Muhammadiyah. 5. Sebagai upaya penyemaian kader kepemimpinan persyarikatan Muhammadiyah.
2. Visi dan Misi Visi dari SMA Muhammadiyah 3 Tangerang adalah mewujudkan siswa yang unggul dalam berprestasi, berakhlak mulia, dan mandiri. Sedangkan misi dari SMA Muhammadiyah 3 Tangerang antara lain : 1. Memiliki kualitas akademik melalui pembelajaran yang optimal dan bermakna. 2. Memiliki kualitas ke-Islaman melalui tertib ibadah dan fasih membaca Al Qur’an. 3. Memiliki kualitas ke-Indonesiaan melalui disiplin dan ketrampilan paskibra. 4. Memiliki kualitas ke-Bahasaan dengan cara trampil dan mampu berbahasa Arab dan Inggris. 5. Memiliki kualitas ketrampilan komputer. 6. Memiliki kemampuan untuk melanjutkan ke jenjang pendidikan yang lebih tinggi.
56
3. Struktur Organisasi Struktur organisasi dari SMA Muhammadiyah 3 Tangerang dapat dilihat pada gambar di bawah ini.
Gambar 4.1 Struktur Organisasi SMA Muhammadiyah 3 Tangerang
4.3.1.2 Analisis Kebutuhan Sistem 1. Uraian Sistem yang Sedang Berjalan Pelaksanaan sistem akademik dan penyampaian informasinya yang berlangsung di SMA Muhammadiyah 3 Tangerang antara lain sebagai berikut. 1. Pembuatan informasi tentang sistem akademik ditentukan bersama dalam rapat keputusan sekolah dan bagian kurikulumlah yang merumuskan detail dari rancangan program yang telah ditentukan bersama tadi.
57
2. Hasil dari perumusan rancangan akademik diberikan bidang kurikulum kepada staf TU, lalu staf TU menyimpan informasi akademik tersebut pada komputer sekolah berupa softcopy dan berkas hardcopy disimpan pada arsip dokumen sekolah, lalu kopian berkas hardcopy informasi akademik disampaikan kepada siswa dan guru melalui mading sekolah agar diketahui sebagaimana mestinya. 3. Informasi akademik yang dibutuhkan siswa, disampaikan oleh staf TU melalui mading sekolah dan kemudian siswa mencatatnya. Sewaktu-waktu siswa juga diberikan kertas pengumuman dari sekolah untuk disampaikan kepada wali siswa/orang tua. Pada akhir semester siswa memperoleh informasi hasil belajarnya berupa rapor penilaian yang diberikan guru kepada wali siswa/orang tua. 4. Informasi akademik yang disampaikan kepada guru dipergunakan oleh guru untuk menjalankan aktivitas mengajarnya. Pada akhir semester guru juga menyampaikan informasi mengenai hasil prestasi belajar siswa berupa rapor penilaian siswa kepada wali siswa. 5. Pihak wali siswa/orang tua menerima informasi akademik sekolah yang disampaikan dari sekolah kepada siswa berupa surat pengumuman dan buku penghubung untuk mencatat aktivitas siswa agar diketahui oleh wali siswa, dan pada akhir semester wali siswa datang ke sekolah untuk memperoleh informasi nilai siswa dalam bentuk rapor siswa.
58
Kurikulum Membuat rumusan informasi akademik sekolah
Merancang data info tentang akademik sekolah
TU
Siswa
Guru
Wali Siswa
Mulai
Mendapat rancangan data info
Data info akademik
Menyam paikan informasi akademik
Mulai
Mendapat informasi akademik
Informasi akademik sekolah
Menyimpan data info akademik
Mempero leh informasi akademik Mulai
Selesai
Informasi akademik sekolah berupa hardcopy
Mulai
Mendapat informasi akademik
Pengumuman/ informasi akademik sekolah
Menyam paikan rapor siswa
Data info akademik sekolah berupa softcopy
Rapor nilai siswa
Memp eroleh rapor siswa
Informasi akademik sekolah Selesai
Selesai
Gambar 4.2 Flow Chart Sistem Akademik yang Berjalan
59
2. Analisis Masalah Kebutuhan Pengguna Penulis memaparkan beberapa hal yang menjadi kebutuhan pengguna pada sistem akademik SMA Muhammadiyah 3 Tangerang, yaitu sebagai berikut. 1. Staf TU membutuhkan suatu sistem yang berguna untuk mengatur data akademik sekolah dalam bentuk web sehingga memudahkan proses pengelolaan sistem akademik, karena selama ini arsip hardcopy informasi akademik disimpan di folder dokumen dan softcopy disimpan di komputer sekolah secara personal. 2. Siswa membutuhkan sistem yang menampilkan informasi akademik siswa dengan cepat untuk mendukung aktifitas belajar di sekolah. 3. Guru yang tidak berada di sekolah memerlukan suatu sistem yang menyajikan informasi akademik dengan cepat untuk menunjang kegiatan mengajar di sekolah. 4. Wali siswa membutuhkan sistem yang berguna untuk menyajikan informasi akademik siswa. Hal ini dilakukan agar wali siswa dapat mengetahui perkembangan akademis siswa dengan cepat dan mudah. Wali siswa juga membutuhkan media untuk membicarakan tentang perkembangan siswa di sekolah melalui suatu forum atau memberikan saran kepada sekolah. 5. Pegawai yang tidak sedang berada di sekolah membutuhkan informasi akademik dengan cepat pada suatu sistem untuk memperlancar aktifitasnya di sekolah.
60
6. Masyarakat yang ingin mengetahui informasi tentang sekolah tetapi belum sempat datang ke sekolah secara langsung memerlukan suatu sistem untuk mendapatkan informasi sekolah dengan mudah melalui portal sekolah bagi user tamu. Di samping itu, sekolah juga memerlukan suatu adanya media promosi untuk mengenalkan sekolah kepada masyarakat luas.
3. Solusi Pemecahan Masalah Dengan melihat masalah kebutuhan pengguna yang terjadi, maka penulis mengusulkan solusi pemecahan masalah tersebut sehingga diharapkan sistem ini nantinya akan dapat membantu sekolah dalam mengatur sistem akademiknya. Solusi yang penulis usulkan adalah dengan merancang sistem akademik sekolah berbasis mobile web pada sisi user dan berbasis web pada sisi admin sekolah. Adapun solusi kebutuhan pengguna yang akan terdapat pada sistem yang diusulkan antara lain sebagai berikut. 1. Staf TU dalam sistem ini berperan sebagai admin sekolah yang berperan mengelola data akademik sekolah. Admin juga berperan mengontrol pengguna dalam sistem, dan memberikan hak akses pengguna
terhadap
sistem.
Admin
sekolah
bertugas
untuk
menambah/memasukkan data akademik yang baru, mengubah data akademik yang lama, dan menghapus data akademik yang sudah tidak diperlukan lagi.
61
2. Siswa mempunyai username dan password dalam sistem yang ditentukan admin sekolah. Siswa berhak login ke sistem, melihat dan mengubah biodatanya, mengubah password, melihat nilai siswa, absensi siswa, jadwal pelajaran, dan info akademik. 3. Guru memiliki user account dalam sistem yang ditentukan admin. Guru berhak login ke sistem, melihat dan mengubah biodatanya, mengubah password, melihat data kelas, absensi guru, dan jadwal pelajaran. 4. Wali siswa mendapatkan user account dari admin sekolah. Wali siswa berhak login ke sistem, melihat dan mengubah datanya, mengubah password, melihat data siswa, info akademik, dan memberikan saran kepada sekolah melalui kotak saran wali. 5. Pegawai memiliki user account dalam sistem. Pegawai berhak login ke sistem, melihat dan mengubah biodatanya, mengubah password, melihat absensi pegawai, profil kepsek dan membalas saran dari wali siswa. 6. Masyarakat/user tamu mendapatkan informasi sekolah melalui portal sekolah seperti berita sekolah, profil, galeri, dan kontak sehingga hal ini juga menjadi media promosi untuk memperkenalkan sekolah kepada masyarakat. 7. Setiap pengguna kecuali tamu memiliki hak akses (priviledge) yang berbeda untuk bisa login ke dalam sistem, dengan memakai username dan password yang diberikan admin sekolah.
62
Berikut ini merupakan usulan rancangan pemecahan masalah dengan flow chart. TU/Admin Mendapat rancangan hardcopy info akademik
Berkas info akademik sekolah
Input data, edit, delete dan simpan data pada sistem akademik web
Data akademik sekolah berupa softcopy pada sistem web
Guru
Siswa
Wali Siswa
Mulai
Memberikan penilaian siswa
Berkas penilaian/ absensi siswa Membaca informasi akademik dengan layanan mobile web
Informasi akademik sekolah Mulai Selesai Melihat informasi akademik sekolah dengan layanan WAP/mobile web
Informasi akademik sekolah
Selesai
Mulai
Mencari informasi akademis siswa termasuk nilai dan absensi siswa pada layanan mobile web
Pengumuman/ informasi akademik termasuk nilai dan absensi siswa
Selesai
Gambar 4.3 Flow Chart Sistem Akademik yang diusulkan
63
Ilustrasi cara kerja sistem akademik yang penulis usulkan yaitu :
Perangkat Mobile Web Siswa Guru Wali Siswa Pegawai Alumni Tamu
Server Web Request (URL)
Response (Content)
Web Hosting Request (URL)
HTTP Server Content
WAP Micro Browser
Push (Content)
Komputer Web Admin Sekolah
Response (Content)
HTTP Client
Push Initiator
Gambar 4.4 Cara Kerja Sistem Akademik yang diusulkan Berikut ini adalah penjelasan dari diagram di atas. 1. Pengguna yaitu siswa, guru, wali siswa, pegawai, alumni, dan tamu meminta layanan mobile web pada URL micro bowser lalu micro browser menerjemahkannya ke dalam HTTP request. Pada saat yang hampir sama komputer web yaitu admin sekolah meminta layanan (request) kepada server web/web hosting. 2. Micro browser kemudian meneruskan request tersebut kepada server web dalam hal ini web hosting untuk meminta konten. Lalu server web memproses request dari komputer web dan mobile web. 3. Kemudian server web mengirimkan respon berupa konten yang diminta ke micro browser dan komputer web. Server web juga melakukan push initiator yakni mengirimkan konten kepada user mobile web walaupun konten tersebut tidak diminta oleh user. Respon dan push pada micro browser diterima dan diterjemahkan.
64
4.3.2 Desain Sistem 4.3.2.1 Desain Arsitektur 1. DFD (Data Flow Diagram) Penulis menggunakan DFD untuk menggambarkan alur proses dari sistem secara logika. Berikut merupakan rancangan DFD-nya. melalui web
login admin biodata dan password siswa nilai siswa absensi siswa jadwal pelajaran guru absensi guru kelas wali siswa pegawai absensi pegawai portal sekolah
Admin/TU
verifikasi login data siswa data nilai siswa data absensi siswa data jadwal pelajaran data guru data absensi guru data kelas data wali siswa data pegawai data absensi pegawai data portal sekolah
login guru ubah biodata guru lihat data kelas lihat absensi guru lihat jadwal pelajaran
Guru
melalui mobile web verifikasi login biodata guru data kelas absensi guru jadwal pelajaran
melalui mobile web login siswa Siswa ubah biodata siswa lihat nilai siswa lihat absensi siswa lihat jadwal pelajaran
verifikasi login biodata siswa nilai siswa absensi siswa jadwal pelajaran
SISTEM AKADEMIK SEKOLAH BERBASIS MOBILE WEB
login wali siswa ubah data wali siswa lihat data siswa lihat info akademik isi saran wali melalui mobile web verifikasi login data wali siswa data siswa info akademik kotak saran wali
login pegawai ubah biodata pegawai lihat absensi pegawai lihat profil kepsek balas saran wali
Pegawai
Wali Siswa
lihat berita sekolah lihat profil sekolah lihat galeri isi data tamu pada kontak verifikasi login biodata pegawai absensi pegawai profil kepsek balasan saran wali
info portal sekolah meliputi : berita sekolah profil sekolah User Tamu galeri kontak
melalui mobile web
melalui mobile web
Gambar 4.5 Diagram Konteks yang diusulkan
65
Login admin, biodata dan password, siswa, nilai siswa, absensi siswa, jadwal pelajaran, guru, absensi guru, kelas, wali siswa, pegawai, absensi pegawai, dan portal sekolah Admin/TU
Verifikasi login, data siswa, data nilai siswa, data absensi siswa, data jadwal pelajaran, data guru, data absensi guru, data kelas, data wali siswa, data pegawai, data absensi pegawai, dan data portal sekolah 1.0 pegawai, Mengatur Data Verifikasi login, data siswa, data Login admin, biodata dan password, Akademik nilai siswa, data absensi siswa, siswa, nilai siswa, absensi siswa, data jadwal pelajaran, data guru jadwal pelajaran, guru, absensi data absensi guru, data kelas, guru, kelas, wali siswa, pegawai, data wali siswa, data pegawai, absensi pegawai, dan portal sekolah data absensi pegawai, dan data portal sekolah Login siswa, ubah biodata siswa, lihat nilai siswa, lihat absensi siswa, dan lihat jadwal pelajaran
Siswa Verifikasi login, biodata siswa, nilai siswa, absensi siswa, dan jadwal pelajaran Login guru, ubah biodata guru lihat data kelas, lihat absensi guru, dan lihat jadwal pelajaran Guru Verifikasi login, biodata guru, data kelas, absensi guru, dan jadwal pelajaran Login wali siswa, ubah data wali siswa, lihat data siswa, lihat info akademik, dan isi saran wali Wali Siswa Verifikasi login, data wali siswa, data siswa, info akademik, dan kotak saran wali Login pegawai, ubah biodata pegawai, lihat absensi pegawai, lihat profil kepsek ,dan balas saran wali Pegawai Verifikasi login, biodata pegawai, absensi pegawai, profil kepsek, dan balasan saran wali
Lihat berita sekolah, lihat profil sekolah,lihat galeri dan isi data tamu pada kontak User Tamu Info portal sekolah meliputi berita sekolah, profil sekolah, galeri, dan kontak
2.0 Mencari Informasi Akademik Siswa
3.0 Mencari Informasi Akademik Guru
Verifikasi login, biodata siswa, nilai siswa, absensi siswa, dan jadwal pelajaran
Login siswa, ubah biodata siswa, lihat nilai siswa, lihat absensi siswa, dan lihat jadwal pelajaran Verifikasi login, biodata guru, data kelas, absensi guru, dan jadwal pelajaran
Login guru, ubah biodata guru, lihat data kelas, lihat absensi guru, dan lihat jadwal pelajaran db_mobile_akasekolah Verifikasi login, data wali siswa, data siswa, 4.0 info akademik,kotak saran wali Mencari Informasi Login wali siswa, ubah data Akademik wali siswa, lihat data siswa,lihat Siswa info akademik dan isi saran wali
Info portal sekolah meliputi berita sekolah, profil sekolah, galeri, dan kontak
Lihat berita sekolah, lihat profil sekolah, lihat galeri, dan isi data tamu pada kontak
Gambar 4.6 DFD Level 0 yang diusulkan
66
Login admin, biodata dan password
Verifikasi login 1.1 Login Admin
Verifikasi login
Data siswa, data nilai siswa, data absensi siswa, dan data jadwal pelajaran
Siswa, nilai siswa, absensi siswa, dan jadwal pelajaran
Data siswa, data nilai siswa, data absensi siswa, dan data jadwal pelajaran
Guru, absensi guru, dan kelas
Data guru, data absensi guru, dan data kelas
Admin/ TU
Wali siswa
Data wali siswa
Pegawai, dan absensi pegawai Data pegawai, dan data absensi pegawai
Portal sekolah
Data portal sekolah
admin Login admin, biodata dan password
1.2 Lihat/Tambah/ Ubah/Hapus Data Siswa
1.3 Lihat/Tambah/ Ubah/Hapus Data Guru
1.4 Lihat/Tambah/ Ubah/Hapus Data Wali Siswa
1.5 Lihat/Tambah/ Ubah/Hapus Data Pegawai
1.6 Lihat/Tambah/ Ubah/Hapus Data Portal Sekolah
siswa Siswa, nilai siswa, absensi siswa, dan jadwal pelajaran
Data guru, data absensi guru, dan data kelas
guru Guru, absensi guru, dan kelas
Data wali siswa
wali_siswa
Wali siswa
Data pegawai, dan data absensi pegawai
pegawai Pegawai, dan absensi pegawai
Data portal sekolah
portal Portal sekolah
Gambar 4.7 DFD Level 1 Proses 1.0
67
Login siswa dan ubah biodata siswa
Verifikasi login dan biodata siswa
Login siswa dan lihat nilai siswa
Veriifikasi login dan nilai siswa
Verifikasi login dan biodata siswa 2.1 Lihat/Ubah Biodata Siswa
2.2 Lihat Nilai Siswa
siswa Login siswa dan ubah biodata siswa
Verifikasi login dan dan nilai siswa
nilai_siswa Login siswa dan lihat nilai siswa
Siswa Verifikasi login dan absensi siswa
2.3 Lihat Absensi Siswa
Login siswa dan lihat absensi siswa
Login siswa dan lihat absensi siswa
absensi_siswa Verifikasi login dan absensi siswa
Verifikasi login dan jadwal pelajaran
Login siswa dan lihat jadwal pelajaran
2.4 Lihat Jadwal Pelajaran
Login siswa dan lihat jadwal pelajaran
jadwalpelajaran Verifikasi login dan jadwal pelajaran
Gambar 4.8 DFD Level 1 Proses 2.0 Login guru dan ubah biodata guru
Verifikasi login dan biodata guru
Login guru dan lihat data kelas
Verifikasi login dan data kelas
3.1 Lihat/Ubah Biodata Guru
3.2 Lihat Data Kelas
Verifikasi login dan biodata guru
guru Login guru dan ubah biodata guru
Verifikasi login dan data kelas
data_kelas Login guru dan lihat data kelas
Guru Verifikasi login dan absensi guru
3.3 Lihat Absensi Guru
Login guru dan lihat absensi guru
Login guru dan lihat absensi guru
absensi_guru Verifikasi login dan absensi guru
Verifikasi login dan jadwal pelajaran
Login guru dan lihat jadwal pelajaran
3.4 Lihat Jadwal Pelajaran
Login guru dan lihat jadwal pelajaran
jadwalpelajaran Verifikasi login dan jadwal pelajaran
Gambar 4.9 DFD Level 1 Proses 3.0
68
Login wali siswa dan ubah data wali siswa
Verifikasi login dan data wali siswa
Login wali siswa dan dan lihat data siswa
Verifikasi login dan data siswa
4.1 Lihat/Ubah Data Wali Siswa
4.2 Lihat Data Siswa
Verifikasl login dan data wali siswa
wali_siswa Login wali siswa dan ubah data wali siswa
Verifikasi login dan data siswa
siswa Login wali siswa dan lihat data siswa
Wali Siswa Verifikasi login dan info akademik
Login wali siswa dan lihat info akademik Verifikasi login dan kotak saran wali
4.3 Lihat Info Akademik
4.4 Kotak Saran Wali Siswa
Login wali siswa dan isi saran wali
Login wali siswa dan lihat info akademik
guru Verifikasi login dan info akademik Login wali siswa dan isi saran wali
kotaksaran_wali Verifikasi login dan kotak saran wali
Gambar 4.10 DFD Level 1 Proses 4.0 Login pegawai dan ubah biodata pegawai
Verifikasi login dan biodata pegawai Login pegawai dan lihat absensi pegawai Verifikasi login dan absensi pegawai
5.1 Lihat/Ubah Biodata Pegawai
5.2 Lihat Absensi Pegawai
Verifikasi login dan biodata pegawai
pegawai Login pegawai dan ubah biodata pegawai Verifikasi login dan absensi pegawai
absensipeg Login pegawai dan lihat absensi pegawai
Pegawai Verifikasi login dan profil kepsek
5.3 Lihat Profil KepSek
Login pegawai dan lihat profil kepsek
Verifikasi login dan balas saran wali
Login pegawai dan balasan saran wali
Login pegawai dan lihat profil kepsek
pegawai Verifikasi login dan profil kepsek
5.4 Balas Saran Wali Siswa
Login pegawai dan balasan saran wali
kotaksaran_wali Verifikasi login dan balas saran wali
Gambar 4.11 DFD Level 1 Proses 5.0
69
Lihat berita sekolah
Berita sekolah 6.1 Lihat Berita Sekolah
Berita sekolah
Lihat profil sekolah
6.2 Lihat Profil Sekolah
Profil sekolah
berita Lihat berita sekolah
Profil sekolah
profil Lihat profil sekolah
User Tamu 6.3 Lihat Galeri Foto
Galeri
Lihat galeri
Lihat galeri
galeri Galeri
Kontak
6.4 Lihat Kontak
Isi data tamu pada kontak
Isi data tamu pada kontak
kontak Kontak
Gambar 4.12 DFD Level 1 Proses 6.0
2. Kamus Data Kamus data digunakan sebagai alat komunikasi antara analisis sistem dengan user sistem tentang data yang masuk ke sistem dan informasi yang dibutuhkan oleh user sistem, adapun kamus data pada sistem yang penulis rancang adalah sebagai berikut. a. Spesifikasi Proses 1)
DFD
: level 1 proses 1.0 admin
No. proses
: 1.1
Nama proses : Login admin Masukan
: username, password, nama lengkap, email
Keluaran
: daftar admin
Deskripsi
: Login admin dan mengolah data admin sekolah
70
2)
DFD
: level 1 proses 1.0 admin
No. proses
: 1.2
Nama proses : Lihat/tambah/ubah/hapus data siswa Masukan
: username, password, nis, nama lengkap, kelas, jenis kelamin, tempat tanggal lahir, agama, alamat
Keluaran
: daftar siswa, nilai siswa, absensi siswa, jadwal pelajaran, info akademik
3)
Deskripsi
: Mengolah data siswa
DFD
: level 1 proses 1.0 admin
No. proses
: 1.3
Nama proses : Lihat/tambah/ubah/hapus data guru Masukan
: username, password, nip, nama lengkap, jenis kelamin, tempat tanggal lahir, agama, alamat
Keluaran
: daftar guru, data kelas, absensi guru, jadwal pelajaran
4)
Deskripsi
: Mengolah data guru
DFD
: level 1 proses 1.0 admin
No. proses
: 1.4
Nama proses : Lihat/tambah/ubah/hapus data wali siswa Masukan
: username, password, nama lengkap, nama siswa, jenis kelamin, agama, telepon, email, alamat
Keluaran
: daftar wali siswa, daftar saran wali siswa
Deskripsi
: Mengolah data wali siswa
71
5)
DFD
: level 1 proses 1.0 admin
No. proses
: 1.5
Nama proses : Lihat/tambah/ubah/hapus data pegawai Masukan
: username, password, nip, nama lengkap, jenis kelamin, tempat tanggal lahir, agama, alamat
6)
Keluaran
: daftar pegawai, daftar absensi pegawai
Deskripsi
: Mengolah data pegawai
DFD
: level 1 proses 1.0 admin
No. proses
: 1.6
Nama proses : Lihat/tambah/ubah/hapus data portal sekolah Masukan
4.3.2.2 Desain Basis Data 1. ERD (Entity Relation Diagram)
Gambar 4.13 ERD Sistem Akademik Sekolah
80
2. LRS (Logical Record Sructure)
Gambar 4.14 LRS Sistem Akademik Sekolah
81
3. Normalisasi Normalisasi bertujuan untuk menentukan pengelompokkan atributatribut dalam sebuah relasi sehingga diperoleh relasi yang berstruktur baik, yaitu relasi yang mengandung redudansi sedikit mungkin. a. Bentuk tidak normal (unnormalized form), merupakan kumpulan seluruh data yang disimpan dalam database. Data ini masih terduplikasi dan multivalue karena data dikumpulkan apa adanya. Bentuk tak normal dari sistem yang penulis rancang sebagai berikut. Tabel 4.1 Bentuk Tidak Normal Sistem Akademik Sekolah id_siswa kelas username_siswa password_siswa nis nama_siswa jk ttl agama alamat notlp email foto id_guru username_guru password_guru nip nama_guru jk ttl agama alamat notlp email pendidikan jabatan foto
id_pegawai username_pegawai password_pegawai nip nama_pegawai jk ttl agama alamat notlp email pendidikan jabatan foto id_wali username_wali password_wali nama_wali namasiswa jk agama notlp email alamat id_nilai siswa guru
kelas wali semester thnpelajaran kkm kognitif psikomotorik afektif nilaiharian nilaiharian2 nilaiharian3 nilaiharian4 nilaiharian5 nilaiharian6 ratanilaiharian nilaimid nilaiulum id_absensi siswa guru kelas wali semester thnpelajaran bulan jumlahhadir jumlahsakit
jumlahijin jumlahalpa jumlahabsensi id_absensi guru semester bulan thnpelajaran jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi id_absensi pegawai semester bulan thnpelajaran jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi id_jadwal kelas semester hari
jam jamke namaguru thnajaran id_kelas kelas walikelas jumlahsiswa tahunajaran id_tamu nama_tamu email id_kontak tamu tanggal waktu pesan id_album judul_album gambar_album id_galeri id_album judul_galeri gambar_galeri keterangan
82
b. Bentuk normal pertama (first NF), dilakukan dengan cara menghilangkan beberapa atribut data yang berulang atau bernilai ganda sehingga diperoleh atribut tunggal pada setiap entitasnya. Bentuk normal pertama sistem yang penulis rancang sebagai berikut. Siswa id_siswa kelas username_siswa password_siswa nis nama_siswa jk ttl agama alamat notlp email foto
Absensi Siswa id_absensi siswa guru kelas wali semester thnpelajaran bulan jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi
Guru id_guru username_guru password_guru nip nama_guru jk ttl agama alamat notlp email pendidikan jabatan foto
Absensi Guru id_absensi guru semester bulan thnpelajaran jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi
Tamu id_tamu nama_tamu email
Pegawai id_pegawai username_pegawai password_pegawai nip nama_pegawai jk ttl agama alamat notlp email pendidikan jabatan foto
Absensi Pegawai id_absensi pegawai semester bulan thnpelajaran jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi
Kontak id_kontak tamu tanggal waktu pesan
Wali Siswa id_wali username_wali password_wali nama_wali namasiswa jk agama notlp email alamat
Jadwal Pelajaran id_jadwal kelas semester hari jam jamke namaguru thnajaran
Album Foto id_album judul_album gambar_album
Nilai Siswa id_nilai siswa guru kelas wali semester thnpelajaran kkm kognitif psikomotorik afektif nilaiharian nilaiharian2 nilaiharian3 nilaiharian4 nilaiharian5 nilaiharian6 ratanilaiharian nilaimid nilaiulum
Data Kelas id_kelas kelas walikelas jumlahsiswa tahunajaran
Galeri Foto id_galeri album judul_galeri gambar_galeri keterangan
Gambar 4.15 Bentuk Normal Pertama Sistem Akademik Sekolah
83
c. Bentuk normal kedua (second NF), sudah berada dalam bentuk normal pertama dan dilakukan dengan cara menentukan primary key dari tiap-tiap entitas sehingga atribut non primary key harus memiliki ketergantungan fungsional sepenuhnya pada primary key. Bentuk normal kedua dari sistem yang penulis rancang sebagai berikut. Siswa id_siswa * id_kelas ** username_siswa password_siswa nis nama_siswa jk ttl agama alamat notlp email foto
Gambar 4.16 Bentuk Normal Kedua Sistem Akademik Sekolah
84
4. Spesifikasi Tabel Database Dalam perancangan sistem akademik sekolah ini, penulis menspesifikasikan
tabel-tabel
yang
terdapat
pada
database
db_mobile_akasekolah. Adapun spesifikasi tabel database yang penulis rancang adalah sebagai berikut. Tabel 4.2 Tabel Siswa Field id_siswa * id_kelas ** username_siswa password_siswa nis nama_siswa jk ttl agama alamat notlp email foto
Jenis int(10) int(10) varchar(200) varchar(200) text
89
4.3.2.3 Desain Antarmuka 1. Struktur Menu a. Struktur Menu Mobile Web Pada User Visi & Misi
Beranda
Fasilitas Profil Ekstrakurikuler Prestasi Sekolah Biodata Siswa Nilai Siswa Siswa
Absensi Siswa Jadwal Pelajaran Info Akademik
Biodata Guru Data Kelas
Guru
Absensi Guru Jadwal Pelajaran
Menu Data Wali Siswa WaliSiswa
Data Siswa Info Akademik Kotak Saran Biodata Pegawai Absensi Pegawai
Pegawai
Profil KepSek Balas Saran
Galeri
Album Galeri Foto
Galeri Foto
Kontak
Gambar 4.17 Struktur Menu Mobile Web
90
b. Struktur Menu Web Pada Admin Pengguna
Admin Sistem
Tambah Data Admin Ubah Password Admin
Siswa
Tambah Data Siswa Lihat Nilai Siswa Lihat Absensi Siswa Lihat Jadwal Pelajaran
Guru
Tambah Data Guru Lihat Data Kelas Lihat Absensi Guru
Menu
Lihat Jadwal Pelajaran Wali Siswa
Tambah Data Wali Siswa Lihat Kotak Saran
Pegawai
Tambah Data Pegawai Lihat Absensi Pegawai
Sekolah
Berita Sekolah Prestasi Sekolah Ekstrakurikuler
Galeri
Tambah Data Album
Kontak
Tambah Data Galeri
Gambar 4.18 Struktur Menu Web
91
2. Tampilan Layar a. Tampilan Layar Mobile Web Pada User Judul Header
Judul Header
Menu
Menu
e
Tanggal
Tanggal Hasil Cari Berita Sekolah
Berita Sekolah Cari Berita
Cari
Footer
Footer
Gambar 4.19 Halaman Beranda
Gambar 4. 20 Halaman Cari Berita
Judul Header
Judul Header
Menu
Menu
Tanggal
Tanggal
Detail Berita Sekolah
Profil Sekolah
Footer
Footer
Gambar 4.21 Halaman Detail Berita
Gambar 4.22 Halaman Profil Sekolah
92
Judul Header
Judul Header
Menu
Menu
Tanggal
Tanggal
Visi dan Misi
Fasilitas
Footer
Footer
Gambar 4.23 Halaman Visi & Misi
Gambar 4.24 Halaman Fasilitas
Judul Header
Judul Header
Menu
Menu
Tanggal
Tanggal
Ekstrakurikuler
Prestasi Sekolah
Footer
Footer
Gambar 4.25 Halaman Ekstrakurikuler Gambar 4.26 Halaman Prestasi Sekolah
93
Judul Header
Judul Header
Menu
Menu
Tanggal
Username
:
Password
:
Tanggal
Siswa
Guru
Login Siswa
Login Guru Username
:
Password
:
Login
Login
Footer
Footer
Gambar 4.27 Halaman Login Siswa
Gambar 4.28 Halaman Login Guru
Judul Header
Judul Header
Menu
Menu Tanggal
Tanggal
Wali Siswa
Pegawai
Login Wali Siswa
Login Pegawai
Username
:
Password
:
Username
:
Password
:
Login
Login
Footer
Footer
Gambar 4.29 Halaman Login Wali Siswa Gambar 4.30 Halaman Login Pegawai
94
Judul Header
Judul Header
Menu
Menu
Tanggal
Tanggal
Kotak Saran Wali Siswa
Album Galeri Foto
Footer
Footer
Gambar 4.31 Halaman Kotak Saran Wali
Gambar 4.32 Halaman Album Foto
Judul Header
Judul Header
Menu
Menu
Tanggal
Tanggal
Galeri Foto
Kontak
Footer
Footer
Gambar 4.33 Halaman Galeri Foto
Gambar 4.34 Halaman Kontak
95
b. Tampilan Layar Web Pada Admin Judul Header
Logo
Login Admin Username : Password : Login
Footer
Gambar 4.35 Desain Halaman Login Admin Judul Header
Logo
Beranda Admin Menu Utama
Footer
Gambar 4.36 Desain Halaman Beranda Admin
Judul Header
Logo
Menu Daftar Admin
Footer
Gambar 4.37 Desain Halaman Daftar Admin
96
Judul Header
Logo
Menu Daftar Siswa
Footer
Gambar 4.38 Desain Halaman Daftar Siswa Judul Header
Logo Menu
Form Tambah Nilai Siswa
Daftar Semua Nilai Siswa
Footer
Gambar 4.39 Desain Halaman Daftar Nilai Siswa
Judul Header
Logo Menu
Form Tambah Absensi Siswa
Daftar Semua Absensi Siswa
Footer
Gambar 4.40 Desain Halaman Daftar Absensi Siswa
97
Judul Header
Logo Menu
Form Tambah Jadwal Pelajaran
Daftar Jadwal Pelajaran
Footer
Gambar 4.41 Desain Halaman Daftar Jadwal Pelajaran
Judul Header
Logo
Menu Daftar Guru
Footer
Gambar 4.42 Desain Halaman Daftar Guru
Judul Header
Logo
Menu Daftar Wali Siswa
Footer
Gambar 4.43 Desain Halaman Daftar Wali Siswa
98
Judul Header
Logo
Menu Daftar Pegawai
Footer
Gambar 4.44 Desain Halaman Daftar Pegawai
Logo
Judul Header
Menu Form Tambah Berita Sekolah
Daftar Berita Sekolah
Footer
Gambar 4.45 Desain Halaman Daftar Berita Sekolah
Logo
Judul Header
Menu Form Tambah Prestasi Sekolah
Daftar Prestasi Sekolah
Footer
Gambar 4.46 Desain Halaman Daftar Prestasi Sekolah
99
Judul Header
Logo Menu
Form Tambah Ekstrakurikuler
Daftar Ekstrakurikuler
Footer
Gambar 4.47 Desain Halaman Daftar Ekstrakurikuler
Logo
Judul Header
Menu Album Galeri Foto
Footer
Gambar 4.48 Desain Halaman Album Galeri Foto
4.3.2.4 Desain Prosedural Dalam mendesain sistem akademik secara prosedural, penulis menggunakan STD (State Transition Diagram) untuk menggambarkan cara kerja dari sistem akademik sekolah. Adapun rincian diagram STDnya dapat dilihat berikut ini.
100
1. STD Mobile Web Pada User Buka URL Tampilkan layar menu Beranda Menu
Klik Berita Selengkapnya Tampilkan detail berita
Klik Cari Berita Tampilkan cari berita
Detail Berita Sekolah
Cari Berita Sekolah
Gambar 4.49 STD Halaman Beranda
Menu Klik Beranda Kembali ke beranda
Beranda
Gambar 4.50 STD Halaman Detail Berita Sekolah
Menu
Klik Berita Selengkapnya Tampilkan detail berita
Detail Berita Sekolah
Klik Beranda Kembali ke beranda
Beranda
Gambar 4.51 STD Halaman Cari Berita Sekolah
101
Menu
Klik Visi & Misi Klik Fasilitas Klik Ekstrakurikuler Klik Prestasi Sekolah Tampilkan visi & misi Tampilkan fasilitas Tampilkan ekstrakurikuler Tampilkan prestasi sekolah
Visi dan Misi
Fasilitas
Ekstrakurikuler
Prestasi Sekolah
Gambar 4.52 STD Halaman Profil Sekolah
Menu
Klik Siswa Tampilkan halaman login siswa
Klik Login Siswa Masuk ke halaman siswa
Login Siswa
Siswa
Gambar 4.53 STD Halaman Login Siswa
Menu
Klik Ubah Biodata Ubah biodata siswa
Ubah Biodata Siswa
Klik Ubah Password Klik Lihat Data Semua Siswa Klik Logout Ubah password siswa Lihat data semua siswa Keluar dari siswa
Ubah Password Siswa
Data Semua Siswa
Gambar 4.54 STD Halaman Biodata Siswa
Logout Siswa
102
Menu
Klik Lihat Semua Nilai Siswa Lihat semua nilai siswa
Pilih Data Tampilkan nilai siswa
Nilai Siswa
Klik Logout Keluar dari siswa
Semua Nilai Siswa
Logout Siswa
Gambar 4.55 STD Halaman Nilai Siswa
Menu
Pilih Data Tampilkan absensi siswa
Klik Lihat Semua Absensi Siswa Lihat absensi semua siswa
Absensi Siswa
Semua Absensi Siswa
Klik Logout Keluar dari siswa
Logout Siswa
Gambar 4.56 STD Halaman Absensi Siswa
Menu
Pilih Kelas Tampilkan jadwal pelajaran
Jadwal Pelajaran
Klik Semua Jadwal Pelajaran Lihat semua jadwal pelajaran
Semua Jadwal
Klik Logout Keluar dari siswa
Logout Siswa
Gambar 4.57 STD Halaman Jadwal Pelajaran Siswa
103
Menu
Klik Login Guru Masuk ke halaman guru
Klik Guru Tampilkan halaman login guru
Login Guru
Guru
Gambar 4.58 STD Halaman Login Guru
Menu
Klik Ubah Biodata Ubah biodata guru
Klik Ubah Password Ubah password guru
Ubah Biodata Guru
Ubah Password Guru
Klik Lihat Data Semua Guru Lihat data semua guru
Data Semua Guru
Klik Logout Keluar dari guru
Logout Guru
Gambar 4.59 STD Halaman Biodata Guru
Menu
Klik Data Kelas Tampilkan data kelas
Klik Logout Keluar dari guru
Data Kelas
Logout Guru
Gambar 4.60 STD Halaman Data Kelas
104
Menu
Masukkan Data Tampilkan absensi guru
Klik Lihat Semua Absensi Guru Lihat semua absensi guru
Absensi Guru
Klik Logout Keluar dari guru
Semua Absensi Guru
Logout Guru
Gambar 4.61 STD Halaman Absensi Guru
Menu
Pilih Kelas Tampilkan jadwal pelajaran
Klik Semua Jadwal Pelajaran Lihat semua jadwal pelajaran
Klik Kembali ke Data Semua Siswa Lihat data semua siswa
Klik Logout Keluar dari wali siswa
Cari Nilai Siswa
Data Semua Siswa
Logout Wali Siswa
Gambar 4.66 STD Halaman Data Nilai Siswa Pada Wali
106
Menu
Klik Data Kelas Lihat data kelas
Klik Logout Keluar dari wali siswa
Data Kelas
Logout Wali Siswa
Gambar 4.67 STD Halaman Info Akademik Pada Wali
Menu
Klik Logout Keluar dari wali siswa
Klik Tombol Form Kotak Saran Tampilkan saran wali siswa
Kotak Saran Wali
Logout Wali Siswa
Gambar 4.68 STD Halaman Kotak Saran Wali Siswa
Menu
Login Pegawai Masuk ke halaman pegawai
Klik Pegawai Tampilkan halaman login pegawai
Login Pegawai
Pegawai
Gambar 4.69 STD Halaman Login Pegawai
107
Menu
Klik Ubah Biodata Klik Ubah Password Klik Lihat Data Semua Pegawai Klik Logout Ubah biodata pegawai Ubah password pegawai Lihat data semua pegawai Keluar dari pegawai
Ubah Biodata Pegawai
Ubah Password Pegawai
Data Semua Pegawai
Logout Pegawai
Gambar 4.70 STD Halaman Biodata Pegawai
Menu
Masukkan Data Tampilkan absensi pegawai
Absensi Pegawai
Klik Lihat Semua Absensi Pegawai Lihat semua absensi pegawai
Klik Logout Keluar dari pegawai
Semua Absensi Pegawai
Logout Pegawai
Gambar 4.71 STD Halaman Absensi Pegawai
Menu
Klik Tombol Form Balas Saran Tampilkan balas saran wali siswa
Balas Saran Wali
Klik Logout Keluar dari pegawai
Logout Pegawai
Gambar 4.72 STD Halaman Balas Saran Wali Siswa
108
2. STD Web Pada Admin Buka URL Tampilkan login admin Menu Klik Login Admin Masuk ke beranda admin
Login Admin
Gambar 4.73 STD Halaman Login Admin
Menu
Klik Logout Keluar dari admin
Klik Menu Utama Pilih menu utama
Menu Utama
Logout Admin
Gambar 4.74 STD Halaman Beranda Admin
Menu
Klik Tambah Admin Klik Ubah Password Klik Tombol Ubah & Hapus Klik Menu Utama Tambah data admin Ubah password admin Ubah & hapus data admin Kembali ke menu utama
Tambah Data Admin
Ubah Password Admin
Ubah &Hapus Admin
Gambar 4.75 STD Halaman Daftar Admin
Menu Utama
109
Menu
Klik Tambah Siswa Klik Ubah Password Klik Tombol Ubah & Hapus Klik Menu Utama Tambah data siswa Ubah password siswa Ubah & hapus data siswa Kembali ke menu utama
Tambah Data Siswa
Ubah Password Siswa
Ubah &Hapus Siswa
Menu Utama
Gambar 4.76 STD Halaman Daftar Siswa
Menu
Klik Tambah Guru Klik Ubah Password Tambah data guru Ubah password guru
Tambah Data Guru
Klik Tombol Ubah & Hapus Klik Menu Utama Ubah & hapus data guru Kembali ke menu utama
Klik Tombol Ubah & Hapus Klik Menu Utama Ubah & hapus data wali Kembali ke menu utama
Ubah Password Wali
Ubah & Hapus Wali
Gambar 4.78 STD Halaman Daftar Wali Siswa
Menu Utama
110
Menu
Klik Tambah Pegawai Klik Ubah Password Klik Tombol Ubah & Hapus Klik Menu Utama Tambahdata pegawai Ubahpassword pegawai Ubah& hapusdata pegawai Kembali ke menu utama
TambahData Pegawai
UbahPasswordPegawai
Menu Utama
Ubah&HapusPegawai
Gambar 4.79 STD Halaman Daftar Pegawai
Menu
Klik Tombol Tambah Berita Tambah berita sekolah
Tambah Berita
Klik Tombol Ubah & Hapus Ubah & hapus berita sekolah
Klik Menu Utama Kembali ke menu utama
Ubah & Hapus Berita
Menu Utama
Gambar 4.80 STD Halaman Daftar Berita Sekolah
Menu
Klik Tombol Tambah Prestasi Tambah prestasi sekolah
Tambah Prestasi
Klik Tombol Ubah & Hapus Ubah & hapus prestasi sekolah
Ubah&Hapus Prestasi
Klik Menu Utama Kembali ke menu utama
Menu Utama
Gambar 4.81 STD Halaman Daftar Prestasi Sekolah
111
Menu
Klik Tombol Hapus Hapus data tamu
Hapus Tamu
Klik Menu Utama Kembali ke menu utama
Menu Utama
Gambar 4.82 STD Halaman Daftar Kontak
4.4 Construction (Code and Test) 4.4.1 Pengkodean Pengkodean dilakukan dengan menggunakan bahasa xHTML MP versi 1.0 sebagai bahasa pemrograman mobile web-nya dan PHP versi 5.2.5 sebagai bahasa server side web-nya. Penulis menggunakan jQuery versi 1.3.2 untuk mempercantik tampilan halaman web. Untuk database, digunakan MySQL versi 5.0.51a. Adapun untuk mengelola administrasi MySQL, penulis menggunakan phpMyAdmin versi 2.11.4 yang terdapat pada XAMPP versi 1.6.6a. Dalam perancangan desain interface-nya, penulis menggunakan Macromedia Dreamweaver MX 2004 sebagai editor tampilan halaman web-nya, Adobe Photoshop CS3 dan Adobe Fireworks CS3 sebagai pengolahan desain gambarnya. Hasil dari tahap ini dapat dilihat pada lampiran source code program.
112
Analisis Koding 1. Analisis Koding Pada Mobile Web User MIME xHTML MP Deklarasi XML Tipe dokumen dan Namespace untuk xHTML MP Metadata WCSS Header dan Menu utama
Script tanggal dalam php
Gambar 4.83 Tampilan Koding Halaman Beranda Pada awal koding di atas terdapat MIME xHTML MP dan deklarasi XML, serta tipe dokumen xHTML MP yang berada di bawahnya. MIME xHTML MP berguna menampilkan informasi pada mobile web dengan benar. Deklarasi XML dibutuhkan karena xHTML MP menggunakan aturan XML. Deklarasi tipe dokumen xHTML MP harus ada karena menspesifikasikan nama dari DTD (Document Type Definition) dan alamat URL-nya. Pada elemen terdapat atribut xmlns yang berfungsi untuk mendefinisikan namespace bagi xHTML MP. Pada elemen terdapat metadata dan WCSS (WAP CSS/Wireless CSS). Di elemen body terdapat menu utama dan tanggal.
113
Gambar 4.84 Tampilan Koding Halaman Login Siswa
Tampilan koding di atas merupakan koding untuk memproses login siswa agar dapat masuk ke halaman data-data siswa. Bagian pertama merupakan tampilan koding halaman siswa yang di dalamnya terdapat form login siswa yang berguna untuk memasukkan username dan password siswa. Bagian kedua merupakan koding login siswa yang berfungsi untuk memproses username dan password yang dimasukkan dari form login siswa tadi. Hasil dari proses ini adalah user siswa akan dibawa masuk ke halaman data dirinya sebagai siswa.
114
Gambar 4.85 Tampilan Koding Halaman Biodata Siswa Tampilan koding di atas merupakan koding halaman biodata siswa setelah proses login siswa. Bagian pertama merupakan bagian dari halaman siswa yang berisi proses session login, dimana jika session-nya tidak ada, maka user tidak boleh masuk ke halaman siswa, sedangkan jika ada, maka user dapat masuk ke halaman siswa dan memperoleh informasi yang dibutuhkan. Bagian kedua merupakan bagian dari halaman siswa yang berguna untuk menampilkan biodata siswa. Hasil dari koding ini adalah user siswa akan memperoleh biodata dirinya.
115
Gambar 4.86 Tampilan Koding Halaman Nilai Siswa
Tampilan koding di atas merupakan koding halaman nilai siswa dalam session login siswa. Bagian pertama merupakan bagian halaman nilai siswa yang berupa form untuk memilih data-data yang dibutuhkan agar data nilai siswa dapat ditampilkan, seperti data kelas, mata pelajaran, dan semester. Bagian kedua merupakan koding yang berguna untuk menampilkan data nilai siswa. Hasil dari koding ini adalah user siswa akan memperoleh informasi nilai akademis dirinya.
116
Gambar 4.87 Tampilan Koding Halaman Absensi Siswa
Tampilan koding di atas merupakan koding halaman absensi siswa dalam session login siswa. Bagian pertama merupakan bagian halaman absensi siswa yang berupa form untuk memilih data-data yang dibutuhkan agar data absensi siswa dapat ditampilkan, seperti data kelas, mata pelajaran, dan semester. Bagian kedua merupakan koding yang berguna untuk menampilkan data absensi siswa. Hasil dari koding ini adalah user siswa akan memperoleh informasi absensi sekolah dirinya.
117
Gambar 4.88 Tampilan Koding Halaman Jadwal Pelajaran
Tampilan koding di atas merupakan koding halaman jadwal pelajaran dalam session login siswa. Bagian pertama merupakan form untuk memilih data-data yang dibutuhkan agar data jadwal pelajaran dapat ditampilkan, seperti data kelas, dan semester. Bagian kedua merupakan koding yang berguna untuk menampilkan data jadwal pelajaran. Hasil dari koding ini adalah user siswa akan memperoleh informasi jadwal pelajaran. Untuk koding-koding yang lain seperti data guru, wali siswa, pegawai, dan lainnya prinsipnya hampir sama dengan data siswa, sehingga analisis kodingnya tak perlu dibahas secara detail.
118
2. Analisis Koding Pada Web Admin
Gambar 4.89 Tampilan Koding Halaman Login Admin Tampilan koding di atas merupakan koding untuk memproses login admin pada sistem web admin agar dapat masuk ke halaman admin sekolah. Bagian pertama merupakan koding halaman index yang di dalamnya terdapat form login admin yang berguna untuk memasukkan username dan password admin. Bagian kedua merupakan koding login admin yang berfungsi untuk memproses username dan password yang dimasukkan dari form login admin tadi. Hasil dari proses ini adalah admin akan dibawa masuk ke halaman beranda admin.
119
Gambar 4.90 Tampilan Koding Halaman Daftar Admin Tampilan koding di atas merupakan koding daftar admin untuk menampilkan nama-nama admin serta data-datanya masing-masing. Bagian pertama merupakan bagian dari daftar admin yang berisi proses session login, dimana jika session-nya tidak ada, maka user tidak boleh masuk ke halaman admin, sedangkan jika ada, maka user dapat mengubah, menambah, dan menghapus data. Bagian kedua merupakan bagian dari halaman daftar admin yang berguna untuk menampilkan data-data admin. Hasil dari koding ini adalah admin akan dapat mengoperasikan sistem akademik dari web sekolah.
120
Gambar 4.91 Tampilan Koding Halaman Daftar Siswa Tampilan koding di atas merupakan koding daftar siswa untuk menampilkan data nama-nama siswa. Bagian pertama merupakan bagian dari daftar siswa yang berada pada proses session login admin, dimana jika session-nya tidak ada, maka user tidak boleh masuk ke halaman admin, sedangkan jika ada, maka user dapat mengubah, menambah, dan menghapus data siswa. Bagian kedua merupakan bagian dari halaman daftar siswa yang berguna untuk menampilkan data-data siswa. Hasil dari koding ini adalah admin akan dapat mengoperasikan data-data siswa.
121
Gambar 4.92 Tampilan Koding Halaman Daftar Nilai Siswa Tampilan koding di atas merupakan koding daftar nilai siswa untuk menampilkan data nilai siswa. Bagian pertama merupakan koding dari form tambah data nilai siswa yang hasilnya diperlihatkan pada daftar nilai siswa di bawahnya. Bagian kedua merupakan koding dari form daftar nilai siswa yang berguna untuk menampilkan data nilai siswa. Hasil dari koding ini adalah admin akan dapat mengoperasikan data nilai siswa. Untuk koding-koding pada halaman lainnya dalam web admin prinsipnya hampir sama dengan koding-koding yang ini dan sebelumnya sehingga analisis kodingnya tak perlu dibahas secara detail.
122
4.4.2 Pengujian 4.4.2.1 Hosting Sistem Sebelum pengujian, penulis melakukan hosting ke web hosting agar sistem dapat diuji sesuai dengan pelaksanaan yang sebenarnya di lapangan. Penulis menggunakan web hosting dan bukan WAP hosting karena sistem sesuai dengan cara kerja WAP 2.0 yang meminta layanan pada web server secara langsung. Prosesnya dapat dilihat berikut ini.
1. Mendapatkan Nama Domain Sistem yang dirancang penulis menggunakan nama domain gratis dari co.cc dengan alamat http://www.co.cc. Adapun langkah-langkahnya adalah sebagai berikut. Buka halaman http://www.co.cc pada browser, lalu ketik nama domain yang diinginkan pada kotak yang tersedia, misalnya smamugatangerang dan klik tombol Check Availability untuk mengecek apakah domain yang diinginkan sudah ada atau belum.
Gambar 4.93 Tampilan Awal Situs Nama Domain
123
Jika domain belum ada maka akan muncul pemberitahuan bahwa domain tersebut available dan klik tombol Continue to registration. Lalu muncul halaman untuk mendaftar bagi anggota baru atau login bagi member yang sudah memiliki account, klik tombol Create an account now jika ingin mendaftar sebagai anggota baru.
Gambar 4.94 Tampilan Halaman Login Situs Nama Domain
Muncul halaman formulir pendaftaran dan isikan dengan data yang benar dan centang pada kalimat I accept the Term of Service lalu klik tombol Create an account now.
Gambar 4.95 Tampilan Halaman Pendaftaran Nama Domain
124
Tampil pemberitahuan bahwa account berhasil dibuat dan terdapat pesan agar men-setup domain dalam 48 jam, jika tidak pendaftaran akan dibatalkan. Klik tombol Set up untuk men-setting nama domain anda.
Gambar 4.96 Tampilan Pemberitahuan Pembuatan Akun Nama Domain
Kemudian muncul halaman baru untuk men-setting domainnya. Klik pada pilihan no. 1 Name Server lalu isi Name Server 1 dengan dns1.freehostia.com dan Name Server 2 dengan dns.freehostia2.com, DNS ini mengacu pada web hosting yang akan kita gunakan.
Gambar 4.97 Tampilan Halaman Setting Nama Domain
Tekan tombol Setup untuk mengakhiri proses setting domain dan akan keluar halaman baru yang menyatakan bahwa kita telah melakukan perubahan setting domain. Klik tombol OK untuk mengakhiri.
125
2. Hosting ke Web Hosting Penulis menggunakan web hosting gratis yaitu freehostia dengan alamat http://www.freehostia.com. Langkah-langkahnya adalah sebagai berikut. Buka halaman http://www.freehostia.com pada browser lalu klik link Sign Up Now untuk mendaftar sebagai anggota baru.
Gambar 4.98 Tampilan Halaman Awal Situs Web Hosting Tampil pendaftaran dan pilih Plan Chocolate, lalu pilih Use my existing domain untuk menghubungkan domain name co.cc dengan web hosting freehostia. Isi data dan klik tombol Continue untuk lanjut.
Gambar 4.99 Tampilan Halaman Pendaftaran Web Hosting
126
Tunggu beberapa saat hingga proses pendaftaran selesai lalu akan muncul halaman data order kita seperti berikut ini.
Gambar 4.100 Tampilan Pemberitahuan Pembuatan Akun Web Hosting
Data username dan password login serta data lainnya dikirim ke email kita. Jika tidak ada di inbox maka ada di spam/bulk mail.
Gambar 4.101 Tampilan Pemberian Data Web Hosting di Email
127
Setelah itu, masuk ke halaman control panel freehostia pada alamat http://cp.freehostia.com/members. Masukkan username dan password yang telah dikirimkan ke email tadi. Klik menu File Manager dan tampil domain name yang kita buat pada co.cc di sebelah kanan atas.
Gambar 4.102 Tampilan Control Panel Web Hosting
Selanjutnya muncul halaman file manager dan tampil directory domain
dari
nama
domain
yang
telah
kita
buat,
misal,
smamugatangerang.co.cc. Selesailah proses hosting ke web hosting.
Gambar 4.103 Tampilan Halaman File Manager Web Hosting
128
3. Upload File ke Web Hosting Proses upload file ke web hosting dilakukan dengan menggunakan software FTP FileZilla versi 3.3.4. Adapun langkah-langkahnya adalah sebagai berikut. Setelah masuk ke halaman control panel dan file manager freehostia, klik link directory dari nama domain, misalnya klik smamugatangerang.co.cc, dan akan terbuka halaman baru dari subdirectory domain yang berisi file-file yang akan di-upload nanti.
Gambar 4.104 Tampilan Halaman Subdirektori File Manager Web Hosting
Sebenarnya pada freehostia disediakan fasilitas untuk upload file namun ukuran file yang bisa di-upload hanya sampai 500 kb sehingga jika lebih besar maka upload file harus dilakukan dengan software FTP. Software FTP yang penulis gunakan adalah FileZilla versi 3.3.4.
129
Install FileZilla dan buka software FileZilla. Pada bagian atasnya isikan Host, Username, Password dan Port dari FTP. Data host, username, dan password dapat dilihat pada pesan email tadi. Untuk port FTP-nya isi dengan angka 21 lalu klik tombol Quickconnect.
Gambar 4.105 Tampilan Halaman Awal Software FTP
Setelah itu muncul proses Command dan Response dari proses FTP dan tampil direktori komputer pada sebelah kanan dan direktori web hosting smamugatangerang.co.cc pada sebelah kiri.
Gambar 4.106 Tampilan Halaman Direktori File
130
Klik direktori smamugatangerang.co.cc pada sebelah kiri dan muncul tampilan subdirektori dari nama domainnya. Upload file dari komputer ke web, caranya drag and drop file dan folder dari direktori komputer ke direktori web hosting, dan hasilnya berikut ini.
Gambar 4.107 Tampilan Halaman Direktori File 2
Untuk melihat file yang telah di-upload masuk control panel > file manager > direktori smamugatangerang.co.cc dan hasilnya di bawah ini.
Gambar 4.108 Tampilan Halaman Direktori File Web Hosting
131
4.4.2.2 Pengujian Mandiri Pengujian mandiri dilakukan oleh penulis sendiri. Pengujian sistem ini dilakukan dengan menggunakan metode black box yang dilakukan tanpa memperhatikan source code program dan lebih memfokuskan pada keperluan fungsional sistem. Pengujian ini terdiri dari : 1. Pengujian mobile web user dilakukan pada : a. Komputer localhost : micro broser Opera Mobile for Windows. b. Handphone : Opera Mini versi 4.2 dan browser handphone Sony Ericsson K510i pada alamat : smamugatangerang.co.cc c. Web online : simulator Opera Mini versi 4.2 dan simulator browser handphone pada web mobiReady. 2. Pengujian web admin sekolah dilakukan pada : a. Komputer localhost : browser Mozilla Firefox versi 3.6. b. Web
:
Mozilla
Firefox
versi
3.6
yang
beralamat
di
smamugatangerang.co.cc/admin
1. Pengujian Mobile Web Pada Simulator Handphone a. Pengujian Pada Simulator Opera Mini versi 4.2 Pengujian mobile web dapat dilakukan pada simulator online dari browser
mobile
Opera
Mini
versi
4.2
pada
alamat
http://www.opera.com/mobile/demo/?ver=4 dengan mengetikkan alamat smamugatangerang.co.cc pada simulator tersebut dan hasilnya terlihat pada gambar berikut ini.
132
Gambar 4.109 Pengujian Halaman Beranda, Profil Sekolah, dan Login Siswa
Gambar 4.110 Pengujian Halaman Biodata, Nilai dan Absensi Siswa
Gambar 4.111 Pengujian Halaman Jadwal Pelajaran Siswa, Info Akademik, dan Login Guru
133
Tampilan pengujian tadi merupakan hanya beberapa tampilan pengujian sistem saja, sementara tampilan pengujian sistem secara lengkap dapat dilihat pada lampiran tampilan sistem.
b. Pengujian Pada Simulator Browser Handphone Pengujian juga dilakukan pada simulator browser handphone dengan
mobiReady
pada
alamat
http://www.ready.mobi/.
Web
mobiReady adalah web yang menyediakan servis online untuk mengetes/mereview mobile web yang menggunakan bahasa xHTML MP sehingga dapat memberikan hasil dan saran untuk mengembangkan mobile web yang jauh lebih baik lagi. Langkah-langkahnya yaitu sebagai berikut. Buka alamat http://www.ready.mobi/, masukkan alamat smamugatangerang.co.cc pada kotak URL yang tersedia di bawah halaman lalu klik tombol GO.
Gambar 4.112 Tampilan Awal Situs mobiReady
134
Tunggu beberapa saat lalu muncul hasilnya. Dari hasilnya terlihat bahwa secara keseluruhan mobile web yang dirancang berjalan dengan baik pada mobile phone. Terlihat juga grafik estimasi score (tingkat dapat dibaca oleh mobile phone), size (ukuran halaman mobile web), time (waktu yang dibutuhkan), dan cost (biaya yang dikeluarkan).
Gambar 4.113 Tampilan Hasil Pengujian Mobile Web
Berikut ini merupakan hasil dari pengujian mobile web-nya.
Gambar 4.114 Pengujian Halaman Beranda
135
Gambar 4.115 Pengujian Halaman Jadwal Pelajaran
Gambar 4.116 Pengujian Halaman Login Wali Siswa
Gambar 4.117 Pengujian Halaman Album Galeri Foto Tampilan pengujian di atas merupakan hanya beberapa tampilan pengujian sistem saja, sementara tampilan pengujian sistem secara lengkap dapat dilihat pada lampiran tampilan sistem.
136
2. Pengujian Web Pada Komputer Pengujian web secara online dilakukan penulis dengan Firefox pada alamat smamugatangerang.co.cc/admin , dan pengujian di localhost dilakukan pada Mozilla Firefo xv3.6. Hasil tampilan pengujian secara online/offline dapat dilihat pada daftar lampiran tampilan sistem.
4.4.2.3 Pengujian Lapangan Pengujian lapangan dilakukan oleh pihak sekolah yaitu staf TU di SMA Muhammadiyah 3 Tangerang. Pengujian ini dilakukan dengan menggunakan metode black box yang dilakukan tanpa memperhatikan source code program dan lebih memfokuskan pada keperluan fungsional sistem. Pengujian dilakukan di Ruang TU SMA Muga Tangerang pada tanggal 9 Desember 2010. Hasil pengujian sistem yang dilakukan pihak sekolah dapat dilihat pada lampiran pengujian lapangan.
4.5 Deployment (Delivery and Feedback) Setelah dilakukan pengujian lapangan oleh pihak sekolah maka pada selanjutnya sistem akademik dapat diserahkan (delivery) kepada pihak sekolah untuk dapat langsung digunakan karena produk hasil increment pertama merupakan produk inti yang sudah siap digunakan oleh user/sekolah. Jika belum sesuai dengan kebutuhan sekolah maka evaluasi sekolah tersebut dijadikan umpan balik (feedback) untuk mengembangkan sistem akademik yang lebih baik lagi pada tahap increment berikutnya.
BAB V PENUTUP
5.1 Kesimpulan Dari hasil pembahasan di bab sebelumnya maka dapat disimpulkan beberapa hal antara lain sebagai berikut. 1. Sistem akademik sekolah berbasis web pada admin sekolah ini dapat mempermudah pengelolaan data dan informasi dari sistem akademik sekolah yang sudah ada sebelumnya. 2. Perancangan sistem akademik sekolah berbasis mobile web digunakan untuk memudahkan siswa, guru, dan pegawai yang sedang tidak berada di sekolah untuk memperoleh informasi yang berkaitan dengan akademik sekolah dengan cepat dan mudah. 3. Dengan
adanya
sistem
ini,
wali
siswa
dapat
memantau
perkembangan akademis siswa di sekolah secara cepat dan mudah, karena
mereka
dapat
mengakses
sistem
akademik
sekolah
menggunakan layanan mobile web. 4. Dengan sistem akademik sekolah ini, masyarakat yang ingin mengetahui informasi tentang sekolah, dapat mengakses sistem ini melalui handphone mereka. Hal ini juga menjadi sarana promosi pihak sekolah untuk mengenalkan sekolah kepada masyarakat luas.
137
138
5.2 Saran Berdasarkan kesimpulan dan pembahasan pada bab sebelumnya, maka saran yang dapat diberikan antara lain sebagai berikut. 1.
Untuk pengembangan selanjutnya sistem akademik ini diharapkan dapat menyajikan informasi akademik secara keseluruhan yang terkait dengan sekolah tersebut, seperti informasi keuangan sekolah, penerimaan siswa baru, dan sebagainya.
2.
Diharapkan pada tahap pengembangan selanjutnya, sistem akademik ini memiliki tingkat keamanan (security) yang lebih tinggi dari sebelumnya karena penulis sadar bahwa tingkat keamanan sistem yang penulis rancang masih terdapat banyak kekurangan apalagi dengan banyaknya teknik hacking di dunia maya akan semakin menambah tingkat kerawanan sistem ini dapat disusupi oleh hacker yang dengan mudahnya menghancurkan sistem.
DAFTAR PUSTAKA
Divisi Litbang MADCOMS. 2004. Aplikasi Program PHP dan MySQL untuk Membuat Website Interaktif. Yogyakarta : ANDI. Elidjen, dkk. 2005. Jurnal Aplikasi Sistem Penjualan Tiket Bioskop 21 Berbasis Web dan WAP. [Online] Tersedia : http://journal.uii.ac.id/index.php/Snati/article/view/1342/1125 [3 September 2010]. Hakim, Lukmanul. 2010. Bikin Website Super Keren dengan PHP dan jQuery. Yogyakarta : Lokomedia. Hariyanto, Bambang. 2004. Rekayasa Sistem Berorientasi Objek. Bandung : Informatika. Hartono, Jogiyanto. 2006. Analisis dan Desain Sistem Informasi : Pendekatan Terstruktur Teori dan Praktik Aplikasi Bisnis. Yogyakarta : ANDI. Haryanto, Yuli. 2010. State Transition Diagram. [Online] Tersedia : http://haryantoyuli.blogspot.com/2010/07/state-transition-diagram.html [23 September 2010]. Hendra. 2010. Mengenal Lebih Jauh Opera Browser. [Online] Tersedia : http://webhendra.web.id/?p=94 [15 September 2010].
Jusak. 2008. Kreasi Situs Mobile Internet dengan xHTML MP. Jakarta : Prestasi Pustaka. Kadir, Abdul. 2009. Dasar Perancangan dan Implementasi Database Relasional. Yogyakarta : ANDI. Nugroho, Bunafit. 2005. Database Relasional dengan MySQL. Yogyakarta : ANDI. Obie.
2008.
Mobile
Web.
[Online]
Tersedia
:
http://www.obilog.info/2008/08/mobile-web/ [15 September 2010]. Peranginangin, Kasiman. 2006. Aplikasi Web dengan PHP dan MySQL. Yogyakarta : ANDI. Pressman, Roger S. 2005. Software Engineering - A Practitioner's Approach Sixth Edition. New York : Mc. Graw Hill. Putro.
2007.
Istilah
Akademik.
[Online]
Tersedia
:
http://id.wikipedia.org/wiki/Akademik [15 September 2010]. Simarmata, Janner. 2010. Rekayasa Web. Yogyakarta : ANDI. Sutanta, Edhy. 2005. Pengantar Teknologi Informasi. Yogyakarta : Graha Ilmu. Tim Wahana Komputer. 2004. Membuat Website Interaktif dengan Macromedia Dreamweaver MX. Yogyakarta : ANDI. WAP Forum. 2002. WAP 2.0 Technical White Paper. [Online] Tersedia : http://www.wapforum.org/what/WAPWhite_Paper1.pdf [17 Juli 2010]
PERANCANGAN SISTEM AKADEMIK SEKOLAH BERBASIS TEKNOLOGI MOBILE WEB (STUDI KASUS : SMA MUHAMMADIYAH 3 TANGERANG) Nendy Subhansyah (106091002885) Teknik Informatika, Universitas Islam Negeri Syarif Hidayatullah Jakarta Di bawah bimbingan Herlino Nanang, MT dan Andrew Fiade, M.Kom
ABSTRAK Sekolah merupakan organisasi yang di dalamnya terdapat kegiatan akademik. Dalam hal menjalankan kegiatan akademik, SMA Muhammadiyah 3 Tangerang masih bersifat sederhana. Oleh karena itu dibutuhkan sistem untuk mengatasi permasalahan tersebut, salah satunya dengan sistem berbasis web. Pengelolaan sistem akademik berbasis web pada sekolahsekolah masih perlu dimaksimalkan, yaitu dengan menggunakan layanan mobile web, agar informasi akademik dapat diterima dengan mudah dan cepat. Oleh karena itu, permasalahan yang akan dibahas dalam penelitian ini adalah bagaimana merancang sistem akademik SMA Muhammadiyah 3 Tangerang berbasis mobile web pada user dan web pada admin sekolah.. Perancangan sistem ini menggunakan bahasa xHTML MP, PHP, jQuery, dan MySQL. Metodologi pengembangan sistem yang dipakai adalah incremental. Hasil penelitian berupa sistem akademik sekolah berbasis mobile web sehingga siswa, guru, wali siswa, pegawai, dan tamu dapat dengan mudah mengaksesnya melalui handphone. Kata kunci : sistem akademik sekolah, mobile web, incremental, xHTML MP.
I. PENDAHULUAN 1.1 Latar Belakang Pembangunan dunia pendidikan yang mengalami perkembangan seiring dengan laju perkembangan teknologi informasi yang sangat pesat, memerlukan peningkatan mutu di bidang pendidikan sehingga SDM yang diciptakan dapat berpartisipasi dalam membangun dunia pendidikan. Pengelolaan sistem akademik berbasis web yang telah ada pada sekolah-sekolah negeri maupun swasta masih perlu dimaksimalkan, salah satunya pengelolaan sistem akademik yang bisa diakses melalui mobile phone. Dengan banyaknya telepon selular di Indonesia, maka bukan mustahil penggunaan sistem akademik yang menggunakan mobile phone akan lebih banyak dari pada sistem akademik yang berbasis web.
Penggunaan sistem akademik yang menggunakan mobile phone antara lain memanfaatkan teknologi WAP, dan yang baru sekarang ini adalah teknologi mobile web. Teknologi mobile web/WAP 2.0 merupakan sebuah metode untuk menghadirkan halaman web di dalam layar mobile phone. Dengan adanya teknologi ini, informasi dari sistem akademik mengenai data siswa, guru, pegawai, profil sekolah, dan lainnya tidak terbatas pada web yang ditampilkan di internet saja, melainkan siswa dapat mengaksesnya melalui handphone-nya sendiri, tanpa harus browsing web di internet. Dengan adanya dukungan GPRS pada mobile phone, maka pemanfaatan sistem akademik berbasis mobile web ini akan dapat terlaksana dengan baik.
SMA Muhammadiyah 3 Tangerang merupakan SMA swasta yang berorientasi ke depan dalam membangun bangsa. Dalam hal menyajikan sistem akademiknya dan memonitoring kegiatan siswa, SMA Muhammadiyah 3 Tangerang masih bersifat sederhana dan belum terdapat sistem akademik yang berbasis web atau mobile web. Sistem yang digunakan pun belum bisa langsung sampai pada wali siswa, sehingga wali siswa masih kesulitan memantau kegiatan akademik anaknya di sekolah. Dengan adanya sistem akademik berbasis teknologi mobile web di SMA Muhammadiyah 3 Tangerang, diharapkan siswa dan guru dapat memberikan dan mendapatkan informasi mengenai sekolah serta wali siswa dapat mengetahui perkembangan anaknya di sekolah melalui mobile phone mereka. Berdasarkan pada penjelasan di atas, maka penulis berkeinginan membuat solusi yang dapat membantu kinerja sekolah tersebut. Penulis memilih SMA Muhammadiyah 3 Tangerang sebagai tempat riset karena dahulu penulis sekolah pada SMA tersebut dan berharap dapat memajukan sekolah tersebut. Solusi yang dipakai penulis adalah dengan merancang sistem akademik berbasis mobile web dengan menggunakan bahasa pemrograman xHTML MP (Extensible HTML Mobile Profile), PHP, jQuery, database MySQL, editor Macromedia Dreamweaver MX 2004, serta micro browser simulator Opera Mobile for Windows. Atas dasar itulah, maka penulis mencoba menyusun skripsi ini dengan judul “Perancangan Sistem Akademik Sekolah Berbasis Teknologi Mobile Web (Studi Kasus : SMA Muhammadiyah 3 Tangerang)”.
1.2 Rumusan Masalah Berdasarkan latar belakang di atas, maka dapat dirumuskan permasalahan yang akan dibahas dalam penelitian ini adalah : 1. Bagaimana merancang sistem akademik SMA Muhammadiyah 3 Tangerang yang masih sederhana menjadi sistem yang berbasis mobile web dan web. 2. Bagaimana cara menyajikan perkembangan akademis siswa di sekolah kepada wali siswa. 3. Bagaimana sistem dapat bekerja secara tepat dalam menyampaikan informasi seputar sekolah kepada siswa, wali siswa, serta masyarakat umum melalui mobile phone. 1.3 Batasan Masalah Batasan masalah dalam penelitian ini antara lain sebagai berikut : 1. Perancangan sistem akademik SMA Muga Tangerang berbasis mobile web pada user dan berbasis web pada admin sekolah. 2. Pada sistem akademiknya tidak dirancang web pada sisi user, hanya dirancang mobile web pada sisi user. 3. Sistem akademik ini tidak membahas sistem keuangan sekolah karena konteks tersebut di luar pembahasan sistem ini dan dapat dibahas tersendiri. 4. Menggunakan bahasa pemrograman xHTML MP, PHP, dan jQuery. 5. Penyimpanan database-nya menggunakan MySQL. 6. Pengujian sistem akademik ini menggunakan browser simulator yaitu Opera Mobile for Windows pada localhost , Opera Mini pada handphone secara online, dan beberapa simulator handphone.
1.4 Tujuan Penelitian Tujuan yang ingin dicapai penulis dari penelitian ini adalah: 1. Merancang sistem akademik sekolah yang masih sederhana menjadi sistem yang berbasis mobile web. 2. Menyajikan kegiatan akademik siswa di sekolah kepada wali siswa yang masih kesulitan mengaksesnya secara cepat dan mudah dengan menggunakan mobile phone. 3. Memudahkan untuk menyajikan informasi dari sistem akademik sekolah.
II. LANDASAN TEORI 2.1 Konsep Sistem Akademik Sekolah Pendekatan sistem yang lebih menekankan pada prosedur mendefinisikan suatu sistem adalah suatu jaringan kerja dari prosedur - prosedur yang saling berhubungan, berkumpul bersama-sama untuk melakukan suatu kegiatan atau menyelesaikan suatu sasaran tertentu. (Jogiyanto, 2006 : 1-2). Akademik adalah seluruh lembaga pendidikan formal baik pendidikan anak usia dini, pendidikan dasar, pendidikan menengah, pendidikan kejuruan maupun perguruan tinggi yang menyelenggarakan pendidikan vokasi dalam satu cabang atau sebagian cabang ilmu pengetahuan, teknologi, dan atau seni tertentu. (Putro, 2007). Sistem akademik sekolah di sini adalah sistem informasi yang dirancang untuk keperluan pengelolaan data-data akademik dalam hal ini sekolah, dengan penerapan teknologi komputer baik hardware maupun software. 2.2 Konsep Mobile Web dan WAP Mobile web adalah sistem yang bertujuan untuk mengakses layanan data
secara wireless dengan menggunakan perangkat mobile seperti handphone, PDA yang tersambung ke sebuah jaringan telekomunikasi selular. (Obie, 2008). WAP adalah standar dunia nyata untuk layanan telepon dan informasi nirkabel pada telepon seluler digital dan terminal nirkabel lainnya. (Simarmata, 2010 : 360). WAP terbagi jadi 2 yaitu : 1. WAP 1.0, cara kerjanya sebagai berikut. Saat sebuah handheld mobile device tersambungkan ke jaringan wireless dan meminta akses sebuah web yang mendukung WAP, handheld mobile device anda akan mengirimkan permintaan tersebut via gelombang radio ke sel terdekat, dimana langsung dirutekan ke internet melalui sebuah server gateway. Server gateway tersebut akan menerjemahkan permintaan ke format standar HTTP dan meneruskannya ke site web. Bila site tersebut meresponnya, ia akan mengirimkan dokumen HTML ke server gateway, kemudian dikonversi menjadi WML dan merutekannya ke antena terdekat. Antena tersebut akan mengirimkan data via gelombang ke piranti WAP anda dan akhirnya microbrowser sebagai navigator yang menyediakan interface antara user dan wireless internet menampilkan halaman microbrowser tersebut. ( Elidjen dkk, 2005).
Gambar 2.1 Cara Kerja WAP 1.0 (sumber : WAP Forum, 2002)
2. WAP 2.0/Mobile Web, cara kerjanya sebagai berikut. “The WAP Programming Model, closely aligned with the Web Programming Model, uses the Pull Model, (which is where the client request content from the server). However, WAP also extends the Web architecture by adding telephony support with WTA and enabling a Push Model, where a server can proactively send content to the client. “ (WAP Forum, 2002).
Gambar 2.2 Cara Kerja WAP 2.0 (sumber : WAP Forum, 2002) 2.3 Pemrograman WAP 2.0/Mobile Web WAP 2.0 menggunakan xHTML MP sebagai bahasa markup-nya. xHTML MP (Extensible Hypertext Markup Language Mobile Profile) merupakan sebuah bahasa markup yang didefinisikan dalam WAP 2.0, yaitu sebuah protocol komunikasi untuk aplikasi-aplikasi nirkabel yang dibuat oleh WAP Forum. Jadi sebenarnya tujuan utama dari xHTML MP adalah menggabungkan teknologi browser yang ada pada mobile dan World Wide Web. (Jusak, 2008 : 1-2). 1. Aturan Penulisan xHTML MP a. Elemen-elemen dalam xHTML MP harus tersarang dengan benar.
b. Elemen-elemen dalam xHTML MP harus tertutup. c. Elemen-elemen dalam xHTML MP harus tertulis dengan huruf kecil. d. Nilai dari setiap atribut pada xHTML MP harus ditulis dalam tanda petik (ganda atau tunggal). e. xHTML MP tidak mengijinkan adanya minimisasi atribut. Jusak (2008 : 10-14). 2. Struktur Penulisan xHTML MP Hello
III. Metodologi Penelitian 3.1 Metodologi Pengumpulan Data 1. Observasi, dilakukan penulis dengan cara mengamati sistem akademik sekolah yang berjalan di SMA Muhammadiyah 3 Tangerang dan mengambil data-data penting untuk perancangan sistem akademiknya. 2. Wawancara, dilakukan penulis pada waktu melakukan riset di SMA Muhammadiyah 3 Tangerang dengan Kepala Sekolah dan PKS Bidang Kurikulum selaku pihak yang berperan penting dalam sistem akademik sekolah di sana. 3. Studi pustaka, dilakukan dengan cara membaca dan mempelajari literatur dan buku-buku yang mendukung dengan topik yang dibahas dalam penyusunan skripsi ini. Selain itu juga penulis mengumpulkan data-data dari internet yang berhubungan dengan skripsi penulis. 4. Studi sejenis, yakni dilakukan dengan mengumpulkan data melalui tugas akhir atau skripsi orang lain yang terkait dengan penelitian skripsi yang penulis lakukan sebagai referensi dan perbandingan dari skripsi penulis. 3.2 Metodologi Pengembangan Sistem Metode pengembangan sistem yang digunakan penulis adalah metode incremental. Alasan penulis menggunakan metode incremental adalah: 1. Metode ini memiliki tahapan waterfall yang terstruktur dan bersifat perulangan, sehingga jika produk pada increment pertama kurang memuaskan user, pada increment berikutnya dapat dikembangkan sistem yang sesuai dengan evaluasi user melalui tahapan terstruktur. 2. Mengutamakan kepentingan user di mana kebutuhan-kebutuhan yang terpenting dimasukkan ke dalam tahap
awal increment, dan produk incrementnya sudah bisa digunakan karena produk inti (core). 3. Metode ini sesuai dengan karakteristik web/mobile web di mana pada increment pertama web sudah bisa digunakan user dan pada increment berikutnya sistem web yang dikembangkan membutuhkan update/modifikasi data secara berkala.
Gambar 3.1 Model Incremental (sumber : Pressman, 2005 : 81) Tahapan perancangan sistem dengan metode incremental sebagai berikut. 1. Communication (komunikasi), tahap awal yang dilakukan penulis dalam proses perancangan sistem adalah komunikasi (wawancara) dengan pihak yang berkepentingan dalam sistem akademik sekolah. 2. Planning (perencanaan), dengan perencanaan dapat diperkirakan jangkauan proyek sistem akademik, pihak yang terlibat, waktu pengerjaannya, dan bahasa pemrograman yang dibutuhkan. 3. Modeling (analysis and design), terdiri dari : a. Analisis sistem, meliputi gambaran umum sekolah, analisis sistem
akademik yang berjalan, permasalahan pada sistem akademiknya, serta pemecahan masalah yang diusulkan oleh penulis. b. Desain sistem, meliputi desain arsitektur yaitu flow chart, DFD, dan kamus data; desain basis data yaitu ERD, LRS, normalisasi, dan spesifikasi tabel database; desain antarmuka yaitu struktur menu dan tampilan layar; serta desain prosedural yaitu STD. 4. Construction (code and test), meliputi : a. Pengkodean, dengan bahasa pemrograman web/mobile web yaitu xHTML MP yang digabung dengan PHP, jQuery, dan MySQL. b. Pengujian, terdiri dari pengujian mandiri dan lapangan. Pengujian mandiri dilakukan oleh penulis sendiri dan dilakukan pada sistem mobile web dan web. Pengujian mobile web dilakukan pada Opera Mobile for Windows di localhost dan Opera Mini online pada handphone, serta web dilakukan pada Mozilla Firefox. Sedangkan pengujian lapangan dilakukan oleh pihak sekolah yaitu staf TU. 5. Deployment (delivery and feedback), setelah melakukan pengujian lapangan, sistem akademik dapat diserahkan (delivery) kepada pihak sekolah untuk dapat langsung digunakan, dan umpan balik (feedback) dari pihak sekolah sangat diperlukan untuk mengembangkan sistem yang lebih baik lagi.
IV. Pembahasan 4.1 Communication (Komunikasi) Tahap awal dari perancangan sistem adalah komunikasi. Tahap ini dilakukan dengan cara mengadakan wawancara dengan narasumber terkait.
4.2 Planning (Perencanaan) Perencanaan yang dilakukan oleh penulis meliputi hal berikut ini. 1. Sistem akademik dirancang berbasis mobile web pada sisi user dan berbasis web pada sisi admin sekolah. 2. Admin mengatur data-data pada sistem akademik sekolah berbasis web sedangkan user memperoleh informasi akademik sekolah berbasis mobile web. 3. Waktu pengerjaan sistem cukup lama yaitu memakan waktu kurang lebih 6 bulan. 4. Sistem akademik ini menggunakan bahasa xHTML MP sebagai bahasa markup mobile web yang digabungkan dengan bahasa pemrograman PHP, jQuery, dan MySQL. 5. Setiap pengguna memiliki hak akses yang berbeda terhadap sistem dengan diberikan username dan password oleh admin sekolah. 4.3 Modeling (Analysis and Design) 4.3.1 Analisis Sistem 1. Uraian Sistem yang Berjalan a. Pembuatan informasi tentang sistem akademik ditentukan bersama dalam rapat keputusan sekolah dan bagian kurikulumlah yang merumuskan detail dari rancangan program yang telah ditentukan bersama tadi. b. Hasil dari perumusan rancangan akademik diberikan bidang kurikulum kepada staf TU, lalu staf TU menyimpan informasi akademik tersebut pada komputer sekolah berupa softcopy dan berkas hardcopy disimpan pada arsip dokumen sekolah, lalu kopian berkas hardcopy informasi akademik disampaikan kepada siswa dan guru melalui mading sekolah agar diketahui sebagaimana mestinya.
c. Informasi akademik yang dibutuhkan siswa, disampaikan oleh staf TU melalui mading sekolah dan kemudian siswa mencatatnya. Sewaktu-waktu siswa juga diberikan kertas pengumuman dari sekolah untuk disampaikan kepada wali siswa/orang tua. Pada akhir semester siswa memperoleh informasi hasil belajarnya berupa rapor penilaian yang diberikan guru kepada wali siswa/orang tua. d. Informasi akademik yang disampaikan kepada guru dipergunakan oleh guru untuk menjalankan aktivitas mengajarnya. Pada akhir semester guru juga menyampaikan informasi mengenai hasil prestasi belajar siswa berupa rapor penilaian siswa kepada wali siswa. e. Pihak wali siswa/orang tua menerima informasi akademik sekolah yang disampaikan dari sekolah kepada siswa berupa surat pengumuman dan buku penghubung untuk mencatat aktivitas siswa agar diketahui oleh wali siswa, dan pada akhir semester wali siswa datang ke sekolah untuk memperoleh informasi nilai siswa dalam bentuk rapor siswa.
2. Analisis Masalah a. Staf TU membutuhkan suatu sistem yang berguna untuk mengatur data akademik sekolah dalam bentuk web sehingga memudahkan proses pengelolaan sistem akademik, karena selama ini arsip hardcopy informasi akademik disimpan di folder dokumen dan softcopy disimpan di komputer sekolah secara personal. b. Siswa membutuhkan sistem yang menampilkan informasi akademik
c.
d.
e.
f.
siswa dengan cepat untuk mendukung aktifitas belajar di sekolah. Guru yang tidak berada di sekolah memerlukan suatu sistem yang menyajikan informasi akademik dengan cepat untuk menunjang kegiatan mengajar di sekolah. Wali siswa membutuhkan sistem yang berguna untuk menyajikan informasi akademik siswa. Hal ini dilakukan agar wali siswa dapat mengetahui perkembangan akademis siswa dengan cepat dan mudah. Wali siswa juga membutuhkan media untuk membicarakan tentang perkembangan siswa di sekolah melalui suatu forum atau memberikan saran kepada sekolah. Pegawai yang tidak sedang berada di sekolah membutuhkan informasi akademik dengan cepat pada suatu sistem untuk memperlancar aktifitasnya di sekolah. Masyarakat yang ingin mengetahui informasi tentang sekolah tetapi belum sempat datang ke sekolah secara langsung memerlukan suatu sistem untuk mendapatkan informasi sekolah dengan mudah melalui portal sekolah bagi user tamu. Di samping itu, sekolah juga memerlukan suatu adanya media promosi untuk mengenalkan sekolah kepada masyarakat luas.
3. Solusi Pemecahan Masalah a. Staf TU dalam sistem ini berperan sebagai admin sekolah yang berperan mengelola data akademik sekolah. Admin juga berperan mengontrol pengguna dalam sistem, dan memberikan hak akses pengguna terhadap sistem. Admin sekolah bertugas untuk menambah/memasukkan data akademik yang baru, mengubah data akademik yang lama, dan menghapus data akademik yang sudah tidak diperlukan lagi. b. Siswa mempunyai username dan password dalam sistem yang ditentukan admin sekolah. Siswa berhak login ke sistem, melihat dan mengubah biodatanya, mengubah password, melihat nilai siswa, absensi siswa, jadwal pelajaran, dan info akademik. c. Guru memiliki user account dalam sistem yang ditentukan admin. Guru berhak login ke sistem, melihat dan mengubah biodatanya, mengubah password, melihat data kelas, absensi guru, dan jadwal pelajaran. d. Wali siswa mendapatkan user account dari admin sekolah. Wali siswa berhak login ke sistem, melihat dan mengubah datanya, mengubah password, melihat data siswa, info akademik, dan memberikan saran kepada sekolah melalui kotak saran wali. e. Pegawai memiliki user account dalam sistem. Pegawai berhak login ke sistem, melihat dan mengubah biodatanya, mengubah password, melihat absensi pegawai, profil kepsek dan membalas saran dari wali siswa. f. Masyarakat/user tamu akan mendapatkan informasi sekolah melalui portal sekolah seperti berita
sekolah, profil, galeri, dan kontak sehingga hal ini juga menjadi media promosi untuk memperkenalkan sekolah kepada masyarakat.
Gambar 4.1 Flowchart Sistem yang Diusulkan 4.3.2 Desain Sistem 1. DFD
Gambar 4.2 Diagram Konteks yang Diusulkan
Gambar 4.5 DFD Level 1 Proses 2.0
Gambar 4.3 DFD Level 0 yang Diusulkan Gambar 4.6 DFD Level 1 Proses 3.0
Gambar 4.7 DFD Level 1 Proses 4.0
Gambar 4.4 DFD Level 1 Proses 1.0 Gambar 4.8 DFD Level 1 Proses 5.0
2. ERD dan LRS
Gambar 4.9 ERD Sistem Akademik
Gambar 4.10 LRS Sistem Akademik
4.4 Construction (Code and Test) 4.4.1 Pengkodean Pengkodean dilakukan dengan menggunakan bahasa xHTML MP versi 1.0 sebagai bahasa pemrograman mobile webnya dan PHP versi 5.2.5 sebagai bahasa server side web-nya. Penulis menggunakan jQuery versi 1.3.2 untuk mempercantik tampilan halaman web. Untuk database, digunakan MySQL versi 5.0.51a. Adapun untuk mengelola administrasi MySQL, penulis menggunakan phpMyAdmin versi 2.11.4 yang terdapat pada XAMPP versi 1.6.6a. 4.4.2 Pengujian 1. Hosting Sistem Sebelum pengujian, penulis melakukan hosting ke web hosting agar sistem dapat diuji sesuai dengan pelaksanaan yang sebenarnya di lapangan. Penulis menggunakan web hosting dan bukan WAP hosting karena sistem sesuai dengan cara kerja WAP 2.0 yang meminta layanan pada web server secara langsung. Prosesnya dapat dilihat berikut ini. 1. Mendapatkan nama domain, dengan menggunakan nama domain gratis dari co.cc dengan alamat http://www.co.cc. 2. Hosting ke web hosting, dengan menggunakan web hosting gratis yaitu freehostia dengan alamat http://www.freehostia.com. 3. Upload file ke web hosting, dengan menggunakan software FTP FileZilla versi 3.3.4. 2.Pengujian Mandiri Pengujian mandiri dilakukan oleh penulis sendiri. Pengujian ini terdiri dari : 1. Pengujian mobile web user dilakukan pada : a. Komputer localhost : micro broser Opera Mobile for Windows. b. Handphone : Opera Mini versi 4.2 dan browser handphone Sony
Ericsson K510i pada alamat : smamugatangerang.co.cc c. Web online : simulator Opera Mini versi 4.2 dan simulator browser handphone pada web mobiReady. 2. Pengujian web admin sekolah dilakukan pada : a. Komputer localhost : browser Mozilla Firefox versi 3.6. b. Web : Mozilla Firefox versi 3.6 yang beralamat di smamugatangerang.co.cc/admin 3. Pengujian Lapangan Pengujian lapangan dilakukan oleh pihak sekolah yaitu staf TU di SMA Muhammadiyah 3 Tangerang. Pengujian ini dilakukan dengan menggunakan metode black box yang dilakukan tanpa memperhatikan source code program dan lebih memfokuskan pada keperluan fungsional sistem. Pengujian dilakukan di Ruang TU SMA Muga Tangerang pada tanggal 9 Desember 2010. 4.5 Deployment (Delivery and Feedback) Setelah dilakukan pengujian lapangan oleh pihak sekolah maka pada selanjutnya sistem akademik dapat diserahkan (delivery) kepada pihak sekolah untuk dapat langsung digunakan karena produk hasil increment pertama merupakan produk inti yang sudah siap digunakan oleh user/sekolah. Jika belum sesuai dengan kebutuhan sekolah maka evaluasi sekolah tersebut dijadikan umpan balik (feedback) untuk mengembangkan sistem akademik yang lebih baik lagi pada tahap increment berikutnya. V.Penutup 5.1 Kesimpulan 1. Sistem akademik sekolah berbasis web pada admin sekolah ini dapat mempermudah pengelolaan data dan
informasi dari sistem akademik sekolah yang sudah ada sebelumnya. 2. Perancangan sistem akademik sekolah berbasis mobile web digunakan untuk memudahkan siswa, guru, dan pegawai yang sedang tidak berada di sekolah untuk memperoleh informasi yang berkaitan dengan akademik sekolah dengan cepat dan mudah. 3. Dengan adanya sistem ini, wali siswa dapat memantau perkembangan akademis siswa di sekolah secara cepat dan mudah, karena mereka dapat mengakses sistem akademik sekolah menggunakan layanan mobile web. 4. Dengan sistem akademik sekolah ini, masyarakat yang ingin mengetahui informasi tentang sekolah, dapat mengakses sistem ini melalui handphone mereka. Hal ini juga menjadi sarana promosi pihak sekolah untuk mengenalkan sekolah kepada masyarakat luas. 5.2 Saran 1. Untuk pengembangan selanjutnya sistem akademik ini diharapkan dapat menyajikan informasi akademik secara keseluruhan yang terkait dengan sekolah tersebut, seperti informasi keuangan sekolah, penerimaan siswa baru, dan sebagainya. 2. Diharapkan pada tahap pengembangan selanjutnya, sistem akademik ini memiliki tingkat keamanan (security) yang lebih tinggi dari sebelumnya karena penulis sadar bahwa tingkat keamanan sistem yang penulis rancang masih terdapat banyak kekurangan apalagi dengan banyaknya teknik hacking di dunia maya akan semakin menambah tingkat kerawanan sistem ini dapat disusupi oleh hacker yang dengan mudahnya menghancurkan sistem.
DAFTAR PUSTAKA Divisi Litbang MADCOMS. 2004. Aplikasi Program PHP dan MySQL untuk Membuat Website Interaktif. Yogyakarta : ANDI. Elidjen, dkk. 2005. Jurnal Aplikasi Sistem Penjualan Tiket Bioskop 21 Berbasis Web dan WAP. [Online] Tersedia : http://journal.uii.ac.id/index.php/Snati/a rticle/view/1342/1125 [3 September 2010]. Hakim, Lukmanul. 2010. Bikin Website Super Keren dengan PHP dan jQuery. Yogyakarta : Lokomedia. Hariyanto, Bambang. 2004. Rekayasa Sistem Berorientasi Objek. Bandung : Informatika. Hartono, Jogiyanto. 2006. Analisis dan Desain Sistem Informasi : Pendekatan Terstruktur Teori dan Praktik Aplikasi Bisnis. Yogyakarta : ANDI. Haryanto, Yuli. 2010. State Transition Diagram. [Online] Tersedia : http://haryantoyuli.blogspot.com/2010/ 07/state-transition-diagram.html [23 September 2010]. Hendra. 2010. Mengenal Lebih Jauh Opera Browser. [Online] Tersedia : http://webhendra.web.id/?p=94 [15 September 2010]. Jusak. 2008. Kreasi Situs Mobile Internet dengan xHTML MP. Jakarta : Prestasi Pustaka. Kadir, Abdul. 2009. Dasar Perancangan dan Implementasi Database Relasional. Yogyakarta : ANDI. Nugroho, Bunafit. 2005. Database Relasional dengan MySQL. Yogyakarta : ANDI. Obie. 2008. Mobile Web. [Online] Tersedia: http://www.obilog.info/2008/08/mobile -web/ [15 September 2010]. Peranginangin, Kasiman. 2006. Aplikasi Web dengan PHP dan MySQL. Yogyakarta : ANDI.
Pressman, Roger S. 2005. Software Engineering A Practitioner's Approach Sixth Edition. New York : Mc. Graw Hill. Putro. 2007. Istilah Akademik. [Online] Tersedia : http://id.wikipedia.org/wiki/Akademik [15 September 2010]. Simarmata, Janner. 2010. Rekayasa Web. Yogyakarta : ANDI. Sutanta, Edhy. 2005. Pengantar Teknologi Informasi. Yogyakarta : Graha Ilmu. Tim Wahana Komputer. 2004. Membuat Website Interaktif dengan Macromedia Dreamweaver MX. Yogyakarta : ANDI. WAP Forum. 2002. WAP 2.0 Technical White Paper. [Online] Tersedia : http://www.wapforum.org/what/WAP White_Paper1.pdf [17 Juli 2010].
LAMPIRAN A SURAT PENELITIAN
A-1
LAMPIRAN B WAWANCARA
B-1
WAWANCARA Wawancara I Narasumber :
Abd. Rohim, S.Ag, M.Pd.
Jabatan
:
Kepala Sekolah
Tanggal
:
Kamis, 23 September 2010
Tempat
:
SMA Muhammadiyah 3 Tangerang
Penanya
:
Nendy Subhansyah
Tema
:
Pelaksanaan Sistem Akademik
Tujuan
: Mengetahui sistem akademik yang berjalan di SMA Muhammadiyah 3 Tangerang
Pertanyaan : 1. Bagaimana pelaksanaan sistem akademik yang berjalan sejauh ini ? 2. Bagaimana proses penyampaian informasi akademik sekolah kepada siswa dan guru ? 3. Bagaimana proses penyampaian informasi akademis siswa kepada wali siswa ? 4. Bagaimana cara masyarakat luas untuk mengetahui informasi dari sekolah ini ? 5. Bagaimana menurut Bapak, jika saya mencoba mengajukan sistem akademik sekolah berbasis mobile web ?
Jawaban : 1. Pelaksanaan sistem akademiknya yaitu perancangan informasi dari sistem akademiknya ditentukan bersama dalam rapat keputusan sekolah dan bagian kurikulumlah yang merumuskan detail dari rancangan program tadi, hasilnya diberikan bidang kurikulum kepada staf TU, lalu staf TU melakukan rekapitulasi dan penyimpanan datadata akademik sekolah dengan menggunakan komputer. 2. Proses penyampaian informasi akademik kepada siswa dan guru dilakukan secara manual yaitu informasi akademik ditempel pada mading sekolah dan surat pengumuman diberikan kepada wali kelas untuk disampaikan kepada siswa dan diberikan kepada guru itu sendiri. 3. Proses penyampaian informasi akademis siswa masih dilakukan secara manual kepada wali siswa/orang tua, yaitu dengan memberikan surat pengumuman dan buku penghubung dari sekolah untuk mencatat aktivitas siswa dan pada pengambilan raport setelah ujian semester, wali siswa datang ke sekolah. 4. Bagi masyarakat yang ingin mengetahui informasi dari SMA Muhammadiyah 3 Tangerang dapat dilakukan dengan cara datang ke sekolah secara langsung untuk berbicara kepada pihak sekolah, jika belum bisa datang maka dapat menghubungi nomor telepon sekolah. 5. Boleh saja, kami setuju dan menerima dengan tangan terbuka sistem yang anda buat.
Wawancara II Narasumber :
Dewi Sri Rahayu, S.Si
Jabatan
:
PKS Bidang Kurikulum
Tanggal
:
Selasa, 12 Oktober 2010
Tempat
:
SMA Muhammadiyah 3 Tangerang
Penanya
:
Nendy Subhansyah
Tema
:
Penilaian Siswa
Tujuan
:
Mengetahui prosedur sistem penilaian siswa pada SMA Muhammadiyah 3 Tangerang
Pertanyaan : 1. Bagaimana bentuk penilaian siswa di SMA Muhammadiyah 3 Tangerang ? 2. Apa yang dimaksud dengan penilaian kognitive, psychomotoric, dan affective ? 3. Bagaimana cara menghitung penilaian hasil belajar siswa tersebut ? 4. Sejauh mana wali siswa/orangtua dapat memantau perkembangan akademis anak mereka ?
Jawaban : 1. Bentuk penilaian siswa di SMA Muhammadiyah 3 Tangerang berupa penilaian ulangan harian, UTS, dan UAS. Penilaian siswa meliputi 3 aspek yaitu aspek kognitif, psikomotorik, dan afektif dan harus memenuhi KKM (Kriteria Ketuntasan Minimal). Siswa dikatakan telah lulus jika penilaian dari ketiga aspek di atas telah memenuhi KKM, dan siswa dikatakan belum lulus jika penilaian dari ketiga aspek tadi atau salah satunya saja belum memenuhi KKM dan wajib mengikuti tes remedial pada mata pelajaran yang masih di bawah standar KKM. 2. Kognitive/kognitif : penilaian siswa dalam pemahaman dan pengetahuan/intelektualitas
dalam
penyerapan
materi,
pschycomotoric/psikomotorik : penilaian siswa dalam keaktifan dan keikutsertaan siswa dalam proses KBM/mata pelajaran yang bersifat praktikum,
affective/afektif : penilaian siswa dalam
sikap dan tingkah laku siswa dalam KBM. 3. Untuk menghitung nilai kognitif dirumuskan dengan : (60% * rata nilai harian) + (20% * nilai uts) + (20% * nilai uas). Rata-rata nilai harian diperoleh dari : (nilai harian 1 + nilai harian 2 + nilai harian 3 + nilai harian 4 + nilai harian 5 + nilai harian 6) / 6.
Nilai psikomotorik diperoleh dari penilaian guru masing-masing mata pelajaran terhadap keikutsertaan siswa dalam KBM yang memiliki range nilai berupa angka dari 10-100. Sedangkan nilai afektif diperoleh dari penilaian guru masing-masing mata pelajaran terhadap tingkah laku siswa dan memiliki range nilai berupa huruf dari A-D.
Adapun kriteria kelulusan minimal
(KKM) untuk masing – masing mata pelajaran, guru masingmasing lah yang menentukan KKM-nya. 4. Wali siswa memantau anak mereka dengan mendapatkan buku penghubung dari sekolah untuk mencatat aktivitas siswa agar diketahui oleh wali siswa/orangtua, setiap ada kasus yang terjadi pada siswa pihak sekolah selalu koordinasi dengan wali siswa dan memanggil mereka, dan pada pengambilan raport setelah ujian semester, wali siswa/orangtua datang ke sekolah.
LAMPIRAN C PENGUJIAN LAPANGAN
C-1
PENGUJIAN SISTEM OLEH PIHAK SEKOLAH Tanggal
:
Tempat
:
Penguji
:
Jabatan
:
I. Pengujian Mobile Web User Rancangan Proses Klik menu beranda Klik cari berita sekolah Klik berita selengkapnya Klik kembali ke beranda Klik menu profil Klik visi dan misi Klik fasilitas Klik ekstrakurikuler Klik prestasi sekolah Klik kembali ke profil sekolah Klik menu siswa Masukkan username dan password lalu klik login Klik menu biodata siswa Klik ubah biodata Masukkan biodata lalu klik ubah Klik ubah password Masukkan password lalu klik kirim Klik lihat data semua siswa Klik kembali ke biodata siswa Klik menu nilai siswa
Hasil yang Diharapkan Menampilkan halaman beranda Menampilkan halaman pencarian berita Menampilkan halaman berita yang lengkap Kembali ke halaman beranda Menampilkan halaman profil sekolah Menampilkan halaman visi dan misi Menampilkan halaman fasilitas sekolah Menampilkan halaman ekstrakurikuler Menampilkan halaman prestasi sekolah Kembali ke halaman profil sekolah Menampilkan halaman login siswa Masuk ke dalam halaman tampil siswa
Menampilkan halaman biodata siswa Menampilkan halaman ubah biodata siswa Mengubah biodata siswa dan menampilkan halaman biodata siswa Menampilkan halaman ubah password siswa Mengubah password siswa dan menampilkan halaman biodata siswa Menampilkan halaman data semua siswa Kembali ke halaman biodata siswa Menampilkan halaman nilai siswa yang login Pilih data lalu klik tombol Pilih Menampilkan nilai siswa Klik lihat semua nilai siswa Menampilkan halaman semua nilai siswa Klik kembali ke nilai siswa Kembali ke halaman nilai siswa Klik menu absensi siswa Menampilkan halaman absensi siswa yang login Pilih data lalu klik tombol Pilih Menampilkan absensi siswa
Hasil Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Klik lihat semua absensi siswa Klik kembali ke absensi siswa Klik menu jadwal pelajaran Pilih kelas lalu klik tombol Pilih Klik lihat semua jadwal Klik kembali ke jadwal Klik menu info akademik Klik logout siswa Klik menu guru Masukkan username dan password lalu klik login Klik menu biodata guru Klik ubah biodata Masukkan biodata lalu klik ubah Klik ubah password Masukkan password lalu klik kirim Klik lihat data semua guru Klik kembali ke biodata guru Klik menu data kelas Klik menu absensi guru
Menampilkan halaman semua absensi siswa Kembali ke halaman absensi siswa Menampilkan halaman jadwal pelajaran Menampilkan data jadwal pelajaran sesuai kelas yang dipilih Menampilkan jadwal pelajaran semua kelas Kembali ke halaman jadwal pelajaran siswa Menampilkan halaman info akademik Keluar dari halaman siswa Menampilkan halaman login guru Masuk ke dalam halaman tampil guru
Sesuai Sesuai Sesuai Sesuai
Menampilkan halaman biodata guru Menampilkan halaman ubah biodata guru Mengubah biodata guru dan menampilkan halaman biodata guru Menampilkan halaman ubah password guru Mengubah password guru dan menampilkan halaman biodata guru Menampilkan halaman data semua guru Kembali ke halaman biodata guru Menampilkan halaman data kelas Menampilkan halaman absensi guru yang login klik Menampilkan absensi guru
Sesuai Sesuai Sesuai
Menampilkan halaman semua absensi guru Kembali ke halaman absensi guru Menampilkan halaman jadwal pelajaran Menampilkan data jadwal pelajaran sesuai kelas yang dipilih Menampilkan jadwal pelajaran semua kelas Kembali ke halaman jadwal pelajaran guru Keluar dari halaman guru Menampilkan halaman login wali siswa Masuk ke dalam halaman tampil wali siswa
Sesuai Sesuai Sesuai Sesuai
Masukkan data lalu tombol Pilih Klik lihat semua absensi guru Klik kembali ke absensi guru Klik menu jadwal pelajaran Pilih kelas lalu klik tombol Pilih Klik lihat semua jadwal Klik kembali ke jadwal Klik logout guru Klik menu wali siswa Masukkan username dan password lalu klik login Klik menu data wali siswa Klik ubah data wali siswa Masukkan data lalu klik ubah
Menampilkan halaman data wali siswa Menampilkan halaman ubah data wali siswa Mengubah data wali siswa dan menampilkan halaman data wali siswa Klik ubah password Menampilkan halaman ubah password wali siswa Masukkan password lalu klik Mengubah password wali siswa dan kirim menampilkan halaman data wali siswa
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Kembali ke halaman data wali siswa Menampilkan halaman data semua siswa Menampilkan halaman hasil pencarian data siswa Menampilkan halaman nilai semua siswa Menampilkan halaman hasil pencarian siswa dan nilainya Menampilkan halaman absensi semua siswa Menampilkan halaman hasil pencarian siswa dan absensinya Kembali ke halaman data semua siswa Menampilkan halaman info akademik Menampilkan halaman data kelas Kembali ke halaman info akademik Menampilkan halaman kotak saran wali siswa Masukkan data saran wali lalu Menambah saran wali siswa dan klik tombol Kirim menampilkan halaman kotak saran wali siswa Klik logout wali siswa Keluar dari halaman wali siswa Klik menu pegawai Menampilkan halaman login pegawai Masukkan username dan Masuk ke dalam halaman tampil pegawai password lalu klik login Klik menu biodata pegawai Menampilkan halaman biodata pegawai Klik ubah biodata Menampilkan halaman ubah biodata pegawai Masukkan biodata lalu klik Mengubah biodata pegawai dan ubah menampilkan halaman biodata pegawai Klik ubah password Menampilkan halaman ubah password pegawai Masukkan password lalu klik Mengubah password pegawai dan kirim menampilkan halaman biodata pegawai Klik lihat data semua pegawai Menampilkan halaman semua data pegawai Klik kembali ke biodata Kembali ke halaman biodata pegawai pegawai Klik menu absensi pegawai Menampilkan halaman absensi pegawai yang login Masukkan data lalu klik Menampilkan absensi pegawai tombol Pilih Klik lihat semua absensi Menampilkan halaman semua absensi pegawai pegawai Klik kembali ke absensi Kembali ke halaman absensi pegawai pegawai Klik menu profil kepsek Menampilkan halaman profil kepala sekolah Klik menu balas saran Menampilkan halaman balasan saran wali
Klik kembali ke data walisiswa Klik menu data siswa Masukkan nama lalu klik cari siswa Klik lihat nilai siswa Masukkan nama lalu klik cari siswa Klik lihat absensi siswa Masukkan nama lalu klik cari siswa Klik kembali ke data siswa Klik menu info akademik Klik lihat data kelas Klik kembali ke info akademik Klik menu kotak saran
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Masukkan balasan saran wali Menambah balasan saran wali siswa dan siswa lalu klik tombol Kirim menampilkan halaman balasan saran wali siswa Klik logout pegawai Keluar dari halaman pegawai Klik menu alumni Menampilkan halaman alumni Masukkan data alumni lalu Menambah data alumni dan menampilkan klik tombol Kirim halaman alumni Masukkan nama lalu klik cari Menampilkan halaman hasil cari alumni alumni Klik kembali ke alumni Kembali ke halaman alumni Klik menu galeri Menampilkan halaman album galeri foto Klik gambar/judul album Menampilkan halaman galeri foto Klik kembali ke album galeri Kembali ke halaman album galeri foto foto Klik menu kontak Menampilkan halaman kontak Masukkan data tamu lalu klik Menambah data tamu dan menampilkan tombol Kirim daftar tamu pada halaman kontak
Tangerang, Desember 2010 Penguji,
-------------------------------------
Sesuai
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
II.
Pengujian Web Admin Sekolah
Rancangan Proses Buka halaman login admin Masukkan username dan password admin lalu klik login Klik menu pengguna > admin Klik menu tambah data admin Masukkan data admin lalu klik tombol tambah Klik menu ubah password admin Masukkan password admin lalu klik tombol ubah Klik icon ubah Masukkan data admin lalu klik tombol ubah Tandai daftar admin lalu klik tombol hapus Klik kembali ke menu utama Klik menu pengguna > siswa Klik menu tambah data siswa Masukkan data siswa lalu klik tombol tambah Klik icon ubah Masukkan data siswa lalu klik tombol ubah Klik icon ubah password Masukkan password siswa lalu klik tombol ubah Klik icon hapus Klik kembali ke menu utama Klik menu lihat nilai siswa Masukkan data nilai siswa lalu klik tombol tambah Klik icon ubah Masukkan data nilai siswa lalu klik tombol ubah Tandai daftar nilai siswa lalu klik tombol hapus Klik menu lihat info akademik Masukkan data info akademik lalu klik tombol tambah
Hasil yang Diharapkan Menampilkan halaman login admin Masuk ke dalam halaman beranda admin
Hasil Sesuai Sesuai
Menampilkan halaman daftar admin Menampilkan halaman form tambah admin Menambah data admin dan menampilkan halaman daftar admin Menampilkan halaman form ubah password admin Mengubah password admin dan menampilkan halaman daftar admin Menampilkan halaman form ubah admin Mengubah data admin dan menampilkan halaman daftar admin Menghapus data pada daftar admin
Sesuai Sesuai Sesuai
Kembali ke halaman beranda admin Menampilkan halaman daftar siswa Menampilkan halaman form tambah siswa Menambah data siswa dan menampilkan halaman daftar siswa Menampilkan halaman form ubah siswa Mengubah data siswa dan menampilkan halaman daftar siswa Menampilkan halaman ubah password siswa Mengubah password siswa dan menampilkan halaman daftar siswa Menghapus data pada daftar siswa Kembali ke halaman beranda admin Menampilkan halaman daftar nilai siswa Menambah data nilai siswa dan menampilkan halaman daftar nilai siswa Menampilkan halaman form ubah nilai siswa Mengubah data nilai siswa dan menampilkan halaman daftar nilai siswa Menghapus data pada daftar nilai siswa
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Menampilkan halaman daftar info akademik Sesuai Menambah data info akademik dan Sesuai menampilkan halaman daftar info akademik
Klik icon ubah Masukkan data info akademik lalu klik tombol ubah Tandai daftar info akademik lalu klik tombol hapus Klik kembali ke daftar nilai siswa Klik kembali ke daftar siswa Klik menu lihat absensi siswa Masukkan data absensi siswa lalu klik tombol tambah Klik icon ubah Masukkan data absensi siswa lalu klik tombol ubah Tandai daftar absensi siswa lalu klik tombol hapus Klik kembali ke daftar siswa Klik menu jadwal pelajaran Masukkan jadwal pelajaran lalu klik tombol tambah Klik icon ubah Masukkan data jadwal pelajaran lalu klik tombol ubah Tandai daftar jadwal pelajaran lalu klik tombol hapus Klik menu lihat mata pelajaran Masukkan data mata pelajaran lalu klik tombol tambah Klik icon ubah Masukkan data mata pelajaran lalu klik tombol ubah Tandai daftar mata pelajaran lalu klik tombol hapus Klik kembali ke jadwal pelajaran Klik kembali ke daftar siswa Klik kembali ke menu utama Klik menu pengguna > guru Klik menu tambah data guru Masukkan data guru lalu klik tombol tambah Klik icon ubah Masukkan data guru lalu klik tombol ubah Klik icon ubah password
Menampilkan halaman ubah info akademik Sesuai Mengubah data info akademik dan Sesuai menampilkan halaman daftar info akademik Menghapus data pada daftar info akademik Sesuai Kembali ke halaman daftar nilai siswa
Sesuai
Kembali ke halaman daftar siswa Menampilkan halaman daftar absensi siswa Menambah data absensi siswa dan menampilkan halaman daftar absensi siswa Menampilkan halaman ubah absensi siswa Mengubah data absensi siswa dan menampilkan halaman daftar absensi siswa Menghapus data pada daftar absensi siswa
Sesuai Sesuai Sesuai
Kembali ke halaman daftar siswa Menampilkan halaman jadwal pelajaran Menambah data jadwal pelajaran dan menampilkan halaman jadwal pelajaran Menampilkan halaman ubah jadwal Mengubah data jadwal pelajaran dan menampilkan halaman daftar jadwal Menghapus data pada daftar jadwal pelajaran Menampilkan halaman daftar mata pelajaran Menambah data mata pelajaran dan menampilkan halaman mata pelajaran Menampilkan halaman ubah mata pelajaran Mengubah data mata pelajaran dan menampilkan halaman daftar mata pelajaran Menghapus data pada daftar mata pelajaran
Sesuai Sesuai Sesuai
Sesuai Sesuai Sesuai
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Kembali ke halaman jadwal pelajaran
Sesuai
Kembali ke halaman daftar siswa Menampilkan halaman beranda admin Menampilkan halaman daftar guru Menampilkan halaman form tambah guru Menambah data guru dan menampilkan halaman daftar guru Menampilkan halaman form ubah guru Mengubah data guru dan menampilkan halaman daftar guru Menampilkan halaman ubah password guru
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Masukkan password guru lalu klik tombol ubah Klik icon hapus Klik menu lihat data kelas Klik menu tambah data kelas Masukkan data kelas lalu klik tombol tambah Klik icon ubah Masukkan data kelas lalu klik tombol ubah Tandai daftar kelas lalu klik tombol hapus Klik kembali ke daftar guru Klik menu lihat absensi guru Masukkan data absensi guru lalu klik tombol tambah Klik icon ubah Masukkan data absensi guru lalu klik tombol ubah Tandai daftar absensi guru lalu klik tombol hapus Klik kembali ke daftar guru Klik kembali ke menu utama Klik menu pengguna > wali siswa Klik menu tambah data wali Masukkan data wali siswa lalu klik tombol tambah Klik icon ubah Masukkan data wali siswa lalu klik tombol ubah Klik icon ubah password Masukkan password wali siswa lalu klik tombol ubah Tandai daftar wali siswa lalu klik tombol hapus Klik menu lihat kotak saran Tandai daftar kotak saran lalu klik tombol hapus Klik kembali ke daftar wali Klik kembali ke menu utama Klik menu pengguna> pegawai Klik menu tambah data pegawai Masukkan data pegawai lalu
Mengubah password guru dan menampilkan halaman daftar guru Menghapus data pada daftar guru Menampilkan halaman daftar kelas Menampilkan halaman form tambah kelas Menambah data kelas dan menampilkan halaman daftar kelas Menampilkan halaman form ubah kelas Mengubah data kelas dan menampilkan halaman daftar kelas Menghapus data pada daftar kelas
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Menampilkan halaman daftar guru Menampilkan halaman daftar absensi guru Menambah data absensi guru dan menampilkan halaman daftar absensi guru Menampilkan halaman ubah absensi guru Mengubah data absensi guru dan menampilkan halaman daftar absensi guru Menghapus data pada daftar absensi guru
Sesuai
Menampilkan halaman daftar guru Menampilkan halaman beranda admin Menampilkan halaman daftar wali siswa
Sesuai Sesuai Sesuai
Menampilkan halaman form tambah wali Menambah data wali siswa dan menampilkan halaman daftar wali siswa Menampilkan halaman form ubah wali siswa Mengubah data wali siswa dan menampilkan halaman daftar wali siswa Menampilkan halaman ubah password wali Mengubah password wali siswa dan menampilkan halaman daftar wali siswa Menghapus data pada daftar wali siswa
Sesuai Sesuai
Menampilkan halaman daftar saran wali Menghapus data pada daftar saran wali siswa Menampilkan halaman daftar wali siswa Menampilkan halaman beranda admin Menampilkan halaman daftar pegawai Menampilkan halaman form tambah pegawai Menambah data pegawai dan menampilkan
Sesuai Sesuai Sesuai Sesuai Sesuai
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
klik tombol tambah Klik icon ubah Masukkan data pegawai lalu klik tombol ubah Klik icon ubah password Masukkan password pegawai lalu klik tombol ubah Klik icon hapus Klik menu lihat absensi pegawai Masukkan absensi pegawai lalu klik tombol tambah Klik icon ubah Masukkan data absensi pegawai lalu klik tombol ubah Tandai daftar absensi pegawai lalu klik tombol hapus Klik kembali ke daftar pegawai Klik kembali ke menu utama Klik menu pengguna > alumni Tandai daftar alumni lalu klik tombol hapus Klik kembali ke menu utama Klik menu sekolah > berita sekolah Masukkan berita lalu klik tombol tambah Klik icon ubah Masukkan data berita sekolah lalu klik tombol ubah Klik icon hapus Klik kembali ke menu utama Klik menu sekolah > prestasi sekolah Masukkan prestasi lalu klik tombol tambah Klik icon ubah Masukkan data prestasi sekolah lalu klik tombol ubah Tandai daftar prestasi sekolah lalu klik tombol hapus Klik kembali ke menu utama Klik menu sekolah > ekstrakurikuler
halaman daftar pegawai Menampilkan halaman form ubah pegawai Mengubah data pegawai dan menampilkan halaman daftar pegawai Menampilkan ubah password pegawai Mengubah password pegawai dan menampilkan halaman daftar pegawai Menghapus data pada daftar pegawai Menampilkan halaman daftar absensi pegawai Menambah data absensi pegawai dan menampilkan daftar absensi pegawai Menampilkan ubah absensi pegawai Mengubah data absensi pegawai dan menampilkan daftar absensi pegawai Menghapus data pada daftar absensi pegawai
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Menampilkan halaman daftar pegawai
Sesuai
Menampilkan halaman beranda admin Menampilkan halaman daftar alumni Menghapus data pada daftar alumni
Sesuai Sesuai Sesuai
Menampilkan halaman beranda admin Menampilkan halaman daftar berita sekolah
Sesuai Sesuai
Menambah data berita sekolah dan menampilkan daftar berita sekolah Menampilkan halaman ubah berita sekolah Mengubah data berita sekolah dan menampilkan daftar berita sekolah Menghapus data pada daftar berita sekolah Menampilkan halaman beranda admin Menampilkan halaman daftar prestasi sekolah Menambah data prestasi sekolah dan menampilkan daftar prestasi sekolah Menampilkan halaman ubah prestasi sekolah Mengubah data prestasi sekolah dan menampilkan daftar prestasi sekolah Menghapus data pada daftar prestasi sekolah
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Menampilkan halaman beranda admin Sesuai Menampilkan halaman daftar ekstrakurikuler Sesuai
Masukkan data ekskul lalu klik tombol tambah Klik icon ubah Masukkan data ekstrakurikuler lalu klik tombol ubah Tandai daftar ekstrakurikuler lalu klik tombol hapus Klik kembali ke menu utama Klik menu galeri Klik judul/gambar album Klik hapus Klik menu tambah data album Masukkan data album lalu klik tambah Klik menu kembali ke album galeri foto Klik menu tambah data galeri Masukkan data galeri lalu klik tambah Klik menu kembali ke album galeri foto Klik kembali ke menu utama Klik menu pengguna > buku tamu Tandai daftar buku tamu lalu klik tombol hapus Klik kembali ke menu utama
Menambah data ekstrakurikuler dan menampilkan daftar ekstrakurikuler Menampilkan halaman ubah ekstrakurikuler Mengubah data ekstrakurikuler dan menampilkan daftar ekstrakurikuler Menghapus data pada daftar ekstrakurikuler Menampilkan halaman beranda admin Menampilkan halaman album galeri foto Menampilkan halaman galeri foto Menghapus album/galeri foto Menampilkan halaman form tambah album Menambah data album dan menampilkan daftar album galeri foto Menampilkan halaman album galeri foto
Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai Sesuai
Menampilkan halaman form tambah galeri Sesuai Menambah data galeri dan menampilkan Sesuai daftar album galeri foto Menampilkan halaman album galeri foto Sesuai Menampilkan halaman beranda admin Menampilkan halaman daftar buku tamu
Sesuai Sesuai
Menghapus data pada daftar buku tamu
Sesuai
Menampilkan halaman beranda admin
Sesuai
Tangerang, Desember 2010 Penguji,
-------------------------------------
LAMPIRAN D TAMPILAN SISTEM
(A)Simulator Opera Mobile for Windows di Localhost (B)Simulator Online Opera Mini v4.2 (C)Simulator Online HP Nokia N70
D-1
TAMPILAN SISTEM I. Tampilan Mobile Web User 1. Tampilan beranda
(A)
(B)
(C)
2. Tampilan profil sekolah
(A)
(B)
(C)
(B)
(C)
3. Tampilan login siswa
(A)
4. Tampilan biodata siswa
(A)
(B)
(C)
(B)
(C)
(B)
(C)
5. Tampilan nilai siswa
(A) 6. Tampilan absensi siswa
(A)
7. Tampilan jadwal pelajaran
(A)
(B)
(C)
(B)
(C)
(B)
(C)
8. Tampilan ubah biodata guru
(A) 9. Tampilan absensi guru
(A)
10. Tampilan ubah password wali siswa
(A)
(B)
(C)
(B)
(C)
(B)
(C)
11. Tampilan kotak saran wali siswa
(A) 12. Tampilan kontak
(A)
II. Tampilan Web Admin 1. Tampilan login admin
2. Tampilan beranda admin
3. Tampilan daftar admin
4. Tampilan tambah admin
5. Tampilan daftar siswa
6. Tampilan ubah password siswa
7. Tampilan daftar nilai siswa
8. Tampilan daftar absensi siswa
9. Tampilan daftar jadwal pelajaran
10. Tampilan daftar guru
11. Tampilan ubah data guru
12. Tampilan daftar kelas
13. Tampilan daftar wali siswa
14. Tampilan daftar saran wali siswa
15. Tampilan daftar berita sekolah
LAMPIRAN E SOURCE CODE PROGRAM
E-1
SOURCE CODE PROGRAM a. index.php '); ?> SMAM 3 TNG <meta http-equiv="Cache-Control" content="notransform" />
Sistem Akademik Sekolah SMA Muhammadiyah 3 Tangerang
"; }while($row=mysql_fetch_row($query)); } //Langkah 3: Hitung total data dan halaman
$tampil2="select * from berita order by id_berita ASC"; $hasil2=mysql_query($tampil2); $jmldata=mysql_num_rows($hasil2); $jmlhalaman=ceil($jmldata/$batas); $file="index.php"; echo"
"; // Link ke halaman sebelumnya (previous) if($halaman > 1){ $previous=$halaman-1; echo "Awal|"; } else { echo "Awal|"; }
![\"back\"](\"images/Back.jpg\")
"; } else { echo "Awal|![\"next\"](\"images/Next.jpg\")
|Akhir"; } echo "![](\"images/Back.jpg\"<br)