Top Banner
PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK KARYA NUGRAHA BOYOLALI SKRIPSI Untuk memenuhi sebagai persyaratan Mencapai Derajat Sarjana S-1 Program Studi Teknik Informatika Disusun oleh : Aris Ahmad Anshori 1171101126 PROGRAM STUDI SISTEM INFORMASI FAKULTAS ILMU KOMPUTER UNIVERSITAS WIDYA DHARMA KLATEN 2016
30

PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

May 20, 2022

Download

Documents

dariahiddleston
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

i

PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB

DI SMK KARYA NUGRAHA BOYOLALI

SKRIPSI

Untuk memenuhi sebagai persyaratan

Mencapai Derajat Sarjana S-1

Program Studi Teknik Informatika

Disusun oleh :

Aris Ahmad Anshori

1171101126

PROGRAM STUDI SISTEM INFORMASI

FAKULTAS ILMU KOMPUTER

UNIVERSITAS WIDYA DHARMA KLATEN

2016

Page 2: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

ii

Page 3: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

iii

Page 4: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

iv

Page 5: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

v

MOTTO

Code is Poetry.

Kode adalah Puisi.

Design is not just what it looks like and fells like, Design is how it works.

Desain bukan hanya bagaimana itu terlihat dan terasa seperti apa, Desain adalah

bagaimana itu bekerja (cara kerjanya).

Technology is just a tool. In terms of getting the kids working together and

motivating them, the teacher is the most important.

Teknologi hanyalah alat. Dalam hal mendapatkan anak-anak bekerja sama dan

memotivasi mereka, guru adalah yang paling penting.

Page 6: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

vi

HALAMAN PERSEMBAHAN

Puji syukur kehadirat Allah SWT atas nikmat-Nya, kepersembahkan karya

tulis ini serta ucapan terima kasih kepada :

1. Kedua orang tuaku tercinta, Alm. Ibu Sumarti dan Bapak Sulanto yang

selalu memberikan doa, semangat dan kasih sayang yang tak terhingga

kepadaku.

2. Adikku Siti Farikha Annisa, terima kasih atas doa dan dukunganya,

semgoa aku bisa mendidik dan menjadi kakak yang terbaik untukmu.

3. Kakakku Ichsan Sulthoni yang selalu memberikan dukungan, semangat

dan motivasi.

4. keluarga tercinta, atas doa yang tidak pernah putus, dukungan yang tidak

pernah berhenti, baik secara moril dan materil, serta sebagai alasan bagi

peneliti unntuk tetap berjuang menyelesaikan pendidikan ini.

5. Teman-teman di Program Studi Teknik Informatika, khususnya TI A 2011

yang selalu memberikan motivasi, semangat dan kebersamaan selama

masa-masa perkuliahan.

6. Sahabat-sahabatku Anang Irawan, Anom Wibowo, Endah Yuliana, Imron

Mursidi, Indri Risqi, Irma Erviani, Ismail Sarjito, Miftahul Rachmawati,

Sri Rahayu, Suk Madi, Tulus Adi dan Yosep Ciptadi yang selalu

memberikan motivasi, doa dan semangat dalam penyusunan skripsi ini.

Page 7: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

vii

KATA PENGANTAR

Puji syukur peneliti panjatkan kepada Allah SWT yang telah melimpahkan

rahmat hidayah dan karunia-Nya, shalawat serta salam semoga selalu tercurah

kepada Rasullullah SAW, sehingga peneliti dapat menyelesainkan skripsi yang

berjudul “Pembangungan Aplikasi E-Learning Berbasis Web di SMK Karya

Nugraha Boyolali”.

Adapun tujuan dari penyusunan skripsi ini adalah untuk memenuhi salah

satu syarat dalam menyelesaikan studi jenjang strata satu (S1) di Program Studi

Teknik Informatika, Universitas Widya Dharma Klaten.

Peneliti membutuhkan peran serta dari pihak lain untuk proses

penyelesaian skripsi ini, karena keterbatasan ilmu dan pengetahuan peneliti. Oleh

karena itu ijinkanlah peneliti untuk menyampaikan ucapan terima kasih yang

sebesar-besarnya kepada :

1. Allah SWT, yang telah memberikan rahmat, hidayah, dan karunia-Nya

kepada peneliti sehingga dapat menyelesaikan skripsi ini.

2. Kedua orang tua beserta keluarga tercinta, atas doa yang tidak pernah

putus, dukungan yang tidak pernah berhenti, baik secara moril dan materil,

serta sebagai alasan bagi peneliti unntuk tetap berjuang menyelesaikan

pendidikan ini.

3. Bapak Prof. Dr. H. Triyono, M.pd selaku Rektor Universitas Widya

Dharma Klaten.

4. Bapak Drs. Sri Wiyanta, M.Kom selaku Dekan Fakultas Ilmu Komputer

Universitas Widya Dharma Klaten.

5. Bapak Fajar Budi Hartono selaku Ketua Proram Studi Teknik Informatika

Universitas Widya Dharma Klaten.

6. Bapak Drs. Mahmud Yusuf, M.Kom dan Ibu Aryati Wuryandari, S.T

selaku dosen pembimbing, terima kasih telah banyak meluangkan waktu

untuk memberikan bimbingan, saran dan nasehatnya selama penyusunan

skripsi ini.

Page 8: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

viii

7. Bapak Sarbiyanto selaku kepala sekolah SMK Karya Nugraha Boyolali

beserta para guru SMK Karya Nugraha Boyolali yang telah memberikan

kesempatan bagi peneliti dan membantu pelaksanaan penelitian Tugas

Akhir di SMK Karya Nugraha Boyolali.

8. Serta semua pihak yang telah turut membantu dalam penyusunan skripsi

ini, yang tidak bisa disebutkan satu persatu.

Peneliti menyadari bahwa masih banyak terdapat kesalahan dalam

penyusunan skripsi ini, oleh karena itu kritik dan saran yang membangun

sangat penulis harapkan guna untuk perbaikan di kemudian hari. Akhir

kata, semoga skripsi ini dapat bermanfaat dan menambah wawasan bagi

peneliti pada khususnya dan pembaca pada umumnya.

Boyolali, April 2016

Peneliti

Page 9: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

ix

DAFTAR ISI

HALAMAN JUDUL ..................................................................................... i

HALAMAN PERSETUJUAN ...................................................................... ii

SURAT PERNYATAAN .............................................................................. iii

HALAMAN PENGESAHAN ....................................................................... iv

MOTTO .......................................................................................................... v

HALAMAN PERSEMBAHAN .................................................................... vi

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

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

DAFTAR TABEL .......................................................................................... xv

DAFTAR GAMBAR ..................................................................................... xvii

ABSTRAK ...................................................................................................... xx

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

A. Latar Belakang Masalah ...................................................................... 1

1. Alasan Pemilihan Judul ................................................................. 2

2. Rumusan Masalah ......................................................................... 2

3. Maksud dan Tujuan ....................................................................... 2

4. Batasan Masalah ........................................................................... 3

5. Keaslian Penelitian ........................................................................ 4

6. Manfaat Penelitian ........................................................................ 4

B. Tujuan Penelitian ................................................................................. 6

BAB II TINJAUAN PUSTAKA DAN LANDASAN TEORI .................... 7

A. Tinjauan Pustaka ................................................................................. 7

1. Profil SMK Karya Nugraha Boyolali ........................................... 7

a. Visi dan Misi SMK Karya Nugraha Boyolali ........................ 8

b. Logo Sekolah ......................................................................... 9

2. Proses Pembelajaran di SMK Karya Nugraha Boyolali ............... 10

Page 10: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

x

3. Penelitian Pendukung .................................................................... 12

B. Landasan Teori .................................................................................... 14

1. Pengenalan Sistem Informasi ........................................................ 14

2. Siklus Hidup Pengembangan Sistem ............................................ 20

3. Perancangan Model ....................................................................... 23

a. Diagram Konteks (Context Diagram) .................................... 23

b. Data Flow Diagram (DFD) ................................................... 24

4. Basis Data ..................................................................................... 25

a. Perancangan Basis Data ......................................................... 26

b. Entity Relationship Diagram (ERD) ...................................... 27

c. Normalisasi ............................................................................. 28

5. E-Learning .................................................................................... 32

a. Tipe E-Learning ..................................................................... 32

b. Keuntungan E-Learning ......................................................... 33

c. Keterbatasan E-Learning ........................................................ 34

d. Konsep E-Learning ................................................................ 36

e. Komponen E-Learning ........................................................... 36

6. Pemrograman Web ........................................................................ 37

a. Client-Side Scripting .............................................................. 37

b. Server-Side Scripting ............................................................. 39

c. Hypertext Markup Language (HTML) ................................... 40

d. Hypetext Preprocessor (PHP) ............................................... 42

e. Cascading Style Sheet (CSS) .................................................. 45

f. JavaScript ............................................................................... 48

g. Web Hosting ........................................................................... 50

h. Domain ................................................................................... 51

i. MySQL .................................................................................... 55

j. CodeIgniter ............................................................................. 58

Page 11: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xi

BAB III METODOLOGI PENELITIAN ................................................... 62

A. Bahan dan Materi Penelitian ............................................................... 62

B. Alat Penelitian ..................................................................................... 63

1. Perangkat Keras (Hardware) ........................................................ 63

2. Perangkat Lunak (Software) .......................................................... 64

C. Jalan Penelitian .................................................................................... 65

1. Pengumpulan Data ........................................................................ 65

2. Perancangan Desain Sistem .......................................................... 67

a. Diagram Konteks .................................................................... 67

b. Data Flow Diagram (DFD) ................................................... 68

3. Perancangan Basis Data (Database) ............................................. 71

a. Perancangan Database Konseptual ........................................ 72

1) Normalisasi ..................................................................... 72

a) Entitas Awal ............................................................ 72

b) Bentuk Normal Pertama .......................................... 73

c) Bentuk Normal Kedua ............................................. 74

d) Bentuk Normal Ketiga ............................................. 75

2) Entity Relationship Diagram (ERD) ............................... 77

b. Perancangan Database Logik ................................................. 78

1) Struktur Tabel Pengajar .................................................. 78

2) Struktur Tabel Siswa ....................................................... 79

3) Struktur Tabel Login ....................................................... 79

4) Struktur Tabel Kelas ....................................................... 80

5) Struktur Tabel Kelas Siswa ............................................ 81

6) Struktur Tabel Mata Pelajaran ........................................ 81

7) Struktur Tabel Jadwal Mata Pelajaran ............................ 82

8) Struktur Tabel Mata Pelajaran Kelas .............................. 83

9) Struktur Tabel Materi ..................................................... 83

Page 12: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xii

10) Struktur Tabel Materi Kelas ......................................... 84

11) Struktur Tabel Tugas .................................................... 85

12) Struktur Tabel Tugas Kelas .......................................... 86

13) Struktur Tabel Tugas Pertanyaan .................................. 86

14) Struktur Tabel Tugas Pilihan Ganda ............................ 87

15) Struktur Tabel Nilai Tugas ........................................... 88

16) Struktur Tabel Pesan ..................................................... 88

17) Struktur Tabel Pengumuman ........................................ 89

18) Struktur Tabel Komentar Materi .................................. 90

19) Struktur Tabel Pengaturan ............................................ 90

20) Struktur Tabel Field Tambahan .................................... 91

c. Perancangan Database Fisik ................................................... 92

1) Relasi Antar Tabel .......................................................... 92

2) Integritas Referensial ...................................................... 93

4. Struktur Menu ............................................................................... 99

5. Desain Antarmuka ......................................................................... 102

a. Desain Antarmuka Halaman Beranda dan Login User .......... 102

b. Desain Antarmuka Halaman Admin ...................................... 103

c. Desain Antarmuka Halaman Pengajar ................................... 104

d. Desain Antarmuka Halaman Siswa ....................................... 105

e. Desain Antarmuka Halaman Manajemen Pengajar ............... 106

f. Desain Antarmuka Halaman Manajemen Siswa .................... 106

g. Desain Antarmuka Halaman Manajemen Kelas .................... 107

h. Desain Antarmuka Halaman Manajemen Mata Pelajaran ..... 107

i. Desain Antarmuka Halaman Manajemen Mata Pelajaran Kelas ......

..................................................................................................... 108

j. Desain Antarmuka Halaman Manajemen Materi ................... 109

k. Desain Antarmuka Halaman Manajemen Tugas ................... 109

Page 13: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xiii

l. Desain Antarmuka Halaman Manajemen Jadwal Pelajaran ... 110

D. Hambatan Dalam Penelitian ................................................................ 111

BAB IV HASIL PENELITIAN DAN PEMBAHASAN ............................. 112

A. Hasil Penelitian .................................................................................... 112

1. Proses Login User ......................................................................... 112

2. Halaman Register/Pendaftaran ...................................................... 115

3. Halaman Manajemen Guru/Pengajar ............................................ 117

4. Halaman Manajemen Siswa .......................................................... 119

5. Halaman Manajemen Kelas .......................................................... 120

6. Halaman Manajemen Mata Pelajaran ........................................... 122

7. Halaman Manajemen Mata Pelajaran Kelas ................................. 124

8. Halaman Manajemen Materi Guru/Pengajar ................................ 126

9. Halaman Manajemen Tugas Guru/Pengajar ................................. 128

10. Halaman Filter Siswa .................................................................. 131

11. Pembuatan Website PHP Dengan Perintah Session .................... 134

12. Mengubah Status Aktif Profil Pengajar dan Siswa oleh Admin . 135

13. Menguji Validasi Data Yang Diinputkan ................................... 136

14. Proses Input Materi Oleh Pengajar ............................................. 137

15. Proses Input Tugas Oleh Pengajar .............................................. 140

16. Proses Input Soal Tugas Pilihan Ganda ...................................... 143

17. Proses Input Jadwal Mengajar .................................................... 146

18. Proses Koreksi Tugas Siswa ....................................................... 147

19. Halaman Jadwal Mata Pelajaran Siswa ...................................... 149

20. Halaman Detail Materi Siswa ..................................................... 151

21. Halaman Detail Tugas Siswa ...................................................... 153

22. Proses Pengerjaan Tugas Siswa .................................................. 155

23. Proses Lihat Nilai dan Cetak Laporan Nilai Siswa ..................... 158

B. Pembahasan ......................................................................................... 161

Page 14: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xiv

BAB V PENUTUP ......................................................................................... 163

A. Kesimpulan .......................................................................................... 163

B. Saran .................................................................................................... 164

DAFTAR PUSTAKA

LAMPIRAN

Page 15: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xv

DAFTAR TABEL

Tabel 2.1 Simbol-simbol Diagram Konteks .................................................... 23

Tabel 2.2 Simbol-simbol DFD ........................................................................ 25

Tabel 2.3 Simbol-simbol ERD ........................................................................ 27

Tabel 2.4 Struktur dasar script HTML ............................................................ 41

Tabel 2.5 Struktur dasar script PHP ................................................................ 44

Tabel 2.6 Contoh Sintaks CSS ........................................................................ 45

Tabel 2.7 Contoh JavaScript ........................................................................... 49

Tabel 2.8 Daftar Top Level Domain ................................................................ 52

Tabel 2.9 Country Top Level Domain ............................................................. 54

Tabel 2.10 Local Domain Indonesia ............................................................... 54

Tabel 2.11 Contoh CodeIgniter ....................................................................... 60

Tabel 3.1 Struktur Tabel Pengajar ................................................................... 78

Tabel 3.2 Struktur Tabel Siswa ....................................................................... 79

Tabel 3.3 Struktur Tabel Login ....................................................................... 80

Tabel 3.4 Struktur Tabel Kelas ....................................................................... 80

Tabel 3.5 Struktur Tabel Kelas Siswa ............................................................. 81

Tabel 3.6 Struktur Tabel Mata Pelajaran ........................................................ 82

Tabel 3.7 Struktur Tabel Jadwal Mata Pelajaran ............................................ 82

Tabel 3.8 Struktur Tabel Mata Pelajaran Kelas .............................................. 83

Tabel 3.9 Struktur Tabel Materi ...................................................................... 84

Tabel 3.10 Struktur Tabel Materi Kelas .......................................................... 84

Tabel 3.11 Struktur Tabel Tugas ..................................................................... 85

Tabel 3.12 Struktur Tabel Tugas Kelas ........................................................... 86

Tabel 3.13 Struktur Tabel Tugas Pertanyaan .................................................. 86

Tabel 3.14 Struktur Tabel Tugas Pilihan Ganda ............................................. 87

Tabel 3.15 Struktur Tabel Nilai Tugas ............................................................ 88

Page 16: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xvi

Tabel 3.16 Struktur Tabel Pesan ..................................................................... 89

Tabel 3.17 Struktur Tabel Pengumuman ......................................................... 89

Tabel 3.18 Struktur Tabel Komentar ............................................................... 90

Tabel 3.19 Struktur Tabel Pengaturan ............................................................. 91

Tabel 3.20 Struktur Tabel Field Tambahan .................................................... 91

Page 17: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xvii

DAFTAR GAMBAR

Gambar 2.1 Logo SMK Karya Nugraha Boyolai ............................................ 9

Gambar 2.2 Siklus Hidup Pengembangan Sistem ........................................... 21

Gambar 2.3 Cara kerja Client-side Scripting .................................................. 38

Gambar 2.4 Cara kerja Server-side Scripting .................................................. 39

Gambar 2.5 Cara kerja database MySQL Server pada PHP MyAdmin .......... 56

Gambar 2.6 Cara kerja Model-View Controller CodeIgniter .......................... 59

Gambar 3.1 Diagram Konteks ......................................................................... 68

Gambar 3.2 DFD Level 1 ................................................................................ 69

Gambar 3.3 DFD Level 2 Proses 1 ................................................................. 70

Gambar 3.4 DFD Level 2 Proses 2 ................................................................. 71

Gambar 3.5 Entitas Awal ................................................................................ 73

Gambar 3.6 Normalisasi Bentuk Pertama ....................................................... 74

Gambar 3.7 Normalisasi Bentuk Kedua .......................................................... 75

Gambar 3.8 Normalisasi Bentuk Ketiga ......................................................... 76

Gambar 3.9 Entity Relationship Diagram (ERD) ........................................... 77

Gambar 3.10 Relasi Tabel ............................................................................... 93

Gambar 3.11 Integritas Referensial tabel login dengan tabel pengajar, tabel login

dengan tabel siswa ........................................................................................... 94

Gambar 3.12 Integritas Referensial tabel kelas_siswa dengan tabel kelas, tabel

kelas_siswa dengan tabel siswa ....................................................................... 94

Gambar 3.13 Integritas Referensial tabel mapel_ajar dengan tabel mapel_kelas,

tabel mapel_ajar dengan tabel pengajar .......................................................... 95

Gambar 3.14 Integritas Referensial tabel mapel_kelas dengan tabel kelas, tabel

mapel_kelas dengan tabel mapel ..................................................................... 95

Gambar 3.15 Integritas Referensial tabel materi dengan tabel mapel, tabel materi

dengan tabel pengajar, tabel materi dengan tabel siswa .................................. 96

Gambar 3.16 Integritas Referensial tabel materi_kelas dengan tabel kelas, tabel

materi_kelas dengan tabel materi .................................................................... 96

Page 18: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xviii

Gambar 3.17 Integritas Referensial tabel tugas dengan tabel mapel, tabel tugas

dengan tabel pengajar ...................................................................................... 96

Gambar 3.18 Integritas Referensial tabel tugas_kelas dengan tabel kelas, tabel

tugas_kelas dengan tabel tugas ....................................................................... 97

Gambar 3.19 Integritas Referensial tabel tugas_pertanyaan dengan tabel tugas

.......................................................................................................................... 97

Gambar 3.20 Integritas Referensial tabel pilihan dengan tabel tugas_pertanyaan

.......................................................................................................................... 97

Gambar 3.21 Integritas Referensial tabel nilai_tugas dengan tabel siswa, tabel

nilai_tugas dengan tabel tugas ......................................................................... 98

Gambar 3.22 Integritas Referensial tabel pengumuman dengan tabel pengajar

.......................................................................................................................... 98

Gambar 3.23 Integritas Referensial tabel komentar dengan tabel login, tabel

komentar dengan tabel materi ......................................................................... 98

Gambar 3.24 Struktur Menu Admin ............................................................... 99

Gambar 3.25 Struktur Menu Pengajar ............................................................. 100

Gambar 3.26 Struktur Menu Siswa ................................................................. 101

Gambar 3.27 Desain Antarmuka Halaman Beranda dan Login User ............. 102

Gambar 3.28 Desain Antarmuka Halaman Admin ......................................... 103

Gambar 3.29 Desain Antarmuka Halaman Pengajar ...................................... 104

Gambar 3.30 Desain Antarmuka Halaman Siswa ........................................... 105

Gambar 3.31 Desain Antarmuka Halaman Manajemen Pengajar ................... 106

Gambar 3.32 Desain Antarmuka Halaman Manajemen Siswa ....................... 106

Gambar 3.33 Desain Antarmuka Halaman Manajemen Kelas ....................... 107

Gambar 3.34 Desain Antarmuka Halaman Manajemen Mata Pelajaran ........ 107

Gambar 3.35 Desain Antarmuka Halaman Manajemen Mata Pelajaran Kelas

.......................................................................................................................... 108

Gambar 3.36 Desain Antarmuka Halaman Manajemen Materi ...................... 109

Gambar 3.37 Desain Antarmuka Halaman Manajemen Tugas ....................... 109

Page 19: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xix

Gambar 3.38 Desain Antarmuka Halaman Manajemen Jadwal Mengajar ..... 110

Gambar 4.1 Halaman Beranda dan Login ....................................................... 113

Gambar 4.2 Form Pendaftaran User E-Learning ............................................ 115

Gambar 4.3 Halaman Manajemen Pengajar .................................................... 118

Gambar 4.4 Halaman Manajemen Siswa ........................................................ 119

Gambar 4.5 Halaman Manajemen Kelas ......................................................... 121

Gambar 4.6 Halaman Manajemen Mata Pelajaran .......................................... 123

Gambar 4.7 Halaman Manajemen Mata Pelajaran Kelas ............................... 125

Gambar 4.8 Halaman Manajemen Materi Pengajar ........................................ 127

Gambar 4.9 Halaman Manajemen Tugas Pengajar ......................................... 129

Gambar 4.10 Halaman Filter Siswa ................................................................ 132

Gambar 4.11 Halaman Ubah Status Aktif Siswa ............................................ 135

Gambar 4.12 Uji Validasi Input Data .............................................................. 137

Gambar 4.13 Form Input Materi Oleh Pengajar ............................................. 138

Gambar 4.14 Form Input Tugas Oleh Pengajar .............................................. 141

Gambar 4.15 Form Input Soal Tugas Pilihan Ganda ...................................... 144

Gambar 4.16 Form Input Jadwal Mengajar .................................................... 145

Gambar 4.17 Halaman Koreksi Tugas ............................................................ 147

Gambar 4.18 Halaman Jadwal Mata Pelajaran ............................................... 150

Gambar 4.19 Halaman Detail Materi Essay .................................................... 151

Gambar 4.20 Halaman Detail Materi Download ............................................ 151

Gambar 4.21 Halaman Detail Tugas Siswa .................................................... 153

Gambar 4.22 Halaman Pengerjaan Tugas Pilihan Ganda ............................... 155

Gambar 4.23 Halaman Pengerjaan Tugas Essay ............................................. 156

Gambar 4.24 Halaman Pengerjaan Tugas Upload .......................................... 156

Gambar 4.25 Halaman Koreksi dan Cetak Nilai Tugas Siswa ....................... 158

Gambar 4.26 Halaman Cetak Laporan Nilai Siswa ........................................ 159

Gambar 4.27 Laporan Nilai Siswa Dalam Bentuk File Excel (.xls) ............... 159

Page 20: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

xx

ABSTRAK

ARIS AHMAD ANSHORI. 2016. PEMBANGUNAN APLIKASI E-

LEARNING BERBASIS WEB DI SMK KARYA NUGRAHA BOYOLALI.

Program SI Teknik Informatika Fakultas Ilmu Komputer Universitas Widya Dharma Klaten.

Selama ini semua proses pembelajaran di SMK Karya Nugraha Boyolali masih bersifat konvensional, dengan kata lain bahwa proses belajar mengajar antar siswa dengan guru hanya dapat dilakukan dengan syarat terjadinya

pertemuan antara siswa dengan guru di dalam kelas. Jika pertemuan antara siswa dengan guru tidak terjadi atau guru yang bersangkutan tidak hadir dan waktu

pembelajaran yang dibatasi pihak sekolah, maka secara otomatis proses pembelajaran pun akan terhambat. Berbagai konsep dan teknik baru dalam pengajaran telah banyak dikembangkan untuk menggantikan metode tradisional

yang hanya mengandalkan pada metode pengajaran satu arah di kelas. Salah satu metode pengajaran yang sedang berkembang saat ini adalah e-learning. E-

learning dapat membantu para pengajar dalam mendistribusikan bahan ajar mereka tanpa harus berada di kelas dengan menggunakan media internet, hal ini dapat memaksimalkan waktu pembelajaran di kelas yang terbatas.

Pengembangan sistem informasi dalam pembuatan perangkat lunak

menggunakan metode Waterfall. Metode pengumpulan data yang digunakan dalam penelitian ini adalah wawancara, observasi dan studi pustaka. Untuk

merancang aplikasi ini digunakan metode perancangan struktural yaitu pembuatan Entity Relationship (ER) dan pembuatan Data Flow Diagram (DFD) untuk merancang dan mendokumentasikan sistem perangkat lunak berdasarkan aliran

data. Dalam pembuatan perangkat lunak ini menggunakan PHP sebagai bahasa script yang digunakan untuk membuat halaman website dan MySQL sebagai

database tempat penyimpanan data.

Dengan adanya e-learning ini dapat membantu proses belajar mengajar agar lebih optimal. Memudahkan para guru untuk dapat mendistribusikan materi pelajaran untuk siswa siswi di SMK Karya Nugraha Boyolali dan juga siswa siswi

dapat dengan mudah mendapat materi pelajaran. Website e-learning ini dapat dijadikan sebagai media diskusi tambahan untuk membahas materi pelajaran yang

belum tuntas serta dapat mengerjakan soal-soal ujian/ tugas berupa pilihan ganda dan mengumpulkan tugas-tugas yang di berikan oleh guru.

Kata kunci: SMK Karya Nugraha Boyolali, e-learning, media pembelajaran

online, website pendidikan, website edukasi, PHP, MySQL

Page 21: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

1

BAB I

PENDAHULUAN

A. Latar Belakang Masalah

Perkembangan teknologi informasi dan komunikasi yang sangat

pesat mendorong berbagai lembaga pendidikan khususnya SMK Karya

Nugraha Boyolali memanfaatkan sistem e-learning untuk meningkatkan

efektivitas dan fleksibilitas pembelajaran. Selama ini semua proses

pembelajaran di SMK Karya Nugraha Boyolali masih bersifat

konvensional, dengan kata lain bahwa proses belajar mengajar antara siswa

dengan guru hanya dapat dilakukan melalui pertemuan antara siswa

dengan guru di dalam kelas.

Jika pertemuan antara siswa dengan guru tidak terjadi atau guru

yang bersangkutan tidak hadir dan waktu pembelajaran yang dibatasi pihak

sekolah, maka secara otomatis proses pembelajaran pun akan terhambat.

Selain itu proses transfer ilmu pengetahuan sepenuhnya dilakukan di dalam

kelas. Keadaan seperti ini dapat menghambat proses pembelajaran maupun

pendistribusian materi antara siswa dengan guru di SMK Karya Nugraha

Boyolali, yang dapat berakibat berkurangnya pemahaman siswa terhadap

suatu materi pelajaran.

Terbatasnya waktu belajar mengajar dikelas terkadang menghalangi

para guru dalam memberikan semua materi pelajaran kepada siswanya. Hal

ini menjadi masalah tersendiri untuk siswa dan guru yang ingin

1

Page 22: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

2

menyampaikan secara detil tentang mata pelajaran tersebut. Kesulitan ini

banyak dikeluhkan para siswa dan guru saat ini karena terkadang materi

yang butuh pembahasan dalam waktu lama justru harus dijelaskan dalam

waktu singkat.

Dalam tercapainya kesuksesan dalam belajar, proses komunikasi

antara para guru dan siswa sangat dibutuhkan maka perlu dibuat suatu

aplikasi e-learning berbasis web yang dapat diakses kapan saja dan dimana

saja sehingga mendukung proses pendidikan di SMK Karya Nugraha

Boyolali.

Berdasarkan latar belakang yang telah dipaparkan sebelumnya,

maka peneliti bermaksud mengambil topik tugas akhir ini dengan judul

“PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI

SMK KARYA NUGRAHA BOYOLALI”.

1. Alasan Pemilihan Judul

Di dalam penelitian ini peneliti mengambil judul

“PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI

SMK KARYA NUGRAHA BOYOLALI” dikarenakan pada SMK

Karya Nugraha Boyolali belum terdapat aplikasi e-learning berbasis

web.

2. Rumusan Masalah

Berdasarkan latar belakang permasalahan yang ada di SMK

Karya Nugraha Boyolali tersebut dapat ditarik kesimpulan bahwa

Page 23: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

3

permasalahan yang dihadapi yaitu bagaimana membangun aplikasi

pembelajaran e-learning untuk SMK Karya Nugraha Boyolali.

3. Maksud dan Tujuan

Berdasarkan masalah yang diteliti, maka maksud dari penulisan

penelitian ini adalah untuk mengaplikasikan perancangan sistem

pembelajaran aplikasi e-learning. Adapun tujuan yang ingin dicapai

dalam penelitian ini adalah:

a. Memudahkan siswa untuk mendapatkan materi tambahan serta

mempermudah guru untuk memberikan pembelajaran tambahan

disamping kegiatan belajar dikelas.

b. Mempermudah komunikasi tanya jawab bisa dilakukan oleh guru

kepada siswa, begitu juga sebaliknya.

c. Mempermudah guru menyampaikan latihan soal jika guru yang

bersangkutan berhalangan hadir dikelas.

d. Memudahkan guru untuk mengevaluasi metode pembelajaran yang

digunakan dengan cara melihat grafik nilai siswa hingga nilai yang

siswa capai melebihi KKM yang ditentukan.

4. Batasan Masalah

Dari rumusan masalah yang ada agar hasilnya lebih optimal dan

tepat sasaran maka permasalahan yang ada di batasi pada

pembangunan aplikasi e-learning berbasis web di SMK Karya Nugraha

Boyolali yang terdiri dari:

Page 24: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

4

a. Pengaturan hak akses kepada setiap user

b. Sistem mengelola data-data yang bersangkutan dengan

pembelajaran yang ada di lingkungan SMK Karya Nugraha seperti

materi.

c. Siswa tidak bisa mengikuti tugas/ ujian yang ada dialam aplikasi

diluar sekolah.

d. Fasilitas tambahan di aplikasi e-learning ini adalah materi pelajaran

yang diberikan bisa berupa modul yang berbentuk teks seperti doc,

pdf, xls, dan ppt, gambar yang bisa di download, serta dapat

memberikan pelayanan tugas/ ujian dengan soal dan jawaban bisa

berupa teks dan gambar.

e. Cara pandang pembuatan perangkat lunak yang digunakan adalah

terstruktur, dengan Entity Relational Diagram (ERD) sebagai

model data dan Data Flow Diagram (DFD) untuk model

fungsionalnya.

5. Keaslian Penelitian

Dalam melakukan penelitian ini peneliti belum pernah

menjumpai penelitian yang sama, sehingga peneliti mengambil tema

Pembangunan Aplikasi e-learning Berbasis Web di SMK Karya

Nugraha Boyolali.

6. Manfaat Penelitian

Penelitian ini mempunyai beberapa manfaat baik bagi peneliti

sendiri maupun bagi sekolah dan universitas, yaitu:

Page 25: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

5

a. Bagi Peneliti

1. Sebagai prasyarat untuk mencapai derajat sarjana dan

menerapkan disiplin ilmu yang telah diperoleh di bangku

kuliah.

2. Untuk menambah wawasan secara nyata dari apa yang telah

diteliti di lapangan khususnya tentang pemrograman web di

internet.

3. Mengembangkan kemampuan secara nyata dari apa yang telah

diteliti di lapangan khususnya untuk pembangunan dan

perancangan pemrograman berbasis web dan analisis sistem.

b. Bagi Pihak Universitas Widya Dharma

Menambah literatur perpustakaan dan bahan pertimbangan yang

berhubungan dengan tugas akhir khususnya pada Fakultas Ilmu

Komputer yang diharapkan bisa sebagai referensi dan acuan bagi

mahasiswa.

c. Bagi pihak SMK Karya Nugraha Boyolali

1. Memfasilitasi, mempermudah serta bagaimana mengoptimalkan

proses belajar mengajar didalam kelas, yang dapat dilakukan

didalam aplikasi e-learning berbasis web ini.

2. Sebagai bahan pertimbangan bagi SMK Karya Nugraha

Boyolali untuk memfasilitasi dan mengoptimalkan proses

belajar mengajar.

Page 26: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

6

B. Tujuan Penelitian

Adapun tujuan penelitian yang dilakukan di SMK KARYA

NUGRAHA Boyolali ini adalah:

1. Peneliti dapat mengaplikasikan ilmu yang diperoleh selama kuliah di

Universitas Widya Dharma Klaten dengan membuat aplikasi

pembelajaran berbasis web di SMK KARYA NUGRAHA Boyolali

dalam hal ini yaitu e-learning berbasis web.

2. Memfasilitasi, mempermudah dan mengoptimalkan proses belajar

mengajar di SMK Karya Nugraha Boyolali melalui website e-learning.

Page 27: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

163

BAB V

KESIMPULAN DAN SARAN

Pada bab ini peneliti akan menyampaikan kesimpulan dan saran yang

dapat digunakan sebagai bahan masukan dan pertimbangan untuk

mengembangkan dan menyempurnakan aplikasi e-learning berbasis web ini

agar menjadi lebih sempurna dan lebih baik.

A. Kesimpulan

Dari penelitian yang telah dilakukan di SMK Karya Nugraha

Boyolali, maka dapat diperoleh kesimpulan sebagai berikut :

1. Aplikasi e-learning ini memudahkan siswa untuk mendapatkan materi

tambahan serta mempermudah guru untuk memberikan pembelajaran

tambahan disamping kegiatan belajar dikelas.

2. Aplikasi e-learning ini mempermudah komunikasi tanya jawab, bisa

dilakukan oleh guru kepada siswa, begitu juga sebaliknya.

3. Aplikasi e-learning ini mempermudah guru menyampaikan latihan

soal jika guru yang bersangkutan berhalangan hadir dikelas.

4. Aplikasi e-learning ini memudahkan guru untuk mengevaluasi metode

pembelajaran yang digunakan dengan cara melihat grafik nilai siswa

hingga nilai yang siswa capai melebihi KKM yang ditentukan.

163

Page 28: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

164

B. Saran

Untuk pengembangan aplikasi e-learning berbasis web ini, ada

beberapa saran yang dapat dilakukan untuk pengembangan aplikasi

selanjutnya, yaitu :

1. Menambahkan fitur video chat agar lebih maksimal dalam membantu

proses belajar mengajar.

2. Membuat kuesioner secara online untuk menilai kinerja dan

pembelajaran yang guru berikan.

Page 29: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

DAFTAR PUSTAKA

Bayu Samodra. (2013). Perancangan Aplikasi E-Learning pada SMA Muhammadiyah 1 Klaten. Universitas Widya Dharma. Klaten

Dea Diki Hamdan. (2012). Pembangunan Aplikasi E-Learning di SMA BPI 1 Bandung. Universitas Komputer Indonesia. Bandung

Effendi, E., & Zhuang, H. (2005). E-Learning Konsep dan Aplikasi. Yogyakarta:

Andi Offset.

Abdul Kadir. (2008). Dasar Pemrograman Web Dinamis Menggunakan PHP.

Yogyakarta: Penerbit Andi. Betha Sidik. (2012). Framework CodeIgniter. Bandung: INFORMATIKA.

Fathansyah. (2004). Sistem Basis Data. Bandung: INFORMATIKA.

Febrian, J. (2005). Menggunakan Internet ; Menjalankan berbagai aktivitas

internet melalui : PC, Notebook, Handphone, dan PDA. Bandung:

Penerbit Informatika.

Jogiyanto, H. (2001). Analisis dan Desain Sistem Informatika. Yogyakarta: Penerbit Andi.

Komputer, W. (2011). Mastering CMS Programming with PHP & MySQL. Yogyakarta: Penerbit ANDI.

Madcoms. (2005). Aplikasi Manajemen Database Pendidikan Berbasis Web

dengan PHP dan MySQL. Yogyakarta: ANDI OFFSET.

Madcoms. (2010). Kupas Tuntas Adobe Dreamweaver CS5 dengan Pemrograman

PHP & MySQL. Yogyakarta: ANDI OFFSET. Nugroho, B. (2008). Aplikasi E-Learning dengan PHP & Editor Dreamweaver.

Yogyakarta: Atmajaya.

Prasetyo, D. D. (2003). Administrasi Database Server MySQL. Jakarta: Elex Media Komputindo.

Sanjaya, R., & Leong, M. (2008). Mudah Membangun Web E-Learning. Yogyakarta: Atmajaya.

Sidik, B. (2004). Pemrograman Web dengan PHP. Bandung: INFORMATIKA.

Simarmata, J. (2007). Perancangan Basis Data. Yogyakarta: ANDI OFFSET.

Page 30: PEMBANGUNAN APLIKASI E-LEARNING BERBASIS WEB DI SMK …

Susanti, E., & Sholeh, M. (2008). Rancang Bangun Aplikasi E-Learning. Jurnal

Teknologi , 1, 53-57. https://id.wikibooks.org/wiki/Pemrograman_CSS/Pengantar

http://www.cksholic.com/2014/07/pengertian-javascript-dan-contoh.html

http://ft.unsur.ac.id/akademik/unduh/dokumen8.pdf.html

http://dul.web.id/bootstrap/3/tuts-tips/belajar-bootstrap-untuk-pemula.php