rancang bangun aplikasi e-learning pramuka berbasis …

1

RANCANG BANGUN APLIKASI E-LEARNING PRAMUKA

BERBASIS WEB PADA SMPN 1 KESAMBEN JOMBANG TUGAS AKHIR Program Studi S1 Sistem Informasi

Oleh: AHMAD SETYAWAN 14410100103

FAKULTAS TEKNOLOGI DAN INFORMATIKA

INSTITUT BISNIS DAN INFORMATIKA STIKOM SURABAYA

2019

ii

ii

RANCANG BANGUN APLIKASI E-LEARNING PRAMUKA BERBASIS

WEB PADA SMPN 1 KESAMBEN JOMBANG

TUGAS AKHIR

Diajukan sebagai salah satu syarat untuk menyelesaikan Program Sarjana

Oleh :

Nama : Ahmad Setyawan

NIM : 14410100103

Program : S1 (Strata Satu)

Jurusan : Sistem Informasi



2019

iii

iii

TUGAS AKHIR

RANCANG BANGUN APLIKASI E-LEARNING PRAMUKA BERBASIS WEB

PADA SMPN 1 KESAMBEN JOMBANG

Dipersiapkan dan disusun oleh

Ahmad Setyawan

NIM : 14410100103

Telah diperiksa, diuji dan disetujui oleh Dewan Penguji

Pada : Juli 2019

Susunan Dewan Penguji

Pembimbing

I. Dr. Januar Wibowo, S.T., M.M. NIDN 0715016801

II. Agus Dwi Churniawan, S.Si., M.Kom.

NIDN 723088002

Pembahas

I. Erwin Sutomo, S.Kom., M.Eng.

NIDN 0722057501

Tugas Akhir ini telah diterima sebagai salah satu persyaratan untuk memperoleh gelar sarjana

Dr. Jusak

Dekan Fakultas Teknologi dan Informasi



SURAT PERNYATAAN PERSETUJUAN PUBLIKASI DAN KEASLIAN KARYA ILMIAH

Sebagai mahasiswa Institut Bisnis dan Informatika Stikom Surabaya, saya :

Nama : Ahmad Setyawan

NIM : 14410100103

Program Studi : S1 Sistem Informasi

Fakultas : Fakultas Teknologi dan Informatika

Jenis Karya : Laporan Tugas Akhir

Judul Karya : RANCANG BANGUN APLIKASI E-LEARNING PRAMUKA BERBASIS WEB PADA SMPN 1 KESAMBEN JOMBANG

Menyatakan dengan sesungguhnya bahwa:

1. Demi pengembangan Ilmu Pengetahuan, Teknologi dan Seni, saya menyetujui

memberikan kepada Institut Bisnis dan Informatika Stikom Surabaya Hak Bebas

Royalti Non-Eksklusif (Non-Exclusive Royalti Free Right) atas seluruh isi/ sebagian

karya ilmiah saya tersebut diatas untuk disimpan, dialihmediakan dan dikelola dalam

bentuk pangkalan data (database) untuk selanjutnya didistribusikan atau

dipublikasikan demi kepentingan akademis dengan tetap mencantumkan nama saya

sebagai penulis atau pencipta dan sebagai pemilik Hak Cipta

2. Karya tersebut diatas adalah karya asli saya, bukan plagiat baik sebagian maupun

keseluruhan. Kutipan, karya atau pendapat orang lain yang ada dalam karya ilmiah

ini adalah semata hanya rujukan yang dicantumkan dalam Daftar Pustaka saya

3. Apabila dikemudian hari ditemukan dan terbukti terdapat tindakan plagiat pada

karya ilmiah ini, maka saya bersedia untuk menerima pencabutan terhadap gelar

kesarjanaan yang telah diberikan kepada saya.

Demikian surat pernyataan ini saya buat dengan sebenarnya.

Surabaya, 26 Juli 2019

Yang menyatakan,

Ahmad Setyawan

NIM: 14410100103

ii

ii

“Ketika kamu mencoba sesuatu hal yang baru, kamu akan menghadapi banyak sekali kesulitan dan rintangan yang membuatmu menderita, namun seperti itulah sebuah

inovasi baru dimulai, jadi buatlah keajaiban itu terjadi”

(Hyuga Tohru)

iii

iii

“Menuju Tak Terbatas, Dan Melampauinya”

vi

vi

ABSTRAK

SMPN 1 Kesamben Jombang merupakan lembaga pendidikan formal yang

memiliki kegiatan ekstrakurikuler salah satunya adalah Pramuka, memiliki anggota

sebanyak 672 siswa dengan 20 pengajar. Kegiatan yang dilakukan pramuka ini adalah

mengajarkan ilmu kepramukaan kepada siswa di dalam kelas yang dibagi menjadi 32

siswa perkelas, hal ini membuat sistem pembelajaran mereka sangat terbatas, mulai

dari pandangan siswa yang duduk dibangku belakang terhalang atau kurang jelas,

sistem mengajar yang masih menggunakan penulisan materi di papan tulis yang

membuat siswa bosan, serta membuat distribusi materi pramuka kepada siswa kurang

maksimal, dan komunikasi antara pembina, pengajar, dan siswa hanya dapat dilakukan

saat jam kepramukaan berlangsung, ketika siswa pulang maka materi yang didapatkan

akan terasa kurang penjelasan. Siswa juga tidak mendapatkan latihan teori untuk

melatih penguasaan teori pramuka dan hanya mendapatkan pelatihan praktik.

Untuk menyelesaikan permasalahan yang ada di atas, maka dibuatkan suatu

aplikasi E-Learning Berbasis Web Pada SMPN 1 Kesamben Jombang dengan metode

Sharable Content Object Reference Model (SCORM) sebagai standarisasi

pembangunan aplikasi e-learning untuk membantu proses belajar ilmu kepramukaan

didalam sekolah maupun diluar sekolah.

Hasil uji coba menunjukkan bahwa aplikasi ini sudah berjalan dengan baik,

serta dapat menghubungkan komunikasi terhadap pembina, pengajar, dan siswa,

membuat materi sebagai bahan pembelajaran yang dapat di bagikan secara langsung

kepada siswa, menghasilkan latihan kuis, dengan menggunakan model SCORM

sebagai standarisasi e-learning yang dipakai.

Kata kunci : Aplikasi, Pramuka, E-Learning, Sharable Content Object Reference

Model

vii

vii

KATA PENGANTAR

Puji dan syukur kehadirat Allah Subhanahu wata’ala atas segala nikmat yang

diberikan sehingga dapat melaksanakan Tugas Akhir yang berjudul “Rancang Bangun

Aplikasi E-Learning Pramuka Berbasis Web Pada SMPN 1 Kesamben Jombang”.

Tugas akhir ini merupakan syarat untuk menyelesaikan program studi Strata Satu di

Fakultas Teknologi dan Informatika pada Institut Bisnis dan Informatika Stikom

Surabaya.

Selama menyelesaian Tugas Akhir ini, penulis tidak terlepas dari bantuan

berbagai pihak yang telah memberikan banyak masukan, saran, kritik dan dukungan

moril maupun materil. Oleh karena itu, menyampaikan rasa terima kasih kepada:

1. Kedua orang tua saya yang selalu mendoakan, mendukung, dan memberikan

semangat di setiap langkah dan aktifitas.

2. Bapak Dr. Januar Wibowo, S.T., M.M. selaku Dosen Pembimbing I yang telah

membimbing, memotivasi, dan memberi arahan kepada penulis dalam

menyelesaikan Tugas Akhir.

3. Bapak Agus Dwi Churniawan, S.Si., M.Kom. selaku Dosen Pembimbing II yang

telah membimbing, memotivasi, dan memberi arahan kepada penulis dalam

menyelesaikan Tugas Akhir.

4. Bapak Erwin Sutomo, S.Kom., M.Eng. selaku Pembahas.

5. Teman – teman Colo_Player yang telah memberikan dukungan, semangat, dan

bantuan lainnya walaupun tidak penting.

viii

viii

6. Semua Guru dan Karyawan sekolah SMPN 1 Kesamben Jombang yang telah

memberikan fasilitas sekolah berupa printer dan internet yang kencang demi

tercapainya Tugas Akhir saya sampai selesai.

7. Pihak-pihak lain yang tidak dapat disebutkan satu - persatu yang telah memberikan

bantuan dan dukungan.

Semoga Allah SWT memberikan balasan yang sesuai kepada semua pihak

yang telah memberikan bantuan, bimbingan, dan nasihat dalam proses Tugas Akhir ini.

Penulis menyadari bahwa Tugas Akhir ini masih jauh dari kesempurnaan, sehingga

kritik dan saran yang bersifat membangun dari semua pihak sangatlah diharapkan agar

dapat diperbaiki menjadi lebih baik lagi di kemudian hari. Semoga dalam Tugas Akhir

ini dapat bermanfaat bagi semua pihak.

Surabaya, 26 Juli 2019

Penulis

ix

ix

DAFTAR ISI

Halaman ABSTRAK .................................................................................................................. vi

KATA PENGANTAR ................................................................................................ vii

DAFTAR ISI ............................................................................................................... ix

DAFTAR GAMBAR .................................................................................................. xix

DAFTAR TABEL ..................................................................................................... xix

DAFTAR LAMPIRAN .............................................................................................. xx

BAB I PENDAHULUAN ......................................................................................... 1

1.1 Latar Belakang ..................................................................................... 1

1.2 Rumusan Masalah ................................................................................ 5

1.3 Batasan Masalah ................................................................................... 5

1.4 Tujuan ................................................................................................... 6

1.5 Manfaat................................................................................................. 6

BAB II LANDASAN TEORI..................................................................................... 7

2.1 Pembelajaran ........................................................................................ 7

2.2 E-Learning ........................................................................................... 8

2.3 Sharable Content Object Reference Model (SCORM) ...................... 10

2.4 Pramuka .............................................................................................. 13

2.4.1 Lagu-lagu dan Yel-yel Pramuka ................................................ 14

2.4.2 Tanda / Atribut Pramuka............................................................ 14

x

x

2.4.3 Tali – temali ............................................................................... 16

2.4.4 Sandi – sandi ............................................................................. 17

2.5 Website ................................................................................................ 19

2.6 PHP : Hypertext Preprocessor............................................................ 20

2.7 MySQL ............................................................................................... 20

2.8 Flowchart ........................................................................................... 21

2.9 Data Flow Diagram (DFD)................................................................ 22

2.10 System Development Life Cycle (SDLC) .......................................... 27

BAB III ANALISIS DAN PERANCANGAN SISTEM ........................................... 29

3.1 Metodologi Penelitian ........................................................................ 29

3.2 Tahap Communication ....................................................................... 29

3.2.1 Identifikasi Masalah .................................................................. 30

3.2.2 Identifikasi Pengguna ................................................................ 32

3.3 Tahap Planning .................................................................................. 32

3.4 Tahap Modelling ................................................................................. 33

3.4.1 Analisis Kebutuhan Bisnis ........................................................ 34

3.4.2 Analisis Kebutuhan Fungsional ................................................. 34

3.4.3 Analisis Kebutuhan Non-Fungsional ........................................ 39

3.4.4 Analisis Kebutuhan Sistem ....................................................... 39

3.4.6 Alur Sistem (System Flow) ........................................................ 45

3.4.7 Diagram Jenjang ........................................................................ 59

xi

xi

3.4.8 Konteks Diagram ....................................................................... 60

3.4.9 Diagram Alur Data Aplikasi ...................................................... 60

3.4.10 Rancangan Basis Data ............................................................. 64

3.4.11 Struktur Basis Data .................................................................. 65

3.4.12 Desain Antar Muka.................................................................. 71

3.5 Tahap Construction .......................................................................... 108

BAB IV HASIL DAN PEMBAHASAN ................................................................. 109

4.1 Implementasi Sistem ........................................................................ 109

4.1.1 Halaman Utama ....................................................................... 109

4.1.2 Pembina .................................................................................... 110

4.1.3 Pengajar ................................................................................... 128

4.1.4 Siswa ....................................................................................... 138

4.2 Evaluasi Sistem ................................................................................ 153

4.2.1 Uji Login ................................................................................. 152

4.2.2 Uji Sistem Sebagai Pembina ................................................... 154

4.3.3 Uji Sistem Sebagai Pengajar ................................................... 165

4.3.4 Uji Sistem Sebagai Siswa ....................................................... 171

4.3 Analisis Hasil Uji Coba .................................................................... 174

4.4 Hubungan Aplikasi E-Learning Pramuka Dengan SCORM ............ 174

BAB V PENUTUP ................................................................................................. 180

5.1 Kesimpulan....................................................................................... 180

xii

xii

5.2 Saran ................................................................................................. 180

DAFTAR PUSTAKA ............................................................................................... 182

BIODATA PENULIS ............................................................................................... 183

LAMPIRAN ............................................................................................................. 184

xi

xi

DAFTAR GAMBAR

Halaman Gambar 1.1 Golongan Pramuka ................................................................................... 1

Gambar 1.2 Sistem Pembelajaran Ekstrakurikuler Pramuka ....................................... 2

Gambar 2.1 Layanan Learning Management System ................................................. 11

Gambar 2.2 Tanda Umum Pramuka ........................................................................... 14

Gambar 2.3 Tanda Lencana Wilayah ......................................................................... 15

Gambar 2.4 Tanda Jabatan ......................................................................................... 15

Gambar 2.5 Tanda Kecakapan ................................................................................... 16

Gambar 2.6 Tanda Penghargaan ................................................................................ 16

Gambar 2.7 Kumpulan Sampul ................................................................................. 17

Gambar 2.8 Sandi Morse ........................................................................................... 17

Gambar 2.9 Sandi A=N .............................................................................................. 18

Gambar 2.10 Sandi A=Z ............................................................................................ 18

Gambar 2.11 Sandi Kotak .......................................................................................... 18

Gambar 2.12 Semaphore ............................................................................................ 19

Gambar 2.13 Pengembangan menggunakan Model Waterfall (Pressman, 2015)...... 27

Gambar 3.1 Tahap Penelitihan ................................................................................... 29

Gambar 3.2 Proses Pembelajaran Ekstrakurikuler Pramuka Saat Ini ........................ 34

Gambar 3.3 Diagram IPO .......................................................................................... 41

Gambar 3.4 System Flow Login User ........................................................................ 46

Gambar 3.5 Sistem Flow Mengelola Profil ................................................................ 47

Gambar 3.6 System Flow Mengelola Data Pengajar .................................................. 48

xii

xii

Gambar 3.7 System Flow Mengelola Data Siswa ...................................................... 50

Gambar 3.8 System Flow Kategori Materi ................................................................. 50

Gambar 3.9 System Flow Mengelola Data Materi ..................................................... 51

Gambar 3.10 System Flow Mengelola Latihan Kuis ................................................. 52

Gambar 3.11 System Flow Hasil Kuis Pembina ........................................................ 53

Gambar 3.12 System Flow Hasil Kuis Pengajar ........................................................ 54

Gambar 3.13 System Flow Hasil Kuis Siswa ............................................................. 54

Gambar 3.14 System Flow Forum Diskusi Pengajar dan Siswa ................................ 55

Gambar 3.15 System Flow Forum Diskusi Pembina ................................................. 56

Gambar 3.16 System Flow Latihan Kuis Siswa ......................................................... 57

Gambar 3.17 System Flow Data Materi Siswa........................................................... 58

Gambar 3.18 System Flow Pengumuman .................................................................. 59

Gambar 3.19 Diagram Jenjang Aplikasi E-Learning Pramuka ................................. 59

Gambar 3.20 Context Diagram Aplikasi E-Learning ................................................ 60

Gambar 3.21 DFD Level 0 Aplikasi E-Learning Pramuka........................................ 61

Gambar 3.22 DFD Level 1 Mengelola Profil ............................................................ 62

Gambar 3.23 DFD Level 1 Mengelola Materi ........................................................... 63

Gambar 3.24 DFD Level 1 Latihan Kuis ................................................................... 63

Gambar 3.25 DFD Level 1 Forum Diskusi ................................................................ 63

Gambar 3.26 CDM Aplikasi E-Learning Pramuka ................................................... 64

Gambar 3.27 PDM Aplikasi E-Learning Pramuka .................................................... 65

Gambar 3.28 Halaman Utama Website ...................................................................... 71

Gambar 3.29 Halaman Login Website........................................................................ 72

Gambar 3.30 Dashboard Pembina ............................................................................. 72

xiii

xiii

Gambar 3.31 Halaman Profil Pembina ...................................................................... 73

Gambar 3.32 Halaman Edit Profil Pembina .............................................................. 74

Gambar 3.33 Halaman Data Pengajar ........................................................................ 74

Gambar 3.34 Halaman Tambah Data Pengajar .......................................................... 75

Gambar 3.35 Halaman Edit Data Pengajar ................................................................ 76

Gambar 3.36 Halaman Data Siswa ............................................................................ 76

Gambar 3.37 Halaman Tambah Data Siswa .............................................................. 77

Gambar 3.38 Halaman Edit Data Siswa .................................................................... 77

Gambar 3.39 Halaman Data Kategori Materi ............................................................ 78

Gambar 3.40 Halaman Tambah Kategori Materi ....................................................... 78

Gambar 3.41 Halaman Edit Kategori Materi ............................................................. 79

Gambar 3.42 Halaman Data Materi Pembina ............................................................ 79

Gambar 3. 43 Halaman Tambah Materi Pembina ...................................................... 80

Gambar 3.44 Halaman Edit Materi Pembina ............................................................. 81

Gambar 3.45 Halaman Lihat Materi Pembina ........................................................... 81

Gambar 3.46 Halaman Data Kuis Pembina ............................................................... 82

Gambar 3.47 Halaman Edit Ketentuan Kuis ............................................................. 83

Gambar 3.48 Halaman Kelola Soal Kuis ................................................................... 83

Gambar 3.49 Halaman Edit Soal Kuis ....................................................................... 84

Gambar 3.50 Halaman Lihat Hasil Pembina ............................................................. 84

Gambar 3.51 Halaman Histori Nilai Siswa Pembina ................................................ 85

Gambar 3. 52 Halaman Detail Hasil Siswa Pembina ................................................ 86

Gambar 3.53 Halaman Data Forum Pembina ............................................................ 86

Gambar 3.54 Halaman Postingan Selengkapnya Pembina........................................ 87

xiv

xiv

Gambar 3.55 Halaman Tulis Postingan Pembina ...................................................... 87

Gambar 3.56 Halaman Dashboard Pengajar ............................................................. 88

Gambar 3.57 Halaman Profil Pengajar ...................................................................... 89

Gambar 3.58 Halaman Edit Profil Pengajar .............................................................. 90

Gambar 3.59 Halaman Semua Materi Pengajar ......................................................... 91

Gambar 3.60 Halaman Data Materi Pengajar ............................................................ 91

Gambar 3.61 Halaman Tambah Data Materi Pengajar .............................................. 92

Gambar 3.62 Halaman Edit Data Materi Pengajar .................................................... 93

Gambar 3.63 Halaman Lihat Materi Pengajar ........................................................... 93

Gambar 3.64 Halaman Data Kuis Pengajar ............................................................... 94

Gambar 3.65 Halaman Hasil Kuis Pengajar .............................................................. 94

Gambar 3.66 Halaman Hasil Detail Siswa Pengajar ................................................. 95

Gambar 3.67 Halaman Forum Diskusi Pengajar ....................................................... 95

Gambar 3.68 Halaman Postingan Saya Pengajar ....................................................... 96

Gambar 3.69 Halaman Tulis Postingan Pengajar ...................................................... 96

Gambar 3.70 Halaman Postingan Selengkapnya Pengajar........................................ 97

Gambar 3.71 Halaman Dashboard Siswa .................................................................. 98

Gambar 3.72 Halaman Profil Siswa .......................................................................... 98

Gambar 3.73 Halaman Edit Profil Siswa ................................................................... 99

Gambar 3.74 Halaman Data Materi Siswa .............................................................. 100

Gambar 3.75 Halaman Data Materi Kategori Siswa ............................................... 100

Gambar 3.76 Halaman Lihat Materi Siswa ............................................................. 101

Gambar 3.77 Halaman Kuis Ditutup ....................................................................... 101

Gambar 3.78 Halaman Kuis Dibuka ........................................................................ 102

xv

xv

Gambar 3.79 Jendela Pemberitahuan Pengerjaan Kuis ........................................... 102

Gambar 3.80 Halaman Kuis Selesai ........................................................................ 103

Gambar 3.81 Halaman Pengerjaan Soal Kuis .......................................................... 103

Gambar 3.82 Halaman Hasil Kuis Siswa ................................................................. 104

Gambar 3.83 Halaman Petunjuk .............................................................................. 105

Gambar 3.84 Halaman Lihat Nilai Saya .................................................................. 105

Gambar 3.85 Halaman Detail Nilai Siswa ............................................................... 106

Gambar 3.86 Halaman Semua Forum Siswa ........................................................... 106

Gambar 3.87 Halaman Postingan Saya Siswa ......................................................... 107

Gambar 3.88 Halaman Tulis Postingan Siswa ......................................................... 107

Gambar 3.89 Halaman Postingan Selengkapnya Siswa .......................................... 108

Gambar 3.90 Halaman Pengumuman ...................................................................... 108

Gambar 4.1 Halaman Utama Website ...................................................................... 109

Gambar 4.2 Halaman Login ...................................................................................... 110

Gambar 4.3 Halaman Dashboard Pembina .............................................................. 111

Gambar 4.4 Halaman Profil Pembina ....................................................................... 112

Gambar 4.5 Halaman Edit Profil Pembina ............................................................... 112

Gambar 4.6 Halaman Data Pengajar ......................................................................... 113

Gambar 4.7 Halaman Tambah Data Pengajar ........................................................... 114

Gambar 4.8 Halaman Edit Data Pengajar ................................................................. 114

Gambar 4.9 Halaman Data Siswa ............................................................................. 115

Gambar 4.10 Halaman Tambah Data Siswa ............................................................. 116

Gambar 4.11 Halaman Edit Data Siswa.................................................................... 117

Gambar 4.12 Halaman Kategori Materi ................................................................... 117

xvi

xvi

Gambar 4.13 Halaman Tambah Kategori Materi ...................................................... 118

Gambar 4.14 Halaman Edit Kategori Materi ............................................................ 118

Gambar 4.15 Halaman Data Materi Pembina ........................................................... 119

Gambar 4.16 Halaman Tambah Data Materi Pembina ............................................. 119

Gambar 4.17 Halaman Edit Data Materi Pembina .................................................. 120

Gambar 4.18 Halaman Lihat Materi Pembina ......................................................... 121

Gambar 4.19 Halaman Data Kuis Pembina ............................................................. 121

Gambar 4.20 Halaman Edit Ketentuan Kuis ........................................................... 122

Gambar 4.21 Halaman Kelola Soal Kuis ................................................................. 123

Gambar 4.22 Halaman Edit Soal Kuis ..................................................................... 123

Gambar 4.23 Halaman Lihat Hasil Kuis Pembina ................................................... 124

Gambar 4.24 Halaman Histori Hasil Siswa ............................................................. 125

Gambar 4.25 Halaman Detail Hasil Pembina .......................................................... 125

Gambar 4.26 Halaman Data Forum Pembina .......................................................... 126

Gambar 4.27 Halaman Postingan Selengkapnya Pembina...................................... 127

Gambar 4.28 Halaman Tulis Postingan Pembina .................................................... 128

Gambar 4.29 Halaman Dashboard Pengajar ........................................................... 128

Gambar 4.30 Halaman Profil Pengajar .................................................................... 129

Gambar 4.31 Halaman Edit Profil Pengajar ............................................................ 129

Gambar 4.32 Halaman Semua Materi Pengajar ....................................................... 130

Gambar 4.33 Halaman Data Materi Pengajar .......................................................... 131

Gambar 4.34 Halaman Tambah Materi Pengajar ..................................................... 131

Gambar 4.35 Halaman Edit Materi Pengajar ........................................................... 132

Gambar 4.36 Halaman Lihat Materi Pengajar ......................................................... 133

xvii

xvii

Gambar 4.37 Halaman Data Kuis Pengajar ............................................................. 133

Gambar 4.38 Halaman Histori Hasil Pengajar ......................................................... 134

Gambar 4.39 Halaman Detail Hasil Siswa Pengajar ............................................... 135

Gambar 4.40 Halaman Forum Diskusi Pengajar ..................................................... 135

Gambar 4.41 Halaman Postingan Saya Pengajar .................................................... 136

Gambar 4.42 Halaman Tulis Postingan Pengajar .................................................... 137

Gambar 4.43 Halaman Postingan Selengkapnya Pengajar...................................... 137

Gambar 4.44 Halaman Dashboard Siswa ................................................................ 138

Gambar 4.45 Halaman Profil Siswa ........................................................................ 139

Gambar 4.46 Halaman Edit Profil Siswa ................................................................. 140

Gambar 4.47 Halaman Data Materi Siswa .............................................................. 140

Gambar 4.48 Halaman Data Materi Kategori Siswa ............................................... 141

Gambar 4.49 Halaman Lihat Materi Siswa ............................................................. 142

Gambar 4.50 Halaman Kuis Ditutup ....................................................................... 143

Gambar 4.51 Halaman Kuis Dibuka ........................................................................ 144

Gambar 4.52 Jendela Pemberitahuan Pengerjaan Kuis ........................................... 144

Gambar 4.53 Halaman Kuis Selesai ........................................................................ 145

Gambar 4.54 Halaman Pengerjaan Soal .................................................................. 146

Gambar 4.55 Halaman Hasil Kuis Siswa ................................................................. 147

Gambar 4.56 Halaman Petunjuk Kuis ..................................................................... 148

Gambar 4.57 Halaman Lihat Nilai Saya Siswa ....................................................... 148

Gambar 4.58 Halaman Detail Hasil Siswa .............................................................. 149

Gambar 4.59 Halaman Semua Forum Siswa ........................................................... 150

Gambar 4.60 Halaman Postingan Saya Siswa ......................................................... 150

xviii

xviii

Gambar 4.61 Halaman Tulis Postingan Siswa ........................................................ 151

Gambar 4.62 Halaman Postingan Selengkapnya Siswa .......................................... 152

Gambar 4.63 Halaman Pengumuman ...................................................................... 153

xix

xix

DAFTAR TABEL

Halaman Tabel 2.1 Simbol Flowchart ...................................................................................... 21

Tabel 2.2 Simbol Data Flow Diagram ...................................................................... 22

Tabel 3.1 Hasil Observasi .......................................................................................... 30

Tabel 3.2 Aktivitas Pengguna Pada Pramuka SMPN 1 Kesamben ............................ 32

Tabel 3. 3 Kebutuhan Fungsional Sistem .................................................................. 35

Tabel 3.4 Non-Fungsional .......................................................................................... 39

Tabel 3.5 Spesifikasi Hardware dan Software Sistem ............................................... 40

Tabel 3.6 Pembina ...................................................................................................... 66

Tabel 3.7 Pengajar ...................................................................................................... 66

Tabel 3.8 Siswa .......................................................................................................... 67

Tabel 3.9 Kategori Materi .......................................................................................... 67

Tabel 3.10 Materi ....................................................................................................... 68

Tabel 3.11 Soal ........................................................................................................... 68

Tabel 3.12 Jawab ........................................................................................................ 69

Tabel 3.13 Hasil ......................................................................................................... 69

Tabel 3.14 Posting ...................................................................................................... 70

Tabel 3.15 Komen ...................................................................................................... 70

Tabel 4.1 Uji Login .................................................................................................. 152

Tabel 4.2 Uji Coba Sistem Sebagai Pembina........................................................... 154

Tabel 4.3 Uji Sistem Sebagai Pengajar .................................................................... 165

Tabel 4.4 Uji Sistem Sebagai Siswa ...................................................................... 1659

xx

xx

DAFTAR LAMPIRAN

Halaman Lampiran 1 Undang - Undang Tentang Anggota Pramuka ...................................... 184

Lampiran 2 SK Tentang SKU Sebagai Materi Kurikulum Pramuka ....................... 185

Lampiran 3 Peran dan Tanggung Jawab Organisasi ................................................ 189

Lampiran 4 Silabus Dan Materi Kegiatan Pramuka ................................................ 193

1

BAB I

PENDAHULUAN

1.1 Latar Belakang

SMP Negeri 1 Kesamben merupakan lembaga pendidikan formal yang

terletak di Jl. Taman Siswa Desa Pojokrejo Kecamatan Kesamben Kabupaten

Jombang yang memiliki jumlah siswa sebanyak 672 siswa. Dalam pelaksanaan

membentuk pengetahuan siswa tentang ilmu pengetahuan, pendidikan di sekolah

ini memberikan fasilitas ekstrakurikuler, salah satunya adalah pramuka, dan

menjadi ekstrakurikuler wajib yang harus diikuti semua siswa yang tercantum

pada UU RI Tahun 2010 Tentang Gerakan Pramuka Pasal 13.

SMPN 1 Kesamben Jombang memiliki 21 pasukan anggota pramuka

penggalang yang berisi 32 siswa per pasukan terdiri dari 3 golongan yaitu ramu,

rakit, dan terap, seperti gambar 1.1.

Gambar 1.1 Golongan Pramuka

1

2

Aktivitas yang dilakukan ekstrakurikuler pramuka diantaranya adalah

mengenalkan pramuka kepada siswa dan siswi seperti yang tertera dalam buku

saku pramuka, karena untuk menjadikan mereka naik ke golongan tertentu,

mereka harus menempuh standar pengetahuan yang telah ditentukan di buku saku

pramuka (SKU), selain itu mereka akan dikenalkan sekaligus dengan

mempraktekkan apa saja yang ada di dalam pramuka, pembina memberikan

arahan supaya siswa dan siswi dapat menyerap ilmu pramuka secara baik.

Gambar 1.2 Sistem Pembelajaran Ekstrakurikuler Pramuka

Pada gambar 1.2 bisa dilihat kendala yang dialami pengajar, terutama

dalam hal mengajarkan pramuka kepada para siswa dan siswi SMP, misalnya

dalam hal penguasaan materi, murid diajarkan didalam satu kelas, setiap kelas

hanya diisi oleh 2 pengajar, sehingga semua murid dalam satu kelas akan

berebutan untuk duduk dibangku depan supaya bisa melihat dengan jelas pengajar

yang akan mengajar, dan pandangan dibangku yang paling belakang kesulitan

melihat pengajar saat melakukan praktik, dikarenakan siswa tidak dapat melihat

secara langsung bagaimana proses praktik dilakukan oleh pengajar, sehingga

siswa tidak bisa mendapatkan ilmu tambahan yang maksimal untuk mengenal

kepramukaan.

Lalu siswa kurang berkomunikasi dengan pengajar atau pembina karena

minimnya pertemuan kegiatan belajar yang dilaksanakan pada pramuka, siswa

3

juga merasa bosan karena pembelajaran yang masih menggunakan papan tulis, hal

ini membuat siswa malas untuk belajar karena banyaknya tulisan di papan tulis,

siswa tidak tahu materi mana saja yang harus mereka cari karena sulitnya mencari

buku yang tepat dan sesuai dengan materi yang diajarkan, siswa tidak mengetahui

ilmu penguasaan mereka sudah sampai mana, karena sistem penilaian masih

menggunakan SKU.

Untuk kendala pembina adalah kesulitan dalam mendistribusikan materi

kepada siswa, biasanya materi hanya diberikan dalam bentuk salinan yang dicetak

di kertas lalu diserahklan kepada pengajar, nantinya pengajar akan menyalin

materi ke papan tulis lalu dicatat oleh siswa di buku tulis, setelah selesai kegiatan,

siswa yang ingin mencari materi tambahan akan kebingungan untuk mencari

materi di luar sekolahan. Kendala-kendala tersebut padahal sangat penting untuk

diatasi karena untuk melakukan praktik pramuka, sebelumnya mereka sudah harus

menguasai teorinya dulu, dan mengingat kegiatan pramuka di SMP ini sangat

berpengaruh terhadap sekolah, hal ini dikarenakan pramuka menjadi salah satu

ekstrakurikuler unggulan dalam hal persaingan antar sekolah dibidang pramuka,

mulai dari persami awal tahun, jambore tingkat kecamatan, jambore tingkat

kabupaten, lomba kepramukaan, dll, juga ilmu pramuka dapat menjadikan

pedoman kedisiplinan untuk anak usia dini, dan bisa mengenal kehidupan alam

melalui program cinta lingkungan yang diadakan setiap kegiatan pramuka

dilaksanakan.

Melihat teknologi pada jaman sekarang yang semakin berkembang, dan

banyaknya perangkat laptop atau komputer yang semakin banyak dijumpai, lalu

banyaknya warnet yang menyediakan fasilitas internet yang cepat, ditambah

adanya fasilitas laboratorium komputer milik SMP, dan pendidikan komputer

4

yang sudah diajarkan sejak dini (kelas 5-6 SD), membuat setiap siswa pasti tidak

asing dengan cara mengoperasikan komputer ataupun laptop, namun karena

mudahnya pengoperasian komputer tersebut, membuat teknologi tersebut kurang

dapat dimanfaatkan, dikatakan kurang dimanfaatkan karena fungsi komputer

tersebut digunakan hanya untuk kegiatan yang berhubungan dengan mengetik,

menghitung, mendengarkan musik, dan untuk internet mereka hanya

menggunakannya untuk bermain game, membuka sosial media dan menyimpan

data pribadi mereka.

Untuk itu dengan memanfaatkan teknologi yang berkembang saat ini,

maka akan dibuatkan suatu sistem berbasis web yang nantinya akan membantu

siswa dalam memahami ilmu dari pramuka atau sebagai pengganti media

pembelajaran kepramukaan yang nantinya mampu membantu siswa memahami

setiap pelajaran yang ada di dalam kepramukaan yang dapat dibuka di mana saja

dan kapan saja, dan mampu memberikan bekal yang nantinya akan digunakan

untuk kegiatan kepramukaan diluar sekolah, seperti berkemah atau lomba, sistem

ini juga akan membantu pembina untuk memudahkan dalam mendistribusikan

materi ke siswa, lalu pembina dapat membuat soal atau kuis kecil untuk siswa

yang ingin mengetahui penguasaan kepramukaannya sudah sampai mana, untuk

berkomunikasi nanti akan dibuatkan forum diskusi didalam sistem ini, sehingga

siswa dan pengajar atau pembina bisa saling berkomunikasi baik didalam maupun

diluar sekolah, didalam forum nanti berisikan tentang postingan pertanyaan yang

akan ditanyakan oleh siswa, lalu pembina atau pengajar akan menjawab

pertanyaan itu atau bisa siswa lain yang menjawab dan bisa saling berdiskusi di

dalam forum itu, dan nantinya didalam praktikum pramuka, siswa yang

mendapatkan jadwal praktikum pramuka dapat ditempatkan di laboratorium

5

komputer, dan murid bisa mengoperasikan komputer per anak dan melihat

aplikasi pramuka, sehingga mereka tidak berebutan untuk melihat pembina

melakukan praktikum karena mereka bisa melihat sendiri di dalam aplikasi.

1.2 Rumusan Masalah

Berdasarkan uraian latar belakang, maka rumusan masalah penelitian ini

adalah bagaimana merancang bangun aplikasi e-learning pramuka pada SMPN 1

Kesamben Jombang ?

1.3 Batasan Masalah

Batasan masalah pada penelitian rancang bangun aplikasi e-learning

berbasis web pramuka pada SMPN 1 Kesamben ini ialah sebagai berikut :

1. Aplikasi ini berbasis website dengan proses belajar ilmu kepramukaan yang

meliputi lagu-lagu dan yel-yel, tanda atau atribut pramuka, tali – temali, dan

sandi – sandi.

2. Aplikasi yang dibuat disesuaikan dengan sistem materi pembelajaran

ekstrakurikuler pramuka SMPN 1 Kesamben yang diambil dari SKU

penggalang yang tercantum pada SK Kwarnas Gerakan Pramuka No. 199

Tahun 2011 Tentang Penyelesaian Syarat Kecakapan Umum.

3. Aplikasi ini dikhususkan untuk kegiatan pramuka secara teori.

4. Aplikasi ini akan dibuatkan juga fitur kuis kecil yang terdiri dari ramu, rakit,

dan terap bagi siswa untuk mengetahui sampai mana ilmu yang mereka

pelajari.

5. Untuk berkomunikasi antar siswa dan murid, aplikasi ini dibuatkan sistem

forum diskusi, dimana siswa dan pengajar dapat membuat postingan yang

nantinya akan dibahas bersama.

6

1.4 Tujuan

Berdasarkan latar belakang, rumusan masalah dan batasan masalah di

atas, maka tujuan penelitihan ini yaitu :

Menghasilkan aplikasi e-learning atau media pembelajaran berbasis web

sebagai pelengkap dalam proses belajar mengajar tentang materi pramuka yang

disertai dengan objek berupa gambar, video, dan dokumen yang mampu dipelajari

oleh siswa dan mampu menghubungkan komunikasi antara pembina atau pengajar

dengan siswa serta mampu membuat penilaian kepada siswa dengan menyertakan

kuis soal agar siswa dapat mengetahui sudah sampai mana ilmu kepramukaan

mereka telah dikuasai.

1.5 Manfaat

Adapun manfaat dari penelitian ini yang dapat dimanfaatkan oleh pihak

SMPN 1 Kesamben Jombang adalah sebagai berikut :

1. Membantu pembina dalam mengarahkan apa saja yang perlu dipelajari lebih

lanjut setelah kegiatan pramuka selesai.

2. Mempermudah siswa dalam mempelajari ilmu kepramukaan karena web yang

dapat diakses dari mana saja.

3. Mengurangi tingkat kesalahan dalam memahami ilmu pramuka

4. Menghubungkan antara pembina atau pengajar dengan siswa dalam

melakukan komunikasi diluar jam ekstrakurikuler pramuka atau jam sekolah.

5. Menghasilkan informasi berupa nilai yang didapat dari kuis kecil latihan teori

kepramukaan.

7

BAB II

LANDASAN TEORI

2.1 Pembelajaran

Istilah pembelajaran dapat didefinisikan dari berbagai sudut pandang.

Dari sudut pandang behavioristik, pembelajaran sebagai proses pengubahan

tingkah laku siswa melalui pengoptimalan lingkungan sebagai sumber stimulus

belajar. Sejalan dengan banyaknya paham behavioristik yang dikembangkan para

ahli, pembelajaran ditafsirkan sebagai upaya pemahiran ketrampilan melalui

pembiasaan siswa secara bertahap dan terperinci dalam memberikan respon atau

stimulus yang diterimanya yang diperkuat oleh tingkah laku yang patut dari para

pengajar (Nurdyansyah & Fahyuni, 2016).

Pembelajaran dari sudut pandang teori kognitif, didefinisikan sebagai

proses belajar yang dibangun oleh guru untuk mengembangkan kreativitas

berpikir yang dapat meningkatkan kemampuan siswa dalam mengontruksi

pengetahuan baru sebagai upaya peningkatan penguasaan materi yang baik

terhadap materi pelajaran. Berdasarkan pengertian ini, pembelajaran dapat

dikatakan sebagai upaya guru untuk memberikan stimulus, arahan dan dorongan

kepada siswa agar terjadi proses belajar (Nurdyansyah & Fahyuni, 2016).

Belajar pada dasarnya merupakan peristiwa yang bersifat individual

yakni peristiwa terjadinya perubahan tingkah laku sebagai dampak dari

pengalaman individu. Sementara itu, pembelajaran adalah penyediaan kondisi

yang mengakibatkan terjadinya proses belajar pada diri peserta .

Pembelajaran dari sudut pandang teori interaksional didefinisikan sebagai

proses interaksi peserta didik dengan pendidik dan sumber belajar pada suatu

lingkungan belajar. Berdasarkan konsep ini, pembelajaran dipandang memiliki 7

8

kualitas baik jika interaksi yang terjadi bersifat multi arah, yakni guru-siswa,

siswaguru, siswa-siswa, siswa-sumber belajar, dan siswa-lingkungan belajar

(Nurdyansyah & Fahyuni, 2016).

2.2 E-Learning

E-learning dapat diterjemahkan sebagai pembelajaran yang

menggunakan perangkat eletronik sebagai medianya. E-learning merupakan

seperangkat aplikasi dan proses yang dibuat untuk kegiatan pembelajaran. E-

learning lebih mengarah kepada kelas virtual (Virtual Classroom). Materi-materi

dalam kegiatan pembelajaran elektronik tersebut kebanyakan dihantarkan melalui

media internet, intranet, tape, audio maupun video, satelit, televisi interaktif,

ataupun media penyimpanan seperti CD-ROM. Definisi ini menjelaskan bahwa

tidak ada nilai mutlak bahwa e-learning harus terhubung dengan internet. Namun,

secara spesifik, definisi e-learning adalah bergantung dari penyelenggara kegiatan

e-learning tersebut, cara penggunaan, serta tujuan penggunaanya (Rusman, 2013).

E-Learning juga merupakan satu penggunaan teknologi internet dalam

penyampaian pembelajaran dalam jangkauan luas yang berlandaskan tiga kriteria,

yaitu : E-learning merupakan jaringan dengan kemampuan memperbaharui,

menyimpan, mendistribusikan dan membagi materi ajar atau informasi,

Pengiriman sampai ke pengguna terakhir melalui komputer dengan menggunakan

teknologi internet yang standar. Memfokuskan pada pandangan yang paling luas

tentang pembelajaran di balik paradigma pembelajaran tradisional. Pernyataan di

atas menjelaskan bahwa e-learning memiliki fleksibilitas dalam pengolahannya,

meskipun terbatas dengan kemampuan dari keberadaan jaringan internet itu

sendiri. Proses pembelajaran di dalam e-learning sangat tergantung kepada

keberadaan komputer sebagai media utamanya. Meskipun begitu, dengan

9

komputer proses belajar bisa menjadi lebih dinamis karena komputer memiliki

beragam fitur, sehingga proses pembelajaran menjadi lebih menyenangkan.

Menurut Aunurrahman (2010), menguraikan beberapa ciri dari pembelajaran E-

learning :

1. E-learning merupakan suatu bentuk pembelajaran yang memberi penekanan

pada penyampaian informasi, komunikasi, pendidikan pada penyampaian

informasi, komunikasi, pendidika, pelatihan secara online.

2. E-learning menyediakan seperangkat alat yang dapat memperkaya nilai

belajar tradisional (model belajar klasikal, kajian terhadap buku teks, CD-

ROM, dan pelatihan berbasis komputer) sehingga dapat menjawab

perkembangan global.

3. E-learning tidak berarti menggantikan sistem belajar klasikal yang

dipraktikkan, tetapi memperkuat model belajar tersebut melalui pengayaan

informasi tentang substansi (content) dan mengembangkan teknologi

pendidikan.

4. Kapasitas pembelajaran sangat bervariasi. Hal ini tergantung pada bentuk

konten serta alat penyampaian informasi pesan-pesan pembelajaran dan gaya

belajar. Bilamana konten dikemas dengan baik dan didukung dengan alat

penyampai informasi dan gaya belajar secara serasi, maka kapasitas belajar

ini akan lebih baik yang pada gilirannya akan memberikan hasil yang baik.

5. E-learning memiliki banyak kelebihan dibandingkan dengan pembelajaran

tradisional. Ada beberapa kelebihan dari E-learning yaitu: merupakan media

komunikasi yang efektif, cepat dan kredibel, mencakup area yang luas, kelas

besar atau kelas kecil, kapan saja dan dimana saja, membangun Komunitas,

peningkatan Pembelajaran Siswa.

10

2.3 Sharable Content Object Reference Model (SCORM)

Sharable Content Object Reference Model (SCORM) : Interoperable

materi dari mata ajar atau mata diklat merupakan salah satu masalah penting

dalam e - learning. Hal tersebut mendorong kelompok Advanced Distance

Learning (ADL) membuat suatu standar materi pembelajaran yang dikenal

dengan nama Sharable Content Object Refference Model (SCORM) dengan

berbagai kelengkapan yang menyertainya.

Casella (dalam A SCORM Thin Client Architecture for E - Learning

Systems Based on Web Services, 2008) menyebutkan, SCORM adalah sesuatu

yang menunjukkan jenis-jenis pelayanan apa saja yang dibutuhkan untuk

menyelesaikan masalah-masalah tertentu, bagaimana masalah tersebut dapat

ditempatkan secara bersama-sama, standar-standar relevan yang terkait dan

bagaimana penggunaannya. Ada tiga buah kriteria utama untuk reference model

seperti SCORM. Pertama, harus mampu menghubungkan petunjuk-petunjuk yang

dapat dimengerti dan diimplementasikan oleh pengembang learning content .

Kedua, harus diterapkan, dimengerti dan digunakan oleh banyak stakeholder

sebisa mungkin. Ketiga, SCORM harus mengizinkan pemetaan dari setiap model

spesifik para stakeholder untuk pengembangan dan desain instruksional ke dalam

dirinya sendiri. Stakeholder harus mampu untuk melihat model desain

instruksional mereka direfleksikan dengan reference model yang mereka pakai

pada umumnya.

Pada SCORM ada beberapa elemen pembentuk, diantaranya adalah

seperti berikut:

11

A. Learning Management Sistem (LMS) berguna untuk mengirim, melacak,

melaporkan dan mengelola isi pembelajaran, mengetahui kemajuan siswa dan

interaksi siswa dengan materi pembelajaran. Sebuah model umum yang

menunjukkan komponen atau service potensial dari sebuah LMS.

Gambar 2.1 Layanan Learning Management System

Learning Management System memiliki 7 (tujuh) buah layanan yang

membentuk arsitektur sistem antara lain :

a. Learning Profile Service : Menyimpan data mengenai pembelajar atau user .

b. Course Administravie Service : Berfungsi untuk mengatur materi belajar

mengajar.

c. Assessment Service : Sebagai basis data ujian dan menentukan serta

mengelola tes yang akan dilaksanakan.

d. Sequencing Service : Layanan yang dapat merangkai materi belajar maupun

tes.

e. Delivery Service : Layanan yang dapat mengirimkan materi belajar kepada

pembelajar atau user .

12

f. Tracking Service : Layanan yang dapat mengetahui pencapaian pembelajar

atau user sampai sejauh mana seorang user dapat melaksanakan tes dan

belajar.

g. Content Management Service : Layanan yang dapat mengelola isi materi

belajar dan tes.

B. Asset

Asset merupakan blok utama dari sebuah learning resources. Asset

merupakan representasi elektronik dari media seperti teks, gambar, suara, objek

penilaian atau bagian data lain yang dapat diolah oleh web client dan

ditampilkan ke siswa.

C. Sharable Content Objects (SCO)

SCO merupakan kumpulan dari asset yang menggunakan SCORM Run-

Time Environment (RTE) untuk berkomunikasi dengan LMS. Perbedaan utama

dengan asset adalah SCO berkomunikasi dengan LMS menggunakan

pemrograman antar muka IEEE ECMAScripts. SCO merupakan unit informasi

minimum yang dapat diambil ke konten LMS.

D. Content Organization.

Content Organization merupakan representasi atau peta yang

mendefinisikan penggunaan yang diharapkan dari isi sampai unit instruksi

terstruktur. Peta akan memperlihatkan hubungan antara satu aktivitas dengan

aktivitas lainnya.

SCORM bermanfaat bagi komunitas pembelajaran jarak jauh dengan

tersedianya serangkaian tujuan yang jelas dan baik yang ditetapkan untuk

pengembangan e - learning Courseware. Adapun tujuan konten SCORM adalah

sebagai berikut:

13

1. Reusable - Isi independen dari konteks pembelajaran dan dapat digunakan

untuk pelajar atau situasi pelatihan dan pada sejumlah sistem pembelajaran

manajemen yang berbeda-beda.

2. Interoperable - Fungsi konten di berbagai konfigurasi, dan tidak tergantung

pada alat yang digunakan untuk menciptakannya. Misalnya, courseware akan

dirancang dan dikembangkan untuk dijalankan dalam lingkungan / HTML

Flash, yang umum untuk kebanyakan komputer.

3. Durable - Isi layak pada sistem perangkat lunak atau platform, bahkan jika

platform diubah atau ditingkatkan.

4. Accessible - Content terletak di beberapa jenis repositori di tempat yang dapat

diakses untuk memenuhi kebutuhan pelatihan atau pendidikan. Sebuah

universitas yang mengembangkan pembelajaran online dengan standar

SCORM mungkin memiliki repositori terpusat.

2.4 Pramuka

Pramuka adalah singkatan dari Praja Muda Karana (berarti orang –

orang berjiwa muda yang suka berkarya), yaitu setiap pemuda yang aktif dalam

kegiatan kepramukaan dan dididik dengan berbagai keterampilan, disiplin,

kepercayaan pada diri sendiri, saling menolong, dan lain sebagainya (Nasrudin,

2018).

Kepramukaan adalah segala bentuk kegiatan dan lain sebagainya yang

berhubungan dengan pramuka. Kegiatan yang dimaksud di sini adalah kegiatan-

kegiatan yang menarik dan mengandung nilai-nilai pendidikan (Nasrudin, 2018).

14

2.4.1 Lagu-lagu dan Yel-yel Pramuka

Lagu-lagu dan yel-yel pramuka adalah sebuah nada atau sorakan yang

digunakan untuk menyemangati anggota pramuka baik dalam suasana senang

maupun sedih.

2.4.2 Tanda / Atribut Pramuka

Tanda pengenal pramuka adalah tanda yang dikenakan oleh seorang

pramuka pada seragam yang menjukkan jati dirinya sebagai seorang pramuka,

satuan tempatnya bergabung, jabatan yang diembannya, kemampuan dan

kecakapannya, dan penghargaan yang telah diterimanya (Nasrudin, 2018). Dalam

gerakan pramuka, tanda pengenal terdiri dari :

1. Tanda Umum

Gambar 2.2 Tanda Umum Pramuka

Tanda Umum Pramuka adalah tanda pengenal yang dikenakan oleh

semua anggota pramuka pada pakaian seragammnya dan gerakan pramuka

sedunia. Tanda umum berfungsi sebagai jati diri seorang sebagai anggota

pramuka (Irfan, 2018).

2. Tanda Satuan

Tanda Satuan adalah kelompok tanda pengenal dalam Gerakan Pramuka

yang menunjukkan seorang anggota Gerakan Pramuka tergabung dalam

15

satuan atau kwartir tertentu. Satuan atau kwartir di sini mulai dari satuan

terkecil (barung, regu, sangga, dan krida), gugusdepan, kwartir ranting,

hingga kwartir nasional. Tanda satuan dipasang di pakaian seragam pramuka.

Penggunaan tanda satuan ini dimaksudkan untuk mempermudah mengenal

satuan atau wilayah tempat anggota Gerakan Pramuka bergabung.

Gambar 2.3 Tanda Lencana Wilayah

3. Tanda Jabatan

Tanda Jabatan adalah tanda pengenal pramuka yang menunjukkan

jabatan seseorang beserta hak dan kewajiban yang melekat dengan jabatan

itu.

Gambar 2.4 Tanda Jabatan

4. Tanda Kecakapan

Tanda Kecakapan dalam Gerakan Pramuka adalah tanda-tanda yang

dikenakan pada pakaian pramuka yang menunjukkan kecakapan,

keterampilan, ketangkasan, kemampuan, sikap dan usaha seorang Pramuka

16

dalam bidang tertentu, sesuai dengan golongan usianya. Secara singkat tanda

kecakapan bisa diartikan sebagai tanda yang menunjukkan kecakapan atau

kemampuan seorang pramuka pada bidang keterampilan tertentu.

Gambar 2.5 Tanda Kecakapan

5. Tanda Penghargaan

Tanda Penghargaan adalah tanda yang menunjukkan jasa atau

penghargaan yang diberikan kepada seseorang, atas jasa, darma bakti, dan

lain-lainnya, yang dianggap cukup bermutu dan berguna bagi pramuka,

masyarakat, bangsa dan negara.

Gambar 2.6 Tanda Penghargaan

2.4.3 Tali – temali

Sebagai alat bantu, tali banyak dipakai untuk mengikat, mengangkat, atau

menarik sebuah benda, Tali-temali atau knots merupakan salah bagian dari

kehidupan sehari-hari, mulai dari tiang jemuran, menali kapal, membuat kemah

hingga panjat tebing. Dalam kegiatan alam terbuka (Outdoor), pengetahuan tali-

temali menjadi pengetahuan wajib yang harus dimiliki oleh penggiat alam

17

terbuka, bukan hanya untuk diri sendiri, tetapi juga berguna ketika berada dalam

keadaan darurat, baik saat mendaki gunung maupun panjat tebing (Nasrudin,

2018).

Gambar 2.7 Kumpulan Sampul

2.4.4 Sandi – sandi

Sandi berasal dari bahasa Sanskerta yang berarti rahasia atau tulisan-

tulisan yang dirahasiakan. Disebut rahasia karena huruf atau sandi hanya dapat

dimengerti oleh orang yang mengetahui kata kuncinya.

Beberapa contoh sandi – sandi yang ada di dalam pramuka sebagai

berikut:

1. Sandi Morse

Sandi morse adalah sandi atau kode komunikasi menggunakan suara

sebagai pengantarnya, bisa melalui siulan, peluit, maupun klakson.

Gambar 2.8 Sandi Morse

18

2. Sandi A=N

Sandi A=N adalah kode dimana cara penulisan huruf pada alfabet dibalik

dari A menjadi N seperti gambar 11.

Gambar 2.9 Sandi A=N

3. Sandi A=Z

Berbeda dengan sandi A=N, sandi A=Z merupakan kebalikan dari sandi

A=N, dimana huruf A menjadi Z.

Gambar 2.10 Sandi A=Z

4. Sandi Kotak I

Sandi kotak I pada dasarnya adalah sandi dengan penulisan menyerupai

garis lekuk seperti gambar 13 dibawah ini.

Gambar 2.11 Sandi Kotak

Berbeda dengan semaphore. Semaphore atau semafor adalah salah satu

teknik untuk mengirim atau menyampaikan dan menerima pesan atau informasi

dengan jarak yang berjauhan dengan menggunakan kombinasi kedua tangan. Agar

mudah dilihat, kedua tangan biasanya memegang sebuah benda yang mencolok

seperti tongkat, dayung, bendera, atau yang lainnya (Nasrudin, 2018).

19

Gambar 2.12 Semaphore

2.5 Website

Menurut Heni (2010), website adalah halaman informasi yang disediakan

melalui jalur internet sehingga bisa diakses di seluruh dunia, selama terkoneksi

dengan jaringan internet. Website merupakan komponen atau kumpulan

komponen yang terdiri dari teks, gambar, suara, dan animasi sehingga lebih

merupakan media informasi yang menarik untuk dikunjungi, secara garis besar

website bisa digolongkan menjadi 3 jenis yaitu :

a. Website statis adalah web yang mempunyai halaman tidak berubah. Artinya,

untuk melakukan perubahan pada suatu halaman dilakukan. Secara manual

dengan mengedit kode yang menjadi struktur dari website tersebut.

b. Website dinamis adalah website yang secara struktur diperuntukan melakukan

update sesering mungkin, user dapat memperbarui data pada halaman web.

20

c. Website interaktif, pada web ini user dapat beradu argumen mengenai apa

yang menjadi pemikiran mereka. Contoh website interaktif adalah blog dan

forum.

2.6 PHP : Hypertext Preprocessor

Menurut Arief (2011), PHP merupakan bahasa server-side-scripting yang

menyatu dengan HTML untuk membuat halaman web yang dinamis. Dengan

menggunakan program PHP, sebuah website akan lebih interaktif dan dinamis.

Kelebihan-kelebihan dari PHP:

a. PHP merupakan sebuah bahasa script yang tidak melakukan sebuah

kompilasi dalam penggunaannya. Tidak seperti halnya bahasa pemrograman

aplikasi yang lainnya.

b. PHP dapat berjalan pada web server yang dirilis oleh Microsoft, seperti IIS

atau PWS juga pada apache yang bersifat open source.

c. PHP memiliki referensi yang begitu banyak sehingga sangat mudah untuk

dipahami.

Menurut Sibero (2011), PHP adalah pemrograman interpreter yaitu

proses penerjemahan baris kode sumber menjadi kode mesin yang dimengerti

komputer secara langsung pada saat baris kode dijalankan. PHP disebut juga

pemrograman server-side-programming, hal ini dikarenakan seluruh prosesnya

dijalankan server. PHP adalah suatu bahasa dengan hak cipta terbuka atau yang

juga dikenal dengan open source yaitu pengguna data mengembangkan kode-kode

fungsi sesuai kebutuhannya.

2.7 MySQL

Menurut Arief (2011) MySQL (My Structure Query Languange) adalah

salah satu jenis database server yang sangat terkenal dan banyak digunakan untuk

21

membangun aplikasi web yang menggunakan database sebagai sumber dan

pengelolaan datanya. MySQL bersifat open source dan menggunakan SQL

(Structured Query Languange). MySQL biasa dijalankan diberbagai platform

misalnya windows, linux, dan lain sebagainya.

MySQL merupakan DBMS yang multithread, multi user yang bersifat

gratis di bawah lisensi GNU General Public Licence (GPL). Tidak seperti Apache

yang merupakan software yang dikembangkan oleh komunitas umum, dan hak

cipta untuk kode sumber dimiliki oleh penulisnya masing-masing. Seperti yang

telah disebutkan sebelumnya, MySQL bersifat gratis atau open source sehingga

kita bisa menggunakannya secara gratis.

2.8 Flowchart

Menurut e-Community (2011), Flowchart adalah simbol-simbol

pekerjaan yang menunjukkan bagan aliran proses yang saling terhubung. Jadi,

setiap simbol Flowchart melambangkan pekerjaan dan instruksinya. Simbol-

simbol Flowchart adalah standar yang ditentukan oleh America National

Standard Institute Inc.

Tabel 2.1 Simbol Flowchart

No. Simbol Keterangan

1. Simbol start atau end yang mendefinisikan awal atau

akhir dari sebuah Flowchart

2. Simbol pemrosesan yang terjadi pada sebuah alur kerja.

3. Simbol input / output yang mendefinisikan masukan dan

keluaran proses

4. Simbol untuk memutuskan proses lanjutan dari kondisi

tertentu.

5. Simbol konektor untuk menyambung proses pada lembar

kerja yang sama

22


6. Simbol konektor untuk menyambung proses pada lembar

kerja yang berbeda.

7. Simbol untuk menghubungkan antar proses atau antar

simbol.

8. Simbol yang menyatakan piranti keluaran, seperti layar,

monitor, printer dll

9. Simbol yang mendefinisikan proses yang dilakukan secara

manual.

2.9 Data Flow Diagram (DFD)

Menurut Sutabri (2012), Data Flow Diagram adalah suatu network yang

menggambarkan suatu system automat atau komputerisasi, manualisasi, atau

gabungan dari keduanya, yang penggambaranya disusun dalam bentuk kumpulan

komponen sistem yang saling berhubungan sesuai aturan mainnya. Simbol –

simbol yang digunakan dalam Data Flow Diagram, yaitu:

Tabel 2.2 Simbol Data Flow Diagram


1. Proses, Simbol ini digunakan untuk proses pengolahan atau

transformasi data.

2. External Entity, Simbol ini digunakan untuk menggambarkan

asal atau tujuan data.

3. Data Flow, simbol ini digunakan untuk menggambarkan

aliran data yang berjalan

4. Data Store, simbol ini digunakan untuk menggambarkan data

flow yang sudah disimpan atau diarsipkan.

27

2.10 System Development Life Cycle (SDLC)

Menurut Pressman & Roger (2015), Model System Development Life

Cycle (SDLC) ini biasa disebut juga dengan model waterfall atau disebut juga

classic life cycle. Adapun pengertian dari SDLC ini adalah suatu pendekatan yang

sistematis dan berurutan. Tahapan-tahapannya adalah komunikasi

(Communication), perencanaan (planning), pemodelan (modeling), konstruksi

(construction), serta penyerahan sistem perangkat lunak ke para

pelanggan/pengguna (deployment), yang diakhiri dengan dukungan berkelanjutan

pada perangkat lunak yang dihasilkan. Model System Development Life Cycle

(SDLC) ditunjukkan pada gambar 1 berikut.

CommunicationProject iniiation

Requirement gathering

Planning EstimatingSchedulingTracking

Modeling

AnalysisDesign

Deployment DeliverySupport

Feedback

Construction

CodeTest

Gambar 2.13 Pengembangan menggunakan Model Waterfall (Pressman, 2015)

Penjelasan-penjelasan SDLC Model Waterfall, adalah sebagai berikut:

a. Communication

Langkah pertama diawali dengan komunikasi kepada konsumen. Langkah

awal ini merupakan langkah penting karena menyangkut penumpulan

informasi tentang apa kebutuhan konsumen.

b. Planning

Setelah proses Communication dapat menetapkan rencana untuk pengerjaan

software yang meliputi tugas-tugas teknis yang akan dilakukan, resiko yang

28

mungkin terjadi, sumber-sumber yang dibutuhkan, hasil yang akan dibuat,

dan jadwal pengerjaan.

c. Modeling

Pada proses modeling ini menerjemahkan syarat kebutuhan ke sebuah

perancangan software yang dapat diperkirakan sebelum dibuat coding. Proses

ini berfokus pada rancangan struktur data, arsitektur software, representasi

interface, dan detail (algoritma) prosedural. Tahapan ini menghasilkan

dokumen yang disebut software requirement.

d. Construction

Construction merupakan proses membuat kode. Coding atau pengkodean

merupakan penerjemahan desain dalam bahasa yang bisa dikenali oleh

komputer. Programmer akan menerjemahkan transaksi yang diminta oleh

user. Tahapan inilah yang merupakan tahapan secara nyata dalam

mengerjakan suatu software, artinya penggunaan komputer akan

dimaksimalkan dalam tahapan ini. Setelah pengkodean selesai maka akan

dilakukan testing terhadap sistem yang telah dibuat. Tujuan testing adalah

menemukan kesalahan-kesalahan terhadap sistem tersebut untuk kemudian

bisa diperbaiki.

e. Deployment

Tahapan ini bisa dikatakan final dalam pembuatan sebuah software atau

sistem. Setelah melakukan analisis, desain dan pengkodean maka sistem yang

sudah jadi akan digunakan user. Kemudian software yang telah dibuat harus

dilakukan pemeliharaan secara berkala.

29

BAB III

ANALISIS DAN PERANCANGAN SISTEM

3.1 Metodologi Penelitian

Metode penelitian pada pembuatan laporan ini menggunakan metode

kuantitatif dimana penelitian ilmiah yang sistematis terhadap bagian-bagian dan

fenomena serta hubungan-hubungannya, yang memiliki beberapa tahapan-

tahapan.

Gambar 3.1 Tahap Penelitihan

3.2 Tahap Communication

Komunikasi adalah tahap awal dari merancang sebuah sistem,

mengidentifikasi masalah yang terjadi, siapa saja yang menjadi pengguna,

mengumpulkan informasi dan data.

Penelitihan

• Analisis dan Perancangan sistem mengunakan metode SDLC

Pendahuluan

• Latar Belakang

• Rumusan Masalah

• Batasan Masalah

• Tujuan • Manfaat

Kajian Pustaka

• Mencari Landasan Teori

Pengumpulan Data

• Identifikasi Masalah

• Identifikasi Pengguna

Pembahasan

• Implementasi Program

• Testing

Penutup

• Kesimpulan • Saran

29

Pendahuluan

30

3.2.1 Identifikasi Masalah

A. Studi Literatur

Studi literatur dilakukan untuk mendapatkan informasi apa saja yang

berhubungan dengan pembuatan aplikasi e-learning pramuka pada SMPN 1

Kesamben Jombang, bahasa pemrograman yang dipakai (PHP, MySQL), Website,

SDLC.

B. Wawancara

Pada System Investigation untuk langkah kedua yaitu pada tahap

wawancara ini, dengan melakukan tanya jawab kepada Bapak Nurul Hidayat yang

berjabat sebagai Pembina Pramuka perihal untuk mengetahui masalah yang

dihadapi, kemudian mencari solusi atas masalah yang dihadapi.

C. Pengamatan / Observasi

Dengan pengamatan / observasi secara langsung untuk mengetahui

kegiatan kepramukaan pada SMPN 1 Kesamben Jombang. Pengamatan /

observasi dilakukan untuk mendapatkan informasi dan data yang berhubungan

dengan penyelesaian masalah, selain itu juga mengetahui langkah – langkah apa

yang dilakukan oleh pihak sekolah dalam mengajarkan ilmu kepramukaan.

Tabel 3.1 Hasil Observasi

Permasalahan Dampak Solusi

1. Pembelajaran masih

menggunakan 2 pengajar di

dalam ruang kelas, setelah

kegiatan selesai, siswa yang

belum mengenal pembina

Komunikasi antara pembina

dan siswa dalam hal materi

yang diterangkan terganggu,

terutama siswa yang duduk

dibangku belakang, juga akan

Adanya forum didalam

sistem nantinya akan

mempermudah komunikasi

antara pembina dan murid,

31


akan kesulitan jika akan

bertanya di luar sekolah.

menyulitkan siswa yang akan

bertanya diluar kegiatan.

walaupun itu diluar sekolah.

2. Kurang jelasnya

pembina dalam membahas

suatu teori dan banyaknya

tulisan dipapan yang

membuat siswa bosan

Siswa sulit memahami apa

yang dijelaskan atau

dipraktekkan oleh pembina,

hal ini akan membuat siswa

merasa bosan dengan suasana

belajar yang seperti iu

Adanya materi yang berupa

penjelasan singkat dengan

menyisipkan gambar, audio,

atau video membuat siswa

tidak akan bosan dengan

materi yang diberikan, karena

tidak banyaknya teks seperti

dipapan.

3. Belum adanya

buku yang bisa dipegang

siswa dalam mendalami

ilmu pramuka sesuai

dengan apa yang mereka

inginkan, terkadang siswa

harus mencari satu persatu

materi pramuka yang ingin

mereka pelajari di internet.

Hal ini akan menyita waktu

belajar jika mereka terlalu

banyak mencari materi di

internet

Adanya sistem e-learning ini

membuat siswa tidak perlu

mencari materi yang telah

diberikan pembina di

internet, mereka cukup

mencarinya di dalam satu

aplikasi yang materinya

sudah diberikan oleh

pembina.

4. Pembina kesulitan

dalam memberikan atau

mendistribusikan referensi

pramuka kepada siswa,

adakalanya banyak siswa

yang kurang mengetahui

teknologi sosial.

Pembina akan kerepotan

karena harus mengirim satu

persatu materi yang ada ke

siswa lewat pengajar mereka

karena kurang tahunya siswa

akan teknologi sosial media.

Dengan adanya sistem maka

pembina cukup

mendistribusikan materi di

dalam satu aplikasi yang

nantinya siswa sendirilah

yang akan mengambilnya.

5. Penilaian siswa

terhadap penguasaan ilmu

pramuka secara teori masih

mengandalkan buku saku

pramuka (SKU), padahal

SKU itu hanya sebagai

patokan untuk mengangkat

siswa ke tingkat golongan

yang lebih tinggi atau tidak

Siswa akan menjadi bingung

dan tidak akan mengetahui

sudah sampai mana

penguasaan teori mereka

terhadap pramuka, mereka

tidak akan bisa menilai diri

sendiri dalam penguasaan

teori, benar atau salahnya

penguasaan mereka, dan

Dengan adanya sistem,

mereka akan diberikan

sebuah kuis kecil yang

nantinya nilai yang dihitung

berdasarkan jawaban yang

benar saja, sehingga mereka

akan tahu sendiri sudah

sampai mana penguasaan

ilmu pramuka yang mereka

32


dengan proses centang

didalam buku SKU-nya.

hanya mengandalkan hasil

akhir SKU yang diberikan

pembina.

pelajari tanpa harus

menunggu pembina

memberikan SKU.

3.2.2 Identifikasi Pengguna

Berdasarkan hasil wawancara dengan pembina pramuka SMPN 1

Kesamben Jombang. Diketahui pengguna dari ekstrakurikuler pramuka beserta

dengan perannya dalam melaksanakan kegiatan kepramukaan yang telah diatur

dalam peraturan tertulis pada kegiatan Buku Pedoman Pramuka Gugus Depan

SMPN 1 Kesamben Jombang (terdapat pada halaman lampiran) disimpulkan

sebagai berikut.

Tabel 3.2 Aktivitas Pengguna Pada Pramuka SMPN 1 Kesamben

No Pengguna Aktifitas 1 Pembina 1. Membuat silabus materi

2. Program Tahunan, Program Semester, Penilaian dan Rencana Pelaksanaan Kegiatan (RPK)

3. Mendistribusikan materi kepada pengajar 4. Mengelola data pengajar dan siswa 5. Menilai kegiatan siswa

2 Pengajar 1. Menyampaikan materi kepada siswa. 2. Materi yang diajarkan merupakan penyampaian dari pembina. 3. Membantu mengawasi siswa dalam melaksanakan kegiatan praktikum. 4. Ikut bagian dalam kegiatan diluar sekolah seperti perkemahan dan lomba. 5. Melihat hasil nilai dari kegiatan kepramukaan siswa yang mereka ajar 6. Setiap pengajar memiliki berhak memilih kelas yang mereka ajar dalam

satu tingkatan yang sama. 3 Siswa 1. Menerima materi kepramukaan

2. Menerima praktik kepramukaan 3. Menerima hasil kegiatan dalam SKU

3.3 Tahap Planning

Pada tahap perencanaan dari alur kebutuhan aplikasi e-learning pramuka

berbasis web pada SMPN 1 Kesamben yaitu dengan alur terstruktur serta estimasi

33

waktu yang dibutuhkan dalam pembuatan aplikasi. Jadwal kerja yang akan

dibutuhkan dalam melakukan penelitian ini.

3.4 Tahap Modelling

Tahapan ini adalah tahap perencanaan dan pemodelan arsitektur sistem

yang berfokus pada perancangan struktur data, arsitektur software, tampilan

interface, dan algoritma program. Pada tahap perancangan kebutuhan perangkat

lunak yang digunakan dalam pembuatan aplikasi kepramukaan adalah

perancangan terstruktur. Tahap ini di bagi menjadi dua sub bab yaitu analisis dan

perancangan, tujuannya untuk lebih memahami gambaran besar dari apa yang

akan dikerjakan.

Pada gambar diatas ini merupakan tahapan yang berfungsi untuk

mengidentifikasi kebutuhan sekolah dengan permasalahan yang ada pada

pembelajaran ekstrakurikuler pramuka. Analisis bisnis merupakan tahapan yang

paling menentukan keberhasilan pengembangan proyek perangkat lunak.

Pada gambar 3.2 dijelaskan terdapat tiga pengguna yang berada di dalam

ekstrakurikuler pramuka SMPN 1 Kesamben Jombang. Untuk alurnya sendiri

pembelajaran ekstrakurikuler pramuka saat ini menggunakan sistem pembelajaran

langsung dimana pembina memberikan materi pramuka kepada para pengajar dan

nantinya para pengajar ini akan dibagi tugas untuk mengajari tiap – tiap pasukkan

yang ada di sekolah serta melakukan praktiknya, setelah itu siswa akan diberikan

tanda tangan oleh pengajar mereka di SKU mereka yang menyatakan para siswa

siswi ini telah melakukan kegiatan pembelajaran sesuai dengan SKU yang

ditandatangani.

34

3.4.1 Analisis Kebutuhan Bisnis

Alur Pembelajaran Pramuka

PengajarPembina Murid

Phas

eSTART

Pemberian Materi

Sesuai Kurikulum ?

Distribusi Materi Kepada Pengajar

Dokumen Materi

Tidak

Ya

Menerima Materi

Menerangkan Materi

Menerima Materi

Melakukan Praktik Pramuka Diluar

kelas

Menerima SKU

Mengisi SKU

Memberikan SKU

Menerima SKU

Sesuai Dengan Yang Dipelajari Hari Ini ?

Tidak

Membuat Laporan Kegiatan

Menerima Laporan Kegiatan

Memberikan SKU

Ya

Selesai

Gambar 3.2 Proses Pembelajaran Ekstrakurikuler Pramuka Saat Ini

3.4.2 Analisis Kebutuhan Fungsional

Pada tahap analisa kebutuhan fungsional, kebutuhan fungsional

merupakan pernyataan layanan sistem yang harus disediakan, bagaimana sistem

bereaksi pada pengguna tertentu dan bagaimana perilaku sistem berjalan pada

situasi tertentu.

35

Tabel 3. 3 Kebutuhan Fungsional Sistem

No Penguna Fungsi Keterangan

1 Pembina 1. Mengelola Profil 1. Pembina dapat melihat profil mereka serta mengedit profilnya

2. Mengelola Data

Pengajar

2. Pembina dapat memasukkan data pengajar baru kedalam sistem.

3. Pembina dapat mengedit data pengajar.

4. Pembina dapat menghapus data pengajar.

3. Mengelola Data

Siswa

1. Pembina dapat memasukkan data siswa baru kedalam sistem.

2. Pembina dapat mengedit data siswa.

3. Pembina dapat menghapus data siswa.

4. Kelola Kategori

Materi

1. Pembina dapat memasukkan data kategori materi baru kedalam sistem.

2. Pembina dapat mengganti nama kategori materi.

3. Pembina dapat menghapus data kategori materi.

5. Mengelola Data

Materi

1. Pembina dapat memasukkan data materi baru kedalam sistem.

2. Pembina dapat mengedit data materi yang dia bagikan sendiri.

3. Pembina dapat menghapus data materinya sendiri.

4. Pembina dapat melihat data materi yang telah dibagikan oleh pengajar.

5. Pembina dapat mengedit atau menghapus data materi milik pengajar

yang telah dibagikan.

35

Tabel 3.3 Kebutuhan Fungsional Sistem

36


6. Mengelola Data

Soal Latihan Kuis

1. Pembina dapat mengedit data soal serta jawaban untuk soal yang akan

dibuat latihan.

2. Pembina dapat melihat jenis soal yang terdiri dari 3 golongan yaitu

ramu, rakit, dan terap.

3. Pembina dapat mengatur waktu kuis berlangsung dan membuka atau

menutup kuis.

7. Hasil Nilai Kuis 1. Pembina dapat melihat hasil kuis mulai dari yang gagal maupun yang

lulus.

2. Pembina dapat melakukan restart kuis atau membuka kembali kuis

untuk beberapa siswa.

8. Forum Diskusi 1. Pembina dapat melihat semua data postingan dari miliknya sendiri

maupun postingan dari pengajar dan siswa.

2. Pembina dapat berkomentar kesemua postingan.

3. Pembina dapat menghapus postingan milik sendiri maupun milik

pengajar atau siswa.

36

37


2 Pengajar 1. Mengelola Profil 1. Pengajar dapat melihat profil mereka serta mengedit profilnya

2. Mengelola Materi 1. Pengajar hanya dapat melihat semua materi yang telah dibagikan oleh

pembina atau pengajar yang lain.

2. Pengajar dapat mengunduh materi yang telah dibagikan.

3. Pengajar dapat menambahkan materi baru sendiri.

4. Pengajar dapat mengedit atau menghapus data materi yang mereka

bagikan sendiri.

3. Hasil Nilai Kuis 1. Pengajar dapat melihat hasil nilai dari kuis siswa dari yang gagal dan

lulus menurut data siswa yang mereka ajar.

2. Pengajar dapat melihat sifat dari kuis.

4. Forum Diskusi 1. Pengajar dapat melihat seluruh postingan yang dibuat oleh pembina

dan siswa.

2. Pengajar dapat membuat postingan sendiri.

3. Pengajar dapat berkomentar keseluruh postingan.

4. Pengajar dapat menghapus postingannya sendiri maupun komentarnya

sendiri.

37

38


3 Siswa 1. Mengelola Profil 1. Siswa dapat mengedit profil mereka masing – masing.

2. Lihat Materi 1. Siswa dapat melihat semua materi yang telah dibagikan oleh pembina

atau pengajar.

2. Siswa dapat mengunduh file materi yang dibagikan.

3. Latihan Kuis 1. Seluruh siswa dapat mengikuti latihan kuis pramuka yang telah dibuka

oleh pembina.

2. Siswa dapat mengerjakan soal latihan dengan model pilihan ganda.

3. Setelah latihan berakhir siswa dapat melihat hasil latihan mereka,

dimana letak kesalahan mereka serta jawaban yang benar, dan

diberikan nilai berapa, jika dibawah KKM maka siswa dianggap gagal.

4. Forum Diskusi 1. Siswa dapat melihat seluruh postingan yang dibuat oleh pembina dan

pengajar.

2. Siswa dapat membuat postingan sendiri.

3. Siswa dapat berkomentar keseluruh postingan.

4. Siswa dapat menghapus postingannya sendiri maupun komentarnya

sendiri.

38

39

3.4.3 Analisis Kebutuhan Non-Fungsional

Analisis kebutuhan non-fungsional dilakukan untuk mengetahui

spesifikasi kebutuhan sistem yang mendukung berjalannya kebutuhan fungsional.

Berikut adalah peranan kebutuhan non-fungsional yang ditunjukkan pada tabel

3.4:

Tabel 3.4 Non-Fungsional

Non-Fungsional Deskripsi

1. Keamanan Setiap user diberikan hak akses dengan username dan password.

2. Waktu 1. Dalam pengerjaan soal latihan kuis, dibuatkan sistem waktu mundur dimana waktu akan berjalan mundur sesuai dengan yang telah ditentukan oleh pembina sebelumnya.

2. Diberikan waktu tanggal kapan dan jam berapa postingan dibuat atau komentar dibuat.

3. Informasi 1. Terdapat pengumuman dari pembina didalam dashboard milik pengajar maupun siswa, serta dapat mengirimkan notifikasi email ke masing – masing pengajar dan siswa.

2. Notifikasi yang muncul ketika ada latihan soal yang telah dibuka oleh pembina.

3.4.4 Analisis Kebutuhan Sistem

Pada tahap ini ditentukan kebutuhan sistem yang diperlukan untuk

membangun aplikasi yang sesuai dengan hasil dari desain program, serta dengan

40

dokumentasi untuk setiap aktivitas pengkodean, dan juga kebutuhan yang

diperlukan untuk membuka aplikasi ketika sudah jadi. Aplikasi pendukung yang

digunakan yaitu :

A. Kebutuhan Software Dan Hardware

Pada tahap ini dilakukan analisis dimana kebutuhan perangkat lunak dan

perangkat keras yang mampu mendukung aplikasi e-learning ini.

Tabel 3.5 Spesifikasi Hardware dan Software Sistem

Pengguna

Software 1. Operasi Sistem Windows 7

2. Web Browser

Hardware

1. Minimal Prosesor Intel

Core 2duo

2. RAM 2 Gb

3. Internet access dial-up

56kb or higher

4. Monitor resolusi minimal

1024 x 800

B. Diagram Input Process Output

Diagram IPO berfungsi untuk menentukan, masukan atau input dan

keluaran atau output dari sistem. Data yang dibutuhkan oleh sistem akan diolah

sesuai dengan fungsi yang sudah dibuat pada sistem. Dari data yang sudah diolah,

pengguna dapat menentukan keluaran atau output yang dibutuhkan oleh pengguna

maupun keluaran atau output yang sudah dibuat secara otomatis pada sistem.

41

Diagram IPOProsesInput Output

Phas

e

Mengelola Data Pengajar

Mengelola Data Siswa

Mengelola Materi

Mengelola Soal Kuis

Data Pengajar

Data Siswa

Data Materi

Daftar Pengajar

Daftar Siswa

Informasi Materi

Pramuka

Data Jawab Daftar Soal Kuis

File DokumenDownload Materi

Hasil Kuis Nilai KuisDaftar Siswa

Daftar Soal Kuis

Forum Diskusi Forum

Kategori MateriData Kategori

Daftar Kategori Materi

Daftar Kategori Materi

Data Post

Data Komen

Daftar Siswa

Daftar Pengajar

A

B

C

D

C

D

B

B

A

Data Soal Informasi Kuis

Update Data Pembina

Data Pembina

Data Pembina

E

Data PembinaE

Data PembinaE

Data PengajarA

Gambar 3.3 Diagram IPO

Pada gambar diatas tentang IPO, menjelaskan tentang sebuah proses

input dan output sebuah sistem yang akan dibangun memiliki :

42

A. Input

a. Data Pembina

Data yang berisi informasi diri mengenai antara lain nama pembina,

alamat pembina, jenis kelamin, agama.

b. Data Pengajar

Data yang berisi informasi mengenai antara lain id pengajar, nama

pengajar, alamat pengajar, status golongan, jenis kelamin.

c. Data Siswa

Data yang berisi informasi antara lain no induk, nama siswa, tingkat

siswa, kelas, alamat siswa, jenis kelamin.

d. Data Kategori

Data yang berisi informasi mengenai kategori materi yang meliputi id

kategori, nama kategori.

e. Data Materi

Data yang berisi materi yang akan dibagikan, terdapat id materi, id

kategori, judul materi, penjelasan, gambar, video.

f. Data Soal

Data yang berisi tentang aturan waktu dan tempat membuka dan menutup

sesi latihan kuis berlangsung.

g. Data Jawab

Data yang berisi kumpulan soal yang nantinya akan dijawab oleh siswa

sebagai kuis kecil.

43

h. Data Post

Data yang berisi postingan yang nantinya akan di bahas atau didiskusikan

bersama di dalam satu forum.

i. Data Komen

Data yang berisi komentar atau hasil jawaban dari postingan yang

telah dibuat tadi.

B. Proses

a. Update Data Pembina

Digunakan untuk mengubah data profil pembina oleh pembina.

b. Mengelola Data Pengajar

Digunakan untuk menambah, menghapus, dan mengupdate data pengajar

yang ada.

c. Mengelola Data Siswa

Digunakan untuk menambah, menghapus, dan mengupdate data siswa.

d. Kategori Materi

Digunakan untuk menambah, menghapus, dan mengupdate kategori

materi yang akan digunakan sebagai pengelompokkan materi pramuka.

e. Mengelola Materi

Digunakan untuk menambah, menghapus, dan mengupdate materi yang

nantinya akan digunakan sebagai bahan ajar.

f. Download Materi

Digunakan untuk mengambil materi yang telah dibagikan sebelumnya.

44

g. Mengelola Soal Kuis

Digunakan untuk membuat soal, menambah, menghapus, dan

mengupdate soal untuk dijadikan kuis kecil sebagai latihan siswa.

h. Hasil Kuis

Digunakan untuk menghitung hasil akhir dari pertanyaan yang sudah

dijawab oleh siswa.

i. Forum

Digunakan untuk menampung diskusi yang akan dibicarakan antara

pengajar, pembina ke siswa atau sesama siswa.

C. Output

a. Data Pembina

Berisikan informasi yang didapatkan dari pengeditan data pembina pada

profil nantinya.

b. Daftar Pengajar

Berisikan informasi yang didapat dari keluaran data pengajar dan

hasilnya akan menjadi inputan untuk proses diskusi forum.

c. Daftar Siswa

Berisikan informasi yang didapat dari keluaran data siswa yang nanti

hasilnya menjadi inputan dari proses hasil kuis dan diskusi forum.

d. Daftar Kategori

Berisikan informasi yang didapat dari keluaran data kategori materi dan

hasilnya akan diteruskan untuk menginputkan proses dari mengelola materi dan

download materi.

45

e. Informasi Materi Pramuka

Berisikan informasi teori tentang ilmu pramuka yang diberikan pembina

atau pengajar kepada siswa.

f. File Dokumen

Berisikan hasil dari pengambilan materi yang dipilih oleh siswa.

g. Daftar Soal Kuis

Berisikan seputar tanya jawab seputar kepramukaan yang ditujukan

untuk siswa yang hasilnya akan diinputkan ke proses hasil nilai.

h. Nilai Kuis

Penghitungan kemampuan anak dalam menguasai teori dalam pramuka.

i. Diskusi Forum

Informasi komunikasi postingan yang dibuat oleh pengajar atau siswa

dan dikomentari oleh pengajar atau siswa.

3.4.6 Alur Sistem (System Flow)

System Flow menggambarkan alur proses sistem dan interaksi pengguna

dengan sistem. Penggunaan System Flow mempermudah penggambaran langkah

demi langkah alur proses sistem dan interaksi pengguna dengan sistem.

1. System Flow Login

Pada proses ini digambarkan alur dari user yang akan masuk kedalam

sistem, proses dimulai dari user menginputkan username dan password mereka,

lalu ketika selesai maka akan di proses untuk mengecek apakah ada username

beserta passwordnya berada pada tabel dari ketiga user, jika tidak maka ada

kesalahan mungkin username dan password salah atau tidak ditemukan data, jika

46

iya maka akan dibuka halaman dashboard untuk masing – masing user yang telah

cocok dengan password dan username seperti pada gambar 3.4.

Sysflow Login

SistemUser

Phas

e

Start

Data Pembina ?

Input username dan

password

Halaman Login

Cek data username dan password pada

tabel

Data Pembina

Data Pengajar ?

Data Pengajar

Data Siswa ?

Data Siswa

Username & password ada di

tabel ?

Menampilkan halaman

dashboard pembina

Menampilkan halaman

dashboard pengajar

Menampilkan halaman

dashboard siswa

Tampilan Dashboard Pembina

Tampilan Dashboard Pengajar

Tampilan Dashboard

Siswa

Selesai

Ya

Tidak

Tidak

Tidak ada

Ya

Ya Ya

Gambar 3.4 System Flow Login User

2. System Flow Mengelola Profil

Pada proses ini dijelaskan alur bagaimana user dapat mengubah atau

memperbarui profilnya, pertama user akan dibawa kehalaman profil, lalu user

memilih untuk mengedit profil yang nantinya akan ditampilkan halaman edit data,

setelah itu sistem akan mengecek apakah ada form yang belum terisi, jika masih

47

ada form kosong maka user akan diperingatkan, jika sudah terisi maka user

diarahkan ke halaman profil seperti pada gambar 3.5.

Sysflow Mengelola Profil

SistemUser

Phas

e

Start Halaman Profil

Input data baru

Form edit profil Masuk ke dalam edit profil

Cek apakah ada data kosong ?

Proses memperbarui data

Halaman Profil

Selesai

Tidak

Data user

Data user

Ya

Gambar 3.5 Sistem Flow Mengelola Profil

3. Mengelola Data Pengajar

Pada proses ini dibagi menjadi 3 alur, yaitu proses tambah data, edit data,

dan hapus data. Untuk tambah data pembina dapat mengisi data pengajar semua,

setelah itu akan di cek apakah ada form kosong atau tidak, jika ada akan

diingatkan jika tidak ada maka akan di cek apakah id pengajar ada yang sama atau

tidak jika tidak ada maka data berhasil disimpan. Untuk proses edit pembina

hanya memilih pengajar mana yang ingin diubah lalu sistem akan melakukan

pengecekan apakah ada data yang kosong atau tidak, jika tidak ada maka data

akan diupdate. Untuk proses hapus pembina memilih data pengajar yang ingin

dihapus dan selesai seperti pada gambar 3.6.

48

Sysflow Mengelola Data Pengajar

SistemPembinaPh

ase

Start Halaman Data Pengajar

Tambah Data ?

Memilih proses kelola

Form tambah data

Data Pengajar

Input data pengajar

Cek apakah form ada yang kosong ?

Cek apakah ada id pengajar yg sama ?

Proses tambah data pengajar

Edit Data ?

Memilih data pengajar yang diedit

Menampilkan form edit berdasarkan data pengajar yg dipilih

Edit data pengajar


Proses update data pengajar

Hapus Data ?

Memilih data pengajar yang

dihapus

Proses data pengajar dihapus

Ya

Tidak

Tidak Ada

Ada

Ada

Tidak Ada

Tidak Ada

Ada

Tidak

Ya

Selesai

Tdk

Data Pengajar

Gambar 3.6 System Flow Mengelola Data Pengajar

49

4. System Flow Mengelola Data Siswa

Pada proses ini hampir sama dengan proses mengelola data pengajar,

hanya saja data yang dikelola adalah data siswa, lalu tidak ada cek id, karena id

dari siswa didapatkan dari nomor induk pendidikan mereka seperti pada gambar

3.7.

Sysflow Mengelola Data Siswa

SistemPembina

Phas

e

Start Halaman Data siswa

Tambah Data ?


Form tambah data

Data Siswa

Input data siswa


Proses tambah data siswa

Edit Data ?

Memilih data siswa yang diedit

Menampilkan form edit berdasarkan data siswa

yg dipilih

Edit data siswa


Proses update data siswa

Hapus Data ?

Memilih data siswa yang dihapus

Proses data siswa dihapus

Ya

TidakTidak Ada

Ada

Tidak Ada

Ada

Tidak

Ya

Selesai

Tdk

Data Siswa

50

Gambar 3.7 System Flow Mengelola Data Siswa

5. System Flow Kategori Materi

Pada proses ini, sebelum materi - materi dibagikan kepada siswa, maka

akan ada proses kategori materi dimana proses ini digunakan untuk

mengelompokkan materi berdasarkan kategori yang sebelumnya dibuat, agar

materi – materi tidak tercampur seperti pada gambar 3.8.

Sysflow Kategori Materi

SistemPembina

Phas

e

Start Halaman Data kategori materi

Tambah Data ?


Form tambah data

Data Kategori Materi

Input data kategori Cek apakah form

ada yang kosong ?

Proses tambah data kategori materi

Edit Data ?

Memilih data kategori Menampilkan form

edit kategori materi

Edit data kategori materi


Proses update data kategori materiHapus Data ?

Memilih data kategori yang

dihapus

Proses data kategori dihapus

Ya

Tidak

Tidak Ada

Ada

Tidak Ada

AdaTidak

Ya

Selesai

Tdk


Pembuatan ID otomatis

Gambar 3.8 System Flow Kategori Materi

51

6. System Flow Data Materi

Sysflow Mengelola Data Materi

SistemPembina dan Pengajar

Phas

eStart Halaman Data

materi

Tambah Data ?


Form tambah data

Data Materi

Input data materi


Proses tambah data materiEdit Data ?

Memilih materi Menampilkan form edit kategori materi

Edit data materi


Proses update data materi

Hapus Data ?

Memilih data materi yang dihapus Proses data materi

dihapus

Ya

Tidak

Tidak Ada

Ada

Tidak Ada

AdaTidak

Selesai

Data Materi

Pembuatan ID otomatisPilih kategori

materi Pembuatan tgl hari ini


Input media materi

Lihat Materi ?

Memilih materiMenampilkan

materi

Tidak

Download Materi ?

Materi didownload Ya

Tidak

Tdk

Data Pembina

Data Pengajar

Pembina ?

Memilih data materi yang dihapus sendiri

Ya

Ya

Tidak

Gambar 3.9 System Flow Mengelola Data Materi

Pada gambar 3.9 memperlihatkan proses dimana untuk memasukkan

materi dibutuhkan dulu kategori materi yang sebelumnya dibuat, Pembina dapat

memasukkan judul materi, isi materi serta media berupa gambar dalam format

(jpg, png dan gif), video dalam format (mp4 dan 3gp maksimal 40mb), dan

pembina dapat menyisipkan file dokumen. Pada proses edit dimana materi yang

52

akan diubah nantinya, lalu proses hapus untuk menghapus materi, dan disertakan

proses lihat materi untuk melihat hasilnya, dan bisa untuk mengecek apakah

dokumen yang telah dibagikan tadi bisa di download atau tidak. Pengajar hanya

dapat mengedit dan menghapus data mereka sendiri.

7. System Flow Mengelola Latihan Kuis

Sysflow Mengelola Latihan Soal

SistemPembina

Phas

e

Start Halaman Data latihan


Halaman soal ramu

Kelola Soal ?

Atur Kuis ?

Memilih tingkat soal

Ramu

Rakit

Terap

Input soal ramu

Cek adakah form kosong ?

Proses update soal

Ya

Ya

Ada

Tidak Ada

Data jawab

Tidak

Halaman soal rakit

Input soal rakit


Halaman soal terap

Input soal terap


Ya

Ada

Tidak Ada

Tidak

Ya

Ada

Tidak Ada

Tidak

Memilih tingkat soal Data jawabYa

Halaman atur soal

Input waktu pengerjaan

soal

Ubah status soal

Proses update ketentuan soal Selesai

Tdk

Gambar 3.10 System Flow Mengelola Latihan Kuis

53

Pada gambar 3.10 memperlihatkan 2 alur proses yaitu mengelola soal dan

mengatur waktu dan membuka atau menutup ujian, untuk mengelola soal,

pembina harus memilih tingkat mana yang mau diubah soalnya, sedangkan untuk

proses mengatur waktu pembina dapat menentukan berapa lama waktu yang

diberikan ketika ujian berlangsung dari masing – masing tingkatan serta membuka

atau menutup kuis.

8. System Flow Hasil Kuis

Pada proses ini hasil kuis dibagi menjadi tiga pengguna yang memiliki

perannya masing – masing, pada pengguna pembina dapat melihat hasil dari siswa

mengerjakan latihan kuis yang telah dikerjakan, disini pembina memiliki hak

untuk menentukan apakah siswa tersebut dapat mengikuti latihan ulang atau tidak

dengan memilih restart siswa seperti pada gambar 3.11.

Sysflow Hasil Kuis Pembina

SistemPembina

Phas

e

Start Halaman Data hasil kuis

Memilih siswa yang telah ujian

Restart siswa ?

Restart siswa ? Membuka kembali kuis untuk siswa

terpilih

Data Hasil

Lihat Siswa

Halaman hasil siswa lulus

Halaman hasil siswa gagal

Lulus

Gagal

SelesaiLihat Histori

Nilai

Ya

Tidak

Halaman histori siswa

Cetak Nilai ? Print Nilai

Ya

Tidak

Tidak

Ya

Data Siswa

Gambar 3.11 System Flow Hasil Kuis Pembina

54

Sedangkan untuk pengajar, mereka hanya bisa melihat hasil nilai siswa

berdasarkan tingkat pramuka yang mereka ajar seperti pada gambar 3.12.

Sysflow Hasil Kuis Pengajar

SistemPengajarPh

ase

StartHalaman Data hasil

kuis berdasarkan kelas ajar pengajar

Data Hasil

SelesaiCetak Nilai ?

Print Nilai

Tidak

Ya

Memilih Siswa

Data Siswa

Data Pengajar

Gambar 3.12 System Flow Hasil Kuis Pengajar

Lalu untuk pengguna siswa, mereka hanya bisa melihat hasil kuis mereka

sendiri, dan tidak bisa melihat hasil kuis siswa lainnya seperti pada gambar 3.13.

Sysflow Hasil Kuis Siswa

SistemSiswa

Phas

e

StartHalaman Data hasil

kuis berdasarkan siswa

Data Hasil

SelesaiCetak Nilai ?

Print Nilai

Tidak

Ya

Memilih Hasil Nilai

Data Siswa

Gambar 3.13 System Flow Hasil Kuis Siswa

9. System Flow Forum Diskusi

Pada proses ini merupakan alur bagaimana forum diskusi berjalan,

terdapat pengguna pembina, pengajar dan siswa yang memiliki peran berbeda,

untuk persamaannya adalah, mereka memiliki dua pilihan yang bisa dipilih oleh

55

mereka, pertama membuat postingan yang kedua melihat dan mengomentari

postingan yang dipilih. Untuk membuat postingan mereka diarahkan ke halaman

form post, lalu mereka memasukkan judul dan pertanyaan yang ingin diiskusikan

bersama, mereka dapat menghapus post dan komentar yang mereka buat sendiri

seperti pada gambar 3.14.

Sysflow Forum Diskusi Pengajar Dan Siswa

SistemPengajar Atau Siswa

Phas

e

Start Halaman Data posting

Data Post

Buat posting ?

Komentar ?

Halaman membuat post

Input Posting Cek apakah ada form kosong ?

Proses simpan post

Hapus post ?

Ya

Tidak Ada

Proses hapus post

Tidak

Pilih postingan Halaman post yg dipilih

Input komentar

Proses simpan komen

Komentar lagi ?

Hapus komen ? Proses hapus komen

Data Post

Data Komen

Tidak

Tidak

Ya

Ya

Selesai

Ya

Tidak

Tidak

Ada

Data Komen

Gambar 3.14 System Flow Forum Diskusi Pengajar dan Siswa

56

Sedangkan untuk pembina berhak untuk menghapus semua postingan

atau komentar yang terdapat pada forum diskusi seperti pada gambar 3.15.

Sysflow Forum Diskusi Pembina

SistemPembina

Phas

e

Start Halaman Data posting

Data Post

Buat posting ?

Komentar ?

Halaman membuat post

Input Posting Cek apakah ada form kosong ?

Proses simpan post

Hapus post ?

Ya

Tidak Ada

Proses hapus post

Tidak

Pilih postingan Halaman post yg dipilih

Input komentar

Proses simpan komen

Komentar lagi ?

Hapus komen ? Proses hapus komen

Data Post

Data Komen

Tidak

Tidak

Ya

Ya

Selesai

Ya

Tidak

Tidak

Ada

Data Komen

Hapus Postingan Pengguna Lain ?

Proses hapus postingYa

Gambar 3.15 System Flow Forum Diskusi Pembina

10. System Flow Latihan Kuis Siswa

Pada proses ini merupakan alur siswa dalam melakukan latihan kuis,

sistem akan membuka latihan kuis ketika pembina membuka status soal menjadi

unlock atau terbuka, ketika terbuka siswa akan diarahkan ke halaman kuis terbuka

57

dan memilih sebelum mengerjakan soal apakah siswa mau membaca petunjuk

atau langsung mengerjakan soal, sebelum mengerjakan soal akan ada

pemberitahuan pesan singkat mengenai waktu pengerjaan berapa lama, lalu ketika

siswa mengerjakan soal akan ditampilkan waktu sebagai pengingat mereka.

Ketika waktu berlangsung dan siswa sudah menyelesaikannya maka siswa tinggal

menekan tombol selesai, akan tetapi ketika waktu sudah habis, maka siswa tidak

akan bisa mengerjakan soal kembali dan siswa akan langsung diarahkan ke

halaman hasil kuis dan melihat nilai mereka disana seperti pada gambar 3.16.

Sysflow Latihan Kuis Siswa

SistemSiswa

Phas

e

Start Halaman Kuis Data Soal

Kuis dibuka ? Halaman maaf kuis blm dibuka

Halaman kuis dibuka

Baca Petunjuk ?

Halaman petunjuk kuis

Halaman soal

Tidak

Ya

Ya

Tidak

Waktu berjalanMengerjakan soal

Waktu habis ?

Tekan tombol selesai

Proses simpan

Halaman pemberitahuan

kuis berakhir

Data Soal

Data Jawab

Halaman hasil

Menghitung hasil

Belum

Sudah Habis

Selesai

Data Hasil

Gambar 3.16 System Flow Latihan Kuis Siswa

58

11. System Flow Data Materi Siswa

Pada proses ini merupakan alur dimana siswa menerima materi dari

pembina maupun dari pengajar seperti pada gambar 3.17.

Sysflow Data Materi Siswa

SistemSiswa

Phas

e

Selesai

Start Halaman Data materi

Memilih materi

Data Materi

Menampilkan materi yang dipilih

Download ?

Download Materi

Materi

Gambar 3.17 System Flow Data Materi Siswa

12. System Flow Pengumuman

Pada proses ini merupakan alur dimana pembimbing ingin memberikan

pengumuman yang nantinya diberikan kepada pengajar dan siswa masing –

masing, terdapat fitur dimana setelah melakukan pengumuman, maka akan

dibuatkan notifikasi email kepada pengajar dan siswa seperti pada gambar 3.18.

59

Sysflow Pengumuman

SistemPembina

Phas

e

Start Halaman Dashboard

Data Siswa

Selesai

Mengisi Pengumuman

Proses Pengiriman Email

Email Pemberitahuan Kepada Pengajar dan Siswa

Data Pengajar

Gambar 3.18 System Flow Pengumuman

3.4.7 Diagram Jenjang

1

Aplikasi E-Learning Pramuka

1.1

Data User

1.2

Materi

1.3

Latihan Kuis

1.1.1

Data Pembina

1.1.2

Data Pengajar

1.1.3

Data Siswa

1.2.1


1.2.2

Data Materi

1.3.1

Atur Soal

1.3.2

Kelola Soal

1.3.3

Kelola Hasil

1.2.4

Download Materi

1.3.4

Mengerjakan Kuis

1.2.3

Lihat Materi

1.4

Forum Diskusi

1.4.1

Posting

1.4.2

Komentar

1.1.4

Pengumuman

Gambar 3.19 Diagram Jenjang Aplikasi E-Learning Pramuka

Pada diagram jenjang Aplikasi E-Learning Pramuka ini (gambar 3.19),

terdapat 4 proses yang memiliki masing – masing sub proses. Proses data user

memiliki sub proses 4 yaitu data pembina, data pengajar, data siswa, dan menulis

pengumuman. Lalu untuk proses materi memiliki 4 sub proses antara lain data

kategori materi, data materi, lihat materi, dan download materi. Lalu proses

60

latihan kuis ada 4 sub proses yaitu atur soal, kelola soal, kelola hasil, dan

mengerjakan kuis. Dan proses forum diskusi yang memiliki dua sub proses

posting dan komentar.

3.4.8 Konteks Diagram

Konteks Diagram atau Context diagram ini dirancang untuk membangun

aplikasi E-Learning Pramuka. Terdapat tiga external entity yaitu pembina,

pengajar, dan siswa. Diagram ini dibuat dengan mengacu pada aliran data yang

terdapat di dalam alur sistem yang telah dibuat.

Gambar 3.20 Context Diagram Aplikasi E-Learning

3.4.9 Diagram Alur Data Aplikasi

Diagram Aliran Data (DAD) atau Data Flow Diagram (DFD) digunakan

untuk menggambarkan alur data pada setiap proses. Data Flow Diagram

merupakan suatu model logika data atau proses yang dibuat untuk

menggambarkan darimana asal data dan kemana tujuan data yang keluar dari

61

sistem, dimana setiap data disimpan, proses apa saja yang berhubungan dengan

data tersebut. Perancangan Data Flow Diagram dimulai dari perancangan Context

Diagram, lalu di dekomposisi menjadi DFD Level 0, dan di dekomposisi menjadi

DFD Level 1. Beberapa proses utama yang ada pada DFD Level 0 diantaranya

adalah proses mengelola profil, materi, latihan kuis, dan forum diskusi.

Gambar 3.21 DFD Level 0 Aplikasi E-Learning Pramuka

62

A. DFD Level 1 – Data User

Pada DFD Level 1 mengelola profil terdapat tiga proses yaitu proses

kelola profil yang dapat dilakukan oleh semua entitas pembina, pengajar, dan

siswa, sedangkan untuk proses kelola pengajar dan kelola siswa yang dapat

mengelola hanya pembina.

Gambar 3.22 DFD Level 1 Mengelola Profil

B. DFD Level 1 – Mengelola Materi

Pada DFD Level 1 mengelola materi terdapat empat proses didalamnya

yaitu kelola kategori materi yang dilakukan oleh pembina, kelola data materi yang

diperankan oleh pembina dan pengajar, lalu untuk melihat materi, dan mengunduh

materi semua entitas dapat melaksanakannya.

1.1.4

63

Gambar 3.23 DFD Level 1 Mengelola Materi

C. DFD Level 1 – Latihan Kuis

Pada DFD Level 1 latihan kuis terdapat proses diantaranya untuk

mengatur ketentuan soal yang akan diujikan, lalu mengelola soal-soal yang akan

diujikan, lalu pengerjaan kuis, dan melihat hasil dari kuis yang telah dilaksanakan.

Gambar 3.24 DFD Level 1 Latihan Kuis

D. DFD Level 1 – Forum Diskusi

Pada DFD Level 1 forum diskusi terdapat proses posting untuk melihat

apa saja forum – forum yang telah dibuat dan proses komentar.

Gambar 3.25 DFD Level 1 Forum Diskusi

64

3.4.10 Rancangan Basis Data

Pada tahapan ini database akan didesain sesuai dengan kebutuhan unutk

membuat aplikasi. Perancangan database akan disesuaikan dengan alur sistem

yang ada pada System Flow. Percanangan database akan menghasilkan CDM dan

PDM.

A. Conceptual Data Model

Conceptual Data Model merupakan rancangan awal konsep desain

database yang nantinya akan di generate kedalam bentuk PDM. Dari rancangan

CDM ini akan menggambarkan keseluruhan relasi antar tabel.

Gambar 3.26 CDM Aplikasi E-Learning Pramuka

65

B. Physical Data Model

Physical Data Model (PDM) merupakan hasil dari generate CDM.

Secara keseluruhan Physical Data Model (PDM) menggambarkan basis data yang

telah jadi dan dapat di generate script kedalam database server.

Gambar 3.27 PDM Aplikasi E-Learning Pramuka

3.4.11 Struktur Basis Data

Struktur basis data ini mengacu pada Physical Data Model (PDM).

Seperti yang sudah dijelaskan sebelumnya PDM merupakan representatif dari

struktur basis data yang ada didalam database server.

66

1. Pembina

Nama Tabel : pembina

Primary Key : ID_pem

Foreign Key : -

Fungsi : menampung data pembina

Tabel 3.6 Pembina

No Nama Kolom Tipe Data 1 ID_pem Char (5) 2 nama_pem Varchar (20) 3 pass_pem Varchar (20) 4 kelamin_pem Varchar (10) 5 agama_pem Varchar (10) 6 alamat_pem Varchar (50) 7 username Varchar (20) 8 foto Varchar (255)

2. Pengajar

Nama Tabel : pengajar

Primary Key : ID_pen

Foreign Key : -

Fungsi : menampung data pengajar

Tabel 3.7 Pengajar

No Nama Kolom Tipe Data 1 ID_pen Char (10) 2 nama_pen Varchar (50) 3 pass_pen Varchar (20) 4 kelamin_pen Varchar (10) 5 agama_pen Varchar (10) 6 alamat_pen Varchar (50) 7 username Varchar (20) 8 email Varchar (255)

67

9 kelas Varchar (255) 10 foto Varchar (255)

3. Siswa

Nama Tabel : siswa

Primary Key : induk

Foreign Key : -

Fungsi : menampung data siswa

Tabel 3.8 Siswa

No Nama Kolom Tipe Data 1 induk Char (10) 2 nama_sis Varchar (225) 3 pass_sis Varchar (20) 4 kelas_sis Varchar (5) 5 status_sis Varchar (10) 6 kelamin_sis Varchar (10) 7 agama_sis Varchar (10) 8 alamat_sis Varchar (255) 9 username Varchar (20) 10 email Varchar (255) 11 foto Varchar (255)

4. Kategori Materi

Nama Tabel : kategorimateri

Primary Key : ID_kat

Foreign Key : -

Fungsi : mengkategorikan data materi

Tabel 3.9 Kategori Materi

No Nama Kolom Tipe Data 1 ID_kat Char (15) 2 nama_kat Varchar (50)

68

5. Materi

Nama Tabel : materi

Primary Key : id_mat

Foreign Key : id_kat

Fungsi : menampung data materi pramuka

Tabel 3.10 Materi

No Nama Kolom Tipe Data 1 id_mat Char (15) 2 judul Varchar (225) 3 id_kat Char (15) 4 nm_pen Varchar (50) 5 tgl_mat Date Time 6 isi_mat Long Varchar 7 foto Varchar (255) 8 video Varchar (255) 9 dokumen Varchar (255)

6. Ketentuan Latihan Kuis

Nama Tabel : soal

Primary Key : id_soal

Foreign Key : -

Fungsi : menampung data ketentuan kuis

Tabel 3.11 Soal

No Nama Kolom Tipe Data 1 id_soal Char (20) 2 Tingkat Varchar (20) 3 Waktu Integer 4 Sts Varchar (20)

69

7. Pertanyaan dan Jawaban

Nama Tabel : jawab

Primary Key : id_jawab

Foreign Key : id_soal

Fungsi : menampung data pertanyaan dan jawaban kuis

Tabel 3.12 Jawab

No Nama Kolom Tipe Data 1 id_jawab Char (20) 2 id_soal Char (20) 3 tanya Long Varchar 4 jwb_a Varchar (255) 5 jwb_b Varchar (255) 6 jwb_c Varchar (255) 7 jwb_d Varchar (255) 8 kunci Varchar (255)

8. Hasil Latihan Kuis

Nama Tabel : hasil

Primary Key : id_hasil

Foreign Key : id_sis

Fungsi : menampung data hasil dari pengerjaan kuis

Tabel 3.13 Hasil

No Nama Kolom Tipe Data 1 id_hasil Char (25) 2 id_sis Char (20) 3 score Integer 4 tgl_hasil Date Time 5 ket Varchar (10)

70

9. Posting

Nama Tabel : posting

Primary Key : id_post

Foreign Key : id_kat, id_pem

Fungsi : menampung data judul forum diskusi

Tabel 3.14 Posting

No Nama Kolom Tipe Data 1 id_post Char (25) 2 id_kat Char (15) 3 id_pem Char (15) 4 tgl_post Date Time 5 judul_post Varchar (50) 6 isi_post Long Varchar 7 Foto Varchar (225) 8 Ket Varchar (10)

10. Komentar

Nama Tabel : komen

Primary Key : id_komen

Foreign Key : id_post, id_penjwb

Fungsi : menampung data komentar dari posting yang telah dibuat

Tabel 3.15 Komen

No Nama Kolom Tipe Data 1 Id_komen Integer 2 Id_post Char (25) 3 Id_penjwb Char (15) 4 Tgl_dijwb Date Time 5 Isi_komen Long Varchar 6 ket Varchar (10)

71

3.4.12 Desain Antar Muka

Rancangan desain antar muka yang akan dibuat nantinya akan digunakan

oleh pengguna. Di sini peran pengguna dibagi menjadi tiga yaitu, Pembina

(Admin), Pengajar, dan Siswa. Rancangan ini digunakan untuk mempermudah

pengguna dalam memakai aplikasi. Terdapat beberapa desain antar muka yang

dibuat antara lain.

A. HALAMAN UTAMA

LOGIN

PROFIL PRAMUKAPROFIL SEKOLAHHOME

Email : ........... | no : .........................

LOGO PRAMUKA

Carrousel

HOME PRAMUKA

KUIS KECIL

.............................

MATERI PRAMUKA

.............................

FORUM DISKUSI

.............................

Gambar 3.28 Halaman Utama Website

Halaman utama (gambar 3.28) berfungsi sebagai tampilan awal ketika

website baru dibuka, terdapat beberapa informasi mengenai profil sekolah dan

pramuka, lalu terdapat 3 fitur utama dalam aplikasi ini, dan satu tombol untuk

login ke aplikasi.

Lalu terdapat halaman login yang digunakan untuk masuk kedalam

sistem, terdapat dua langkah dalam masuk kedalam aplikasi ini, pengguna disini

hanya memasukkan username dan password, dan menekan tombol login untuk

memproses ke tahap masuk seperti pada gambar 3.29.

72

Enter Text Enter Text

MASUK SISTEM PRAMUKA

Username Password

LOGINHOME

Gambar 3.29 Halaman Login Website

B. PEMBINA

Rancangan ini digunakan untuk pembina atau admin agar mempermudah

dalam memakai aplikasi.

1. Dashboard Pembina

Pada gambar 3.30 ditampilkan informasi berupa jumlah seputar kuis,

siswa, pengajar serta di atas dashboard ditampilkan sebuah bagian dimana

pembina dapat memberikan pengumuman kepada pengajar dan siswa, dan

disebelah kiri ditampilkan menu untuk mempermudah pengguna untuk

bernavigasi.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO

SELAMAT DATANG

PENGUMUMAN

UPDATE PENGUMUMAN

Tulis pengumuman disini....

Info jumlah siswa Info jumlah materiInfo jumlah pengajar Info jumlah post

Info jumlah siswaSudah mengikutikuis

Info jumlah siswa lulus Info jumlah siswa gagal

DASHBOARD

Gambar 3.30 Dashboard Pembina

73

2. Halaman Profil Pembina

Dihalaman ini (gambar 3.31) ditampilkan sebuah halaman profil untuk

memperlihatkan data pengguna yang sedang menggunakan aplikasi ini.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO

SELAMAT DATANG USER PROFIL

PROFIL SAYA

Username

Nama Lengkap

Alamat

Agama

Jenis Kelamin

EDIT PROFIL

.....................................

.....................................

.........................

.........................

................................................................................

foto

PEMBINA PRAMUKA

NAMA LENGKAP ............

Kelas Ajar

.........................

Gambar 3.31 Halaman Profil Pembina

3. Halaman Edit Profil Pembina

Dihalaman ini (gambar 3.32) ditampilkan sebuah halaman profil untuk

diubah nantinya data pengguna yang sedang menggunakan aplikasi ini.

74

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

...........

***********

...........

....................

.......

- pilih satu -

LOGO


Edit Profil

Username

Nama Lengkap

Alamat

Agama

Jenis Kelamin

UPDATE PROFIL

Password

Foto

Pilih file ...............

Laki-laki Perempuan

Gambar 3.32 Halaman Edit Profil Pembina

4. Halaman Data Pengajar

321

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO

SELAMAT DATANG Tabel Pengajar Pramuka

Tambah Data

ID Pengajar Nama Lengkap Username Jenis Kelamin Agama Kelas Ajar Foto

2020 ............. ............. Perempuan ................................. Edit Hapusfoto

2021 ............. ............. Laki-laki ................................. Edit Hapusfoto



Gambar 3.33 Halaman Data Pengajar

Pada gambar 3.33 ditampilkan seluruh data pengajar yang mengajar di

pramuka, serta pembina dapat mengubah maupun menghapus data pengajar

tersebut.

5. Halaman Tambah Data Pengajar

75

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

........... ***********

...........

....................

.......

- pilih satu -

...........

- pilih satu -

......

LOGO

SELAMAT DATANG Tabel Pengajar / Tambah Data

Tambah Data

ID Pengajar

Nama Lengkap

Alamat

Kelas Ajar

Jenis Kelamin

TAMBAH DATA

Password

Foto

Pilih file ...............

Laki-laki Perempuan

Username

Agama

Email

Gambar 3.34 Halaman Tambah Data Pengajar

Pada gambar 3.34 ditampilkan data pengajar yang ingin ditambahkan

oleh pembina, untuk id pengajar diinputkan manual karena nomor pengajar sudah

disediakan oleh pihak sekolah.

6. Halaman Edit Data Pengajar

Pada gambar 3.35 ditampilkan form untuk mengedit data pengajar, untuk

id pengajar tidak bisa diubah.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

2020 ***********

...........

....................

.......

- pilih satu -

...........

- pilih satu -

........

LOGO

SELAMAT DATANG Tabel Pengajar / Ubah Data

Ubah Data

ID Pengajar

Nama Lengkap

Alamat

Kelas Ajar

Jenis Kelamin

UBAH DATA

Password

Foto

Pilih file ...............

Laki-laki Perempuan

Username

Agama

Email

76

Gambar 3.35 Halaman Edit Data Pengajar

7. Halaman Data Siswa

321

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

- pilih kelas -

LOGO

SELAMAT DATANG Tabel Siswa Pramuka

Tambah Data

No Induk Nama Lengkap Username Jenis Kelamin Agama Alamat Foto





Kelas Status

7B

7B

7B

7B

Ramu

Ramu

Ramu

Ramu

Cari Kelas Cari

Gambar 3.36 Halaman Data Siswa

Pada halaman data siswa (gambar 3.36) ditampilkan informasi semua

data siswa, terdapat fitur pencarian berdasarkan kelas yang digunakan untuk

mempermudah dalam mencari siswa ketika akan di lihat, diubah, atau dihapus

datanya.

8. Halaman Tambah Data Siswa

Pada gambar 3.37 menampilkan form untuk menambahkan siswa baru,

untuk nomor induk diinputkan manual karena menyesuaikan dengan nomor induk

dari dinas pendidikan.

77

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

...........

***********

...........

....................

.......

- pilih satu -

...........

- pilih satu - - pilih satu -

...........

LOGO

SELAMAT DATANG Tabel Siswa / Tambah Data

Tambah Data

No Induk

Nama Lengkap

Alamat

Agama

Jenis Kelamin

TAMBAH DATA

PasswordFoto

Pilih file ...............

Laki-laki Perempuan

Username

Kelas Tingkat Pramuka

Email

Gambar 3.37 Halaman Tambah Data Siswa

9. Halaman Edit Data Siswa

Pada gambar 3.38 menampilkan form untuk mengubah data siswa, untuk

nomor induk tidak bisa diubah.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

7056

***********

...........

....................

.......

- pilih satu -

...........

- pilih satu - - pilih satu -

...........

LOGO

SELAMAT DATANG Tabel Siswa / Ubah Data

Ubah Data

No Induk

Nama Lengkap

Alamat

Agama

Jenis Kelamin

UBAH DATA

PasswordFoto

Pilih file ...............

Laki-laki Perempuan

Username

Kelas Tingkat Pramuka

Email

Gambar 3.38 Halaman Edit Data Siswa

78

10. Halaman Kategori Materi

Pada gambar 3.39 ditampilkan data kategori dari materi pramuka yang

nantinya akan membantu dalam pengelolaan data materi atau pengelompokan data

materi.

321

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

..........

LOGO

SELAMAT DATANG Tabel Kategori Materi Pramuka

Tambah Data

ID Kategori Nama Kategori

25022019-005 ............. Edit Hapus

............. Edit Hapus

............. Edit Hapus

............. Edit Hapus

Cari Kategori Materi Cari

25022019-004

25022019-003

25022019-002

Gambar 3.39 Halaman Data Kategori Materi

11. Halaman Tambah Kategori Materi

Pada gambar 3.40 digunakan untuk memasukkan atau menambahkan

data kategori materi kedalam sistem.

Gambar 3.40 Halaman Tambah Kategori Materi

12. Halaman Edit Kategori Materi

79

Pada gambar 3.41 digunakan untuk mengedit data kategori materi di

dalam sistem.

Gambar 3.41 Halaman Edit Kategori Materi

13. Halaman Data Materi Pembina

Pada gambar 3.42 menampilkan data seluruh materi yang telah

dimasukkan kedalam sistem, terdapat fitur pencarian materi untuk memudahkan

dalam menemukan judul materi yang diinginkan untuk dilihat, diubah, maupun

dihapus.

321

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

..........

LOGO

SELAMAT DATANG Tabel Materi Pramuka

Tambah Data

ID Materi Judul Materi

25022019-005 ............. Edit Hapus

............. Edit Hapus

............. Edit Hapus

............. Edit Hapus

Cari Materi Cari

25022019-004

25022019-003

25022019-002

Preview

Preview

Preview

Preview

Penulis

.............

.............

.............

.............

Gambar 3.42 Halaman Data Materi Pembina

14. Halaman Tambah Materi Pembina

80

Pada gambar 3.43 ditampilkan form untuk menambah data materi, id

dibuat otomatis, pengguna dapat memilih kategori materi yang sesuai dengan

judul materi yang ingin dibagikan, dan terdapat nama penulis dan tanggal dibuat

untuk menambahkan informasi tentang materi yang dibuat tanggal dan siapa yang

membagikannya.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

16022019-006 ............

- Pilih Kategori - ............

.........................

..............

..................

..........................

LOGO

SELAMAT DATANG Tabel Materi Pramuka / Tambah Data

Tambah Data

ID Materi Nama Penulis

TAMBAH DATA

Kategori Materi Tanggal

Judul Materi

Tambah GambarPilih File .......................

Isi Materi

Tambah VideoPilih File .......................

Tambah DokumenPilih File .......................

Gambar 3. 43 Halaman Tambah Materi Pembina

15. Halaman Edit Materi Pembina

Pada gambar 3.44 digunakan untuk mengubah data materi yang ingin

diperbaiki maupun ditambahkan lagi isinya.

81

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

16022019-006 ............


.........................

..............

..................

..........................

LOGO

SELAMAT DATANG Tabel Materi Pramuka / Ubah Data

Ubah Data


UBAH DATA


Judul Materi


Isi Materi



Gambar 3.44 Halaman Edit Materi Pembina

16. Halaman Lihat Materi Pembina

Pada gambar 3.45 semua materi yang telah dibagikan dapat dilihat seperti

apa hasilnya, dan juga di halaman ini pengguna juga dapat mengunduh file,

melihat gambar, dan melihat video materi.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

16022019-006 ............


Judul Materi ...............

Gambar Materi .........

Isi Materi ..............

Video Materi ................

LOGO

SELAMAT DATANG Tabel Materi Pramuka / Lihat Data

Lihat Data


KLIK UNTUK DOWNLOAD FILE DOKUMEN


Gambar 3.45 Halaman Lihat Materi Pembina

17. Halaman Data Kuis Pembina

Pada gambar 3.46 ditampilkan data untuk mengelola kuis, terdapat tiga

akses untuk mengelola kuis yaitu akses untuk melihat hasil kuis, akses untuk

82

mengelola soal kuis, dan akses untuk mengelola sifat soal dan membuka atau

menutup kuis. Kuis pramuka disini dibagi menjadi tiga menurut level

tingkatannya yaitu ramu, rakit, dan terap.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO

SELAMAT DATANG Kelola Kuis Prauka

Info jumlah siswa sudah ikut kuis Info jumlah siswa lulus Info jumlah siswa gagal

Kelola Data Soal == > RAMU RAKIT TERAP

Ketentuan Kuis

Tingkat Waktu Status

Ramu

Rakit

Terap

100 Menit

50 Menit

120 Menit

unlock

unlock

lock

Edit

Edit

Edit

LIHAT HISTORI SISWA

Gambar 3.46 Halaman Data Kuis Pembina

18. Halaman Edit Ketentuan Kuis

Pada gambar 3.47 digunakan untuk menentukan sifat kuis yang akan

diikuti oleh siswa, terdapat waktu yang digunakan untuk menentukan lamanya

pengerjaan soal oleh para siswa, lalu terdapat status yang dimana digunakan untuk

membuka atau menutup kuis pramuka ini.

83

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

terap

120

- Lock -

LOGO

SELAMAT DATANG Kelola Kuis Pramuka / Ubah Ketentuan Kuis

Ubah Data

Tingkatan

Waktu

Status

UPDATE

Gambar 3.47 Halaman Edit Ketentuan Kuis

19. Halaman Kelola Soal Kuis

Dihalaman ini digunakan untuk melihat semua soal kuis mulai dari

tingkat ramu, rakit, dan juga terap. Terdapat juga fitur pencarian pertanyaan yang

digunakan untuk membantu pembina dalam mencari pertanyaan seperti pada

gambar 3.48.

321

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

.............

LOGO

SELAMAT DATANG Kelola Kuis Pramuka

RAMU RAKIT TERAP

Cari Pertanyaan Cari

Pertanyaan Kuis

# Pertanyaan Edit

Q15022019-001 Edit.................................................................................................................................

Q15022019-002 Edit.................................................................................................................................

Q15022019-003 Edit.................................................................................................................................

Q15022019-004 Edit.................................................................................................................................

Gambar 3.48 Halaman Kelola Soal Kuis

84

20. Halaman Edit Soal Kuis

Pada halaman ini pertanyaan tersebut dapat diubah serta jawabnnya juga

dapat diganti ataupun diubah seperti pada gambar 3.49.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

Q15022019-001 Ramu

.........................

..........

...........................

...........

...........

...........

...........

...........

LOGO

SELAMAT DATANG Kelola Kuis Pramuka / Ubah Soal

Ubah Data

ID Pertanyaan Tingkatan

Pertanyaan

Jawaban A

Jawaban B

Jawaban C

Jawaban D

Kunci Jawaban

UPDATE SOAL

Gambar 3.49 Halaman Edit Soal Kuis

21. Halaman Lihat Hasil Pembina

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO



Hasil Latihan Kuis

Nama Tingkat Nilai

Ramu

Rakit

Terap

Status

.............

.............

.............

50

77

34

GAGAL

GAGAL

LULUS

Gambar 3.50 Halaman Lihat Hasil Pembina

85

Pada gambar 3.50 ditampilkan semua hasil kuis yang telah dikerjakan

oleh siswa, terdapat tampilan untuk melihat siswa yang gagal maupun lulus, serta

terdapat tombol restart di tiap siswa yang tujuannya untuk melakukan kuis ulang

terhadap siswa yang bersangkutan bila terjadi sesuatu diluar dugaan seperti lampu

mati atau komputer hang saat mengerjakan soal dan waktu habis.

22. Halaman Histori Nilai Siswa Pembina

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO


Hasil Latihan Kuis

Nama Tingkat Nilai

Ramu

Rakit

Terap

Status

.............

.............

.............

50

77

34

GAGAL

GAGAL

LULUS

Lihat Detail Hapus

Lihat Detail Hapus

Lihat Detail Hapus

Semua Hasil

Cari Nama Cari Tingkat Cari Periode Tanggal Cetak Tanggal

Gambar 3.51 Halaman Histori Nilai Siswa Pembina

Pada gambar 3.51 ditampilkan semua histori dari nilai siswa setiap

selesai melaksanakan ujian, lalu terdapat halaman lihat detail digunakan untuk

melihat jawaban dari siswa yang terpilih.

86

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

FOTO

LOGO


No Pertanyaan Jawaban Siswa Jawaban Benar

.............

.............

.............

E-LEARNING PRAMUKA SMPN 1 KESAMBEN JOMBANGHASIL LATIHAN KUIS

Nama Siswa =Kelas =Tingkat =Tanggal Ujian =Nilai = gagal/lulus KKM=75

Cetak Hasil

Tanda

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

Gambar 3. 52 Halaman Detail Hasil Siswa Pembina

23. Halaman Data Forum Pembina

Pada halaman ini ditampilkan semua postingan atau pertanyaan yang

ingin didiskusikan dengan semua orang, terdapat judul postingan, kapan

pertanyaan itu dibuat, dan oleh siapa pertanyaan itu dibuat. Halaman ini juga

dilengkapi dengan fitur pencarian judul pertanyaan untuk memudahkan pengguna

dalam mencari diskusi, dan pembina berhak menghapus postingan yang dikira

mengandung pelanggaran seperti pada gambar 3.53.

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

...............

LOGO

SELAMAT DATANG Forum Diskusi Pramuka

Tulis Postingan Lihat Postinganku

Cari Post Cari

Judul Post ..........

Dibuat oleh .................

Tanggal di post : 25 – 02 – 2019 | Pukul : 00:00

Jumlah yg mengomentari...

Isi postingan

3 orang terakhir yang mengomentari postingan ini ...........- Nama : Komentar ..............- Nama : Komentar .................- Nama : Komentar .................

Lihat Selengkapnya ... Hapus Postingan Ini


Dibuat oleh .................



Isi postingan

Gambar 3.53 Halaman Data Forum Pembina

87

24. Halaman Postingan Selengkapnya Pembina

Pada halaman menampilkan seluruh aktivitas diskusi dari satu topik

postingan yang dipilih, terdapat beberapa pengguna yang berkomentar, dan

sebagai pembina memiliki hak untuk menghapus setiap komentar yang mungkin

saja melanggar atau tidak pantas untuk di tampilkan seperti pada gambar 3.54.

32 1

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

Tulis komentar ........................

LOGO


Tulis Postingan

Judul PostinganPenulis : ................ | Tanggal Di post : .................. | Pukul : .......................

Isi Postingan

Komentari Postingan Ini : ..............

Beri Komentar

Urutan Komentar

25-02-2019 | Pukul : 21:00Nama : ...........................................................................

25-02-2019 | Pukul : 21:00Nama : ...........................................................................

25-02-2019 | Pukul : 21:00Nama : ...........................................................................

X

X

X Gambar 3.54 Halaman Postingan Selengkapnya Pembina

25. Halaman Data Tulis Postingan Pembina

DASHBOARD

PROFIL SAYA

TABEL

PENGAJAR

SISWA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

.................... ............... ..............

- Pilih Kategori -

.....................

............................

......................................

LOGO


Ingin Membuat Postingan Apa ?

ID Post Penulis Tanggal

Kategori Materi Yang Ditanyakan

Tambahkan Gambar Pilih File .......................

Isi Post

TAMBAH DATA

Gambar 3.55 Halaman Tulis Postingan Pembina

88

Pada gambar 3.55 menampilkan form untuk menulis diskusi baru yang

nantinya akan dibahas bersama – sama.

C. PENGAJAR

Rancangan ini digunakan untuk penguna pengajar agar mempermudah


1. Halaman Dashboard Pengajar

Pada halaman ini ditampilkan informasi berupa jumlah seputar kuis,


pengajar dapat melihat pengumuman yang diberikan oleh pembina, dan disebelah

kiri ditampilkan menu untuk mempermudah pengguna untu bernavigasi seperti

pada gambar 3.56.

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO

SELAMAT DATANG

PENGUMUMAN !!!!!!

Info jumlah siswa Info jumlah materiInfo jumlah pengajar Info jumlah post

Info jumlah siswaSudah mengikutikuis

Info jumlah siswa lulus Info jumlah siswa gagal

DASHBOARD

Akan Ditampilkan Pengumuman Disini ..............

Gambar 3.56 Halaman Dashboard Pengajar

2. Halaman Profil Pengajar

89

Dihalaman ini ditampilkan sebuah halaman profil untuk memperlihatkan

data pengguna yang sedang menggunakan aplikasi ini seperti pada gambar 3.57.

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO


PROFIL SAYA

Username

Nama Lengkap

Alamat

Agama

Jenis Kelamin

EDIT PROFIL

.....................................

.....................................

.........................

.........................

................................................................................

foto

PENGAJAR PRAMUKA

NAMA LENGKAP ............

Kelas Ajar

.........................

E-Mail

.........................

Gambar 3.57 Halaman Profil Pengajar

3. Halaman Edit Profil Pengajar

Dihalaman ini ditampilkan sebuah halaman profil untuk diubah nantinya


90

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

...........

***********

...........

....................

.......

- pilih satu - ...........

LOGO


Edit Profil

Username

Nama Lengkap

Alamat

Agama

Jenis Kelamin

UPDATE PROFIL

Password

Foto

Pilih file ...............

Laki-laki Perempuan

E-Mail

Gambar 3.58 Halaman Edit Profil Pengajar

4. Halaman Semua Materi Pengajar

Pada halaman ini menampilkan data seluruh materi yang telah


dalam menemukan judul materi yang diinginkan untuk dilihat, dan pengguna

hanya dapat melihat materi saja seperti pada gambar 3.59.

91

321

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

..........

LOGO


Tambah Data


25022019-005 .............

.............

.............

.............

Cari Materi Cari

25022019-004

25022019-003

25022019-002

Preview

Preview

Preview

Preview

Penulis

.............

.............

.............

.............

Gambar 3.59 Halaman Semua Materi Pengajar

5. Halaman Data Materi Pengajar

Berbeda dengan halaman semua materi, di dalam halaman data materi ini

hanya ditampilkan materi – materi yang di bagikan oleh pengguna itu sendiri,

sehingga pengguna dapat melakukan hapus atau mengubah data materi miliknya

sendiri seperti pada gambar 3.60.

321

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

..........

LOGO


Tambah Data


25022019-005 ............. Edit Hapus

............. Edit Hapus

............. Edit Hapus

............. Edit Hapus

Cari Materi Cari

25022019-004

25022019-003

25022019-002

Preview

Preview

Preview

Preview

Penulis

.............

.............

.............

.............

Gambar 3.60 Halaman Data Materi Pengajar

92

6. Halaman Tambah Materi Pengajar

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

16022019-006 ............


.........................

..............

..................

..........................

LOGO

SELAMAT DATANG Tabel Materi Pramuka / Tambah Data

Tambah Data


TAMBAH DATA


Judul Materi


Isi Materi



Gambar 3.61 Halaman Tambah Data Materi Pengajar

Pada gambar 3.61 ditampilkan form untuk menambah data materi, id

dibuat otomatis, pengguna dapat memilih kategori materi yang sesuai dengan

judul materi yang ingin dibagikan, dan terdapat nama penulis dan tanggal dibuat

untuk menambahkan informasi tentang materi yang dibuat tanggal dan siapa yang

membagikannya.

7. Halaman Edit Materi Pengajar

Pada halaman ini digunakan untuk mengubah data materi yang ingin

diperbaiki maupun ditambahkan lagi isinya seperti pada gambar 3.62.

93

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

16022019-006 ............


.........................

..............

..................

..........................

LOGO

SELAMAT DATANG Tabel Materi Pramuka / Ubah Data

Ubah Data


UBAH DATA


Judul Materi


Isi Materi



Gambar 3.62 Halaman Edit Data Materi Pengajar

8. Halaman Lihat Materi Pengajar

Pada halaman ini semua materi yang telah dibagikan dapat dilihat seperti

apa hasilnya, dan juga di halaman ini pengguna juga dapat mengunduh file,

melihat gambar, dan melihat video materi seperti pada gambar 3.63.

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

16022019-006 ............


Judul Materi ...............

Gambar Materi .........

Isi Materi ..............

Video Materi ................

LOGO

SELAMAT DATANG Tabel Materi Pramuka / Lihat Data

Lihat Data


KLIK UNTUK DOWNLOAD FILE DOKUMEN


Gambar 3.63 Halaman Lihat Materi Pengajar

94

9. Halaman Data Kuis Pengajar

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO



Ketentuan Kuis

Tingkat Waktu Status

Ramu

Rakit

Terap

100 Menit

50 Menit

120 Menit

unlock

unlock

lock

HISTORI NILAI SISWA

Gambar 3.64 Halaman Data Kuis Pengajar

Pada gambar 3.64 ditampilkan data untuk melihat data kuis, pengajar

dapat melihat status dan waktu pengerjaan soal di halaman ini, namun pengajar

tidak dapat mengubahnya, dan pengajar juga dapat melihat data hasil kuis.

10. Halaman Hasil Kuis Pengajar

Pada halaman ini ditampilkan semua hasil kuis yang telah dikerjakan

oleh siswa, terdapat tampilan untuk melihat siswa yang gagal maupun lulus


DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

LOGO


Hasil Latihan Kuis Tingkat = .............(kelas ajar pengajar)

Nama Kelas Nilai

7B

....

.....

Status

.............

.............

.............

50

77

34

GAGAL

GAGAL

LULUS

Semua Data

Cari Kelas Cari Nama Lihat Periode Tanggal Cetak Tanggal

Tanggal

00-00-00

00-00-00

00-00-00

Lihat Detail

Lihat Detail

Lihat Detail

Gambar 3.65 Halaman Hasil Kuis Pengajar

95

Hasil nilai hanya dapat dilihat oleh pengajar disetiap kelas yang mereka

ajar, jika berbeda tingkat maka pengajar tidak dapat melihat, pengajar juga dapat

melihat detail jawaban siswa terpilih namun tidak bisa menghapusnya seperti pada

gambar 3.66.

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

FOTO

LOGO



.............

.............

.............



Cetak Hasil

Tanda

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

Gambar 3.66 Halaman Hasil Detail Siswa Pengajar

11. Halaman Forum Diskusi Pengajar

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

...............

LOGO


Tulis Postingan Lihat Postinganku

Cari Post Cari


Dibuat oleh .................



Isi postingan


Lihat Selengkapnya ...


Dibuat oleh .................



Isi postingan Gambar 3.67 Halaman Forum Diskusi Pengajar

Pada gambar 3.67 ditampilkan semua postingan atau pertanyaan yang



96


dalam mencari diskusi.

12. Halaman Postingan Saya Pengajar

Pada halaman ini ditampilkan postingan yang dibuat oleh pemiliknya

sendiri, dan pengguna dapat menghapus postingan yang dibuatnya sendiri seperti

pada gambar 3.68.

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

...............

LOGO


Tulis Postingan Lihat Semua Post

Cari Post Cari


Dibuat oleh .................



Isi postingan




Dibuat oleh .................



Isi postingan

Hapus Postingan Ini

Gambar 3.68 Halaman Postingan Saya Pengajar

13. Halaman Tulis Postingan Pengajar

Pada halaman ini menampilkan form untuk menulis diskusi baru yang

nantinya akan dibahas bersama – sama seperti pada gambar 3.69.

DASHBOARD

PROFIL SAYA

MATERI

SEMUA MATERI

DATA MATERI

DATA KUIS

DATA FORUM

.................... ............... ..............

- Pilih Kategori -

.....................

............................

......................................

LOGO


Ingin Membuat Postingan Apa ?

ID Post Penulis Tanggal


Tambahkan Gambar Pilih File .......................

Isi Post

TAMBAH DATA

Gambar 3.69 Halaman Tulis Postingan Pengajar

97

14. Halaman Postingan Selengkapnya Pengajar

Pada halaman ini menampilkan seluruh aktivitas diskusi dari satu topik


pemilik komentar memiliki hak untuk menghapus setiap komentar yang mungkin

ingin dihapus seperti pada gambar 3.70.

21 3

DASHBOARD

PROFIL SAYA

MATERI

KATEGORI MATERI

DATA MATERI

DATA KUIS

DATA FORUM

Tulis komentar ........................

LOGO


Tulis Postingan


Isi Postingan


Beri Komentar

Urutan Komentar

25-02-2019 | Pukul : 21:00Nama : ...........................................................................

25-02-2019 | Pukul : 21:00Nama Saya : ...........................................................................

25-02-2019 | Pukul : 21:00Nama : ...........................................................................

X

Gambar 3.70 Halaman Postingan Selengkapnya Pengajar

D. SISWA

Rancangan ini digunakan untuk pembina atau admin agar mempermudah


1. Halaman Dashboard Siswa

Pada halaman ini ditampilkan informasi pengumuman dari pembina,

terdapat tiga fitur utama serta akses langsung berupa tombol, terdapat juga

notifikasi lonceng yang digunakan jika ada latihan kuis dibuka, dan disebelah kiri

ditampilkan menu untuk mempermudah pengguna untuk bernavigasi seperti pada

gambar 3.71.

98

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG

SELAMAT DATANG

PENGUMUMAN !!!Pengumuman disini....

DASHBOARD

Nama siswa

Kuis Kecil.............

.....

Mulai Ikut Kuis

Berbagai Materi.............

.....

Lihat Materi

Forum Diskusi.............

.....

Lihat Forum

1

Gambar 3.71 Halaman Dashboard Siswa

2. Halaman Profil Siswa

Dihalaman ini ditampilkan sebuah halaman profil untuk memperlihatkan


DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG

PROFIL SAYA

Nama siswa

Username

Alamat

Agama

Jenis Kelamin

EDIT PROFIL

.................. .............

............

................................................................................

foto

Nama Lengkap :........................

Tingkat Pramuka :Penggalang .............

No Induk

...............

Kelas

...............

E-Mail

............

Gambar 3.72 Halaman Profil Siswa

99

3. Halaman Edit Profil Siswa

Dihalaman ini ditampilkan sebuah halaman profil untuk diubah nantinya


DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

6866

...............

***********

............................

...........

...........

...........

..........

..............

.....................

...............

LOGO SELAMAT DATANG

Ubah Profil

Nama siswa

No Induk

Username

Password

Nama Lengkap

Jenis Kelamin

Agama

Kelas

Status Siswa

Alamat

Foto

Laki - Laki Perempuan

Pilih File ....................................

UPDATE DATA

E-Mail

Gambar 3.73 Halaman Edit Profil Siswa

4. Halaman Data Materi Siswa

Pada halaman ini menampilkan data seluruh materi yang telah


dalam menemukan judul materi yang diinginkan untuk dilihat, dan pengguna

hanya dapat melihat materi saja seperti pada gambar 3.74.

100

321

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

...........

LOGO SELAMAT DATANG

Materi Pramuka

Nama siswa

Cari Materi Cari Berdasarkan KategoriCari Materi

GambarJudul Materi

Sekilas isi materinya

Penulis : .......................... / 25 02 2019

GambarJudul Materi


Penulis : .......................... / 25 02 2019

GambarJudul Materi


Penulis : .......................... / 25 02 2019

GambarJudul Materi


Penulis : .......................... / 25 02 2019

Gambar 3.74 Halaman Data Materi Siswa

5. Halaman Data Materi Kategori Siswa

Pada halaman ini ditampilkan seluruh kategori materi yang mewakili data

materi, terdapat jumlah banyaknya materi yang tersedia di setiap kategori materi

yang ditampilkan, tersedia juga fitur pencarian kategori materi untuk

memudahkan pengguna dalam mencari kategori materi yang mereka inginkan


321

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

...........

2

4

5

8

1

0

LOGO SELAMAT DATANG

Materi Pramuka

Nama siswa

Cari Kategori Lihat Semua MateriCari Kategori

Nama Kategori .................

Nama Kategori .................

Nama Kategori .................

Nama Kategori .................

Nama Kategori .................

Nama Kategori .................

Gambar 3.75 Halaman Data Materi Kategori Siswa

101

6. Halaman Lihat Materi Siswa

Pada halaman ini semua materi yang telah dibagikan dapat dilihat seperti

apa, dan juga di halaman ini pengguna juga dapat mengunduh file, melihat

gambar, dan melihat video materi seperti pada gambar 3.76.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG

Materi Pramuka

Nama siswa

Judul Materi ...................Kategori = ............ | Ditulis = ............... | Dipublish = 25 02 2019

Gambar MateriIsi Materi

Video Materi

Kembali Klik Untuk Download File Dokumen

Ga

mbar 3.76 Halaman Lihat Materi Siswa

7. Halaman Ikut Kuis

Pada halaman ini terdapat tiga kondisi dimana siswa dapat melihat kuis

sedang ditutup, dibuka, maupun halaman pengerjaan selesai seperti pada gambar

3.77.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG

SELAMAT DATANGDALAM KUIS E – LEARNING PRAMUKA SMP N 1 KESAMBEN JOMBANG

Nama siswa

MAAF UNTUK SAAT INI LATIHAN KUISBELUM DIBUKA

Gambar 3.77 Halaman Kuis Ditutup

102

Pada halaman diatas dijelaskan bahwa latihan kuis sedang ditutup atau

masih belum dibuka oleh pembina seperti pada gambar 3.78.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG


Nama siswa

LATIHAN KUIS TELAH DIBUKA !!!!

SILAHKAN KLIK TOMBOL DIBAWAH UNTUKMEMULAI KUIS

Petunjuk ? Mulai

Gambar 3.78 Halaman Kuis Dibuka

Ketika pembina membuka kuis, maka siswa akan ditampilkan halaman

seperti pada gambar diatas ini, terdapat dua tombol yaitu petunjuk digunakan

untuk membuka petunjuk kuis, dan tombol mulai yang digunakan untuk memulai

mengerjakan kuis.

Setelah siswa menekan tombol mulai, nantinya halaman akan

memunculkan jendela pemberitahuan berapa lama siswa diberikan waktu dalam

pengerjaan soal seperti pada gambar 3.79.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG


Nama siswa

MulaiClose

Perhatian

Isi Mengenai Informasi WaktuUntuk Mengerjakan Kuis ......... Menit

Gambar 3.79 Jendela Pemberitahuan Pengerjaan Kuis

103

Lalu ketika siswa sudah mengerjakan kuis, dan nilai sudah tersimpan

didalam sistem, maka siswa tidak dapat mengerjakan kuis lagi, dan akan

ditampilkan halaman seperti pada gambar 3.80.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG

MAAF

Nama siswa

Anda Sudah Melaksanakan Latihan Kuis

Gambar 3.80 Halaman Kuis Selesai

8. Halaman Pengerjaan Soal Kuis

Gambar 3.81 Halaman Pengerjaan Soal Kuis

Setelah siswa melihat pemberitahuan berapa banyak waktu pengerjaan

soal dilakukan, maka siswa akan dibawa ke halaman pengerjaan soal. Pada

gambar 3.81 ini tidak ada navigasi menu dan hanya terdapat soal untuk dikerjakan

oleh siswa, terdapat judul kuis serta nama siswa dan juga ditampilkan timer atau

waktu pengerjaan soal yang selalu muncul dipojok halaman agar digunakan

sebagai pengingat waktu untuk siswa dalam mengerjakan soal, ketika waktu habis

104

maka secara otomatis soal akan ditutup dan siswa akan dibawa ke halaman hasil

kuis, namun jika siswa sudah selesai dalam pengerjaan soal dan waktu masih

tersisa, maka siswa dapat menekan tombol selesai yang disediakan dibawah

halaman.

9. Halaman Hasil Kuis Siswa

Pada halaman hasil kuis ini siswa akan melihat informasi mengenai hasil

dari mereka mengerjakan soal, siswa dapat melihat jawaban mereka apakah benar

atau tidak di nomor soal berapa, dan di bawah halaman akan ditampilkan berapa

skor yang didapat oleh siswa, jika dibawah KKM maka siswa dianggap gagal,

namun sebaliknya jika nilai siswa diatas skor KKM maka siswa dianggal lulus


DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG

Hasil Ujian

Nama siswa

# Pertanyaan Jawaban Anda Jawaban Benar Tanda

1 .................................... AAAAA AAAAA

CCCCC SSSSSSS2 ....................................

Anda GAGAL / LULUS Dengan Hasil Ujian – Skor ........, Dengan KKM 75 Gambar 3.82 Halaman Hasil Kuis Siswa

10. Halaman Petunjuk

Pada halaman petunjuk ini, ditampilkan beberapa poin dalam pengerjaan

soal kuis nanti seperti pada gambar 3.83.

105

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG

Petunjuk

Nama siswa

Pengisian Jawaban Latihan Kuis E-Learning Pramuka SMPN 1 Kesamben Jombang

1. ...............................................................................2. ..............................................................................3. .................................................................................................

Mulai Ujian ?

Gambar 3.83 Halaman Petunjuk

11. Halaman Lihat Nilai Saya

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

LOGO SELAMAT DATANG Nama siswa

Histori Semua Hasil Latihan Tes = ........(Nama Siswa)

Nama Tingkat Nilai Status

Nama Siswa .......... Ramu 78 LULUS

Nama Siswa .......... Ramu 50 GAGAL

Cari Tanggal Semua Data

Kelas

.....

.....

Tanggal Ujian

00-00-00

00-00-00

Lihat Detail

Lihat Detail

Gambar 3.84 Halaman Lihat Nilai Saya

Pada gambar 3.84 ini siswa akan mendapatkan informasi tentang

beberapa hasil kuis dari semua nilai yang pernah siswa itu laksanakan, terdapat

juga detail nilai untuk melihat jawaban siswa yang terpilih seperti pada gambar

3.85.

106

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

FOTO



.............

.............

.............



Cetak Hasil

Tanda

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

.............

Gambar 3.85 Halaman Detail Nilai Siswa

12. Halaman Semua Forum Siswa

Pada halaman ini ditampilkan semua postingan atau pertanyaan yang




dalam mencari diskusi seperti pada gambar 3.86.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

...............


Forum Diskusi Tulis PostinganPostingan SayaCari Post Cari


Dibuat oleh .................



Isi postingan




Dibuat oleh .................



Isi postingan

Gambar 3.86 Halaman Semua Forum Siswa

107

13. Halaman Postingan Saya Siswa

Pada halaman ini ditampilkan postingan yang dibuat oleh pemiliknya

sendiri, dan pengguna dapat menghapus postingan yang dibuatnya sendiri seperti

pada gambar 3.87.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

...............


Postingan Saya Tulis PostinganLihat Semua PostCari Post Cari


Dibuat oleh .................



Isi postingan




Dibuat oleh .................



Isi postingan

Hapus Postingan Ini

Gambar 3.87 Halaman Postingan Saya Siswa

14. Halaman Tulis Postingan Siswa

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

- pilih kategori -

....................

Enter Text


Forum Diskusi

Ingin mendiskusikan apa ?


Judul Posting

Foto

Isi Posting

Pilih File ..........................

Kembali Tambah Data

Gambar 3.88 Halaman Tulis Postingan Siswa

Pada gambar 3.88 menampilkan form untuk menulis diskusi baru yang

nantinya akan dibahas bersama – sama.

15. Halaman Postingan Selengkapnya Siswa

Pada halaman ini menampilkan seluruh aktivitas diskusi dari satu topik


108

pemilik komentar memiliki hak untuk menghapus setiap komentar yang mungkin

ingin dihapus seperti pada gambar 3.89.

32 1

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT NILAI SAYA

PEMBERITAHUAN

Tulis komentar ........................


Postingan Saya Tulis PostinganPostingan SayaKembali


Isi Postingan


Beri Komentar

Urutan Komentar

25-02-2019 | Pukul : 21:00Nama : ...........................................................................

25-02-2019 | Pukul : 21:00Nama Saya : ...........................................................................

25-02-2019 | Pukul : 21:00Nama : ...........................................................................

X

Gambar 3.89 Halaman Postingan Selengkapnya Siswa

16. Halaman Pengumuman

Pada halaman ini ditampilkan pengumuman yang telah ditulis oleh

pembina sebelumnya seperti pada gambar 3.90.

DASHBOARD

PROFIL

KUIS LATIHAN

IKUT KUIS

PETUNJUK

FORUM DISKUSI

SEMUA FORUM

POSTINGAN SAYA

DATA MATERI

LIHAT RANKING

PEMBERITAHUAN


PENGUMUMAN !!!

Isi Pengumuman

Gambar 3.90 Halaman Pengumuman

3.5 Tahap Construction

Tahapan ini adalah merupakan tahapan implementasi dan testing dalam

menyelesaikan tugas akhir. Adapun implementasi dan testing telah dijelaskan

pada bab iv.

109

BAB IV

HASIL DAN PEMBAHASAN

4.1 Implementasi Sistem

Pada tahapan ini merupakan tahap dimana perangkat lunak dibuat sesuai

dengan rancangan dan desain sistem yang telah dibuat sebelumnya. Pengguna

harus menyiapkan kebutuhan perangkat lunak sistem dan kebutuhan perangkat

keras sistem untuk mendukung proses berjalannya aplikasi sebelum melakukan

implementasi.

4.1.1 Halaman Utama

Nama Halaman = Halaman Utama Website E-Learning Pramuka

Flowchart = -

Desain UI = Gambar 3.28

Gambar 4.1 Halaman Utama Website

109

110

Halaman utama disini (gambar 4.1) berfungsi sebagai tampilan awal

ketika website baru dibuka, terdapat beberapa informasi mengenai profil sekolah

dan pramuka, lalu terdapat 3 fitur utama dalam aplikasi ini, dan satu tombol untuk

login ke aplikasi.

Nama Halaman = Halaman Utama Login

Flowchart = Gambar 3.4


Gambar 4.2 Halaman Login

Halaman login (gambar 4.2) yang digunakan untuk masuk kedalam sistem,

terdapat dua langkah dalam masuk kedalam aplikasi ini, pertama pengguna

memasukkan username dan password, dan menekan tombol login untuk

memproses ke tahap masuk.

4.1.2 Pembina

Halaman ini digunakan untuk pembina atau admin agar mempermudah


1. Dashboard Pembina

111

Nama Halaman = Dashboard Pembina



Gambar 4.3 Halaman Dashboard Pembina

Pada gambar 4.3 ditampilkan informasi berupa jumlah seputar kuis,


pembina dapat memberikan pengumuman kepada pengajar dan siswa, dan

disebelah kiri ditampilkan menu untuk mempermudah pengguna untuk

bernavigasi.

2. Halaman Profil Pembina

Nama Halaman = Profil Pembina



112

Gambar 4.4 Halaman Profil Pembina

Pada gambar 4.4 memperlihatkan data dari pengguna yang telah masuk

atau sedang menggunakan aplikasi ini.

3. Halaman Edit Profil Pembina

Nama Halaman = Edit Profil Pembina



Gambar 4.5 Halaman Edit Profil Pembina

113

Pada gambar 4.5 merupakan tampilan untuk mengedit informasi

pengguna.

4. Halaman Data Pengajar

Nama Halaman = Data Pengajar



Gambar 4.6 Halaman Data Pengajar

Pada gambar 4.6 merupakan tampilan dari data seluruh pengajar yang

mengajar di ekstrakurikuler pramuka SMPN 1 Kesamben Jombang.

5. Halaman Tambah Data Pengajar

Nama Halaman = Tambah Data Pengajar



114

Gambar 4.7 Halaman Tambah Data Pengajar

Pada gambar 4.7 menampilkan form untuk menambahkan data pengajar

yang akan mengajar di ekstrakurikuler pramuka.

6. Halaman Edit Data Pengajar

Nama Halaman = Edit Data Pengajar



Gambar 4.8 Halaman Edit Data Pengajar

Pada gambar 4.8 menampilkan form untuk mengubah data dari pengajar

yang dipilih dari halaman data pengajar.

7. Halaman Data Siswa

Nama Halaman = Data Siswa

115



Gambar 4.9 Halaman Data Siswa

Pada gambar 4.9 menampilkan seluruh data siswa yang mengikuti

pramuka, dan diberikan fitur pencarian berdasarkan kelas agar mempermudah

dalam mencari siswa.

8. Halaman Tambah Data Siswa

Nama Halaman = Tambah Data Siswa



116

Gambar 4.10 Halaman Tambah Data Siswa

Pada gambar 4.10 menampilkan form untuk menambahkan data siswa

yang ikut dalam kepramukaan SMPN 1 Kesamben Jombang.

9. Halaman Edit Data Siswa

Nama Halaman = Edit Data Siswa



117

Gambar 4.11 Halaman Edit Data Siswa

Pada gambar 4.11 menampilkan form untuk mengubah data siswa yang

telah dipilih sebelumnya di halaman data siswa.

10. Halaman Kategori Materi

Nama Halaman = Kategori Materi



Gambar 4.12 Halaman Kategori Materi

Pada gambar 4.12 menampilkan data dari kategori materi yang nantinya

membantu pengelompokan data materi di halaman data materi.

118

11. Halaman Tambah Kategori Materi

Nama Halaman = Tambah Kategori Materi



Gambar 4.13 Halaman Tambah Kategori Materi

Pada gambar 4.13 menampilkan form untuk menambah data kategori

materi.

12. Halaman Edit Kategori Materi

Nama Halaman = Edit Kategori Materi



Gambar 4.14 Halaman Edit Kategori Materi

Pada gambar 4.14 menampilkan form untuk mengedit atau mengubah

data dari kategori materi yang telah dipilih sebelumnya.

119

13. Halaman Data Materi Pembina

Nama Halaman = Data Materi Pembina



Gambar 4.15 Halaman Data Materi Pembina

Pada gambar 4.15 menampilkan semua data materi yang telah dibagikan

baik oleh pembina maupun oleh pengajar.

14. Halaman Tambah Data Materi Pembina

Nama Halaman = Tambah Data Materi Pembina



Gambar 4.16 Halaman Tambah Data Materi Pembina

120

Pada gambar 4.16 menampilkan form untuk menambahkan data materi

yang ingin dibagikan, diform tersebut juga sudah disediakan pilihan kategori yang

sebelumnya telah dibuat untuk membantu pengelompokkan materi.

15. Halaman Edit Data Materi Pembina

Nama Halaman = Edit Data Materi Pembina



Gambar 4.17 Halaman Edit Data Materi Pembina

Pada gambar 4.17 menampilkan form untuk mengedit atau mengubah

data materi yang telah dipilih sebelumnya di data materi.

16. Halaman Lihat Materi Pembina

Nama Halaman = Lihat Materi Pembina



121

Gambar 4.18 Halaman Lihat Materi Pembina

Pada gambar 4.18 menampilkan hasil sebuah materi yang sudah jadi dan

bisa di bagikan kepada seluruh siswa, disini pengguna juga dapat mendownload

dokumen berupa pdf untuk disimpan ke penyimpanan internal mereka masing-

masing.

17. Halaman Data Kuis Pembina

Nama Halaman = Data Kuis Pembina



Gambar 4.19 Halaman Data Kuis Pembina

122

Pada gambar 4.19 menampilkan halaman utama dalam melakukan

pengelolaan kuis.

18. Halaman Edit Ketentuan Kuis

Nama Halaman = Edit Ketentuan Kuis



Gambar 4.20 Halaman Edit Ketentuan Kuis

Pada gambar 4.20 menampilkan form untuk mengubah ketentuan kuis

yang akan dilaksanakan oleh siswa, mulai dari mengatur waktu dan melakukan

buka tutup soal.

19. Halaman Kelola Soal Kuis

Nama Halaman = Kelola Soal Kuis



123

Gambar 4.21 Halaman Kelola Soal Kuis

Pada gambar 4.21 menampilkan daftar soal atau pertanyaan dan terdapat

juga fitur pencarian agar memudahkan dalam mencari pertanyaan.

20. Halaman Edit Soal Kuis

Nama Halaman = Edit Soal Kuis



Gambar 4.22 Halaman Edit Soal Kuis

124

Pada gambar 4.22 menampilkan bagaimana pertanyaan tersebut diubah

setelah memilih pertanyaan yang akan di ubah pada halaman Kelola soal kuis.

21. Halaman Lihat Hasil Pembina

Nama Halaman = Lihat Hasil Kuis Pembina



Gambar 4.23 Halaman Lihat Hasil Kuis Pembina

Pada gambar 4.23 memperlihatkan data hasil dari para siswa

mengerjakan kuis yang telah dilaksanakan, terdapat beberapa menu tampilan

berupa siapa saja yang gagal maupun siapa yang lulus.

22. Halaman Lihat Histori Hasil Pembina

Nama Halaman = Lihat Histori Hasil Pembina



125

Gambar 4.24 Halaman Histori Hasil Siswa

Pada gambar 4.24 menampilkan seluruh histori nilai yang pernah diikuti

oleh siswa saat kuis berlangsung maupun yang telah selesai.

23. Halaman Detail Hasil Pembina

Nama Halaman = Detail Hasil Pembina



Gambar 4.25 Halaman Detail Hasil Pembina

126

Pada gambar 4.25 menampilkan rincian jawaban dari nilai yang telah

dipilih oleh pembina.

24. Halaman Data Forum Pembina

Nama Halaman = Data Forum Pembina



Gambar 4.26 Halaman Data Forum Pembina

Pada gambar 4.26 menampilkan seluruh forum diskusi dimana semua

postingan – postingan dari pembina, pengajar dan siswa diperlihatkan dalam satu

halaman.

25. Halaman Postingan Selengkapnya Pembina

Nama Halaman = Postingan Selengkapnya Pembina



127

Gambar 4.27 Halaman Postingan Selengkapnya Pembina

Pada gambar 4.27 menampilkan percakapan dari salah satu postingan

yang telah dibuat dan dipilih untuk di komentari atau sekedar untuk melihatnya

saja.

26. Halaman Tulis Postingan Pembina

Nama Halaman = Tulis Postingan Pembina



128

Gambar 4.28 Halaman Tulis Postingan Pembina

Pada gambar 4.28 menampilkan form untuk membuat postingan baru

yang bisa dibuat oleh pembina.

4.1.3 Pengajar

Halaman ini digunakan untuk pengajar agar mempermudah dalam

memakai aplikasi.

1. Halaman Dashboard Pengajar

Nama Halaman = Dashboard Pengajar



Gambar 4.29 Halaman Dashboard Pengajar

Pada gambar 4.29 menampilkan tampilan awal setelah pengajar

melakukan login kedalam sistem, terdapat beberapa informasi mengenai hasil

ujian, jumlah siswa, materi dan judul posting.

2. Halaman Profil Pengajar

Nama Halaman = Profil Pengajar

129



Gambar 4.30 Halaman Profil Pengajar

Pada gambar 4.30 menampilkan informasi data diri pengajar yang masuk

ke sistem aplikasi.

3. Halaman Edit Profil Pengajar

Nama Halaman = Edit Profil Pengajar



Gambar 4.31 Halaman Edit Profil Pengajar

130

Pada gambar 4.31 menampilkan informasi data diri pengajar yang akan

diubah datanya sendiri oleh pengajar.

4. Halaman Semua Materi Pengajar

Nama Halaman = Semua Materi Pengajar

Flowchart = -


Gambar 4.32 Halaman Semua Materi Pengajar

Pada gambar 4.32 menampilkan seluruh data materi yang telah dibagikan

oleh semua pengajar serta pembina.

5. Halaman Data Materi Pengajar

Nama Halaman = Data Materi Pengajar



131

Gambar 4.33 Halaman Data Materi Pengajar

Pada gambar 4.33 menampilkan seluruh data materi yang telah dibagikan

oleh pengguna itu sendiri, sehingga data materi disini bisa diubah dan dihapus.

6. Halaman Tambah Materi Pengajar

Nama Halaman = Tambah Materi Pengajar



Gambar 4.34 Halaman Tambah Materi Pengajar

132

Pada gambar 4.34 menampilkan form untuk menambahkan materi

kedalam sistem oleh pengguna pengajar yang telah masuk ke dalam aplikasi.

7. Halaman Edit Materi Pengajar

Nama Halaman = Edit Materi Pengajar



Gambar 4.35 Halaman Edit Materi Pengajar

Pada gambar 4.35 menampilkan form untuk mengubah data materi yang

telah dipilih oleh pengguna pengajar di halaman data materi tadi.

8. Halaman Lihat Materi Pengajar

Nama Halaman = Lihat Materi Pengajar



133

Gambar 4.36 Halaman Lihat Materi Pengajar

Sama seperti halaman lihat materi pada pembina, di halaman lihat materi

disini (gambar 4.36) memperlihatkan hasil dari materi yang sudah dibagikan,

disini pengguna juga bisa mengunduh materi untuk disimpan ke media

penyimpanan internal mereka.

9. Halaman Data Kuis Pengajar

Nama Halaman = Data Kuis Pengajar



Gambar 4.37 Halaman Data Kuis Pengajar

134

Pada gambar 4.37 adalah halaman awal untuk melihat hasil siswa dalam

mengikuti latihan kuis, pada bagian atas terdapat informasi jumlah siswa yang

mengikuti ujian, dan dibagian bawah adalah informasi mengenai sifat ujian itu

sendiri.

10. Halaman Histori Hasil Pengajar

Nama Halaman = Histori Hasil Pengajar



Gambar 4.38 Halaman Histori Hasil Pengajar

Setelah halaman data kuis terbuka maka ketika pengguna membuka

histori hasil siswa yang berada di bagian atas halaman data kuis, maka pada

gambar 4.38 pengguna akan diperlihatkan halaman informasi siapa saja yang telah

mengikuti kuis dan hasilnya seperti apa sesuai dengan kelas yang diajar oleh

pengajar itu sendiri.

11. Halaman Detail Hasil Pengajar

Nama Halaman = Detail Hasil Pengajar



135

Gambar 4.39 Halaman Detail Hasil Siswa Pengajar

Pada gambar 4.39 menampilkan informasi rincian dari jawaban siswa

yang sebelumnya dipilih oleh pengajar.

12. Halaman Forum Diskusi Pengajar

Nama Halaman = Forum Diskusi Pengajar



Gambar 4.40 Halaman Forum Diskusi Pengajar

136

Pada gambar 4.40 memperlihatkan semua postingan yang telah dibuat

oleh pengajar, pembina dan siswa.

13. Halaman Postingan Saya Pengajar

Nama Halaman = Postingan Saya Pengajar



Gambar 4.41 Halaman Postingan Saya Pengajar


oleh pengguna pengajar yang masuk ke dalam aplikasi tersebut, sehingga

pengguna tersebut dapat menghapus atau melihat postingan tersebut.

14. Halaman Tulis Postingan Pengajar

Nama Halaman = Tulis Postingan Pengajar



137

Gambar 4.42 Halaman Tulis Postingan Pengajar

Pada gambar 4.42 memperlihatkan form untuk menulis postingan baru

atau membuka sesi diskusi yang baru untuk mendiskusikan suatu hal bersama

pembina, pengajar, dan siswa.

15. Halaman Postingan Selengkapnya Pengajar

Nama Halaman = Postingan Selengkapnya Pengajar



Gambar 4.43 Halaman Postingan Selengkapnya Pengajar

138

Pada gambar 4.43 memperlihatkan sebuah postingan yang telah dipilih

untuk mengikuti diskusi secara langsung, berkomentar atau hanya melihatnya

saja.

4.1.4 Siswa

Halaman ini digunakan untuk siswa agar mempermudah dalam memakai

aplikasi.

1. Halaman Dashboard Siswa

Nama Halaman = Dashboard Siswa



Gambar 4.44 Halaman Dashboard Siswa

Pada gambar 4.44 memperlihatkan sebuah halaman awal yang akan

ditampilkan ketika siswa sudah melakukan login kedalam aplikasi, terdapat

tombol akses langsung ke 3 fitur utama dalam aplikasi ini, dan juga diatas terdapat

informasi pengumuman.

2. Halaman Profil Siswa

139

Nama Halaman = Profil Siswa



Gambar 4.45 Halaman Profil Siswa

Pada gambar 4.45 memperlihatkan data diri lengkap dari siswa yang

telah masuk kedalam aplikasi ini.

3. Halaman Edit Profil Siswa

Nama Halaman = Edit Profil Siswa



140

Gambar 4.46 Halaman Edit Profil Siswa

Pada gambar 4.46 menampilkan form untuk mengubah informasi data

dari siswa tersebut, ada beberapa form yang memang tidak bisa diganti misalnya

no induk, dan juga agama, kelas, dan status siswa yang harus diubah oleh

pembina.

4. Halaman Data Materi Siswa

Nama Halaman = Data Materi Siswa



Gambar 4.47 Halaman Data Materi Siswa

Pada gambar 4.47 memperlihatkan semua data materi yang telah

dibagikan oleh pembina dan pengajar, terdapat judul materi dan gambar kecil

serta keterangan penulis yang terdapat dalam satu baris materi.

5. Halaman Data Materi Kategori Siswa

Nama Halaman = Data Materi Kategori Siswa


141


Gambar 4.48 Halaman Data Materi Kategori Siswa

Pada gambar 4.48 memperlihatkan seluruh kategori materi yang sudah

terkelompok untuk mempermudahkan siswa dalam mencari materi – materi

berdasarkan kategori materi.

6. Halaman Lihat Materi Siswa

Nama Halaman = Lihat Materi Siswa



142

Gambar 4.49 Halaman Lihat Materi Siswa

Pada gambar 4.49 memperlihatkan tampilan materi yang telah dipilih,

terdapat gambar materi, penjelasan materi, video materi, serta siswa juga dapat

mengunduh materi untuk disimpan ke penyimpanan internal mereka.

7. Halaman Ikut Kuis

Pada halaman ini digunakan sebelum siswa mengikuti atau mengerjakan

soal kuis, terdapat beberapa bagian pada halaman ini sesuai dengan kondisi siswa.

A. Halaman Kuis Ditutup

Nama Halaman = Kuis Ditutup


143


Gambar 4.50 Halaman Kuis Ditutup

Pada gambar 4.50 memperlihatkan dan menjelaskan bahwa kondisi saat

ini latihan kuis untuk pramuka belum dibuka, atau masih ditutup oleh pembina.

B. Halaman Kuis Dibuka

Nama Halaman = Kuis Dibuka



144

Gambar 4.51 Halaman Kuis Dibuka

Pada gambar 4.51 memperlihatkan kondisi dimana jika latihan kuis telah

dibuka oleh pembina dan siswa dapat melaksanakan ujian latihan kuis.

C. Jendela Pemberitahuan Pengerjaan Kuis

Nama Halaman = Jendela Pemberitahuan Pengerjaan Kuis



Gambar 4.52 Jendela Pemberitahuan Pengerjaan Kuis

145

Setelah tombol mulai dibuka, maka akan ditampilkan sebuah pop up atau

jendela kecil untuk memperlihatkan berapa waktu yang dibutuhkan siswa dalam

mengerjakan latihan kuis ini nantinya seperti gambar 4.52.

D. Halaman Kuis Selesai

Nama Halaman = Kuis Selesai



Gambar 4.53 Halaman Kuis Selesai

Pada gambar 4.53 memperlihatkan kondisi dimana ketika seorang siswa

telah melaksanakan latihan kuis dan mencoba untuk membuka menu ikut kuis,

maka secara otomatis siswa tidak dapat untuk melaksanakan ujian lagi sampai

pembina melakukan reset kembali.

8. Halaman Soal

Nama Halaman = Halaman Soal Pengerjaan



146

Gambar 4.54 Halaman Pengerjaan Soal

Pada gambar 4.54 memperlihatkan form pengerjaan soal latihan kuis

untuk para siswa, pada halaman ini tidak ada navigasi menu dan hanya

menampilkan soal dan waktu, pada halaman ini juga tidak dapat di reload

halaman, sehingga ketika siswa mereload halaman waktu akan tetap berjalan,

sehingga terhindar dari kecurangan waktu.

9. Halaman Hasil Kuis Siswa

Nama Halaman = Hasil Kuis Siswa



147

Gambar 4.55 Halaman Hasil Kuis Siswa

Pada gambar 4.55 memperlihatkan hasil kuis yang telah diikuti oleh

siswa, setelah pengerjaan soal selesai maka siswa dapat mengkoreksi kesalahan

mereka secara langsung melalui halaman ini.

10. Halaman Petunjuk

Nama Halaman = Petunjuk Kuis



148

Gambar 4.56 Halaman Petunjuk Kuis

Sebelum melaksanakan latihan kuis, pada gambar 4.56 siswa dapat

melihat petunjuk bagaimana cara pengisian atau ikut dalam mengerjakan latihan

kuis.

11. Halaman Lihat Nilai Saya Siswa

Nama Halaman = Lihat Nilai Saya



Gambar 4.57 Halaman Lihat Nilai Saya Siswa

149

Pada gambar 4.57 memperlihatkan seluruh nilai siswa yang telah

melaksanakan latihan kuis, siswa hanya dapat melihat hasil kuis mereka sendiri

dan tidak dapat melihat hasil kuis dari siswa lainnya.

12. Halaman Detail Hasil Siswa

Nama Halaman = Detail Hasil Siswa



Gambar 4.58 Halaman Detail Hasil Siswa

Pada halaman ini siswa dapat melihat detail rinci dari jawaban mereka

yang telah dikerjakan sebelumnya.

13. Halaman Semua Forum Siswa

Nama Halaman = Semua Forum Siswa



150

Gambar 4.59 Halaman Semua Forum Siswa


oleh semua pengajar, pembina, maupun semua siswa, terdapat pula pencarian post

untuk mempermudah mencari judul postingan yang ingin dicari sebelum

membuka sesi diskusi baru.

14. Halaman Postingan Saya Siswa

Nama Halaman = Postingan Saya Siswa



Gambar 4.60 Halaman Postingan Saya Siswa

151


oleh siswa yang bersangkutan di dalam aplikasi ini, dihalaman ini juga siswa

dapat menghapus atau hanya melihat postingan mereka sendiri.

15. Halaman Tulis Postingan Siswa

Nama Halaman = Tulis Postingan Siswa



Gambar 4.61 Halaman Tulis Postingan Siswa

Pada gambar 4.61 memperlihatkan form untuk menulis postingan baru

atau memulai diskusi baru yang dibuat oleh siswa yang masuk kedalam aplikasi.

16. Halaman Postingan Selengkapnya Siswa

Nama Halaman = Postingan Selengkapnya Siswa



152

Gambar 4.62 Halaman Postingan Selengkapnya Siswa

Pada gambar 4.62 memperlihatkan sebuah diskusi yang telah dipilih oleh

siswa tersebut, dan siswa tersebut dapat berkomentar, atau hanya melihat diskusi

tersebut.

17. Halaman Pengumuman

Nama Halaman = Pengumuman



153

Gambar 4.63 Halaman Pengumuman

Pada gambar 4.63 memperlihatkan pengumuman atau pemberitahuan

yang diberikan pembina kepada siswa.

4.2 Evaluasi Sistem

Pada tahap evaluasi sistem kegiatan yang diuji terhadap aplikasi

menggunakan Alpha testing dengan metode black box testing selenium. Metode

Black Box Testing merupakan pengujian program yang mengutamakan pengujian

terhadap kebutuhan fungsi dari suatu program. Tujuan dari metode Black Box

Testing ini adalah untuk menemukan kesalahan fungsi pada program. Pengujian

dengan metode Black Box Testing dilakukan dengan cara memberikan sejumlah

input pada program. Input tersebut kemudian diproses sesuai dengan kebutuhan

fungsionalnya untuk melihat apakah program aplikasi dapat menghasilkan output

yang sesuai dengan yang diinginkan dan sesuai pula dengan fungsi dasar dari

program tersebut. Apabila dari input yang diberikan proses dapat menghasilkan

output yang sesuai dengan kebutuhan fungsionalnya, maka program yang dibuat

sudah benar, tetapi apabila output yang dihasilkan tidak sesuai dengan kebutuhan

fungsionalnya, maka masih terdapat kesalahan pada program tersebut, dan

selanjutnya dilakukan penelusuran perbaikan untuk memperbaiki kesalahan yang

terjadi.

152

4.2.1 Uji Login

Tabel 4.1 Uji Login

No Nama

Pengujian Cara Pengujian Proses

Output

1 Login

sebagai

pembina

Pada uji coba ini pengguna memasukkan username dan password mereka.

Aplikasi mengecek level, username, dan password ke dalam database.

152

153

No Nama


Output

2 Login

sebagai

pengajar



3 Login

sebagai

siswa



153

154

4.2.2 Uji Sistem Sebagai Pembina

Tabel 4.2 Uji Coba Sistem Sebagai Pembina

No Nama Pengujian Cara Pengujian Proses

Output

1 Edit Profil Pada halaman ini pengguna dapat mengubah username, password, nama lengkap, alamat, agama, jenis kelamin dan foto.

Update data pada tabel pembina.

154

155

No Nama Pengujian Cara Pengujian Proses Output

2 Tambah

Data

Pengajar

Pada halaman ini pengguna memasukkan ID Pengajar, username, foto, password, agama, nama, jenis kelamin, dan alamat.

Data disimpan ke dalam tabel pengajar.

3 Edit Data

Pengajar

Pada halaman ini pengguna dapat mengubah username, foto, password, agama, nama, jenis kelamin, dan alamat, sedangkan ID Pengajar tidak bisa.

Data diupdate ke dalam tabel pengajar.

155

156


4 Menghapus

Data

Pengajar

Pengguna memilih data pengajar yang ingin dihapus dengan menekan tombol hapus pada tabel sebelah kanan.

Data pengajar pada tabel pengajar di database terhapus.

5 Tambah

Data Siswa

Pada halaman ini pengguna memasukkan nomor induk siswa, username, password, nama, jenis kelamin, agama, kelas, tingkatan pramuka, alamat, dan foto.

Data siswa ditambahkan kedalam tabel siswa di database.

156

157


6 Edit Data

Siswa

Pada halaman ini pengguna mengubah username, password, nama, jenis kelamin, agama, kelas, tingkatan pramuka, alamat, dan foto.

Data diupdate ke dalam tabel siswa.

7 Hapus

Data Siswa

Pengguna memilih data siswa yang ingin dihapus dengan menekan tombol hapus pada tabel sebelah kanan.

Data siswa pada tabel siswa di database terhapus.

157

158


8 Tambah

Data

Kategori

Materi

Pada halaman ini pengguna memasukkan nama kategori materi.

Data kategori materi ditambahkan kedalam tabel kategori materi di database.

9 Edit Data

Kategori

Materi

Pada halaman ini pengguna mengubah nama kategori materi.

Data diupdate ke dalam tabel kategori materi.

10 Hapus

Data

Kategori

Materi

Pengguna memilih data kategori materi yang ingin dihapus dengan menekan tombol hapus pada tabel sebelah kanan.

Data kategori materi pada tabel kategori materi di database terhapus.

158

159


11 Tambah

Data

Materi

Pada halaman ini pengguna memasukkan kategori materi, judul materi, isi materi, gambar jpg, video mp4, dokumen pdf.

Data materi ditambahkan kedalam tabel materi di database.

160


12 Edit Data

Materi

Pada halaman ini pengguna mengubah nama judul materi, kategori, isi, gambar jpg, video mp4, dan dokumen pdf.

Data diupdate ke dalam tabel materi.

13 Hapus

Data

Materi

Pengguna memilih data materi yang ingin dihapus dengan menekan tombol hapus pada tabel sebelah kanan.

Data materi pada tabel materi di database terhapus.

159

161


14 Lihat Data

Materi

Pengguna memilih data materi yang ingin dilihat dengan menekan tombol preview pada tabel sebelah kanan.

Mengambil data dari tabel materi dan kategori materi.

15 Mengubah

Ketentuan

Kuis

Pada halaman ini pengguna mengubah lama waktu yang diberikan dan membuka atau menutup kuis.

Data ketentuan kuis di update ke dalam tabel soal di database.

16 Mengubah

Pertanyaan

Kuis

Pada halaman ini pengguna mengubah isi soal kuis, jawaban abcd, dan kunci jawaban.

Data pertanyaan kuis di update ke dalam tabel jawab di database.

160

162


17 Melihat

Hasil

Pengguna memilih pilihan untuk melihat hasil, semua, lulus, atau gagal.

Mengambil data dari tabel hasil di database.

18 Mengulang

i ujian

siswa

Pengguna memilih data siswa untuk mengulangi kuis pada tombol restart paling kanan.

Data pada tabel hasil di update.

161

163


19 Melihat

Semua

Forum

Pengguna memilih data forum pada menu di kiri halaman.

Mengambil data dari tabel posting di database.

20 Melihat

Diskusi

Pengguna memilih postingan yang ingin dilihat diskusinya.

Menampilkan data pada tabel posting dan komen di database sesuai postingan yang dipilih.

21 Berkoment

ar Di

Diskusi

Pengguna mengisi komentar pada diskusi. Data komentar ditambahkan ke tabel komen.

162

164


22 Membuat

Postingan

Baru

Pengguna memasukkan kategori materi, judul postingan, isi postingan, dan gambar.

Data postingan ditambah ke tabel posting.

165


23 Menghapus

Postingan

Pengguna memilih postingan yang ingin dihapus di bagian bawah.

Data postingan dihapus dari tabel posting pada database.

24 Menghapu

s

Komentar

Pengguna memilih icon ‘X’ pada komentar di sebuah diskusi.

Data komentar dihapus dari tabel komen pada database.

4.3.3 Uji Sistem Sebagai Pengajar

Tabel 4.3 Uji Sistem Sebagai Pengajar

No Nama


Output

163

166

No Nama


Output

1 Edit Profil Pada halaman ini pengguna dapat mengubah username, password, nama lengkap, alamat, agama, jenis kelamin dan foto.

Update data pada tabel pengajar.

2 Tambah

Data Materi

Pada halaman ini pengguna memasukkan kategori materi, judul materi, isi materi, gambar jpg, video mp4, dokumen pdf.

Data materi ditambahkan kedalam tabel materi di database.

167

No Nama


Output

3 Edit Data

Materi

Pada halaman ini pengguna mengubah nama judul materi, kategori, isi, gambar jpg, video mp4, dan dokumen pdf.

Data diupdate ke dalam tabel materi.

4 Hapus Data

Materi

Pengguna memilih data materi yang ingin dihapus dengan menekan tombol hapus pada tabel sebelah kanan.

Data materi pada tabel materi di database terhapus.

5 Lihat Data

Materi

Pengguna memilih data materi yang ingin dilihat dengan menekan tombol preview pada tabel sebelah kanan.


165

168

No Nama


Output

6 Melihat

Hasil

Pengguna memilih pilihan histori untuk membuka histori siswa


7 Melihat

Semua

Forum

Pengguna memilih data forum pada menu di kiri halaman.


Setelah pengguna memilih data forum, maka akan ditampilkan semua postingan.

166

169

No Nama


Output

20 Melihat

Diskusi



21 Berkomenta

r Di Diskusi

Pengguna mengisi komentar pada diskusi.

Data komentar ditambahkan ke tabel komen.

22 Membuat

Postingan

Baru



167

170

No Nama


Output

23 Menghapus

Postingan



24 Menghapus

Komentar



168

171

4.3.4 Uji Sistem Sebagai Siswa

Tabel 4.4 Uji Sistem Sebagai Siswa

No Nama Pengujian

Cara Pengujian Proses Output

1 Edit Profil Pada halaman ini pengguna dapat mengubah username, password, nama lengkap, alamat, jenis kelamin dan foto.

Update data pada tabel siswa.

2 Lihat Data

Materi

Pengguna memilih data materi yang ingin dilihat dengan menekan materi yang ditampilkan.


169

172


3 Menyimpa

n

Dokumen

Materi

Pengguna membuka halaman materi dan memilih tombol download dibawah.

Mengambil data dari server untuk diunduh.

4 Mengerjak

an Kuis

Pengguna mengisi pertanyaan pada halaman mengerjakan latihan kuis dan menekan tombol selesai, atau jika waktu habis.

Data hasil dari pengerjaan soal ditambahkan ke tabel hasil pada database.

170

173


6 Melihat

Nilai Saya

Pengguna memilih kuis latihan pada menu sebelah kiri, dan memilih lihat nilai saya.


7 Melihat

Semua

Forum

Pengguna memilih forum diskusi pada menu di kiri halaman, dan memilih semua forum.


8 Melihat

Diskusi



171

174


21 Berkoment

ar Di

Diskusi

Pengguna mengisi komentar pada diskusi.

Data komentar ditambahkan ke tabel komen.

22 Membuat

Postingan

Baru



172

175


23 Menghapus

Postingan



24 Menghapus

Komentar



173

174

4.3 Analisis Hasil Uji Coba

Berdasarkan hasil uji coba dan evaluasi sitem maka disini dilakukan

analisa terhadap hasil uji coba dan evaluasi sistem. Hasil uji coba tadi kemudian

didapatkan hasil sebagai berikut:

1. Aplikasi mampu menyimpan data pembina, pengajar, siswa, materi, forum, dan

kuis.

2. Aplikasi dapat menampilkan informasi profil pengguna yang diambil dari

database.

3. Aplikasi dapat melakukan pendistribusian materi kepada siswa.

4. Aplikasi dapat menampilkan informasi berupa objek gambar dan video

didalam materi, juga dapat diunduh oleh pengguna.

5. Aplikasi dapat membuka atau menuntup kuis setelah ditentukan pembina.

6. Aplikasi dapat menampilkan pengerjaan soal kuis dengan waktu yang telah

ditentukan pembina sebelumnya.

7. Aplikasi dapat menampilkan informasi hasil evaluasi kuis setiap siswa telah

melakukan pengerjaan kuis.

8. Aplikasi dapat menjadi wadah untuk membantu komunikasi antara pembina,

pengajar, dan siswa lewat fitur forum diskusi dimana pengguna dapat membuat

posting dan juga berkomentar pada postingan tersebut.

4.4 Hubungan Aplikasi E-Learning Pramuka Dengan SCORM

Pada poin ini akan dijelaskan bagaimana Aplikasi E-Learning Pramuka

Pada SMPN 1 Kesamben Jombang dapat dikatakan sebuah website e-learning

dengan menggunakan standar dari SCORM setelah melakukan uji coba sistem.

175

A. Learning Management System (LMS)

LMS berguna untuk mengirim, melacak, melaporkan dan mengelola isi

pembelajaran, mengetahui kemajuan siswa dan interaksi siswa dengan materi

pembelajaran. Terdapat 7 buah layanan didalam LMS antara lain :

1. Learning Profile Service

Didalam aplikasi ini terdapat data pengguna yang dapat mengoperasikan

aplikasi ini diantaranya pembina pada gambar 4.4, pengajar pada gambar 4.30,

dan siswa pada gambar 4.45.

2. Course Administravie Service

Didalam aplikasi ini pembina dan pengajar dapat melakukan pengaturan

baik berupa menambah, menghapus, maupun mengubah materi dan dibagikan

kepada siswa nantinya, Course Administravie Service pada aplikasi ini dapat

dilihat pada gambar 4.12 s/d gambar 4.18, dan gambar 4.32 s/d gambar 4.36.

3. Assessment Service

Didalam aplikasi ini pembina dapat melakukan pengelolaan latihan kuis

(gambar 4.19), menentukan sifat dari kuis yang akan dibuka (gambar 4.20),

menghapus atau mengubah soal (gambar 4.21 dan 4.22), serta mengelola hasil

latihan kuis (gambar 4.23), dan pelaksanaannya dapat dilakukan siswa pada

gambar 4.50 s/d gambar 4.55.

4. Sequencing Service

Didalam aplikasi ini terdapat materi yang memiliki teks materi, gambar,

dan video yang dapat dilihat oleh siswa (gambar 4.47 s/d gambar 4.49), serta

untuk kuis sendiri terbagi dari 3 tingkatan yang berbeda sesuai dengan tingkatan

pramuka siswa (gambar 4.19 dan gambar 4.20).

176

5. Delivery Service

Didalam aplikasi ini materi yang sudah ditambahkan oleh pembina dan

pengajar (gambar 4.15 dan gambar 4.33) akan secara langsung terbagi oleh siswa,

dan siswa dapat mengaksesnya langsung (gambar 4.47), bahkan dapat

menyimpannya kedalam media penyimpanan internal mereka (gambar 4.49).

6. Tracking Service

Didalam aplikasi ini pembina mampu melihat seluruh nilai siswa

(gambar 4.23 s/d gambar 4.25), lalu pengajar mampu melihat nilai siswa yang

sesuai dengan tingkat yang diajar oleh pengajar itu sendiri (gambar 4.38 dan

gambar 4.39), dan siswa dapat melihat nilainya sendiri (gambar 4.57 dan gambar

4.58).

7. Content Management Service

Didalam aplikasi ini yang dapat mengelola materi dan latihan kuis hanya

pembina (gambar 4.12 s/d gambar 4.24), sedangkan untuk mengelola materi saja

hanya pengajar yang dapat melakukan (gambar 4.33 s/d gambar 4.35).

Adapun fitur dimana agar pembelajar dapat melakukan komunikasi dari

jarak jauh dan mendiskusikan hal yang mereka ingin tahu, dengan fitur forum

diskusi, memungkinkan pembina, pengajar dan siswa dapat saling berkomunikasi

dalam beberapa diskusi sekaligus, sehingga pembelajaran diluar kelas tetap dapat

dilakukan walaupun dari jarak jauh. Adapun tampilan forum diskusi dari masing –

masing pengguna dapat dilihat pada gambar 4.26 s/d gambar 4.28 (pembina),

gambar 4.40 s/d gambar 4.43 (pengajar), gambar 4.59 s/d gambar 4.62 (siswa).

B. Asset

177

Aplikasi e-learning pramuka ini merupakan media pembelajaran dimana

semua materi yang dibagikan oleh pembina dan pengajar memberikan isi berupa

judul, teks isi, gambar (jpg, png, dan gif), video (mp4 dan 3gp), serta dokumen

(pdf dan doc) yang dapat diolah oleh pembina (gambar 4.12 s/d gambar 4.23) dan

pengajar (gambar 4.33 s/d gambar 4.36) sebelum ditampilkan atau dibagikan

kepada siswa (gambar 4.47 s/d gambar 4.49).

C. Sharable Content Objects (SCO)

Untuk meningkatkan pembelajaran pramuka ini, maka dari 7 buah

layanan yang ada di Learning Management System diatas serta fitur forum diskusi

dihubungkan dengan jaringan yang meluas seperti website agar semua pengguna

dapat mengakses e-learning pramuka ini dimana saja dan kapan saja, dan tentu

saja website yang dibuat harus sesuai dengan LMS untuk menunjang

pembelajaran.

D. Contect Organization

Pada aplikasi ini diberikan sebuah navigasi berupa menu yang selalu

terlihat dibagian kiri halaman untuk menunjukkan pengguna ingin ke halaman

apa, dan juga disetiap halaman akan diberikan navigasi berupa tombol button

yang fungsinya disesuaikan dengan kebutuhan yang ada di halaman tersebut,

sehingga pengguna tidak akan tersesat ketika membuka aplikasi e-learning

pramuka ini.

Lalu didalam SCORM terdapat tiga kriteria utama yaitu. Pertama, aplikasi

ini mampu menghubungkan menu yang ada didalam aplikasi dengan navigasi

disebelah kiri untuk memudahkan pengguna dalam mengakses aplikasi. Kedua,

aplikasi ini sangat mudah digunakan oleh pengguna termasuk siswa karena

178

tampilan yang tidak terlalu banyak warna, dan pemilihan penulisan yang mudah

dimengerti oleh pengguna. Ketiga, aplikasi ini memudahkan siswa dalam

mendalami materi pramuka, karena yang akan membagikan materi sendiri adalah

pembina dan pengajar, sehingga materi yang mereka terima pasti akan diajarkan

didalam praktikum pramuka.

Lalu terdapat pula empat tujuan SCORM yang harus dimiliki oleh sebuah

aplikasi e-learning diantaranya :

1. Reusable

Sebagai aplikasi pembelajaran, materi yang telah dibagikan sudah

seharusnya dapat terus digunakan oleh siswa, membuka materi yang sebelumnya

pernah dibuka kapan saja.

2. Interoperable

Aplikasi ini dapat dioperasikan menggunakan web browser seperti

(Chrome, Ms Edge, Firefox, UC, dll), sehingga membuat pengguna merasa

mudah dalam membuka aplikasi ini.

3. Durable

Materi yang telah dibagikan akan disimpan didalam database sekolah

sehingga akan bertahan lama dan sewaktu – waktu dapat dibuka kembali.

4. Accessible

Dengan adanya sistem online maka pengguna dapat membuka aplikasi

ini dimana saja dan kapan saja.

Dengan memeriksa standar SCORM dengan aplikasi e-learning pramuka

ini dapat dilihat bahwa persentase 80% aplikasi ini sudah memenuhi kriteria dari

e-learning standar SCORM, lalu untuk 20% nya didapat dari tidak sesuainya

179

aplikasi dalam menghubungkan aplikasi ke internet karena pada saat diuji coba,

aplikasi di pasang menggunakan jaringan lokal sekolah saja, lalu seorang pengajar

masih belum bisa membuat latihan kuis untuk siswa karena peraturan yang hanya

memperbolehkan pembina saja yang berhak membuat latihan kuis yang terdapat

pada Lampiran 3 – Peran dan Tanggung Jawab Organisasi, padahal menurut

standar SCORM pengajar atau guru dapat membuat latihan soal untuk siswanya.

180

BAB V

PENUTUP

5.1 Kesimpulan

Setelah melakukan uji coba terhadap Aplikasi E-Learning Pramuka Pada

SMPN 1 Kesamben Jombang dengan metode blackbox maka dapat disimpulkan

kalau aplikasi ini dapat menjalankan fungsinya sesuai dengan kebutuhan sekolah

SMPN 1 Kesamben Jombang dan rancangan yang telah dibuat telah menghasilkan

forum diskusi antara pembina, pengajar, dan siswa, lalu pembina dan pengajar

mampu memberikan materi dimana berisikan objek berupa gambar (jpg, png, dan

gif), video (mp4 dan 3gp), dan dokumen (pdf dan doc) sebagai referensi

pembelajaran untuk siswa, siswa dapat mengerjakan latihan kuis yang telah dibuat

oleh pembina, serta pembina, pengajar, dan siswa dapat menampilkan hasilnya,

dan berdasarkan model SCORM, dapat diambil kesimpulan bahwa aplikasi ini

80% sesuai dengan standar yang telah digunakan oleh model SCORM, sehingga

aplikasi ini dapat membantu ekstrakurikuler pramuka SMPN 1 Kesamben

Jombang sebagai tambahan dalam melaksanakan proses pembelajaran untuk siswa

dan siswi.

5.2 Saran

Berdasarkan rancang bangun aplikasi yang telah dibuat, saran yang dapat

diberikan oleh penulis kepada pengembangan terkait aplikasi e-learning yaitu :

1. Aplikasi dapat mencakup semua tingkat pramuka baik siaga, penggalang,

dan pendega.

180

181

2. Aplikasi diberikan fitur notifikasi secara langsung agar pengguna dapat

melihat pemberitahuan langsung.

3. Aplikasi dapat dikembangkan tidak hanya pada ekstrakurikuler pramuka

saja, namun pada ekstrakurikuler yang lainnya.

4. Aplikasi mampu menghasilkan informasi berupa absensi maupun nilai

kepramukaan yang nantinya dapat dilihat oleh orang tua wali secara

langsung.

182

DAFTAR PUSTAKA

Arief. (2011). Pemrograman Web Dinamis Menggunakan PHP dan MySQL.

Yogyakarta: Andi Offset.

Aunurrahman. (2010). Belajar dan Pembelajaran. Bandung: Alfabeta.

Casella, G., Costagliola, G., Ferrucci, F., Polese, G., & Scanniello, G. (2008). A

SCROM Thin Client Architecture for E-Learning Systems Based on Web

Services. International Journal of Distance Education Technologies,

Volume 5, Issue 1.

e-Community. (2011). Indeks Lengkap Syntax/eWolfCommunity. Yogyakarta:

MediaKom.

Heni, P. (2010). Membangun Website Interaktif dengan Adobe Creative Suite 5.

Yogyakarta: Scripta Media Creative.

Nasrudin, I. A. (2018). Buku Komplet Pramuka. Jakarta: Briliant.

Nurdyansyah, & Fahyuni, E. F. (2016). Inovasi Model Pembelajaran. Sidoarjo:

Nazamia Learning Center.

Pressman, P., & Roger, S. (2015). Rekayasa Perangkat Lunak. Yogyakarta: Andi.

Rusman. (2013). Model - Model Pembelajaran. Jakarta: Raja Grafindo Persada.

Sibero, P. (2011). Kitab Suci Web Programming. Yogyakarta: MediaKom.

Sutabri, T. (2012). Analisis Sistem Informasi. Yogyakarta: Andi Offset.

182

rancang bangun aplikasi e-learning pramuka berbasis …

Documents