ANALISIS DAN PERANCANGAN E-LEARNING BERBASIS WEB … · 36 39 . xii 2.12.1 HTML (Hyper Text Markup...

v

UNIVERSITAS BINA NUSANTARA _________________________________________________________________

Jurusan Teknik Informatika Skripsi Sarjana Komputer

Semester Genap tahun 2007/2008

ANALISIS DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMA PLUS PEMBANGUNAN JAYA

Dhydha Maryudha / 0800748876

Mohammad Resha Pratama / 0800749286 Shinta Ayu Fitrianti / 0800752910

Kelas / Kelompok : 08 PBT / 6

Abstrak

Tujuan dari penulisan skripsi ini adalah untuk menganalisis sistem dan merancang aplikasi E-learning berbasis web pada SMA Plus Pembangunan Jaya agar dapat membantu dalam proses kegiatan belajar-mengajar (KBM). Dengan adanya aplikasi E-learning ini berbasis web pada SMA Plus Pembangunan Jaya, diharapkan dapat membantu masalah yang dihadapi oleh guru dan siswa di luar jam pelajaran, seperti kurangnya waktu komunikasi antar guru dan siswa, pencarian informasi mengenai materi yang diajarakan, dan tentunya memudahkan guru untuk memberikan materi pengajaran terhadap siswa. Metode yang digunakan dalam penulisan skripsi ini meliputi dua bagian utama, yaitu metode analisis dan metode perancangan.

Analisis sistem dilakukan dengan 4 tahapan yaitu (1) survei atas sistem yang sedang berjalan, (2) analisis terhadap temuan survei, (3) identifikasi kebutuhan informasi, dan (4) identifikasi persyaratan sistem. Metode yang digunakan dalam perancangan adalah metode perancangan berbasis object oriented melalui tahapan (1) pembuatan UML, (2) pembuatan rancangan basis data, dan (3) pembuatan rancangan layar. Hasil yang dicapai adalah ketersediaan aplikasi pendukung kegiatan belajara mengajar yang dapat diakses tanpa keterikatan waktu dan tempat. Kesimpulan dengan adanya E-learning berbasis web ini adalah memudahkan komunikasi guru dan siswa, pemberian materi pelajaran, kemudahan dalam pemberian tugas dan pengumpulan tugas, serta memudahkan dalam penginformasian nilai.

Kata Kunci : E-learning, web, aplikasi, metode perancangan, analisis sistem.

vi

PRAKATA

Kami mengucapkan puji syukur yang sebesarnya-besarnya kehadirat Allah SWT untuk

berkat dan rahmat yang dilimpahkan Nya. Karena akhirnya kami dapat menyelesaikan skripsi

yang menjadi satu persyaratan kelulusan di Universitas Bina Nusantara.

Selama dalam proses penulisan skripsi ini, kami menemui banyak halangan, maka dalam

kesempatan yang berharga ini kami ingin mengucapkan terima kasih kepada berbagai pihak yang

telah membimbing dan membantu secara langsung maupun tidak langsung sehingga kami dapat

meyelesaikan skripsi ini dengan baik. Mereka adalah :

1. Bapak Romli, Drs., M.App.Comp, selaku dosen pembimbing skripsi kami.

2. Bapak Drs. Tonazaro Gea.Mpd selaku Kepala Sekolah SMA Plus Pembangunan Jaya

ysng telah memberikan kesempatan kepada penulis untuk memperoleh data serta

informasi yang diperlukan dalam penulisan skripsi ini.

3. Bapak Drs. Gunawan, selaku Team Leader bidang kesiswaan SMA Plus Pembangunan

Jaya telah banyak membantu kami dalam mendapatkan data serta informasi yang

diperlukan selama proses penulisan skripsi ini.

4. Prof. Dr. Gerardus Polla, M.App.Sc, selaku Rektor Unversitas Bina Nusantara yang telah

memberikan kesempatan kepada penulis untuk menyelesaikan penulisan skripsi ini.

5. Ir. Sablin Yusuf, M.Sc,M.Comp.Sc, selaku Dekan Fakultas Ilmu Komputer Universitas

Bina Nusantara

vii

6. Freddy Purnomo, S.Kom., M.Kom, selaku Ketua Jurusan Tehnik Informatika Universitas

Bina Nusantara

7. Henny Surya Ningsih, S.Kom, MSoftSysEng, selaku Sekretaris Jurusan Tehnik

Informatika

8. Keluarga, sahabat, dan teman-teman yang telah membantu memberikan doa yang tulus,

perhatian, dukungan, dan segalanya kepada kami selama proses penulisan skripsi ini.

Kami sadar bahwa dalam penulisan skripsi ini terdapat kekurangan, baik isi maupun

bentuknya. Oleh karena itu kami memohon maaf sebesar-besarnya kepada Universitas Bina

Nusantara bila terdapat kesalahan dan kekurangan dalam penulisan skripsi ini. Skripsi ini murni

dari hasil survey yang dilakukan penulis pada SMA Plus Pembangunan Jaya.

Harapan kami begitu besar, semoga skripsi ini dapat bermanfaat bagi pihak-pihak yang

membacanya. Tidak lupa kami menunggu kritik dan saran yang dapat menyempurnakan

penulisan skripsi ini.

Jakarta, 9 Juni 2008

Penulis

viii

DAFTAR ISI

halaman

Halaman Judul Luar

Halaman Judul Dalam

Halaman Persetujuan Hard Cover

Halaman Persetujuan Dewan Penguji

Abstrak

Prakata

Daftar Isi

Daftar Tabel

Daftar Gambar

Daftar Lampiran

i

ii

iii

iv

v

vi

viii

xvii

xviii

xxxvii

BAB 1 PENDAHULUAN

1.1 Latar Belakang

1.2 Ruang Lingkup

1.3 Tujuan dan Manfaat Penelitian

1

1

2

3

ix

1.3.1 Tujuan

1.3.2 Manfaat

1.4 Metodologi

1.5 Sistematika Penulisan

3

3

3

4

BAB 2 LANDASAN TEORI

2.1 Pengertian Sistem

2.2 Konsep Analisis dan Perancangan Sistem

2.2.1 Pengertian Analisis Sistem

2.2.2 Pengertian Perancangan Sistem

2.3 Internet

2.3.1 Pengertian Internet

2.3.2 Sejarah Internet

2.3.3 Peranan Situs Web

2.3.4 WWW (World Wide Web)

2.3.5 Web Server

2.3.6 Web Browser

6

6

6

6

7

7

7

7

10

10

11

11

x

2.4 Electronic Learning (E-Learning)

2.4.1 Komponen-komponen E-Learning

2.4.2 Keuntungan Elearning

2.4.3 Kekurangan Elearning

2.5 Interaksi Manusia dan Komputer

2.5.1 Pengertian Interaksi Manusia dan Komputer

2.5.2 Delapan aturan emas perancangan antar muka

2.5.3 10 kesalahan utama pada website

2.6 Basis data (Database)

2.6.1 Normalisasi

2.6.1.1 UNF (Unnormal Form)

2.6.1.2 1NF (First Normal Form)

2.6.1.3 2NF (Second Normal Form)

2.6.1.4 3NF (Third Normal Form)

2.7 Spesifikasi Proses

2.8 STD (State Transition Diagram)

2.9 Unified Modelling Language (UML)

12

15

17

20

21

21

22

22

23

23

24

24

24

24

24

25

26

xi

2.9.1 Pengertian UML

2.9.2 Diagram Struktur

2.9.2.1 Diagram kelas

2.9.2.2 Diagram obyek

2.9.2.3 Diagram komponen

2.9.2.4 Diagram deployment

2.9.3 Diagram Perilaku

2.9.3.1 Diagram use-case

2.9.3.2 Diagram urutan / sequence

2.9.3.3 Diagram kolaborasi

2.9.3.4 Diagram statechart

2.9.3.5 Diagram aktivitas

2.10 Rekayasa Piranti Lunak (RPL)

2.10.1 Pengertian RPL

2.10.2 Langkah-langkah Pengembangan Piranti Lunak

2.11 Siklus Hidup Sistem (System Life Cycle)

2.12 Teori Khusus yang berhubungan

26

27

27

29

29

30

30

30

32

33

34

34

35

35

36

36

39

xii

2.12.1 HTML (Hyper Text Markup Language)

2.12.2 PHP

2.12.2.1 Sejarah PHP

2.12.2.2 Pengertian PHP

2.12.2.3Kelebihan PHP

2.12.3 MySQL

2.12.3.1 Entity Relationship Diagram

2.13 Metode pemecahan masalah

2.14 Metode Pengumpulan Data

39

39

40

41

42

42

43

46

48

BAB 3 ANALISIS DAN PERANCANGAN

3.1 Gambaran Umum Studi Kasus

3.1.1 Sejarah dan Perkembangan Studi Kasus

3.1.2 Struktur Organisasi

3.1.3 Rincian Tugas dan Tanggung Jawab SMA Pembangunan Jaya

3.1.3.1 Rincian Tugas dan Tanggung Jawab SMA Pembangunan Jaya

Secara Umum

50

50

50

55

56

57

xiii

3.1.3.2 Rincian Tugas dan Tanggung Jawab SMA Pembangunan Jaya

Secara Khusus

3.2 Analisis Permasalahan

3.2.1 Analisis Proses Bisnis Berjalan

3.2.2 Analisis kuesioner dan Wawancara

3.2.3 Identifikasi Permasalahan

3.3 Perancangan Solusi

3.3.1 Perancangan Proses Bisnis Diusulkan pada Solusi

3.3.2 Perancangan Struktur Menu

3.3.3 State Transition Diagram

3.3.3.1 State Transition Diagram Struktur Menu Admin

3.3.3.2 State Transition Diagram Struktur Menu User

3.3.3.3 State Transition Diagram Struktur Menu Guru

3.3.3.4 State Transition Diagram Struktur Menu Siswa

3.3.4 Perancangan Layar pada Solusi

3.3.4.1 Perancangan Layar untuk Admin

3.3.4.2 Perancangan Layar untuk Siswa

58

75

75

85

103

106

106

115

116

116

133

137

139

146

147

194

xiv

3.3.4.3 Perancangan Layar untuk Guru

3.3.4.4 Perancangan Layar untuk User Guru dan Murid

3.3.5 Perancangan UML pada Solusi

3.3.5.1 Perancangan Hubungan Diagram Class

3.3.5.2 Diagram Use Case

3.3.5.3 Sequence Diagram

3.3.5.4 Activity Diagram

3.3.5.5 State Diagram

3.3.6 Perancangan Basis Data pada Solusi

3.3.7 Perancangan Spesifikasi Proses

3.3.7.1 Administrator

3.3.7.2 Guru

3.3.7.3 Siswa

203

219

229

229

230

231

279

282

288

310

310

333

338

BAB 4 IMPLEMENTASI DAN EVALUASI

4.1 Perancangan Aplikasi

4.1.1 Kebutuhan Perangkat Keras

341

341

341

xv

4.1.2 Kebutuhan Perangkat Lunak

4.2 Cara penggunaan aplikasi

4.2.1 Penggunaan aplikasi untuk Administrator

4.2.2 Penggunaan aplikasi untuk Guru

4.2.3 Penggunaan aplikasi untuk Murid

4.3 Evaluasi

4.3.1 Evaluasi dari pengguna

4.3.2 Evaluasi Program

342

343

346

377

391

407

407

419

BAB 5 KESIMPULAN DAN SARAN

5.1 Kesimpulan

5.2 Saran

421

421

422

DAFTAR PUSTAKA

RIWAYAT HIDUP

LAMPIRAN-LAMPIRAN

SURAT SURVEI

423

425

L1

L25

xvi

DAFTAR TABEL

Tabel 2.1 Hubungan Antara Ketepatan Memilih Masalah dan Cara Pemecahannya 47

Tabel 3.1 Proses Bisnis dan Aktornya 76

Tabel 3.2 Proses Bisnis Untuk Mewujudkan Tujuan Solusi 106

Tabel 3.3 Tabel Fungsi Menu 140

Tabel 3.4 Definisi Tabel MSGuru 289

Tabel 3.5 Definisi Tabel PM 291

Tabel 3.6 Definisi Tabel MsKelas 292

Tabel 3.7 Definisi Tabel detilNilaiTugas 294

Tabel 3.8 Definisi Tabel DetilNilai 295

Tabel 3.9 Definisi Tabel MsNilai 296

Tabel 3.10 Definisi Tabel MsJadwal 297

Tabel 3.11 Definisi Tabel MsMateri 298

Tabel 3.12 Definisi Tabel MsPengumuman 299

Tabel 3.13 Definisi Tabel MsOrangTua 302

Tabel 3.14 Definisi Tabel MsSiswa 305

xvii

Tabel 3.15 Definisi Tabel MsPelajaran 306

Tabel 3.16 Definisi Tabel Forum 307

Tabel 3.17 Definisi Tabel Post 308

Tabel 3.18 Definisi Tabel Thread 309

Tabel 3.19 Definisi Tabel Topic 310

xviii

DAFTAR GAMBAR

Gambar 2.1 Kelas 28

Gambar 2.2 Inheritance Kelas 28

Gambar 2.3 Message 29

Gambar 2.4 Diagram Use Case 31

Gambar 2.5 Diagram Sequence 32

Gambar 2.6 Diagram Kolaborasi 33

Gambar 2.7 Diagram Statechart 34

Gambar 2.8 Diagram Aktivitas 35

Gambar 2.9 Delapan step dalam SDLC (Turban, Rainer, Potter, 2001,p477) 37

Gambar 2.10 Model Data Hubungan Entitas 46

Gambar 3.1 Struktur Organisasi SMA Plus Pembangunan Jaya 55

Gambar 3.2 DAD Pemberian Materi & Tugas 79

Gambar 3.3 DAD Pelaksanaan Ulangan 81

Gambar 3.4 DAD Pelaksanaan Ulangan Remedial 83

Gambar 3.5 Diagram hasil kuisioner pertanyaan No.1 untuk Siswa 88

xix













Gambar 3.18 Diagram hasil kuisioner pertanyaan No.1 untuk Guru 95




xx






Gambar 3.27 Struktur Menu Keseluruhan 115

Gambar 3.28 State Transition Diagram Halaman Admin-Menu Utama 116

Gambar 3.29 State Transition Diagram Halaman Admin-Siswa 117

Gambar 3.30 State Transition Diagram Halaman Admin-Tambah Data Siswa 117

Gambar 3.31 State Transition Diagram Halaman Admin-Lihat Detail Siswa 117

Gambar 3.32 State Transition Diagram Halaman Admin-Ubah Data Siswa 118

Gambar 3.42 State Transition Diagram Halaman Admin-Delete Siswa 118

Gambar 3.34 State Transition Diagram Halaman Admin-Adavanced Search Siswa 118

Gambar 3.35 State Transition Diagram Halaman Admin-Guru 119

Gambar 3.36 State Transition Diagram Halaman Admin-Tambah Data Guru 119

Gambar 3.37 State Transition Diagram Halaman Admin-Lihat Detail Guru 120

Gambar 3.38 State Transition Diagram Halaman Admin-Ubah Data Guru 120

xxi

Gambar 3.39 State Transition Diagram Halaman Admin-Delete Guru 120

Gambar 3.40 State Transition Diagram Halaman Admin-Advanced Search Guru 121

Gambar 3.41 State Transition Diagram Halaman Admin-Kelas 121

Gambar 3.42 State Transition Diagram Halaman Admin-Tambah Kelas 121

Gambar 3.43 State Transition Diagram Halaman Admin-Lihat Detail Kelas 122

Gambar 3.44 State Transition Diagram Halaman Admin-Ubah Data Kelas 122

Gambar 3.45 State Transition Diagram Halaman Admin-Delete Kelas 122

Gambar 3.46 State Transition Diagram Halaman Admin-Tambah Murid Dalam Kelas 123

Gambar 3.47 State Transition Diagram Halaman Admin-Pelajaran 123

Gambar 3.48 State Transition Diagram Halaman Admin-Lihat Materi 124

Gambar 3.49 State Transition Diagram Halaman Admin-Tambah Pelajaran 124

Gambar 3.50 State Transition Diagram Halaman Admin-Lihat Detail Pelajaran 124

Gambar 3.51 State Transition Diagram Halaman Admin-Ubah Data Pelajaran 125

Gambar 3.52 State Transition Diagram Halaman Admin-Delete Pelajaran 125

Gambar 3.53 State Transition Diagram Halaman Admin-Tambah Materi 125

Gambar 3.54 State Transition Diagram Halaman Admin-Ubah Data Materi 126

Gambar 3.55 State Transition Diagram Halaman Admin-Delete Materi 126

xxii

Gambar 3.56 State Transition Diagram Halaman Admin-Lihat Detail Materi 126

Gambar 3.57 State Transition Diagram Halaman Admin-Pengumuman 127

Gambar 3.58 State Transition Diagram Halaman Admin-Tambah Pengumuman 127

Gambar 3.59 State Transition Diagram Halaman Admin-Jadwal 127

Gambar 3.60 State Transition Diagram Halaman Admin-Tambah Jadwal 128

Gambar 3.61 State Transition Diagram Halaman Admin-Ubah Jadwal 128

Gambar 3.62 State Transition Diagram Halaman Admin-Lihat Detail Jadwal 128

Gambar 3.63 State Transition Diagram Halaman Admin-Forum 129

Gambar 3.64 State Transition Diagram Halaman Admin-Forum Buat Kategori Forum 129

Gambar 3.65 State Transition Diagram Halaman Admin-Forum Buat Ubah 129

Kategori Forum

Gambar 3.66 State Transition Diagram Halaman Admin-Forum Buat Thread Forum 130

Gambar 3.67 State Transition Diagram Halaman Admin-Forum Ubah Thread Forum 130

Gambar 3.68 State Transition Diagram Halaman Admin-Forum Thread 130

Gambar 3.69 State Transition Diagram Halaman Admin-Forum Posting Topik 131

Gambar 3.70 State Transition Diagram Halaman Admin-Forum Ubah Topik 131

Gambar 3.71 State Transition Diagram Halaman Admin-Forum Delete Topik 132

xxiii

Gambar 3.72 State Transition Diagram Halaman Admin-Forum Post 132

Gambar 3.73 State Transition Diagram Halaman User-Change Pin 133

Gambar 3.74 State Transition Diagram Halaman User-Forum 133

Gambar 3.75 State Transition Diagram Halaman User-Topik 133

Gambar 3.76 State Transition Diagram Halaman User-Forum Posting Topik 134

Gambar 3.77 State Transition Diagram Halaman User-Forum Ubah Topik 134

Gambar 3.78 State Transition Diagram Halaman User-Forum Post 134

Gambar 3.79 State Transition Diagram Halaman User-Private Message 135

Gambar 3.80 State Transition Diagram Halaman User-Private Message 135

Gambar 3.81 State Transition Diagram Halaman User-Private Message Baca Topik 136

Gambar 3.82 State Transition Diagram Halaman Guru-Menu Utama 137

Gambar 3.83 State Transition Diagram Halaman Guru-Kelas Nilai 138

Gambar 3.84 State Transition Diagram Halaman User-Forum 139

Gambar 3.85 Rancangan Layar Index 146

Gambar 3.86 Rancangan Layar Admin Home 147

Gambar 3.87 Rancangan Layar Admin Siswa 148

Gambar 3.88 Rancangan Layar Admin Advanced Search Siswa 150

xxiv

Gambar 3.89 Rancangan Layar Admin Tambah Data Siswa 152

Gambar 3.90 Rancangan Layar Admin Lihat Detail Siswa 154

Gambar 3.91 Rancangan Layar Admin Ubah Data Siswa 156

Gambar 3.92 Rancangan Layar Admin Delete Siswa 158

Gambar 3.93 Rancangan Layar Admin Guru 159

Gambar 3.94 Rancangan Layar Admin Tambah Data Guru 160

Gambar 3.95 Rancangan Layar Admin Lihat Detail 161

Gambar 3.96 Rancangan Layar Admin Ubah Data 162

Gambar 3.97 Rancangan Layar Admin Konfirmasi Hapus Data Guru 163

Gambar 3.98 Rancangan Layar Admin Kelas 164

Gambar 3.99 Rancangan Layar Admin Tambah Kelas 166

Gambar 3.100 Rancangan Layar Admin Lihat Detail Kelas 167

Gambar 3.101 Rancangan Layar Admin Ubah Data Kelas 168

Gambar 3.102 Rancangan Layar Admin Pengisian Kelas 169

Gambar 3.103 Rancangan Layar Admin Pelajaran 170

Gambar 3.104 Rancangan Layar Admin Lihat Materi 171

Gambar 3.105 Rancangan Layar Admin Tambah Pelajaran 17

xxv

Gambar 3.106 Rancangan Layar Admin Lihat Detail Pelajaran 173

Gambar 3.107 Rancangan Layar Admin Ubah Data Pelajaran 174

Gambar 3.108 Rancangan Layar Admin Konfirmasi Penghapusan Pelajaran 175

Gambar 3.109 Rancangan Layar Admin Konfirmasi Penghapusan Data Materi 176

Gambar 3.110 Rancangan Layar Admin tambah materi pelajaran 177

Gambar 3.111 Rancangan Layar Admin Lihat Detail Materi 178

Gambar 3.112 Rancangan Layar Admin ubah data materi pelajaran 179

Gambar 3.113 Rancangan Layar Admin Pengumuman 180

Gambar 3.114 Rancangan Layar Admin tambah pengumuman 181

Gambar 3.115 Rancangan Layar Admin lihat detail pengumuman 182

Gambar 3.116 Rancangan Layar Admin jadwal 183

Gambar 3.117 Rancangan Layar Admin buat jadwal 184

Gambar 3.118 Rancangan Layar Admin ubah Jadwal 186

Gambar 3.119 Rancangan Layar Admin lihat jadwal 187

Gambar 3.120 Rancangan Layar Admin Forum 188

Gambar 3.121 Rancangan Layar Admin Buat Kategori Forum 189

Gambar 3.122 Rancangan Layar Admin Ubah Kategori Forum 190

xxvi

Gambar 3.123 Rancangan Layar Admin Buat Thread Forum 191

Gambar 3.124 Rancangan Layar Admin Topic 192

Gambar 3.125 Rancangan Layar Admin Ubah Topic 193

Gambar 3.126 Rancangan Layar Home Siswa 194

Gambar 3.127 Rancangan Layar Pelajaran Siswa 195

Gambar 3.128 Rancangan Layar Siswa Kelas Matematika 196

Gambar 3.129 Rancangan Layar Siswa Kelas Matematika Bab 1 Materi 197

Gambar 3.130 Rancangan Layar Siswa Data Pribadi 199

Gambar 3.131 Rancangan Layar Siswa Nilai 201

Gambar 3.132 Rancangan Layar Siswa Jadwal Pelajaran 202

Gambar 3.133 Rancangan Layar Guru Utama 203

Gambar 3.134 Rancangan Layar Guru Kelas 204

Gambar 3.135 Rancangan Layar Guru Mata Pelajaran 205

Gambar 3.136 Rancangan Layar Guru Materi Bab 1 206

Gambar 3.137 Rancangan Layar Guru Pengumpulan Tugas 208

Gambar 3.138 Rancangan Layar Guru Data Pribadi 210

Gambar 3.139 Rancangan Layar Guru Nilai 212

xxvii

Gambar 3.140 Rancangan Layar Guru View Nilai Kelas 214

Gambar 3.141 Rancangan Layar Guru Nilai Tugas 215

Gambar 3.142 Rancangan Layar Guru Nilai Ulangan Harian 216

Gambar 3.143 Rancangan Layar Guru Nilai Ujian 217

Gambar 3.144 Rancangan Layar Guru Jadwal Pelajaran 218

Gambar 3.145 Rancangan Layar Ubah Sandi 219

Gambar 3.146 Rancangan Layar User Forum 220

Gambar 3.147 Rancangan Layar Topic User 221

Gambar 3.148 Rancangan Layar Buat Topic User 222

Gambar 3.149 Rancangan Layar Post User 223

Gambar 3.150 Rancangan Layar Kirim Posting Forum 224

Gambar 3.151 Rancangan Layar Edit Komentar 225

Gambar 3.152 Rancangan Layar User Private Message 226

Gambar 3.153 Rancangan Layar Kirim Private Message 227

Gambar 3.154 Rancangan Layar Baca Private Message 228

Gambar 3.155 Class Diagram 229

Gambar 3.156 Use Case User & Admin 230

xxviii

Gambar 3.157 Sequence User Guru Login 231

Gambar 3.158 Sequence Siswa Download Materi 232

Gambar 3.159 Sequence Siswa Download Soal Latihan 233

Gambar 3.160 Sequence Siswa Upload Tugas 234

Gambar 3.161 Sequence Siswa Update Profile 235

Gambar 3.162 Sequence Siswa View Jadwal 236

Gambar 3.163 Sequence Siswa User Logout 237

Gambar 3.164 Sequence Siswa User View Inbox 237

Gambar 3.165 Sequence Siswa User View PM 238

Gambar 3.166 Sequence Siswa User Delete PM 238

Gambar 3.167 Sequence Siswa Lihat Transkrip Nilai 239

Gambar 3.168 Sequence Guru Upload Materi Tambahan 240

Gambar 3.169 Sequence Guru Download Materi 241

Gambar 3.170 Sequence Guru Input Nilai 242

Gambar 3.171 Sequence Guru View Nilai 243

Gambar 3.172 Sequence Guru Ulangan Harian 244

Gambar 3.173 Sequence Guru Add Nilai Ujian 245

xxix

Gambar 3.174 Sequence Guru Change Password 246

Gambar 3.175 Sequence Admin Insert, View Detail Siswa 247

Gambar 3.176 Sequence Admin Ubah, Hapus Siswa 248

Gambar 3.177 Sequence Admin Posting Pengumuman 249

Gambar 3.178 Sequence Guru Update Profile 250

Gambar 3.179 Sequence Create PM 251

Gambar 3.180 Sequence Lihat Pengumuman 252

Gambar 3.181 Sequence Guru Cek dan download pelajaran 253

Gambar 3.182 Sequence Upload Soal Tugas 254

Gambar 3.183 Sequence View Jadwal Mengajar 255

Gambar 3.184 Sequence Admin Insert Kelas 256

Gambar 3.185 Sequence Admin Update Kelas 257

Gambar 3.186 Sequence Admin Delete Kelas 258

Gambar 3.187 Sequence Admin Add Murid Kelas 259

Gambar 3.188 Sequence Admin Delete Kelas 260

Gambar 3.189 Sequence Admin Update Jadwal Pelajaran 261

Gambar 3.190 Sequence Admin Insert Pelajaran 262

Gambar 3.191 Sequence Admin Update Pelajaran 263

Gambar 3.192 Sequence Admin Delete Pelajaran 264

Gambar 3.193 Sequence Admin Add Materi 265

xxx

Gambar 3.194 Sequence Admin Delete Pengumuman 265

Gambar 3.195 Sequence User Create Posting 266

Gambar 3.196 Sequence User Update Posting 267

Gambar 3.197 Sequence User Create Topic 268

Gambar 3.198 Sequence User Update Topic 269

Gambar 3.199 Sequence Admin Create Kategori Forum 270

Gambar 3.200 Sequence Admin Update Kategori Forum 270

Gambar 3.201 Sequence Admin Delete Kategori Forum 271

Gambar 3.202 Sequence Admin Create Topic 272

Gambar 3.203 Sequence Admin Update Topic 273

Gambar 3.204 Sequence Admin Delete Topic 274

Gambar 3.205 Sequence Admin Update Kategori Forum 274

Gambar 3.206 Sequence Admin Update Thread 275

Gambar 3.207 Sequence Admin Hapus Thread 275

Gambar 3.208 Sequence Admin Create Posting 276

Gambar 3.209 Sequence Admin Update Posting 277

Gambar 3.210 Sequence Admin HapusPosting 278

Gambar 3.211 Acitivity Diagram Siswa 279

Gambar 3.212 Acitivity Diagram User Guru 280

Gambar 3.213 Acitivity Diagram Admin 281

Gambar 3.214 Statechart Baca Forum Diskusi 282

xxxi

Gambar 3.215 Statechart Add Forum Diskusi Member 281

Gambar 3.216 Statechart Admin Delete Kelas 281

Gambar 3.217 Statechart Admin Delete Pengumuman 282

Gambar 3.218 Statechart Admin Delete User 282

Gambar 3.219 Statechart Admin Delete Forum 282

Gambar 3.220 Statechart Admin Posting Pengumuman 283

Gambar 3.221 Statechart Admin Update Kelas 283

Gambar 3.222 Statechart Admin Update User 283

Gambar 3.223 Statechart Admin Create Forum 284

Gambar 3.224 Statechart Delete Private Message 284

Gambar 3.225 Statechart Download Soal Latihan 285

Gambar 3.226 Statechart Guru Download Jawaban Tugas 285

Gambar 3.227 Statechart Lihat Pengumuman 285

Gambar 3.228 Statechart Posting Private Message 286

Gambar 3.229 Statechart Baca Private Message 286

Gambar 3.230 Statechart Siswa Upload Tugas 286

Gambar 3.221 Statechart Upload Materi 287

Gambar 3.232 ERD 288

Gambar 3.233 Tabel MsGuru 289

Gambar 3.234 Tabel PM 291

Gambar 3.235 Tabel MsKelas 292

xxxii

Gambar 3.236 Tabel detilNilaiTugas 293

Gambar 3.237 Tabel DetilNilai 294

Gambar 3.238 Tabel MsNilai 295

Gambar 3.239 Tabel MsJadwal 296

Gambar 3.240 Tabel MsMateri 297

Gambar 3.241 Tabel MsPengumuman 299

Gambar 3.242 Tabel MsOrangtua 300

Gambar 3.243 Tabel MsSiswa 303

Gambar 3.244 Tabel MsPelajaran 306

Gambar 3.245 Tabel Forum 307

Gambar 3.246 Tabel Post 307

Gambar 3.247 Tabel Thread 308

Gambar 3.248 Tabel Topic 309

Gambar 4.1 Halaman Login 346

Gambar 4.2 Halaman Home Admin 346

Gambar 4.3 Halaman Edit Password 347

Gambar 4.4 Halaman Layar Admin Siswa 348

Gambar 4.5 Halaman layar Admin Tambah Data Siswa 350

Gambar 4.6 Halaman Layar Admin Pencarian Detail Siswa 352

Gambar 4.7 Halaman untuk konfirmasi Penghapusan Data Siswa 354

Gambar 4.8 Halaman View Guru pada Layar Admin 355

xxxiii

Gambar 4.9 Halaman Layar Admin tambah Data Guru 357

Gambar 4.10 Halaman Layar Admin Pencarian Detail Guru 358

Gambar 4.11 Halaman Tambah Kelas 359

Gambar 4.12 Halaman Layar Admin Lihat Detail Kelas 360

Gambar 4.13 Halaman Layar Delete Kelas 361

Gambar 4.14 Halaman Tambah Murid Ke Kelas 362

Gambar 4.15 Halaman View Jadwal Pelajaran 363

Gambar 4.16 Halaman Layar Admin Untuk Membuat Jadwal Pelajaran 364

Gambar 4.17 Halaman View Daftar Pelajaran 365

Gambar 4.18 Halaman Tambah Daftar Pelajaran 366

Gambar 4.19 Halaman Delete Daftar Pelajaran 367

Gambar 4.20 Halaman Layar Admin Untuk Detail Daftar Pelajaran 368

Gambar 4.21 Halaman Layar Admin Untuk Pengumuman 369

Gambar 4.22 Halaman Layar Admin Untuk Menambah Pengumuman 370

Gambar 4.23 Halaman Forum Admin 371

Gambar 4.24 Halaman Tambah Kategori Forum 372

Gambar 4.25 Halaman Tambah Thread Forum 373

Gambar 4.26 Halaman Pesan Pribadi 374

Gambar 4.27 Halaman Forum Admin Lihat topic 375

Gambar 4.28 Halaman Admin Forum Post 376

Gambar 4.29 Halaman Home Guru 377

xxxiv

Gambar 4.30 Halaman View Pelajaran Guru 378

Gambar 4.31 Halaman Detail Bab 379

Gambar 4.32 Halaman View Materi Pelajaran 380

Gambar 4.33 Halaman Upload Materi dan Soal 381

Gambar 4.34 Halaman View Pengumpulan Tugas 382

Gambar 4.35 Halaman Data Pribadi Guru 383

Gambar 4.36 Halaman Nilai 384

Gambar 4.37 Halaman Input Nilai Tugas 386

Gambar 4.38 Halaman Input Nilai Ulangan 387

Gambar 4.39 Halaman Input Nilai Ujian 388

Gambar 4.40 Halaman View Nilai Siswa 389

Gambar 4.41 Halaman Jadwal Mengajar 390

Gambar 4.42 Halaman Home Siswa 391

Gambar 4.43 Halaman Pelajaran Siswa 392

Gambar 4.44 Halaman View Detail Pelajaran 393

Gambar 4.45 Halaman View Detail Bab Pelajaran 394

Gambar 4.46 Halaman Download Materi 395

Gambar 4.47 Halaman Upload File 396

Gambar 4.48 Halaman Detail Pribadi 397

Gambar 4.49 Halaman View Nilai Pelajaran 399

Gambar 4.50 Halaman View Jadwal Pelajaran 400

xxxv

Gambar 4.51 Halaman Forum Siswa 401

Gambar 4.52 Halaman View Topik Forum 402

Gambar 4.53 Halaman Masuk Ke Topik 403

Gambar 4.54 Halaman Pesan Pribadi 404

Gambar 4.55 Halaman View Pesan 405

Gambar 4.56 Halaman Balas Pesan Pribadi 406

Gambar 4.57 Diagram Hasil Evaluasi Kuisioner Siswa Pertanyaan no. 1 407










Gambar 4.67 Diagram Hasil Evaluasi Kuisioner Guru Pertanyaan no. 1 412





xxxvi





xxxvii

DAFTAR LAMPIRAN

Lampiran kuisioner analisis dan perancangan aplikasi e-learning berbasiskan web pada

SMA Plus Pembangunan Jaya (Di isi oleh pihak siswa)

L1

Lampiran kuisioner analisis dan perancangan aplikasi e-learning berbasiskan web pada

SMA Plus Pembangunan Jaya (Di isi oleh pihak sekolah)

L3

Lampiran daftar pertanyaan wawancara dengan pihak sekolah. L10

Lampiran evaluasi aplikasi e-learning SMA Plus Pembangunan Jaya (Di isi oleh pihak

siswa)

L11

Lampiran evaluasi aplikasi e-learning SMA Plus Pembangunan Jaya (Di isi oleh pihak

guru)

L15

Lampiran daftar pertanyaan wawancara evaluasi aplikasi e-learning SMA Plus

Pembangunan Jaya dengan pihak sekolah.

L18

Lampiran panduan instalasi aplikasi L19

Lampiran surat survei L25

ANALISIS DAN PERANCANGAN E-LEARNING BERBASIS WEB … · 36 39 . xii 2.12.1 HTML (Hyper Text Markup...

Documents

Transcript of ANALISIS DAN PERANCANGAN E-LEARNING BERBASIS WEB … · 36 39 . xii 2.12.1 HTML (Hyper Text Markup...