PERANCANGAN SISTEM AKADEMIK SEKOLAH BERBASIS ...

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


Skripsi Sebagai Salah Satu Syarat Untuk Memperoleh Gelar Sarjana Komputer

Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta


PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA 2011 M / 1432 H

ii


Skripsi Sebagai Salah Satu Syarat Untuk Memperoleh Gelar Sarjana Komputer Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta


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

Penulis

viii

DAFTAR ISI

Halaman LEMBAR SAMPUL …………………………………………

i

LEMBAR JUDUL .………………………………….……….

ii

LEMBAR PENGESAHAN PEMBIMBING .………………

iii

LEMBAR PENGESAHAN UJIAN ..............………………..

iv

LEMBAR PERNYATAAN ………………………………….

v

ABSTRAK ................................................................................

vi

KATA PENGANTAR ……………………………………….

vii

DAFTAR ISI ………………………………………………….

ix

DAFTAR GAMBAR …………………………………………

xiii

DAFTAR TABEL ……………………………………………

xix

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


67


67


68


68


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
Halo Tes

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 :

23

TES

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

disimpan

dalam

database,

konseptual. (Kadir, 2009 : 30).

melainkan

hanya

bersifat

26

Tabel 2.2 Simbol Entity Relationship Diagram (ERD) (sumber : Yudi, 2010)

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

5.0 Mencari Informasi Akademik Pegawai

6.0 Melihat Informasi Portal Sekolah

Verifikasi login, biodata pegawai, absensi pegawai, profil kepsek, dan balasan saran wali

Login pegawai, ubah biodata pegawai, lihat absensi pegawai, lihat profil kepsek dan balas 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


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


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


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


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


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


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


No. proses

: 1.5

Nama proses : Lihat/tambah/ubah/hapus data pegawai Masukan


6)

Keluaran

: daftar pegawai, daftar absensi pegawai

Deskripsi

: Mengolah data pegawai

DFD


No. proses

: 1.6

Nama proses : Lihat/tambah/ubah/hapus data portal sekolah Masukan

: penulis, judul, isi berita, foto, prestasi, tahun, kegiatan, waktu, tutor, keterangan

7)

Keluaran

: daftar berita sekolah, profil sekolah, galeri, kontak

Deskripsi

: Mengolah data portal sekolah

DFD

: level 1 proses 2.0 siswa

No. proses

: 2.1

Nama proses : Lihat/ ubah biodata siswa Masukan

: username, password, nis, nama lengkap, kelas, jenis kelamin, tempat tanggal lahir, agama, alamat

Keluaran

: biodata siswa, data semua siswa

Deskripsi

: Menampilkan informasi siswa serta mengubah biodata dan password siswa

72

8)

DFD


No. proses

: 2.2

Nama proses : Lihat nilai siswa

9)

Masukan

:-

Keluaran

: data nilai siswa, data semua nilai siswa

Deskripsi

: Menampilkan informasi nilai siswa

DFD


No. proses

: 2.3

Nama proses : Lihat absensi siswa Masukan

:-

Keluaran

: data absensi siswa, data semua absensi siswa

Deskripsi

: Menampilkan informasi absensi siswa

10) DFD No. proses

: level 1 proses 2.0 siswa : 2.4

Nama proses : Lihat jadwal pelajaran Masukan

:-

Keluaran

: data jadwal pelajaran, data semua jadwal

Deskripsi

: Menampilkan informasi jadwal pelajaran

11) DFD No. proses

: level 1 proses 3.0 guru : 3.1

Nama proses : Lihat/ ubah biodata guru Masukan


73

Keluaran

: biodata guru, data semua guru

Deskripsi

: Menampilkan informasi guru serta mengubah biodata dan password guru

12) DFD No. proses


Nama proses : Lihat data kelas Masukan

:-

Keluaran

: data kelas

Deskripsi

: Menampilkan informasi data kelas

13) DFD No. proses


Nama proses : Lihat absensi guru Masukan

:-

Keluaran

: data absensi guru, data semua absensi guru

Deskripsi

: Menampilkan informasi absensi guru

14) DFD No. proses


Nama proses : Lihat jadwal pelajaran Masukan

:-

Keluaran

: data jadwal pelajaran, data semua jadwal

Deskripsi

: Menampilkan informasi jadwal pelajaran

15) DFD No. proses

: level 1 proses 4.0 wali siswa : 4.1

74

Nama proses : Lihat/ ubah data wali siswa Masukan

: username, password, nama siswa, nama lengkap, jenis kelamin, agama, telepon, email, alamat

Keluaran

: data wali siswa

Deskripsi

:

Menampilkan

informasi

wali

siswa

mengubah data dan password wali siswa 16) DFD No. proses


Nama proses : Lihat data siswa Masukan

:-

Keluaran

: data siswa, data nilaisiswa, data absensi siswa

Deskripsi

: Menampilkan informasi siswa

17) DFD No. proses


Nama proses : Lihat info akademik Masukan

:-

Keluaran

: info akademik, data kelas

Deskripsi

: Menampilkan info akademik dan data kelas

18) DFD No. proses


Nama proses : Kotak saran wali siswa Masukan

: nama, nama anak, email, saran

Keluaran

: daftar saran wali siswa

serta

75

Deskripsi

: Menampilkan informasi saran wali siswa dan memasukkan data saran wali siswa

19) DFD No. proses

: level 1 proses 5.0 pegawai : 5.1

Nama proses : Lihat/ ubah biodata pegawai Masukan


Keluaran

: biodata pegawai, data semua pegawai

Deskripsi

: Menampilkan informasi pegawai serta mengubah biodata dan password pegawai

20) DFD No. proses


Nama proses : Lihat absensi pegawai Masukan

:-

Keluaran

: data absensi pegawai, data absensi semua pegawai

Deskripsi

: Menampilkan informasi absensi pegawai

21) DFD No. proses


Nama proses : Lihat profil kepsek Masukan

:-

Keluaran

: profil kepsek

Deskripsi

: Menampilkan informasi profil kepsek

76

22) DFD No. proses


Nama proses : Balas saran wali siswa Masukan

: nama, nama anak, email, saran

Keluaran

: daftar balasan saran wali siswa

Deskripsi

: Menampilkan informasi balasan saran wali siswa dan memasukkan data balas saran wali siswa

23) DFD No. proses

: level 1 proses 6.0 user tamu : 6.1

Nama proses : Lihat berita sekolah Masukan

:-

Keluaran

: berita sekolah, detail berita sekolah

Deskripsi

: Menampilkan informasi berita sekolah

24) DFD No. proses

: level 1 proses 6.0 user tamu : 6.2

Nama proses : Lihat profil sekolah Masukan

:-

Keluaran

: profil sekolah, visi & misi, fasilitas, ekskul, prestasi sekolah

Deskripsi 25) DFD No. proses

: Menampilkan informasi profil sekolah : level 1 proses 6.0 user tamu : 6.3

Nama proses : Lihat galeri foto

77

Masukan

:-

Keluaran

: galeri foto, album foto

Deskripsi

: Menampilkan galeri foto

26) DFD

: level 1 proses 6.0 user tamu

No. proses

: 6.4

Nama proses : Lihat kontak Masukan

: nama, email, pesan

Keluaran

: daftar tamu

Deskripsi

: Menampilkan informasi kontak buku tamu dan memasukkan data tamu pada kontak

b. Data Store 1) siswa = @ id_siswa + id_kelas + username_siswa + password_siswa + nis + nama_siswa + jk + ttl + agama + alamat + notlp + email + foto 2) guru = @ id_guru + username_guru + password_guru + nip + nama_guru + jk + ttl + agama + alamat + notlp + email + pendidikan + jabatan + foto 3) wali_siswa = @ id_wali + username_wali + password_wali + nama_wali + namasiswa + jk + agama + notlp + email + alamat 4) pegawai = @ id_pegawai + username_pegawai + password_pegawai + nip + nama_pegawai + jk + ttl + agama + alamat + notlp + email + pendidikan + jabatan + foto

78

5) nilai_siswa = @ id_nilai + id_siswa + id_guru + id_kelas + id_wali + semester + thnpelajaran + kkm + kognitif + psikomotorik + afektif + nilaiharian + nilaiharian2 + nilaiharian3 + nilaiharian4 + nilaiharian5 + nilaiharian6 + ratanilaiharian + nilaimid + nilaiulum 6) absensi_siswa = @ id_absensi + id_siswa + id_guru + id_kelas + id_wali + semester + thnpelajaran + bulan + jumlahhadir + jumlahsakit + jumlahijin + jumlahalpa + jumlahabsensi 7) absensi_guru = @ id_absensi + id_guru + semester + bulan + thnpelajaran + jumlahhadir + jumlahsakit + jumlahijin + jumlahalpa + jumlahabsensi 8) absensi_pegawai = @ id_absensi + id_pegawai + semester + bulan + thnpelajaran + jumlahhadir + jumlahsakit + jumlahijin + jumlahalpa + jumlahabsensi 9) data_kelas = @ id_kelas + kelas + walikelas + jumlahsiswa + tahunajaran 10) jadwalpelajaran = @ id_jadwal + id_kelas + semester + hari + jam + jamke + namaguru + thnajaran 11) tamu = @ id_tamu + nama_tamu + email 12) kontak = @ id_kontak + id_tamu + tanggal + waktu + pesan 13) album = @ id_album + judul_album + gambar_album 14) galeri = @ id_galeri + id_album + judul_galeri + gambar_galeri + keterangan

79

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

Absensi Siswa id_absensi * id_siswa ** id_guru ** id_kelas ** id_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 * id_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 * id_pegawai ** semester bulan thnpelajaran jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi

Kontak id_kontak * id_tamu ** tanggal waktu pesan

Wali Siswa id_wali * username_wali password_wali nama_wali namasiswa jk agama notlp email alamat

Jadwal Pelajaran id_jadwal * id_kelas ** semester hari jam jamke namaguru thnajaran

Album Foto id_album * judul_album gambar_album

Nilai Siswa id_nilai * id_siswa ** id_guru ** id_kelas ** id_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 * id_album ** judul_galeri gambar_galeri keterangan

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(100) varchar(100) char(20) varchar(100) char(20) varchar(100) char(20) varchar(200) char(15) varchar(200) varchar(50)

Tabel 4.3 Tabel Guru Field id_guru * username_guru password_guru nip nama_guru jk ttl agama alamat notlp email pendidikan jabatan foto

Jenis int(10) varchar(100) varchar(100) char(20) varchar(100) char(20) varchar(100) char(30) varchar(200) char(15) varchar(200) varchar(30) varchar(100) varchar(100)

85

Tabel 4.4 Tabel Pegawai Field id_pegawai * username_pegawai password_pegawai nip nama_pegawai jk ttl agama alamat notlp email pendidikan jabatan foto

Jenis int(10) varchar(100) varchar(100) char(20) varchar(100) char(20) varchar(100) char(30) varchar(200) char(15) varchar(200) varchar(30) varchar(100) varchar(50)

Tabel 4.5 Tabel Wali Siswa Field id_wali * username_wali password_wali nama_wali namasiswa jk agama notlp email alamat

Jenis int(10) varchar(100) varchar(100) varchar(100) varchar(100) char(20) char(30) char(15) varchar(200) varchar(200)

Tabel 4.6 Tabel Nilai Siswa Field id_nilai * id_siswa ** id_guru ** id_kelas ** id_wali ** semester thnpelajaran kkm

Jenis int(10) int(10) int(10) int(10) int(10) char(5) char(20) int(10)

86

kognitif psikomotorik afektif nilaiharian nilaiharian2 nilaiharian3 nilaiharian4 nilaiharian5 nilaiharian6 ratanilaiharian nilaimid nilaiulum

int(10) int(10) char(5) int(10) int(10) int(10) int(10) int(10) int(10) int(10) int(10) int(10) Tabel 4.7 Tabel Absensi Siswa

Field id_absensi * id_siswa ** id_guru ** id_kelas ** id_wali ** semester thnpelajaran bulan jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi

Jenis int(10) int(10) int(10) int(10) int(10) char(5) char(20) varchar(20) int(10) int(10) int(10) int(10) int(10)

Tabel 4.8 Tabel Absensi Guru Field id_absensi * id_guru ** semester bulan thnpelajaran jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi

Jenis int(10) int(10) char(5) varchar(20) char(20) int(10) int(10) int(10) int(10) int(10)

87

Tabel 4.9 Tabel Absensi Pegawai Field id_absensi * id_pegawai ** semester bulan thnpelajaran jumlahhadir jumlahsakit jumlahijin jumlahalpa jumlahabsensi

Jenis int(10) int(10) char(5) varchar(20) char(20) int(10) int(10) int(10) int(10) int(10)

Tabel 4.10 Tabel Jadwal Pelajaran Field id_jadwal * id_kelas ** semester hari jam jamke namaguru thnajaran

Jenis int(10) int(10) char(5) varchar(20) varchar(30) char(20) varchar(50) char(20)

Tabel 4.11 Tabel Data Kelas Field Jenis id_kelas * int(10) kelas varchar(50) walikelas varchar(100) jumlahsiswa char(15) tahunajaran char(20)

Tabel 4.12 Tabel Tamu Field id_tamu * nama_tamu email

Jenis int(10) varchar(50) varchar(50)

88

Tabel 4.13 Tabel Kontak Field id_kontak * id_tamu ** tanggal waktu pesan

Jenis int(10) int(10) varchar(20) varchar(20) text

Tabel 4.14 Tabel Album Foto Field id_album * judul_album gambar_album

Jenis int(10) varchar(200) varchar(200)

Tabel 4.15 Tabel Galeri Foto Field id_galeri * id_album ** judul_galeri gambar_galeri keterangan

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


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


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


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


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


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


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


Semua Jadwal

Logout Guru

Jadwal Pelajaran

Gambar 4.62 STD Halaman Jadwal Pelajaran Guru

Menu

Klik Login Wali Siswa Masuk ke halaman wali siswa

Login Wali Siswa

Klik Wali Siswa Tampilkan halaman login wali siswa

Wali Siswa

Gambar 4.63 STD Halaman Login Wali Siswa

105

Menu

Klik Ubah Data Wali Ubah data wali siswa

Ubah Data Wali

Klik Ubah Password Wali Ubah password wali siswa

Ubah Password Wali

Klik Logout Keluar dari wali siswa

Logout Wali Siswa

Gambar 4.64 STD Halaman Data Wali Siswa

Menu

Klik Cari Siswa Tampilkan cari siswa

Cari Data Siswa

Klik Nilai Siswa Lihat nilai siswa

Klik Absensi Siswa Lihat absensi siswa

Data Nilai Siswa

Data Absensi Siswa


Logout Wali Siswa

Gambar 4.65 STD Halaman Data Siswa Pada Wali

Menu

Klik Cari Siswa Tampilkan nilai siswa

Klik Kembali ke Data Semua Siswa Lihat data semua 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


Data Kelas

Logout Wali Siswa

Gambar 4.67 STD Halaman Info Akademik Pada Wali

Menu


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

Ubah Password Guru

Ubah & Hapus Guru

Menu Utama

Gambar 4.77 STD Halaman Daftar Guru

Menu

Klik Tambah Wali Klik Ubah Password Tambah data wali Ubah password wali

Tambah Data Wali

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


Menu Utama

Gambar 4.81 STD Halaman Daftar Prestasi Sekolah

111

Menu

Klik Tombol Hapus Hapus data tamu

Hapus Tamu


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
Halo Tes

3. Penulisan xHTML MP dan PHP TES

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.3 DFD Level 0 yang Diusulkan Gambar 4.6 DFD Level 1 Proses 3.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

:


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


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


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


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

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


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


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


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


Menampilkan halaman daftar pegawai

Sesuai

Menampilkan halaman beranda admin Menampilkan halaman daftar alumni Menghapus data pada daftar alumni


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


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

Sistem Akademik Sekolah

Beranda | Profil | Siswa | Guru | WaliSiswa | Pegawai | Alumni | Galeri| Kontak

Selamat datang di Sistem Akademik SMA Muga Tangerang.

BERITA SEKOLAH

Cari Berita

echo "
Ubah Biodata";

echo "
Lihat Data Semua Siswa
";

}

else


{ echo"
Maaf, biodata siswa

Info Akademik |

Juni","Juli","Agustus","September","Oktober","November",

$hari=array("Minggu","Senin","Selasa","Rabu","Kamis","Ju

mat","Sabtu");

$namabulan=$bulan[$bln-1];

$namahari=$hari[$hr];


$sekarang="$namahari, $tgl $namabulan $thn";


$tanggal="$tgl $namabulan $thn";

{ header('location:siswa_mobile.php');

DATA ABSENSI SISWA

}

Nama Siswa :

//koneksi ke database

Pilih

if($_POST["tombol"]=="Pilih") { $id_kelas=strip_tags($_POST["id_kelas"]); $id_matpel=strip_tags($_POST["id_matpel"]); $semester=strip_tags($_POST["semester"]);

Pelajaran

$query=mysql_query("SELECT * FROM

absensi_siswa.id_matpel='$id_matpel' AND

data_kelas.id_kelas=absensi_siswa.id_kelas AND

Pilih Semester

mata_pelajaran.id_matpel=absensi_siswa.id_matpel AND siswa.id_siswa=absensi_siswa.id_siswa AND guru.id_guru=absensi_siswa.id_guru GROUP BY id_absensi

1

ASC limit $posisi,$batas"); $no=$posisi+0;

2

while($data=mysql_fetch_array($query)) { $no++; if(!$data)

{ echo"
Maaf, data absensi siswa kosong.

";

}