Ta 2

RANCANG BANGUN APLIKASI E-COURSE INTERAKTIF
BERBASISKAN WEBSITE MENGGUNAKAN LARAVEL PADA

YAYASAN KAMPUS AMERTA BAKTI
TUGAS AKHIR
Oleh:
PUTU BAGUS WILLIE YUDHA MAHESWARA (160030219)
INSTITUT TEKNOLOGI DAN BISNIS

(ITB) STIKOM BALI
2020
.
DIAJUKAN SEBAGAI SALAH SATU SYARAT UNTUK MENCAPAI
GELAR SARJANA PROGRAM STUDI S1-SISTEM INFORMASI
Oleh:
INSTITUT TEKNOLOGI DAN BISNIS

(ITB) STIKOM BALI
2020
.
PENGESAHAN TUGAS AKHIR

Oleh:
Dosen Pembimbing Tanda Tangan Tanggal
I Gusti Ngurah Ady Kusuma, S.Kom., M.Kom ……………….. ………….
Agus Purwanto, S.S., M.Kom ……………….. ………….
Denpasar, ………………..
Mengetahui,
Ketua Program Studi Sistem Informasi
Ricky Aurelius Nurtanto Diaz, S.Kom., MT
i
HALAMAN INI SENGAJA DIKOSONGKAN
ii
PERNYATAAN KEASLIAN
Saya yang bertanda tangan dibawah ini:
NIM : 160030219
Nama : PUTU BAGUS WILLIE YUDHA MAHESWARA
Jenjang Studi : Strata Satu (S1)
Program Studi : Sistem Informasi
Tempat, Tgl. Lahir : DENPASAR, 19 Juni 1998
Alamat : Jl. Tukad Citarum F1 No.81, Br/link Tengah,
Desa Renon, Kecamatan Denpasar Selatan
NIK : 5171011906980011
Menyatakan bahwa dalam Tugas Akhir ini tidak terdapat karya yang pernah diajukan
untuk memperoleh Sarjana Komputer (S. Kom) di suatu Perguruan Tinggi, dan
sepanjang pengetahuan saya tidak terdapat karya atau pendapat yang pernah ditulis
atau diterbitkan oleh orang lain, kecuali yang secara tertulis diacu dalam naskah ini
dan disebutkan dalam Daftar Pustaka.
Denpasar, ………………………..
(Putu Bagus Willie Yudha

Maheswara)
iii
iv
ABSTRAK
Yayasan Kampus Amerta Bakti merupakan lembaga yang bergerak di bidang
pendidikan atau kursus. Dalam menjalankan kegiatan bisnisnya Yayasan ini masih
menggunakan metode konvesional atau manual dalam menyampaikan kursus,
sehingga biaya operasional di Yayasan tersebut dirasakan masih cukup mahal
terhitung atas biaya tempat dan tenaga pengajar. Berdasarkan hal tersebut penulis
merancang dan membangun sebuah aplikasi yang mampu menjembatani jarak dan
tempat dalam menjalankan kursus dan forum untuk berdiskusi pada Yayasan Kampus
Amerta Bakti, yang diharapkan mampu meningkatkan dan mempermudah proses
operasional kursus dan juga membantu proses komunikasi jika ada kesulitan saat
mengikuti kursus atau ada hal yang ingin di tanyakan mengenai kursus yaitu forum
diskusi. Untuk membantu dalam pembangunan aplikasi digunakan alat bantu
perancangan antara lain Data Flow Diagram (DFD), Entity Relationship Diagram
(ERD) dan Konseptual Diagram. Aplikasi E-Course Interaktif Pada Yayasan Kampus
Amerta Bakti ini Menggunakan Framework Laravel sebagai kerangka kerja utama
programnya. Pengujian pada sistem ini menggunakan Teknik Black Box Testing dan
dalam pengujiannya telah menghasilkan fungsi sistem yang sesuai dengan yang
diharapkan dalam perancangan sistem sebelumnya.
Kata kunci: Aplikasi E-Course Interaktif, Aplikasi, Yayasan Kampus Amerta Bakti,
Framework Laravel.
v
vi
ABSTRACT
The Amerta Bakti Campus Foundation is an institution engaged in education
or courses. In carrying out its business activities, the Foundation still uses conventional
or manual methods in delivering courses, so operational costs at the Foundation are
still quite expensive, calculated from the cost of the place and the teaching staff. Based
on this the authors designed and built an application that is able to bridge the distance
and place in running courses and forums to discuss at the Amerta Bakti Campus
Foundation, which is expected to be able to improve and simplify the course of
operational courses and also help the communication process if there are difficulties
when attending courses or there the thing to ask about the course is the discussion
forum. To assist in application development, design tools are used including Data Flow
Diagrams (DFD), Entity Relationship Diagrams (ERD) and Conceptual Diagrams.
Interactive E-Course Application at the Amerta Bakti Campus Foundation Uses the
Laravel Framework as the main framework of the program. Testing on this system
uses the Black Box Testing Technique and in its testing has resulted in system
functions that are as expected in the previous system design.
Keywords: Interactive E-Course Application, Application, Amerta Bakti Campus

Foundation, Laravel Framework.
vii
Halaman sengaja dikosongkan
viii
KATA PENGANTAR
Berkat Rahmat Tuhan Yang Maha Esa, penulis dapat menyelesaikan Tugas
Akhir yang berjudul “RANCANG BANGUN APLIKASI E-COURSE INTERAKTIF
BERBASISKAN WEBSITE MENGGUNAKAN LARAVEL PADA YAYASAN
KAMPUS AMERTA BAKTI” sesuai dengan waktu yang telah direncanakan.
Selanjutnya penulis mengucapkan Terima Kasih kepada:
1. Rektor ITB STIKOM Bali Bapak Dr. Dadang Hermawan.

2. Bapak Dr. Muhammad Rusli., MT dan Ibu Ni Luh Putri Srinadi, SE., MM.Kom
selaku Wakil Rektor.
3. Bapak Dian Pramana, S.Kom., M.Kom selaku Dekan Fakultas Informatika dan
Komputer ITB STIKOM Bali.
4. Bapak Ricky Aurelius Nurtanto Diaz, S.Kom., M.T selaku Ketua Program Studi
Sistem Informasi ITB STIKOM Bali.
5. Bapak I Gusti Ngurah Ady Kusuma, S.Kom., M.Kom selaku Dosen
Pembimbing Utama yang telah membimbing penulis selama melaksanakan
Tugas Akhir.
6. Bapak Agus Purwanto, S.S., M.Kom selaku Dosen Pembimbing Pendamping
yang juga turut membimbing penulis selama melaksanakan Tugas Akhir.
7. Semua teman dan berbagai pihak yang memberikan dukungan dan bantuan
kepada penulis.
Semoga hasil penulisan Tugas Akhir ini bermanfaat bagi pihak yang
berkepentingan.
Denpasar,
Penulis
ix
Halaman sengaja dikosongkan
x
DAFTAR ISI
Halaman
PERSETUJUAN SEMINAR DAN SIDANG TUGAS AKHIR.......................... i

PERNYATAAN KEASLIAN ........................................................................... iii
ABSTRAK ..................................................................................................... v
ABSTRACT .................................................................................................. vii
KATA PENGANTAR ..................................................................................... ix
DAFTAR ISI .................................................................................................. xi
DAFTAR TABEL ........................................................................................... xiii
DAFTAR GAMBAR ....................................................................................... xv
BAB I PENDAHULUAN................................................................................. 1
1.1 Latar Belakang............................................................................... 1
1.2 Rumusan Masalah ......................................................................... 2
1.3 Tujuan Perekayasaan .................................................................... 2
1.4 Manfaat Perekeyasaan .................................................................. 2
1.5 Ruang Lingkup Perekayasaan ....................................................... 3
1.6 Sistematika Penulisan.................................................................... 5
BAB II TINJAUAN PUSTAKA........................................................................ 7
2.1 State Of The Art ............................................................................. 7
2.2 Sistem Informasi ............................................................................ 9
2.3 E-Course ....................................................................................... 10
2.4 Forum Diskusi ................................................................................ 10
2.5 Website Interaktif ........................................................................... 10
2.6 Apache Web Server ....................................................................... 10
2.7 MariaDB......................................................................................... 11
2.8 Framework Laravel ........................................................................ 12
2.9 Visual Studio Code ........................................................................ 13
2.10 Data Flow Diagram(DFD)............................................................. 13
2.11 Entity Relationship Diagram(ERD) ............................................... 15
2.12 Blackbox Testing ......................................................................... 16
BAB III METODE PENELITIAN..................................................................... 19
3.1 Requirement Definition .................................................................. 19
3.2 System and Software Design ......................................................... 20
3.3 Implementation and Unit Testing.................................................... 20
xi
3.4 Integration and System Testing..................................................... 20
3.5 Operation and Maintenance ........................................................... 21
BAB IV HASIL DAN PEMBAHASAN ............................................................. 23
4.1 Hasil Analisis Sistem...................................................................... 23
4.2 Perancangan Sistem...................................................................... 27
4.3 Perancangan Basis Data ............................................................... 37
4.4 Perancangan Antarmuka ............................................................... 47
4.4.1 Desain Antarmuka ................................................................ 47
4.5 Implementasi Sistem...................................................................... 60
4.5.1 Implementasi Halaman User ................................................. 60
4.5.2 Implementasi Halaman Admin .............................................. 66
4.5.3 Implementasi Halaman Super Admin .................................... 70
4.6 Pengujian Sistem ........................................................................... 73
4.6.1 Pengujian Pada Halaman User ............................................. 73
4.6.2 Pengujian Pada Halaman Admin........................................... 84
4.6.3 Pengujian Pada Halaman Admin........................................... 86
DAFTAR PUSTAKA ...................................................................................... 25
xii
DAFTAR TABEL
Halaman
2.1 Rangkuman State Of The Art .................................................................. 8

2.2 Perbandingan Keunggulan Framework ................................................... 13
2.3 DFD Notasi Yourdon/DeMarco dan Notasi Gane/Sarson ........................ 14
2.4 Simbol Entity Relationship Diagram (ERD) Crow’s Foot.......................... 15
2.5 Kardinalitas ............................................................................................. 16
4.1 Analisis User ........................................................................................... 23
4.2 Analisis Proses ....................................................................................... 24
4.3 Analisis Data ........................................................................................... 25
4.4 Atribut Masing-Masing Entitas................................................................. 38
4.5 Struktur Tabel users................................................................................ 41
4.6 Struktur Tabel categories ........................................................................ 41
4.7 Struktur Tabel channels .......................................................................... 41
4.8 Struktur Tabel course_packages............................................................. 42
4.9 Struktur Tabel discussions ...................................................................... 42
4.10 Struktur Tabel migrations ...................................................................... 43
4.11 Struktur Tabel payment_logs ................................................................ 43
4.12 Struktur Tabel played_videos ................................................................ 43
4.13 Struktur Tabel quizzes .......................................................................... 44
4.14 Struktur Tabel replies ............................................................................ 44
4.15 Struktur Tabel report_discussions ......................................................... 44
4.16 Struktur Tabel report_videos ................................................................. 45
4.17 Struktur Tabel tasks .............................................................................. 45
4.18 Struktur Tabel totalviews ....................................................................... 45
4.19 Struktur Tabel upvotes .......................................................................... 46
4.20 Struktur Tabel users_courses ............................................................... 46
4.21 Struktur Tabel user_quizzes.................................................................. 47
4.22 Struktur Tabel videos ............................................................................ 47
4.23 Hasil Pengujian Halaman Login User .................................................... 73
4.24 Hasil Pengujian Halaman Daftar User ................................................... 74
4.25 Hasil Pengujian Halaman Home ........................................................... 74
xiii
4.26 Hasil Pengujian Halaman Buat Topik Baru............................................ 76
4.27 Hasil Pengujian Halaman Profile Saya .................................................. 77
4.28 Hasil Pengujian Halaman Edit Profile Saya ........................................... 77
4.29 Hasil Pengujian Halaman Semua Kursus .............................................. 78
4.30 Hasil Pengujian Halaman Detail Kursus ................................................ 78
4.31 Hasil Pengujian Halaman Kursus Saya ................................................. 79
4.32 Hasil Pengujian Halaman List Video Kursus ........................................ 79
4.33 Hasil Pengujian Halaman Tonton Video Kursus ................................... 80
4.34 Hasil Pengujian Halaman Report Video ................................................ 81
4.35 Hasil Pengujian Halaman Report Diskusi .............................................. 82
4.36 Hasil Pengujian Halaman Kumpul Tugas Kursus .................................. 83
4.37 Hasil Pengujian Halaman Kumpul Tugas Akhir Kursus ......................... 84
4.38 Hasil Pengujian Menu Sidebar Admin ................................................... 84
4.39 Hasil Pengujian Menu Sidebar Super Admin......................................... 86
xiv
DAFTAR GAMBAR
Halaman
3.1 Metode Waterfall ..................................................................................... 19

4.1 Diagram Konteks .................................................................................... 27
4.2 DFD (Data Flow Diagram) Level 0 .......................................................... 29
4.3 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Anggota ............. 30
4.4 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Video ................. 30
4.5 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Diskusi ............... 31
4.6 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Kursus ............... 31
4.7 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Kategori ............. 32
4.8 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Chanel ............... 32
4.9 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Kursus .... 33
4.10 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Pembayaran
Kursus .......................................................................................................... 34
4.11 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Akhir
Kursus ......................................................................................................... 34
4.12 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Report Diskusi . 35
4.13 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Admin .............. 35
4.14 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Report Video.... 36
4.15 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Paket Kursus ... 36
4.16 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Kursus .. 37
4.17 Entity Relationship Diagram (ERD) ....................................................... 38
4.18 Basis Data Konseptual .......................................................................... 40
4.19 Rancangan Antarmuka Halaman Login................................................. 48
4.20 Rancangan Antarmuka Halaman Daftar................................................ 49
4.21 Rancangan Antarmuka Halaman Home ................................................ 49
4.22 Rancangan Antarmuka Halaman Buat Topik Baru ................................ 50
4.23 Rancangan Antarmuka Halaman Tampil Diskusi .................................. 50
4.24 Rancangan Antarmuka Halaman Profile Saya ...................................... 51
4.25 Rancangan Antarmuka Halaman Semua Kursus .................................. 51
4.26 Rancangan Antarmuka Halaman Kursus Saya ..................................... 52
4.27 Rancangan Antarmuka Halaman Detail Kursus Saya .......................... 52
xv
4.28 Rancangan Antarmuka Halaman Putar Video ....................................... 53
4.29 Rancangan Antarmuka Halaman Admin Dashboard ............................ 53
4.30 Rancangan Antarmuka Halaman Admin Report Diskusi ..................... 54
4.31 Rancangan Antarmuka Halaman Admin Report Video ........................ 54
4.32 Rancangan Antarmuka Halaman Admin Video ................................... 55
4.33 Rancangan Antarmuka Halaman Admin Anggota ................................ 55
4.34 Rancangan Antarmuka Halaman Admin Pembayaran Kursus ............. 56
4.35 Rancangan Antarmuka Halaman Admin Tugas Kursus........................ 56
4.36 Rancangan Antarmuka Halaman Admin Tugas Akhir Kursus............... 57
4.37 Rancangan Antarmuka Halaman Super Admin Dashboard ................... 57
4.38 Rancangan Antarmuka Halaman Super Admin Laporan Pembelian ..... 58
4.39 Rancangan Antarmuka Halaman Super Admin Daftar Admin ............... 58
4.40 Rancangan Antarmuka Halaman Super Admin Daftar Chanel .............. 59
4.41 Rancangan Antarmuka Halaman Super Admin Daftar Kategori ............ 59
4.42 Rancangan Antarmuka Halaman Super Admin Daftar Paket Kursus .... 60
4.43 Halaman Login ...................................................................................... 61
4.44 Halaman Daftar..................................................................................... 61
4.45 Halaman Home ..................................................................................... 62
4.46 Halaman Buat Topik Baru ..................................................................... 62
4.47 Halaman Tampil Topik Diskusi .............................................................. 63
4.48 Halaman Tampil Topik Diskusi .............................................................. 63
4.49 Halaman Semua Kursus ....................................................................... 64
4.50 Halaman Kursus Saya .......................................................................... 64
4.51 Halaman Detail Kursus Saya ............................................................... 65
4.52 Halaman Putar Video ........................................................................... 65
4.53 Halaman Admin Dashboard ................................................................. 66
4.54 Halaman Admin Report Diskusi ............................................................ 66
4.55 Halaman Admin Report Video ............................................................... 67
4.56 Halaman Admin Video .......................................................................... 67
4.57 Halaman Admin Daftar Anggota............................................................ 68
4.58 Halaman Admin Daftar Pembayaran .................................................... 68
4.59 Halaman Admin Daftar Pembayaran ..................................................... 69
xvi
4.60 Halaman Tugas Akhir Kursus................................................................ 69
4.61 Halaman Super Admin Dashboard ........................................................ 70
4.62 Halaman Super Admin Laporan Pembelian .......................................... 70
4.63 Halaman Super Admin Laporan Pembelian .......................................... 71
4.64 Halaman Super Admin Daftar Chanel ................................................... 71
4.65 Halaman Super Admin Daftar Chanel ................................................... 72
4.66 Halaman Super Admin Daftar Paket Kursus ......................................... 72
xvii
BAB I
PENDAHULUAN
1.1 Latar Belakang

Kursus secara umum adalah belajar sesuatu pengetahuan atau
keterampilan dalam waktu yang relatif singkat. Kursus merupakan salah satu
pendidikan yang diberikan di luar sekolah resmi (non-formal) untuk
mengembangkan kemampuan dan keterampilan diri. Tujuan mengikuti kursus
adalah sebagai bekal pengetahuan, keterampilan, kecakapan hidup,
pengembangan diri, pengembangan profesi, modal kerja, usaha mandiri atau
untuk melanjutkan pendidikan ke jenjang yang lebih tinggi. Alasan mengikuti
kursus adalah keterbatasan waktu belajar, tidak ada kesempatan lagi untuk
mengikuti pendidikan formal, faktor biaya belajar, lebih terfokus dengan apa yang
akan dipelajari, meningkatkan ketrampilan yang telah dimiliki. Yayasan Kampus
Amerta Bakti dalam menjalankan kegiatan bisnisnya masih menggunakan metode
konvesional atau manual dalam menyampaikan kursus, sehingga biaya
operasional di Yayasan tersebut dirasakan masih cukup mahal terhitung atas
biaya tempat dan tenaga pengajar, maka Yayasan mencari trobosan baru yang
mampu menjembatani jarak dan tempat antara pengajar atau siswa dalam
menjalankan kursus dan memiliki wadah untuk berdiskusi secara online seperti
forum.
Media pembelajaran online secara umum ada dua yaitu e-learning dan e-
course, perbedaan e-learning dan e-course pada dasarnya adalah alat atau
sistem pendidikan berbasis komputer yang memungkinkan untuk belajar dimana
saja dan kapan saja, namun e-learning adalah suatu pembelajaran yang dilakukan
secara elektronik dengan menggunakan media berbasis komputer serta sebuah
jaringan yang memiliki cakupan luas dalam pembelajarannya [1], Sedangkan e-
course adalah sebuah program belajar untuk meningkatkan keterampilan yang
dilakukan secara online dan menggunakan perangkat digital yang lebih terfokus
dengan keterampilan tertentu [2], berdasarkan hal tersebut e-course lebih
menarik. Berdasarkan uraian tersebut maka penulis mengusulkan untuk
dibangunnya aplikasi e-course yang menyediakan fitur forum untuk berdiskusi.
Sehingga segala informasi mengenai diskusi bisa tersampaikan secara cepat.
1
2
Dengan adanya aplikasi e-course interaktif pada Yayasan Kampus Amerta Bakti
diharapkan dapat meningkatkan dan mempermudah proses operasional kursus
dan juga membantu proses komunikasi jika ada kesulitan saat mengikuti kursus
atau ada hal yang ingin di tanyakan mengenai kursus yaitu forum diskusi, dengan
memanfaatkan Framework Laravel sebagai kerangka kerja programnya yang
dapat mengakomodasi kebutuhan serta menjadi solusi dari permasalahan yang di
hadapi Yayasan. Framework Laravel merupakan framework berbasis php yang
open source dan menggunakan konsep MVC (Model View Controller). Kelebihan
yang dimilki oleh Framework Laravel adalah dapat mengurangi waktu yang
dibutuhkan untuk mengembangkan projek website dengan menggunakan
framework ini. Laravel juga dilengkapi dengan utilitas pemrograman untuk
membantu proses pengembangan aplikasi website dan juga moderasi dengan
dengan cara terbaik. Mengapa di bangunnya sistem informasi ini dalam platform
website adalah mampu memudahkan siswa dan pengajar dalam mengakses
sistem informasi dimanapun dan kapanpun dengan perangkat apapun.
Berdasarkan teknologi tersebut, maka disusun aplikasi ini berbasis website.
1.2 Rumusan Masalah

Berdasarkan pada latar belakang di atas, maka didapatkan rumusan masalah
sebagai berikut :
1. Bagaimana merancang aplikasi e-course interaktif berbasiskan website
menggunakan framework laravel pada yayasan kampus amerta bakti?
2. Bagaimana membangun aplikasi e-course interaktif berbasiskan website
menggunakan framework laravel pada yayasan kampus amerta bakti?
1.3 Tujuan Perekayasaan

Tujuan dari perekayasaan ini adalah sebagai berikut :
1. Merancang aplikasi e-course interaktif berbasiskan website
menggunakan framework laravel pada yayasan kampus amerta bakti.
2. membangun aplikasi e-course interaktif berbasiskan website
menggunakan framework laravel pada yayasan kampus amerta bakti.
1.4 Manfaat Perekayasaan

Adapun manfaat yang dicapai dari sistem informasi yang dibangun adalah
sebagai berikut :
a) Yayasan Kampus Amerta Bakti :
1. Membantu pendistribusian kursus lebih luas.
3
2. Mengurangi biaya tempat dan tenaga pengajar saat proses-proses

distribusi.
b) Masyarakat :
1. Diharapkan membantu masyarakat dalam mencari informasi mengenai
Yayasan Kampus Amerta Bakti.
c) Siswa dan Pengajar :
1. Siswa tidak dibatasi jarak.
2. Siswa memiliki kebebasan tempat belajar dimanapun.
3. Siswa dapat memilih materi yang diminati atau di inginkan.
4. Siswa memiliki kebebasan dalam waktu belajar.
5. Siswa bisa mendapatkan privasi saat belajar.
6. Pengajar lebih berkurang perannya karena tidak harus selalu tatap
muka.
7. Pengajar lebih hemat waktu dan biaya.
8. Pengajar lebih hemat tenaga.
1.5 Ruang Lingkup Perekayasaan
Berdasarkan latar belakang yang telah disampaikan, maka dapat
ditentukan ruang lingkup permasalahan yang ada. Dengan maksud agar sistem
yang dibangun tidak meluas dari pembahasan, antara lain :
1. Perekayasaan sistem didasarkan pada kebutuhan di Yayasan Kampus
Amerta Bakti, Renon, Denpasar Selatan, Denpasar, Bali.
2. Sistem informasi ini dibangun dengan platform web dengan menggunakan
Framework Laravel dan MariaDB sebagai basis datanya melalui aplikasi
Laragon.
3. Sistem Informasi ini memiliki hak akses yang berbeda-beda di dalamnya
yaitu :
a. Administrator
1. Administrator dapat mengelola data diskusi dengan menambah ,
memperbaharui , maupun menghapus data diskusi.
2. Administrator dapat mengelola data report diskusi dengan
menambah , memperbaharui , maupun menghapus data report
diskusi.
3. Administrator dapat menghapus data user.
4. Administrator dapat mengelola data video dengan menambah ,
memperbaharui, maupun menghapus data video.
4
5. Administrator dapat mengelola data paket dengan menambah ,

memperbaharui , maupun mengahpus data paket.
6. Administrator dapat menghapus data komentar.
7. Administrator dapat melihat data chanel , kategori dan admin.
b. Super Administrator
1. Super Administrator dapat mengelola data admin seperti
menambah, memperbaharui , maupun menghapus data admin.
2. Super Administrator dapat mengelola data chanel seperti
menambah, memperbaharui, maupun menghapus data chanel.
3. Super Administartor dapat mengelola data kategori seperi
menambah, memperbaharui, maupun menghapus data kategori.
4. Super Administrator dapat melihat data video, Paket, user, report
diskusi, diskusi.
c. Anggota.
1. Anggota dapat melihat data diskusi dan komentar.
2. Anggota dapat melihat video jika sudah membeli paket kursus.
3. Anggota dapat mengikuti diskusi pada forum.
4. Anggota dapat log in.
d. Pengunjung.
1. Pengunjung dapat Sign up.
4. Setiap kursus yang diselesaikan terdapat sertifikat yang akan bisa dicetak
ataupun diunduh.
5. Setiap kursus yang diikuti memiliki durasi waktu.
6. Data yang diolah dalam sistem informasi ini adalah data diskusi, data report
diskusi, data video, data kategori, data chanel, data pengguna (Super
administrator , Administrator, Anggota) dan data komentar.
7. Dalam rancang dan bangun sistem akan digunakan Data Flow Diagram
(DFD).
8. Perancangan database terdiri dari Entitiy Relationship Diagram (ERD),
Konseptual Database dan Struktur Tabel.
9. Metode pengujian yang diterapkan pada sistem ini adalah Blackbox
Testing.
10. Bahasa pemrograman php & javascript.
5
11. Penelitian ini hanya berfokus pada perancangan dan pembanggunan

sistem atau aplikasi e-course interaktif pada yayasan kampus amerta
bakti.
1.6 Sistematika Penulisan

Agar penyajian laporan tugas akhir dapat lebih terstruktur maka
sistematika penulisan laporan ini dibagi menjadi beberapa bab dengan masing-
masing sub babnya yang saling berkaitan. Berikut adalah penulisan masing-
masing bab yang terdapat pada laporan ini.
BAB I PENDAHULUAN
Bab ini menjelaskan latar belakang, rumusan masalah, tujuan perekayasaan,
manfaat perekayasaan, dan ruang lingkup perekayasaan terkait Rancang Bangun
Aplikasi E-Course Interaktif Berbasiskan Website Pada Yayasan Kampus Amerta
Bakti Menggunakan Framework Laravel.
BAB II TINJAUAN PUSTAKA

Bab ini berisikan tentang telaah pustaka yang berhubungan dengan rancang dan
bangun sistem informasi atau aplikasi dan landasan teori tentang aplikasi e-
course, analisa dan perancangan sistem, pengetahuan tentang basis data, PHP,
Javascript, Framework Laravel, MariaDB.
BAB III METODE PEREKAYASAAN

Bab ini menjelaskan perekayasaan, metode pengumpulan data, serta metode-
metode yang terkait dengan Rancang Bangun Aplikasi E-Course Interaktif
Berbasiskan Website Menggunakan Framework Laravel Pada Yayasan Kampus
Amerta Bakti.
BAB IV HASIL DAN PEMBAHASAN

Bab ini menjelaskan tentang aplikasi yang dibuat yaitu meliputi Data Flow Diagram
(DFD), Entity Relationship Diagram (ERD), perancangan basis data, basis data
konseptual, struktur tabel, perancangan antarmuka, implementasi sistem dan
pengujian sistem.
6
BAB V PENUTUP
Bab ini menjelaskan kesimpulan dan saran dari Aplikasi E-Course Interaktif
Berbasiskan Website Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti.
.
BAB II
TINJAUAN PUSTAKA
2.1 State of The Art

Dalam penyusunan proposal ini, penulis mereferensi beberapa hasil
penelitian - penelitian terkait yang sudah ada sebelumnya. Penelitian yang
digunakan didapatkan dari beberapa jurnal, yaitu :
Regi Asyika (2019) melakukan penelitian yang berjudul Optimasi E-Kursus

Menggunakan Model Fast Lpk Kampoes Inggris Pangkalpinang [2]. Hasil dari
penelitian ini adalah sistem berbasis web yang memudahkan peserta kursus dan
pemilik pada Lpk Kampoes Inggris yang masih menggunakan menggunakan cara
manual, penelitian ini menggunakan metode Unifield Modelling Languange.
I Gede Suputra Widharma (2017) melakukan penelitian berjudul

Perancangan Simulasi Sistem Pendaftaran Kursus Berbasis Web Dengan Metode
SDLC [3]. software pendukung dalam penelitian ini adalah Sublime Text, XAMPP,
CodeIgniter, HTML, CSS, Javascript, PHP, dan MySQL . Hasil akhir dari penelitian
ini adalah perancangan simulasi sebuah aplikasi website dengan framework yang
menggunakan konsep Model View Controller (MVC), yang mampu menangani
proses member area,membuat report transaksi dan daftar member yang aktif
dengan metode system development life cycle (SDLC).
Mulyadi, Hoiriah, Deddy Supriadi, Rina Mugiati (2018) melakukan

penelitian berjudul Sistem Informasi Pendaftaran Kursus Berbasis Web Pada
Yayasan Musik Jakarta [4]. Hasil akhir dari penelitian ini adalah sistem berbasis
website yang mampu memudahkan petugas pendaftaran dalam proses
pendaftaran, sehingga lebih efisiensi dan efektif. Memudahkan dari sisi siswa
dalam melakukan proses pendaftaran kursus dimanapun dan kapanpun.
Penelitian ini menggunakan metode Waterfall.
Wanda Kurniawan, Andi Suprianto, B.Sumardiyono (2016) melakukan

penelitian berjudul Rancangan Sistem Forum Diskusi Online Untuk Program Studi
Sistem Informasi Antara Dosen Dan Mahasiswa (Studi Kasus Institut Sains Dan
Teknologi Nasional) [5]. Bahasa pemrograman yang digunakan adalah PHP
dengan database MySql , hasil akhir dari penelitian ini adalah suatu sistem yang
7
8
mempermudah kegiatan komunikasi dan berbagi informasi antar

mahasiswa,dosen dan alumni secara online. Memberikan informasi tentang sistem
informasi secara umum pada masyarakat dalam peminatan jurusan sistem
informasi. Penelitian ini menggunakan metode Software Development Life Cycle
(SDLC).
Rangkuman state of the art dari penelitian sebelumnya dapat dilihat pada
tabel 2.1.
Tabel 2.1 Rangkuman State Of The Art
No Judul Peneliti Metode Hasil

Penelitian
1 Optimasi E-Kursus Regi Asyika UML(Unifield sistem berbasis
Menggunakan Model Modelling web yang
Fast Lpk Kampoes Languange) memudahkan
Inggris peserta kursus
Pangkalpinang dan pemilik Lpk
yang masih
menggunakan
metode manual
dalam
pendaftarannya
2 Perancangan I Gede Suputra SDLC(Software Aplikasi berbasis
Simulasi Sistem Widharma Development website yang
Pendaftaran Kursus Life Cycle) mampu
Berbasis Web menangani
Dengan Metode proses member
SDLC area,membuat
report transaksi
dan daftar
member yang
aktif
9
3 Sistem Informasi Mulyadi, Waterfall sistem berbasis

Pendaftaran Kursus Hoiriah, Deddy website yang
Berbasis Web Pada Supriadi, Rina mampu
Yayasan Musik Mugiati memudahkan
Jakarta petugas dan
siswa dalam
proses
pendaftaran
kursus, sehingga
lebih efisiensi dan
efektif.
4 Rancangan Sistem Wanda SDLC(Software suatu sistem yang
Forum Diskusi Online Kurniawan, Development mempermudah
Untuk Program Studi Andi Suprianto, Life Cycle) kegiatan
Sistem Informasi B.Sumardiyono komunikasi dan
Antara Dosen Dan berbagi informasi
Mahasiswa antar
mahasiswa,dosen
dan alumni
secara online.
2.2 Sistem Informasi

Sistem informasi (information system) merupakan kombinasi teratur dari
orang-orang, perangkat keras, perangkat lunak, jaringan komunikasi dan sumber
daya data yang mengumpulkan, mengubah, menyebarkan informasi dalam
sebuah organisasi. Sistem Informasi terdiri dari beberapa komponen atau elemen.
Komponen-komponen dari sistem informasi ini dapat dijabarkan sebagai berikut :
1. Blok Masukan (Input Block), Input memiliki data yang masuk ke dalam
sistem informasi, juga metode-metode untuk menangkap data yang dimasukkan.
2. Blok Model (Model Block), blok ini terdiri dari kombinasi prosedur, logika
dan model matematik yang akan memanipulasi data input dan data yang
tersimpan di basis data.
3. Blok Keluaran (Output Block), produk dari sistem informasi adalah keluaran
yang merupakan informasi yang berkualitas dan dokumentasi yang berguna untuk
semua tingkatan manajemen serta semua pemakai sistem.
10
4. Blok Teknologi (Technology Block), blok teknologi digunakan untuk

menerima masukan, menjalankan model, menyimpan dan mengakses data,
menghasilkan dan mengirimkan keluaran dari sistem secara keseluruhan. Blok
Teknologi terdiri dari tiga bagian utama, yaitu ; teknisi/pengguna (brainware),
perangkat lunak (software) dan perangkat keras (hardware).
5. Basis Data (Database Block), merupakan kumpulan dari data yang daling
berhubungan satu sama lain, tersimpan dalam bentuk tabel dalam perangkat keras
komputer dan dimanipulasi menggunakan perangkat lunak [6].
2.3 E-Course
Kamus Besar Indonesia Kursus adalah pelajaran tentang sesuatu
pengetahuan atas keterampilan, yang diberikan dalam waktu singkat, Lembaga
diluar sekolah yang memberikan pelajaran serta pengetahuan atau ketrampilan
yang diberikan [7]. Jadi bisa di artikan E-Course atau Electronic Course adalah
teknologi elektronik yang menghubungkan antara perusahaan, siswa dan
masyarakat dalam bentuk kursus [8].
2.4 Forum Diskusi

Menurut penelitian dari Wanda Kurniawan, Andi Suprianto,
B.Sumardiyono, “Forum adalah lembaga atau badan atau wadah yang membentuk
suatu tempat untuk membicarakan kepentingan bersama. Dan diskusi merupakan
pertemuan ilmiah untuk bertukar pikiran mengenai suatu masalah yang lakukan
oleh sekelompok orang” [5]. Sehingga dapat diartikan Forum Diskusi Online
adalah suatu wadah untuk sekelompok orang atau organisasi dalam melakukan
pertemuan ilmiah untuk bertukar pikiran dalam tujuan yang sama dengan
memanfaatkan teknologi.
2.5 Website Interaktif

Interaktif adalah saat terjadi dua arah atau suatu hal yang bersifat saling
melakukan aksi, saling aktif secara timbal balik antara satu dengan lainnya salah
satunya komunikasi yang terjadi secara timbal balik. Dapat diartikan website
interaktif adalah website yang didalamnya terdapat aksi komunikasi 2 arah atau
timbal balik baik pengguna pada pengguna ataupun pengguna pada sistem [9].
2.6 Apache Web Server

Apache dipilih karena Apache adalah server HTTP yang mendukung
HTTP/1.1. Apache didesain untuk menggantikan server NCSA HTTP. Apache
11
dibuat oleh Apache Group yang merupakan kelompok pemrogram di seluruh dunia
yang secara sukarela mengembangkan server Apache. Dengan menggunakan
dasar NCSA HTTPD 1.3, Apache Group mengembangkan server yang pada
mulanya ditujukan untuk mereka sendiri.Apache merupakan web server yang
paling banyak digunakan saat ini. Menurut survei netcraft, Apache digunakan oleh
lebih dari 60% web server di dunia internet, hal ini disebabkan oleh sifatnya yang
open source dan kemudahan di dalam konfigurasi, serta kemudahannya dalam
menambahkan software lain sebagai pelengkap, contohnya dapat ditambahkan
support source protocol melalui SSL (Secure Socket Layer) dan konektifitasnya
dengan database server melalui bahasa scripting PHP. Alasan Apache dipilih
karena:
1. Mempunyai kelebihan dibandingkan web server yang lain.
2. Apache termasuk kategori freeware (gratis).
3. Proses instalasinya mudah.
4. Mampu beroperasi pada bagian platform sistem operasi.
Antara web server yang satu dengan yang lain mempunyai perbedaan baik
itu dalam hal fasilitas maupun dalam hal kriterianya yang di atas, sedangkan
Apache sendiri mempunyai beberapa fasilitas antara lain:
1. Mampu dikomplikasi sesuai dengan spesifikasi HTTP yang sekarang ini.
2. Mempunyai dukungan teknis melalui web.
3. Mempunyai compability platform tinggi.
4. Mendukung transaksi yang aman dengan menggunakan SSL (Secure
Socket Layer) [10].
2.7 MariaDB
MariaDB adalah basis data open source yang paling cepat berkembang
dengan lebih dari 12 juta pengguna di seluruh dunia. MariaDB merupakan
pengembangan dari MySQL untuk mendukung kebutuhan database dari sebuah
perusahaan saat ini dengan antar muka SQL yang sesuai. MariaDB dibangun
dengan arsitektur modern yang dapat diperluas di setiap lapisannya seperti klien,
kluster, kernel dan penyimpanan. MariaDB juga dirancang untuk mengamankan
basis data di setiap lapisan yang didukung dengan fitur keamanan tingkat tinggi
[11].
12
MariaDB dapat dikatakan sama dengan MySQL karena MariaDB

merupakan pengembangan dari MySQL itu sendiri. Berikut adalah beberapa fitur
yang membedakan MariaDB dengan MySQL :
1. MariaDB memasukkan semua engine open source populer dan mengganti

InnoDB menjadi XtraDB.
2. MariaDB di klaim lebih cepat dari MySQL.
Terdapat eksistensi open source baru yang tidak ada di MySQL [12].
2.8 Framework Laravel

Laravel adalah Framework open source yang ditulis oleh Taylor Otwell di
bawah Lisensi MIT. Laravel adalah kerangka pengembangan website berbasis
MVC (model view controller) yang ditulis dalam bahasa PHP dan dirancang untuk
meningkatkan kualitas perangkat lunak dengan mengurangi biaya pengembangan
awal dan biaya pemeliharaan. Laravel dapat meningkatkan pengalaman bekerja
dengan aplikasi dengan menyediakan sinstaks yang ekspresif, jelas dan
menghemat waktu [13]. Kelebihan lain dari framework ini adalah kelengkapan
library yang disediakan, terutama library-library yang akan digunakan dalam
pengembangan sistem informasi ujian penerimaan mahasiswa baru ini.
Framework ini berjalan diatas PHP dan berbasis MVC (Model View
Controller). Laravel pertama kali dirilis pada tanggal 22 Pebruari 2012 dan versi
stabil terbaru adalah versi 5.7 yang dirilis pada September 2018. Model View
Contoller adalah sebuah metode untuk membuat sebuah aplikasi dengan
memisahkan data (Model) dari tampilan (View) dan bagaimana cara
memprosesnya (Controller) [14]. Terdapat tiga komponen MVC yaitu :
1. Model
Bagian yang berperan menghubungkan controller dengan database. Tugas
dari model adalah melakukan manipulasi data ke database seperti CRUD (create,
rad, update, delete).
2. View
Mengatur bagaimana data akan ditampilkan kepda user. Data yang didapat
dari model akan diproses oleh controller kemudian oleh View ditampilkan kepada
user.
13
3. Controller
Bagian yang menjadi penghubung anatara model dan view. Controller
berfungsi memproses fungsi atau perintah dari user kemudian menentukan
bagaimana aplikasi dijalankan.
Tabel 2.2 Perbandingan Keunggulan Framework
No Perbandingan Keunggulan Framework
Laravel memiliki keunggulan popularitas di kalangan

developer, dokumentasi yang rapi dan lengkap,
code modularity yang sangat bagus dan module
1 Laravel yang tersedia dalam jumlah banyak, kode program
yang rapi dan simpel, migration yang disertai seeder
untuk membantu saat testing ataupun mengisi data
statis (non-transactional data record).
Yii memiliki keunggulan dalam performa untuk
sistem kompleks, code modularity yang sangat
2 Yii
bagus, dukungan komunitas yang baik dan
dokumentasi yang lengkap.
CI adalah ringan, mudah dipelajari dan zero config
framework (tanpa setting-setting khusus seperti
3 Codeigniter
Laravel dan Yii, kode pada CI bisa langsung
dijalankan).
2.9 Visual Studio Code

Visual Studio Code adalah editor kode yang ringan namun kuat yang
dioperasikan pada dekstop yang tersedia untuk Windows, macOS dan Linux.
Visual Studio Code hadir dengan dukungan built-in untuk JavaScript, TypeScript
dan Node.js dan memiliki ekosistem ekstensi yang kaya untuk jenis bahasa lain
yang lain seperti C++, C#, Java, Python, PHP, Go dan runtimes seperti .NET dan
Unity. Visual Studio Code diperbaharui setidaknya sebulan sekali dari situs
aslinya. Lisensi dari Visual Studio Code adalah Microsoft Corporation [15].
2.10 Data Flow Diagram(DFD)

Data Flow Diagram (DFD) adalah suatu network yang menggambarkan
suatu sistem komputerisasi, manualisasi atau gabungan dari keduanya, yang
penggambarannya disusun dalam bentuk kumpulan komponen sistem yang saling
14
berhubungan. Keuntungan dari DFD adalah memungkinkan untuk

menggambarkan sistem dari level yang paling tinggi kemudian menguraikannya
menjadi level yang lebih rendah. Sedangkan kekurangan dari DFD adalah tidak
menunjukkan proses pengulangan, proses keputusan, dan proses perhitungan.
Adapun langkah-langkah dalam membuat data flow diagram dibagi
menjadi tiga (3) tahap atau tingkat konstruksi DFD, yaitu sebagai berikut :
1. Diagram Konteks
Diagram ini dibuat untuk menggambarkan sumber serta tujuan data yang
akan diproses atau dengan kata lain diagram tersebut digunakan untuk
menggambarkan sistem yang ada.
2. Diagram Nol
Diagram ini dibuat untuk menggambarkan tahapan dari setiap proses yang
ada didalam diagram konteks, yang penjabarannya lebih terperinci.
3. Diagram Detail
Diagram ini dibuat untuk menggambarkan arus data secara lebih mendetail
lagi dari tahapan proses yang ada didalam diagram nol [16].
Tabel 2.3 DFD Notasi Yourdon/DeMarco dan Notasi Gane/Sarson

Gambar
N Notasi Notasi Gane/ Keterangan
No. Yourdon/DeMarco Sarson
Simbol entitas eksternal/
1. terminator menggambarkan
asal atau tujuan data dari luar
system
Simbol proses yaitu simbol
2. yang digunakan untuk
1. menggambarkan proses
dimana aliran data masuk
ditransformasikan ke aliran data
keluar. Suatu proses harus
mempunyai minimal satu input
dan minimal satu output.
15
Simbol aliran data

3. menggambarkan aliran data.
Aliran data, yaitu menunjukkan
perpindahan data dari satu titik
ke titik lain, dengan kepala
tanda panah mengarah ke
tujuan.
Simpanan data (data store)
4. digunakan untuk
menggambarkan data flow yang
sudah disimpan atau
diarsipkan.
2.11 Entity Relationship Diagram (ERD)

Entity Relationship Diagram (ERD) adalah suatu diagram untuk
menggambarkan desain konseptual dari model konseptual suatu basis data
relasional. ERD juga merupakan gambaran yang menghubungkan antara objek
satu dengan objek yang lain dalam dunia nyata. Sebagai contoh, jika akan
membuat ERD dari sistem akademik suatu perguruan tinggi, maka bahan sebagai
objek ERD bisa berupa mahasiswa, dosen, mata kuliah, dan lain sebagainya [17].
Tabel 2.4 Simbol Entity Relationship Diagram (ERD) Crow’s Foot
NO. Gambar Keterangan
Objek di luar sistem yang berkomunikasi

1. dengan sistem sebagai sumber maupun
pemakai informasi
Entity
Garis penghubung yang digunakan pada
2. diagram
1. Relationship line
Digunakan untuk relasi fungsional

3. Option Symbol
Digunakan pada relasi menunjukkan 1 (one)

16
4. One Symbol
Digunakan pada relasi untuk menunjukkan

5.
banyak (many)
Many
Dalam ERD terdapat kardinalitas. Kardinalitas adalah relasi/hubungan

antara suatu entitas dengan entitas lainnya. Berikut adalah tabel kardinalitas :
Tabel 2.5 Kardinalitas

No Kardinalitas Keterangan
Menggambarkan hubungan yang hanya memungkinkan
1-ke-1 terjadi satu kejadian/transaksi saja antara kedua entitas.
1
(one to one) Setiap nilai pada entitas A berhubungan dengan paling
banyak satu nilai pada entitas B, dan sebaliknya.
Satu elemen di entitas pertama dapat berasosiasi
1-ke-n dengan nol, satu, atau lebih elemen yang ada di entitas
2
(one to many) kedua, tetapi untuk satu elemen di entitas kedua hanya
berelasi dengan satu elemen di entitas pertama.
n-ke-n Satu elemen di entitas pertama berasosiasi dengan nol,
(many to many) satu, atau lebih di entitas kedua, dan elemen di entitas
3
kedua berasosiasi dengan nol, satu atau lebih elemen di
entitas pertama.
2.12 Blackbox Testing

Pengujian disisi pengembang dilakukan oleh programmer dari aplikasi
bersangkutan atau mereka yang mengerti dan terlibat didalam pengembangan
sistem tersebut. Pengujian disisi pengembang ini umumnya disebut dengan
Blackbox Testing, pengujian ini menekankan pada sejauh mana fungsionalitas
sistem informasi berjalan dengan baik sesuai dengan yang diinginkan oleh
pengguna dan pengembang [18]. Terdapat empat jenis pengujian pada Blackbox
testing, antara lain :
1. Pengujian Interface (Tatap Muka) Aplikasi
Pengujian interface (tatap muka) aplikasi sistem informasi bertujuan untuk
mengetahui fungsionalitas dari setiap elemen interface yang ada disetiap
halaman aplikasi sistem informasi.
2. Pengujian Fungsi Dasar Sistem
17
Pengujian fungsi dasar sistem bertujuan untuk mengetahui sejauh mana

kinerja dari setiap fungsi dasar sistem yang ada di dalam aplikasi sistem
informasi.
3. Pengujian Form Handle Sistem
Pengujian Form Handle Sistem bertujuan untuk mengetahui seperti apa
dan sejauh mana respon oleh sistem informasi terhadap inputan yang
diberikan oleh pengguna.
4. Pengujian Keamanan Sistem
Pengujian Keamanan Sistem bertujuan untuk mengetahui sejauh mana
tingkat keamanan yang dimiliki oleh sistem informasi untuk dapat
memberikan rasa aman kepada pengguna serta menjamin kemanan
datanya.
18

BAB III
METODE PENELITIAN
Metode penelitian yang digunakan dalam perancangan “Rancang Bangun

Aplikasi E-Course Interaktif Berbasiskan Webiste Menggunakan Laravel Pada
Yayasan Kampus Aamerta Bakti adalah metode waterfall. Metode waterfall
merupakan sebuah metode pengembangan sistem dimana antar satu tahap ke
tahap yang lain dilakukan secara berurutan. Dalam proses implementasi metode
waterfall ini, sebuah langkah akan diselesaikan terlebih dahulu dimulai dari
tahapan yang pertama sebelum melanjutkan ke tahap yang berikutnya [19].
Berikut gambar dari metode waterfall yang dapat dilihat pada Gambar 3.1.
Gambar 3.1 Metode Waterfall.
3.1 Requirement Definition (Definisi Kebutuhan)

Merupakan tahap awal dari metode Waterfall, di mana pada tahap ini
dilakukan pengumpulan data terkait yang akan digunakan sebagai bahan penentu
kebutuhan sistem pada nantinya. Adapun metode pengumpulan data yang
digunakan sebagai berikut:
1. Observasi
Observasi merupakan suatu metode pengumpulan data dengan cara
mengamati secara langsung objek yang diteliti kemudian melakukan
pencatatan secara sistematis. Pada tahap ini akan dilakukan observasi
langsung ke Yayasan Kampus Amerta Bakti untuk mendapatkan informasi
19
20
terkait kriteria-kriteria yang di butuhkan dalam penambahan data kedalam

sistem yang akan dibangun.
2. Wawancara
Wawancara merupakan suatu metode yang dilakukan untuk mendapatkan
data dan informasi mengenai kebutuhan sistem, yang mana dilakukan
dengan cara tanya jawab kepada seorang pegawai atau pimpinan Yayasan
Kampus Amerta Bakti.
3. Studi Literatur
Studi Literatur merupakan metode pengumpulan data yang dilakukan
dengan cara membaca berbagai literatur yang berhubungan dengan objek
penelitian. seperti menggunakan buku-buku, jurnal atau makalah yang
berhubungan dengan analisa dan desain sistem terstruktur serta pembuatan
website. Seperti buku mengenai konsep dan aplikasi Framework Laravel
serta perancangan sistem dengan data flow diagram dan entity relationship
diagram.
3.2 System and Software Design (Desain Sistem dan Perangkat Lunak)
Merupakan tahap yang dilakukan setelah kebutuhan dari sistem telah
ditentukan. Pendesainan alur kerja sistem akan menggunakan Data Flow Diagram
(DFD), sedangkan untuk desain dari database akan menggunakan Entity
Relationship Diaragm (ERD) dan konseptual database.
3.3 Implementation and Unit Testing (Implementasi Dan Pengujian Unit)

Merupakan tahap pengimplementasian hasil dari tahap pertama
(Requirements Definition) dan kedua (System and Software Design). Implementasi
akan dilakukan dengan menggunakan Visual Studio Code sebagai kode editor
untuk menulis kode program dari sistem ini. Sistem ini akan dibangun dengan
bahasa pemrograman PHP menggunakan framework Laravel, kemudian untuk
keperluan database akan menggunakan DBMS (Database Management System)
MariaDB. Sistem akan dijalankan menggunakan web server Apache yang
disediakan oleh aplikasi Laragon, guna keperluan pengujian setiap fungsi sistem
(unit). Tahap ini akan dilakukan hingga semua spesifikasi sistem yang telah
ditentukan (unit) berhasil diimplementasikan.
3.4 Integration and System Testing (Uji Coba)

Merupakan tahap untuk pengujian sistem secara utuh, di mana dalam
penelitian ini sistem akan diuji menggunakan metode Black Box Testing. Pengujian
21
ini bertujuan untuk menemukan kesalahan atau bug di dalam sistem, yang dapat
berasal dari kode program maupun aktivitas dari pengguna. Pengujian pun akan
dibatasi dengan berbagai input yang telah ditentukan sesuai dengan spesifikasi
sistem serta melihat seperti apa output yang dihasilkan, apakah sudah sesuai yang
diharapkan atau tidak.
3.5 Operation and Maintenance (Operasi dan Pemeliharaan)

Merupakan tahap akhir dari metode Waterfall, di mana sistem akan
dioperasikan guna melihat hasil akhir dari sistem apakah berjalan sesuai dengan
yang direncanakan atau tidak. Tahap ini juga akan dilakukan pemeliharaan sistem,
di mana termasuk melakukan perbaikan apabila ditemukan kesalahan atau bug
yang tidak terdeteksi pada tahap sebelumnya dan melakukan perubahan maupun
penambahan fungsi apabila diperlukan.
22

BAB IV
HASIL DAN PEMBAHASAN
4.1. Hasil Analisis Sistem

Hasil analisis sistem merupakan tahapan penting dalam membangun suatu
aplikasi yang bertujuan untuk menganalisa permasalahan-permasalahan yang ada
pada sistem. Adapun hasil analisis sistem tersebut yang terdiri dari 3 yaitu:
1. Analisis User
Analisis user, terdapat 3 user yang dapat mengakses sistem. Peran masing-
masing user akan dijelaskan pada tabel 4.1.
Tabel 4.1 Analisis User
No. User Keterangan
1. Super Admin Super Admin merupakan orang yang dapat
mengelola atau melihat data chanel, data
kategori, data paket kursus, data laporan
pembelian, data admin dan data anggota.
2. Admin Admin merupakan orang yang dapat

mengelola atau melihat data report diskusi,
data report video, data video, data anggota,
data pembayaran, data tugas kursus, dan
data tugas akhir.
3. Anggota Anggota merupakan orang yang hanya dapat
mengakses beberapa informasi atau data
pada sistem ini seperti data atau informasi
diskusi, kursus, chanel, video, tugas kursus,
tugas akhir, sertifikat.
23
24
2. Analisis Proses
Analisis proses, terdapat 9 proses yang dapat diakses oleh user. Analisis
proses akan dijelaskan pada tabel 4.2.
Tabel 4.2 Analisis Proses
No. Proses Keterangan User
1. Login Merupakan proses verifikasi username Super
dan password untuk dapat mengakses Admin,
sistem. Admin
dan
Anggota
2. Sign Up atau Merupakan proses untuk mendaftar Anggota,
Daftar menjadi anggota, atau admin. Admin
3. Kelola Data 1 Merupakan proses untuk mengelola data Super
chanel, data kategori, data paket kursus, Admin
data laporan pembelian, data admin dan
data anggota.
4. Kelola Data 2 Merupakan proses untuk mengelola data Admin
report diskusi, data report video, data
video, data anggota, data pembayaran,
data tugas kursus, data tugas akhir.
5. Membuat Merupakan proses menambah topik Super
Topik Diskusi diskusi berdasarkan chanel atau kategori Admin,
yang dipilih. Admin
dan
Anggota
6. Membeli Merupakan proses untuk membeli kursus Anggota
kursus yang sudah tersedia.
7. Mengumpulkan Merupakan proses untuk memenuhi
tugas kursus kondisi agar melanjutkan ke video
selanjutnya pada kursus.
25
8. Mengumpulkan Merupakan proses untuk memenuhi Anggota

tugas akhir kondisi agar bisa mencetak sertifikat
kursus kursus yaitu mengumpulkan tugas akhir
kursus.
9. Mencetak Merupakan proses mencetak sertifikat Anggota
Sertifkat sebagai bukti telah menyelesaikan kursus.
3. Analisis Data
Pada analisis data, terdapat 17 data yang ada pada sistem dan diakses oleh
user. Berikut merupakan data store pada Aplikasi E-Course Interaktif Berbasiskan
Website Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti.
Tabel 4.3 Analisis Data
No. Data Keterangan
1. Users adalah data yang menyimpan id, full_name,
avatar, username, address, gender, phone, dob,
admin, super_admin, email, password.
2. Discussions adalah data yang menyimpan id, user_id,
channel_id, category_id, images, title, content.
3. Report_discussions adalah data yang menyimpan id, user_id,

discussion_id, reason.
4. Totalviews adalah data yang menyimpan id, user_id,

discussion_id.
5. Replies adalah data yang menyimpan id, user_id,

discussion_id, best_answer, conten.
6. Upvotes adalah data yang menyimpan id, user_id, reply_id.
7. Channels adalah data yang menyimpan id, title.

26
8. Categories adalah data yang menyimpan id, title.
9. Users_courses adalah data yang menyimpan id, user_id,

package_id, payment_status, expired_date.
10. Course_packages adalah data yang menyimpan id, title, description,

price, month_expired, image, preview_link,
channels_id, final_taskdescript.
11. Videos adalah data yang menyimpan id, name,
package_id, step, link.
12. Played_videos adalah data yang menyimpan id, video_id,

usercourse_id.
13. Report_videos adalah data yang menyimpan id, user_id,

video_id, reason.
14. Quizzes adalah data yang menyimpan video_id,

description.
15. User_quizzes Adalah data yang menyimpan quiz_id, user_id,

file, status, completion_date.
16. Tasks adalah data yang menyimpan id, usercourse_id,

file, status, completion_date.
17. Payment_logs adalah data yang menyimpan id, name, course,

approved_by, total_price, payments_date.
27
4.2. Perancangan Sistem

Perancangan sistem pada Rancang Bangun Aplikasi E-Course Interaktif
Berbasiskan Website Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti ini
menggunakan DFD (Data Flow Diagram), untuk perancangan basis datanya
menggunakan Konseptual Basis Data dan ERD (Entity Relationship Diagram), dan
terdapat juga perancangan antarmuka sistem ini. Berikut DFD pada Sistem Informasi
Manajemen Komunitas Seni Candi Ghana Menggunakan Framework Laravel.
1. Diagram Konteks
Diagram Konteks merupakan diagram yang menjelaskan mengenai proses-
proses yang ada pada sistem. Pada sistem ini terdapat 3 entitas yaitu entitas Super
Admin, entitas Admin dan entitas Anggota. Berikut diagram konteks pada Rancang
Bangun Aplikasi E-Course Interaktif Berbasiskan Website Menggunakan Laravel
Pada Yayasan Kampus Amerta Bakti.
Gambar 4.1 Diagram Konteks

28
2. DFD (Data Flow Diagram) Level 0

Data Flow Diagram Level 0 merupakan pemecahan proses dari Diagram
Konteks. Pada Sistem Rancang Bangun Aplikasi E-Course Interaktif Berbasiskan
Website Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti ini terdapat 18
proses yang terdiri dari Login, Daftar, Kelola Data Anggota, Kelola Data Video, Kelola
Data Diskusi, Sertifikat,Kelola Data Kategori, Kelola Data Kursus, Kelola Data Chanel,
Kelola Data Kursus User, Kelola Data Pembayaran Kursus, Kelola Data Tugas
Kursus, Kelola Data Report Diskusi, Kelola Data Admin, Laporan Pembelian, Kelola
Data Report Video, Kelola Data Paket Kursus, Kelola Data Tugas Kursus. Dalam DFD
Level 0 ini juga terdapat 13 buah data store yaitu users, videos, discussions,
users_courses, categories, channels, user_quizzes, tasks, report_discussions,
payment_logs, report_videos, course_packages dan quizzes.
29
Gambar 4.2 DFD (Data Flow Diagram) Level 0.

30
3. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Anggota

Data Flow Diagram Level 1 merupakan pemecahan dari proses Kelola Data
Anggota yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Anggota dipecah menjadi 2 (dua) proses dan 1 data store. Pada DFD ini Admin dapat
menampilkan dan menghapus anggota.
Gambar 4.3 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Anggota.
4. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Video

Video yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data Anggota
dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini Admin dapat
menampilkan, menambah, mengubah dan menghapus video.
Gambar 4.4 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Video.
31
5. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Diskusi

Data Flow Diagram Level 1 merupakan pemecahan dari proses Kelola Diskusi
yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data Diskusi
dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini Super Admin,
Admin dan Anggota dapat menampilkan, menambah, mengubah dan menghapus
diskusi.
Gambar 4.5 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Diskusi.
6. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Kursus

Kursus yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data Kursus
dipecah menjadi 3 (tiga) proses dan 1 data store. Pada DFD ini Anggota dapat
menampilkan, menambah dan menghapus kursus.
Gambar 4.6 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Kursus.
32
7. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Kategori

Data Flow Diagram Level 1 merupakan pemecahan dari proses Kelola
Kategori yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Kategori dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini Super
Admin dapat menampilkan, menambah, mengubah dan menghapus kategori.
Gambar 4.7 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Kategori
8. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Chanel

Chanel yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data Chanel
dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini Super Admin dapat
menampilkan, menambah, mengubah dan menghapus chanel.
Gambar 4.8 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Chanel.
33
9. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Kursus
Tugas Kursus yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Tugas Kursus dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini
Admin dapat menampilkan dan mengubah tugas kursus. Sedangkan Anggota dapat
menampilkan, menambah, mengubah dan menghapus tugas kursus.
Gambar 4.9 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Kursus.
10. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Pembayaran Kursus
Pembayaran Kursus yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola
Data Pembayaran Kursus dipecah menjadi 4 (empat) proses dan 1 data store. Pada
DFD ini Admin dapat menampilkan dan mengubah pembayaran kursus. Sedangkan
Anggota dapat menampilkan, menambah dan menghapus pembayaran kursus.
34
Gambar 4.10 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Pembayaran
Kursus.
11. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Akhir
Tugas Akhir yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Tugas Akhir dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini Admin
dapat menampilkan dan mengubah tugas akhir kursus. Sedangkan Anggota dapat
menampilkan, menambah dan menghapus tugas akhir kursus.
Gambar 4.11 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Akhir
Kursus.
35
12. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Report Diskusi
Report Diskusi yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Report Diskusi dipecah menjadi 3 (tiga) proses dan 1 data store. Pada DFD ini Admin
dapat menampilkan, menambah dan menghapus report diskusi. Sedangkan Anggota
dan Super Admin menambah report diskusi.
Gambar 4.12 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Report Diskusi.
13. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Admin
Admin yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data Admin
dipecah menjadi 3 (tiga) proses dan 1 data store. Pada DFD ini Super Admin dapat
menampilkan, menambah dan menghapus Admin.
Gambar 4.13 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Admin.
36
14. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Report Video
Report Video yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Report Video dipecah menjadi 3 (tiga) proses dan 1 data store. Pada DFD ini Admin
dapat menampilkan dan menghapus report video. Sedangkan Anggota dapat
menambah report video.
Gambar 4.14 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Report Video.
15. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Paket Kursus
Paket Kursus yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Paket Kursus dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini Super
Admin dapat menampilkan, menambah dan menghapus paket kursus.
Gambar 4.15 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Paket Kursus.
37
16. DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Kursus
Tugas Kursus yang ada pada DFD Level 0. Pada DFD Level 1 ini proses Kelola Data
Tugas Kursus dipecah menjadi 4 (empat) proses dan 1 data store. Pada DFD ini
Admin dapat menampilkan dan mengubah tugas kursus. Sedangkan Anggota dapat
menampilkan, menambah dan menghapus tugas kursus.
Gambar 4.16 DFD (Data Flow Diagram) Level 1 Proses Kelola Data Tugas Kursus.
4.3. Perancangan Basis Data

1. Entity Relationship Diagram (ERD)
Pada Rancang Bangun Aplikasi E-Course Interaktif Berbasiskan Website
Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti ini terdapat ERD yang
memiliki 18 tabel, diantaranya yaitu users, categories, channels, course_packages,
discussions, migrations, payment_logs, played_videos, quizzes, replies,
report_discussions, report_videos, tasks, totalviews, upvotes, users_courses,
user_quizzes, videos. Berikut merupakan ERD yang digambarkan pada Gambar 4.6.
38
Gambar 4.17 Entity Relationship Diagram (ERD)
Berikut merupakan atribut dari masing-masing entitas:

Tabel 4.4 Atribut Masing-Masing Entitas
No. Entitas Atribut
1. admin,super_admin, Id, full_name, username, avatar, address, gender,
anggota phone, dob, admin, super_admin, email, password,
remember_token, created_at, updated_at.
2. payment_logs id, name, course, approved_by, total_price,

payments_date, created_at, updated_at.
39
3. migrations Migration, batch.

4. categories id, title, created_at, updated_at.
5. channels id, title, created_at, updated_at.
6. users_course id, user_id, package_id, payment_status, start_date,
expired_date, created_at, updated_at.
7. discussions id, user_id, channel_id, category_id, images, title,
content, created_at, updated_at.
8. report_discussions id, user_id, discussion_id, reason, created_at,
updated_at.
9. replies id, user_id, discussion_id, best_answer, conten,
created_at, updated_at.
10. quizzes id, video_id, description, created_at, updated_at.
11. user_quizzes id, quiz_id, user_i, file, status, completion_date,
12. course_packages id, title, description, price, month_expired, image,
preview_link, channels_id, final_taskdescript,
13. upvotes id, user_id, reply_id, created_at, updated_at.
14. played_videos id, video_id, usercourse_id, created_at, updated_at.
15. videos id, name, package_id, step, link, created_at,
updated_at.
16. report_videos id, user_id, video_id, created_at, updated_at.
17. tasks id, usercourse_id, file, description, status,
completion_date, created_at, updated_at.
18. total_views id, user_id, discussion_id, created_at, updated_at.
2. Basis Data Konseptual

Basis Data Konseptual pada Rancang Bangun Aplikasi E-Course Interaktif
Berbasiskan Website Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti ini
terdapat 18 tabel, diantaranya yaitu users, categories, channels, course_packages,
discussions, migrations, payment_logs, played_videos, quizzes, replies,
40
report_discussions, report_videos, tasks, totalviews, upvotes, users_courses,

user_quizzes, videos.
Gambar 4.18 Basis Data Konseptual
3. Struktur Tabel
Pada suatu sistem informasi pasti ada penyimpanan data sehingga dibutuhkan
sebuah database yang dapat menyimpan data-data yang dimasukkan oleh user.
Berikut adalah struktur tabel pada Rancang Bangun Aplikasi E-Course Interaktif
Berbasiskan Website Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti:
41
a. Nama tabel : users

Fungsi : menyimpan data user
Tabel 4.5 Struktur Tabel users
No. Nama Atribut Tipe Data Keterangan
1. id Int(10) primary Key
2. full_name varchar(225)
3. username varchar(225) unique
5. email varchar(225) unique
6. password varchar(225)
7. address varchar(225)
8. avatar varchar(225)
9. admin Tinyint(1)
10. super_admin Tinyint(1)
11. remember_token varchar(100)
12. created_at timestamp
13. update_at timestamp
b. Nama tabel : categories

Fungsi : menyimpan data kategori
Tabel 4.6 Struktur Tabel categories
2. title varchar(225)
c. Nama tabel : channels

Fungsi : menyimpan data chanel
Tabel 4.7 Struktur Tabel channels
42
d. Nama tabel : course_packages

Fungsi : menyimpan data paket kursus
Tabel 4.8 Struktur Tabel course_packages
2. description text
3. title varchar(225) unique
5. price int(11) unique
6. month_expired int(11)
7. image varchar(225)
8. preview_link varchar(225)
9. channels_id int(11)
10. final_taskdescript text
e. Nama tabel : discussions

Fungsi : menyimpan data diskusi
Tabel 4.9 Struktur Tabel discussions
2. user_id int(11)
3. channel_id int(11)
5. category_id int(11)
6. images varchar(225)
8. content varchar(225)
9. channels_id int(11)
43
12. update_at Timestamp
f. Nama tabel : migrations

Fungsi : menyimpan data migrasi tabel di framework laravel.
Tabel 4.10 Struktur Tabel migrations
2. migration varchar(225)
3. batch Int(11)
g. Nama tabel : payment_logs

Fungsi : menyimpan data pembelian kursus.
Tabel 4.11 Struktur Tabel payment_logs
2. name varchar(225)
3. course varchar(225)
5. approved_by varchar(225)
6. total_price varchar(225)
7. payments_date date
8. content varchar(225)
12. updated_at timestamp
h. Nama tabel : played_videos

Fungsi : menyimpan data video yang sudah diputar.
Tabel 4.12 Struktur Tabel played_videos
2. video_id Int(10)
3. usercourse_id Int(10)
44
i. Nama tabel : quizzes

Fungsi : menyimpan data tugas kursus.
Tabel 4.13 Struktur Tabel quizzes
2. video_id Int(10)
3. description text
j. Nama tabel : replies

Fungsi : menyimpan data komentar pada diskusi.
Tabel 4.14 Struktur Tabel replies
2. user_id Int(10)
3. discussion_id Int(10)
5. best_answer tinyint
6. conten text
k. Nama tabel : report_discussions

Fungsi : menyimpan data report pada diskusi.
Tabel 4.15 Struktur Tabel report_discussions
2. user_id Int(11)
4. reason varchar(225)
45
l. Nama tabel : report_videos

Fungsi : menyimpan data report pada video.
Tabel 4.16 Struktur Tabel report_videos
1. Id Int(10) primary Key
2. user_id Int(11)
3. video_id Int(11)
5. Reason varchar(225)
m. Nama tabel : tasks

Fungsi : menyimpan data tugas akhir kursus.
Tabel 4.17 Struktur Tabel tasks
2. usercourse_id Int(11)
3. file varchar(225)
5. description text
6. status tinyint
7. completion_date date
n. Nama tabel : totalviews

Fungsi : menyimpan data total yang telah melihat diskusi.
Tabel 4.18 Struktur Tabel totalviews
46
2. user_id Int(10)
o. Nama tabel : upvotes

Fungsi : menyimpan data upvote pada komentar diskusi.
Tabel 4.19 Struktur Tabel upvotes
2. user_id Int(10)
3. reply_id Int(10)
p. Nama tabel : users_courses

Fungsi : menyimpan data kursus pengguna.
Tabel 4.20 Struktur Tabel users_courses
2. user_id Int(11)
3. package_id Int(11)
5. payment_status tinyint
6. start_date date
7. expired_date date
47
q. Nama tabel : user_quizzes

Fungsi : menyimpan data tugas kursus pengguna.
Tabel 4.21 Struktur Tabel user_quizzes

2. quiz_id Int(11)
3. user_id Int(11)
5. file varchar(255)
6. status tinyint
7. completion_date date
r. Nama tabel : videos

Fungsi : menyimpan data video kursus.
Tabel 4.22 Struktur Tabel videos
2. name varchar(255)
3. package_id Int(11)
6. step Int(11)
7. link text
4.4. Perancangan Antarmuka

Perancangan Antarmuka merupakan sketsa dasar dari pembuatan bentuk
tampilan sistem. Perancangan ini berguna untuk memberikan gambaran bagaimana
tampilan sistem yang akan diimplementasikan nantinya.
48
4.4.1. Desain Antarmuka

Berikut merupakan desain antarmuka :
1. Halaman Login
Login merupakan halaman pertama yang muncul ketika sistem diakses oleh
user. Pada halaman login, user harus menginputkan data sesuai dengan field yang
sudah disediakan. Berikut adalah rancangan antarmuka Halaman Login :
Gambar 4.19 Rancangan Antarmuka Halaman Login
2. Halaman Daftar
Daftar merupakan halaman yang muncul ketika oleh user belum memiliki akun
untuk login. Pada halaman Daftar, user harus menginputkan data sesuai dengan field
yang sudah disediakan. Berikut adalah rancangan antarmuka Halaman Daftar:
Gambar 4.20 Rancangan Antarmuka Halaman Daftar

49
3. Halaman Home
Home merupakan halaman yang muncul ketika oleh user berhasil login. Pada
Halaman Home, User dapat melihat list berbagai diskusi. Berikut adalah rancangan
antarmuka Halaman Home:
Gambar 4.21 Rancangan Antarmuka Halaman Home
4. Halaman Buat Topik Baru

Buat Topik Baru merupakan halaman yang muncul ketika oleh user akan
membuat topik diskusi yang baru. Pada Halaman Buat Topik Baru, User harus
menginputkan data sesuai dengan field yang sudah disediakan. Berikut adalah
rancangan antarmuka Halaman Buat Topik Baru:
Gambar 4.22 Rancangan Antarmuka Halaman Buat Topik Baru

50
5. Halaman Tampil Diskusi

Pada Halaman Tampil Diskusi, User dapat melihat detail diskusi yang
diinginkan. Berikut adalah rancangan antarmuka Halaman Tampil Diskusi:
Gambar 4.23 Rancangan Antarmuka Halaman Tampil Diskusi
6. Halaman Profile Saya

Pada Halaman Profile Saya, User dapat melihat informasi diri secara detail.
Berikut adalah rancangan antarmuka Halaman Profile Saya:
Gambar 4.24 Rancangan Antarmuka Halaman Profile Saya

51
7. Halaman Semua Kursus

Pada Halaman Semua Kursus, User dapat melihat informasi semua kursus
yang sudah tersedia. Berikut adalah rancangan antarmuka Halaman Semua Kursus:
Gambar 4.25 Rancangan Antarmuka Halaman Semua Kursus
8. Halaman Kursus Saya

Pada Halaman Kursus Saya, User dapat melihat informasi kursus yang sudah
dibayar ataupun belum dibayar. Berikut adalah rancangan antarmuka Halaman
Kursus Saya:
Gambar 4.26 Rancangan Antarmuka Halaman Kursus Saya

52
9. Halaman Detail Kursus Saya

Pada Halaman Detail Kursus Saya, User dapat melihat detail informasi kursus
yang sudah dibayar. Berikut adalah rancangan antarmuka Halaman Detail Kursus
Saya:
Gambar 4.27 Rancangan Antarmuka Halaman Detail Kursus Saya
10. Halaman Putar Video

Pada Halaman Putar Video, User dapat menonton video dari kursus yang
sudah dibayar. Berikut adalah rancangan antarmuka Halaman Putar Video:
Gambar 4.28 Rancangan Antarmuka Halaman Putar Video

53
11. Halaman Admin Dashboard

Pada Halaman Admin Dashboard, Admin dapat melihat informasi fitur
halaman admin secara keseluruhan . Berikut adalah rancangan antarmuka Halaman
Admin Dashboard:
Gambar 4.29 Rancangan Antarmuka Halaman Admin Dashboard
12. Halaman Admin Report Diskusi

Pada Halaman Admin Report Diskusi , Admin dapat melihat informasi diskusi
yang telah direport semua user. Berikut adalah rancangan antarmuka Halaman Admin
Report Diskusi :
Gambar 4.30 Rancangan Antarmuka Halaman Admin Report Diskusi

54
13. Halaman Admin Report Video

Pada Halaman Admin Report Video, Admin dapat melihat informasi video
yang telah direport Anggota. Berikut adalah rancangan antarmuka Halaman Admin
Report Video:
Gambar 4.31 Rancangan Antarmuka Halaman Admin Report Video
14. Halaman Admin Video

Pada Halaman Admin Video, Admin dapat melihat informasi video disetiap
paket kursus. Berikut adalah rancangan antarmuka Halaman Admin Video:
Gambar 4.32 Rancangan Antarmuka Halaman Admin Video

55
15. Halaman Admin Daftar Anggota

Pada Halaman Admin Daftar Anggota, Admin dapat melihat informasi
keseluruhan Anggota. Berikut adalah rancangan antarmuka Halaman Admin Daftar
Anggota :
Gambar 4.33 Rancangan Antarmuka Halaman Admin Anggota
16. Halaman Admin Pembayaran Kursus

Pada Admin Halaman Pembayaran, Admin dapat melihat informasi
pembayaran kursus. Berikut adalah rancangan antarmuka Halaman Admin
Pembayaran Kursus:
Gambar 4.34 Rancangan Antarmuka Halaman Admin Pembayaran Kursus

56
17. Halaman Admin Tugas Kursus

Pada Halaman Admin Tugas Kursus, Admin dapat melihat informasi tugas
kursus yang dikumpulkan Anggota. Berikut adalah rancangan antarmuka Halaman
Admin Tugas Kursus:
Gambar 4.35 Rancangan Antarmuka Halaman Admin Tugas Kursus
18. Halaman Admin Tugas Akhir Kursus

Pada Halaman Admin Tugas Akhir Kursus, Admin dapat melihat informasi
tugas akhir kursus yang dikumpulkan Anggota. Berikut adalah rancangan antarmuka
Halaman Admin Tugas Akhir Kursus:
Gambar 4.36 Rancangan Antarmuka Halaman Admin Tugas Akhir Kursus

57
19. Halaman Super Admin Dashboard

Pada Halaman Super Admin Dashboard, Super Admin dapat melihat
informasi fitur halaman super admin secara keseluruhan . Berikut adalah rancangan
antarmuka Halaman Super Admin Dashboard:
Gambar 4.37 Rancangan Antarmuka Halaman Super Admin Dashboard
20. Halaman Super Admin Laporan Pembelian

Pada Halaman Super Admin Laporan Pembelian, Super Admin dapat melihat
informasi laporan pembelian kursus . Berikut adalah rancangan antarmuka Halaman
Super Admin Laporan Pembelian:
Gambar 4.38 Rancangan Antarmuka Halaman Super Admin Laporan Pembelian

58
21. Halaman Super Admin Daftar Admin

Pada Halaman Super Admin Daftar Admin, Super Admin dapat melihat
informasi user yang terdaftar sebagai Admin. Berikut adalah rancangan antarmuka
Halaman Super Admin Daftar Admin:
Gambar 4.39 Rancangan Antarmuka Halaman Super Admin Daftar Admin
22. Halaman Super Admin Daftar Chanel

Pada Halaman Super Admin Daftar Chanel, Super Admin dapat melihat
informasi chanel. Berikut adalah rancangan antarmuka Halaman Super Admin Daftar
Chanel:
Gambar 4.40 Rancangan Antarmuka Halaman Super Admin Daftar Chanel

59
23. Halaman Super Admin Daftar Kategori

Pada Halaman Super Admin Daftar Kategori, Super Admin dapat melihat
informasi kategori. Berikut adalah rancangan antarmuka Halaman Super Admin Daftar
Kategori:
Gambar 4.41 Rancangan Antarmuka Halaman Super Admin Daftar Kategori
24. Halaman Super Admin Daftar Paket Kursus

Pada Halaman Super Admin Daftar Paket Kursus, Super Admin dapat
melihat informasi paket kursus. Berikut adalah rancangan antarmuka Halaman Super
Admin Daftar Paket Kursus:
Gambar 4.42 Rancangan Antarmuka Halaman Super Admin Daftar Paket Kursus
60
4.5. Implementasi Sistem

Pada implementasi Rancang Bangun Aplikasi E-Course Interaktif Berbasiskan
Website Menggunakan Laravel Pada Yayasan Kampus Amerta Bakti terdapat
beberapa tampilan yang sudah dibuat berdasarkan perancangan sebelumnya.
Adapun hasil implementasi sistem yang dimaksud adalah sebagai berikut :
4.5.1. Implementasi Halaman User

1. Halaman Login
Halaman Login merupakan halaman pada sistem yang bertujuan untuk
memvalidasi user yang dapat mengakses sistem. Pada halaman ini user email atau
username dan password untuk mengakses sistem.
Gambar 4.43 Halaman Login
2. Halaman Daftar
Halaman Daftar merupakan halaman pada sistem yang bertujuan untuk
membuat akun untuk user yang belum memilikinya. Pada halaman ini user harus
melengkapi field yang sudah tersedia untuk membuat akun.
61
Gambar 4.44 Halaman Daftar
3. Halaman Home
Halaman Home merupakan halaman pada sistem yang akan muncul setelah
user berhasil login atauapun daftar. Pada halaman ini user harus melengkapi field
yang sudah tersedia untuk membuat akun.
62
Gambar 4.45 Halaman Home
4. Halaman Buat Topik Baru

Halaman Buat Topik Baru merupakan halaman pada sistem yang akan muncul
saat user akan membuat diskusi baru. Pada halaman ini user harus melengkapi field
yang sudah tersedia untuk membuat diskusi.
Gambar 4.46 Halaman Buat Topik Baru
5. Halaman Tampil Topik Diskusi

Halaman Tampil Topik Diskusi merupakan halaman pada sistem yang akan
muncul saat user ingin melihat topik diskusi. Pada halaman ini user dapat melihat
secara detail topik diskusi yang sudah tersedia.
Gambar 4.47 Halaman Tampil Topik Diskusi

63
6. Halaman Profile Saya

Halaman Profile Saya merupakan halaman pada sistem yang akan muncul
saat user ingin melihat profilenya sendiri. Pada halaman ini user dapat melihat secara
detail profile nya sendiri.
Gambar 4.48 Halaman Tampil Topik Diskusi
7. Halaman Semua Kursus

Halaman Semua Kursus merupakan halaman pada sistem yang akan muncul
saat user ingin melihat semua kursus yang tersedia. Pada halaman ini user dapat
melihat secara detail semua kursus.
Gambar 4.49 Halaman Semua Kursus

64
8. Halaman Kursus Saya

Halaman Kursus Saya merupakan halaman pada sistem yang akan muncul
saat Anggota ingin melihat semua kursus yang sudah dipesan baik bayar ataupun
belum bayar. Pada halaman ini user dapat melihat secara detail kursus yang dipesan.
Gambar 4.50 Halaman Kursus Saya
9. Halaman Detail Kursus Saya

Halaman Detail Kursus Saya merupakan halaman pada sistem yang akan
muncul saat Anggota ingin melihat secara detail kursus yang sudah dibayar.
Gambar 4.51 Halaman Detail Kursus Saya

65
10. Halaman Putar Video

Halaman Putar Video merupakan halaman pada sistem yang akan muncul
saat Anggota ingin menonton video kursus yang sudah dibayar.
Gambar 4.52 Halaman Putar Video
4.5.2. Implementasi Halaman Admin

1. Halaman Admin Dashboard
Halaman Admin Dashboard merupakan halaman pada sistem yang akan
muncul diawal memasuki halaman Admin. Pada halaman ini Admin dapat melihat
secara keseluruhan menu Admin.
Gambar 4.53 Halaman Admin Dashboard
2. Halaman Admin Report Diskusi

Halaman Admin Report Diskusi merupakan halaman pada sistem yang akan
muncul saat Admin akan melihat daftar report pada diskusi.
66
Gambar 4.54 Halaman Admin Report Diskusi
3. Halaman Admin Report Video

Halaman Admin Report Video merupakan halaman pada sistem yang akan
muncul saat Admin akan melihat daftar report pada video.
Gambar 4.55 Halaman Admin Report Video

67
4. Halaman Admin Video

Halaman Admin Video merupakan halaman pada sistem yang akan muncul
saat Admin akan melihat daftar video pada kursus.
Gambar 4.56 Halaman Admin Video
5. Halaman Admin Daftar Anggota

Halaman Admin Daftar Anggota merupakan halaman pada sistem yang akan
muncul saat Admin akan melihat daftar Anggota pada sistem.
Gambar 4.57 Halaman Admin Daftar Anggota

68
6. Halaman Admin Daftar Pembayaran

Halaman Admin Daftar Pembayaran merupakan halaman pada sistem yang
akan muncul saat Admin akan melihat daftar pembayaran Anggota pada kursus.
Gambar 4.58 Halaman Admin Daftar Pembayaran
7. Halaman Admin Tugas Kursus

Halaman Admin Tugas Kursus merupakan halaman pada sistem yang akan
muncul saat Admin akan melihat daftar tugas kursus Anggota.
Gambar 4.59 Halaman Admin Daftar Pembayaran

69
8. Halaman Admin Tugas Akhir Kursus

Halaman Admin Tugas Akhir Kursus merupakan halaman pada sistem yang
akan muncul saat Admin akan melihat daftar tugas akhir kursus Anggota.
Gambar 4.60 Halaman Tugas Akhir Kursus
4.5.3. Implementasi Halaman Super Admin

1. Halaman Super Admin Dashboard
Halaman Super Admin Dashboard merupakan halaman pada sistem yang
akan muncul diawal memasuki halaman Super Admin. Pada halaman ini Super Admin
dapat melihat secara keseluruhan menu Super Admin.
Gambar 4.61 Halaman Super Admin Dashboard

70
2. Halaman Super Admin Laporan Pembelian

Halaman Super Admin Laporan Pembelian merupakan halaman pada sistem
yang akan muncul saat Super Admin akan melihat daftar kursus Anggota yang sudah
dibayar.
Gambar 4.62 Halaman Super Admin Laporan Pembelian
3. Halaman Super Admin Daftar Admin

Halaman Super Admin Daftar Admin merupakan halaman pada sistem yang
akan muncul saat Super Admin akan melihat daftar Admin pada sistem.
Gambar 4.63 Halaman Super Admin Daftar Admin

71
4. Halaman Super Admin Daftar Chanel

Halaman Super Admin Daftar Chanel merupakan halaman pada sistem yang
akan muncul saat Super Admin akan melihat daftar Chanel pada sistem.
Gambar 4.64 Halaman Super Admin Daftar Chanel
5. Halaman Super Admin Daftar Kategori

Halaman Super Admin Daftar Kategori merupakan halaman pada sistem yang
akan muncul saat Super Admin akan melihat daftar Kategori pada sistem.
Gambar 4.65 Halaman Super Admin Daftar Kategori

72
6. Halaman Super Admin Daftar Paket Kursus

Halaman Super Admin Daftar Paket Kursus merupakan halaman pada sistem
yang akan muncul saat Super Admin akan melihat daftar Paket Kursus pada sistem.
Gambar 4.66 Halaman Super Admin Daftar Paket Kursus
4.6. Pengujian Sistem

Pengujian sistem merupakan tahap yang wajib dilakukan ketika membangun
sebuah sistem. Pengujian sistem dilakukan biasanya setelah pembuatan sistem
selesai. Pengujian sistem dilakukan dengan menguji antarmuka sistem apakah sudah
berjalan sesuai dengan fungsi yang diinginkan. Pengujian ini dilakukan sendiri oleh
penulis selaku pengembang sistem dan bertujuan untuk mengetahui kesalahan pada
sistem yang dibuat. Pengujiannya menggunakan Blackbox Testing.
4.6.1 Pengujian Pada Halaman User

Berikut merupakan hasil pengujian untuk halaman User:
73
1. Hasil Pengujian Halaman Login User

Berikut adalah hasil pengujian untuk Halaman Login User:
Tabel 4.23 Hasil Pengujian Halaman Login User
Hasil yang
No Kelas Uji Hasil Pengujian Keterangan
Diharapkan
Tampil Halaman Sistem pertama Sistem berhasil Sesuai
Login kali menampilkan menampilkan
1 Halaman Login Halaman Login
saat sistem saat sistem
diakses diakses
Input Username Sistem menerima Sistem berhasil Sesuai
atau Email: data login user dan menerima data
2 Benar meneruskan user login user dan
Input Password: ke halaman Home. meneruskan user
Benar ke halaman Home
Input Username Data login user Sistem berhasil Sesuai
atau Email: ditolak dan muncul menolak data
Salah atau pesan peringatan login user, muncul
3 Kosong pesan peringatan,
Input Password: dan user tidak
Salah atau dapat memasuki
Kosong sistem
2. Hasil Pengujian Halaman Daftar User

Berikut adalah hasil pengujian untuk Halaman Daftar User:
Tabel 4.24 Hasil Pengujian Halaman Daftar User
Hasil yang
Diharapkan
Klik Tombol Sistem Sistem berhasil Sesuai
1 Daftar menampilkan menampilkan
halaman daftar halaman daftar
74
Input Field: Sistem menerima Sistem berhasil Sesuai

Benar data daftar user menerima data
2 dan meneruskan daftar user dan
user ke halaman meneruskan user
Home. ke halaman Home
Input Field: Data daftar user Sistem berhasil Sesuai
Salah atau Tidak ditolak dan muncul menolak data
Lengkap pesan peringatan daftar user,
3 muncul pesan
peringatan, dan
user tidak dapat
memasuki sistem
3. Hasil Pengujian Halaman Home.

Berikut adalah hasil pengujian untuk Halaman Home:
Tabel 4.25 Hasil Pengujian Halaman Home.
Hasil yang
Diharapkan
Klik Tombol Buat Sistem Sistem berhasil Sesuai
Topik Baru menampilkan menampilkan
1
halaman buat topik halaman topik
baru baru
Klik logo Sistem kembali Sistem berhasil Sesuai
menampilkan kembali
2
halaman home menampilkan
halaman home
Klik Menu Sistem Sistem berhasil Sesuai
Kursus : anggota menampilkan dua menampilkan dua
menu lainnya yaitu menu lainnya
3
semua kursus dan yaitu semua
kursus saya kursus dan kursus
saya
75
Klik Menu Sistem akan Sistem berhasil sesuai

Kursus : admin menampilkan satu menampilkan satu
4
dan super admin dropdown yaitu dropdown yaitu
semua kursus semua kursus
Klik dropdown Sistem akan Sistem berhasil sesuai
semua kursus menampilkan menampilkan
5
halaman semua halaman semua
kursus kursus
Klik dropdown Sistem akan Sistem berhasil sesuai
kursus saya menampilkan menampilkan
6
halaman kursus halaman kursus
saya saya
Klik menu Sistem akan Sistem berhasil sesuai
dropdown user : menampilkan menampilkan
7 anggota dropdown yaitu dropdown yaitu
profile saya dan profile saya dan
keluar keluar
Klik menu Sistem akan Sistem berhasil Sesuai
admin dan super dropdown yaitu dropdown yaitu
8
admin halaman admin, halaman admin,
profile saya dan profile saya dan
keluar keluar
Klik menu Sistem Sistem berhasil sesuai
9
profile saya halaman profile halaman profile
user. user.
10 keluar halaman login dan halaman login dan
user keluar dari user keluar dari
sistem sistem
76

dropdown menampilkan menampilkan
11
halaman admin : halaman admin halaman admin
admin
Klik menu Sistem Sistem berhasil Sesuai
dropdown menampilkan menampilkan
12
halaman admin : halaman super halaman super
super admin admin admin
4. Hasil Pengujian Halaman Buat Topik Baru

Berikut adalah hasil pengujian untuk Halaman Buat Topik Baru:
Tabel 4.26 Hasil Pengujian Halaman Buat Topik Baru
Hasil yang
Diharapkan
Input Field: Sistem menerima Sistem berhasil Sesuai
Benar data topik user dan menerima data
kembali ke topik user dan
1
halaman buat topik kembali ke
baru. halaman buat
topik baru.
Input Field: Data topik user Sistem berhasil Sesuai
Salah atau Tidak ditolak dan muncul menolak data
Lengkap pesan peringatan topik user, muncul
2 pesan peringatan,
dan user tidak
dapat membuat
topik baru.
77
5. Hasil Pengujian Halaman Profile Saya

Berikut adalah hasil pengujian untuk Halaman Profile Saya:
Tabel 4.27 Hasil Pengujian Halaman Profile Saya
Hasil yang
Diharapkan
Klik Tombol Edit Sistem Sistem berhasil Sesuai
menampilkan menampilkan
1
halaman edit halaman edit
profile saya profile saya
6. Hasil Pengujian Halaman Edit Profile Saya

Berikut adalah hasil pengujian untuk Halaman Edit Profile Saya:
Tabel 4.28 Hasil Pengujian Halaman Edit Profile Saya
Hasil yang
Diharapkan
Klik Tombol Batal Sistem Sistem berhasil Sesuai
1
kembali halaman kembali halaman
profile saya profile saya
Klik Tombol Sistem menerima Sistem berhasil Sesuai
Simpan data update profile menerima data
Perubahan, Input user dan kembali update profile
2 Field: Benar ke halaman update user dan kembali
profile saya. ke halaman buat
update profile
saya.
Klik Tombol Data update profile Sistem berhasil Sesuai
Simpan user ditolak dan menolak data
Perubahan, Input muncul pesan update profile
3
Field: Salah atau peringatan user, muncul
Tidak Lengkap pesan peringatan,
dan user tidak
78
dapat
mempebaharui
profile.
7. Hasil Pengujian Halaman Semua Kursus

Berikut adalah hasil pengujian untuk Halaman Semua Kursus:
Tabel 4.29 Hasil Pengujian Halaman Semua Kursus
Hasil yang
Diharapkan
Detail menampilkan menampilkan
1
halaman detail halaman detail
kursus kursus
8. Hasil Pengujian Halaman Detail Kursus

Berikut adalah hasil pengujian untuk Halaman Detail Kursus:
Tabel 4.30 Hasil Pengujian Halaman Detail Kursus.
Hasil yang
Diharapkan
Klik Tombol Beli Sistem menerima Sistem berhasil Sesuai
Kursus data kursus dan menerima data
meneruskan ke kursus dan
1
halaman kursus meneruskan ke
saya. halaman kursus
saya.
79
9. Hasil Pengujian Halaman Kursus Saya

Berikut adalah hasil pengujian untuk Halaman Kursus Saya:
Tabel 4.31 Hasil Pengujian Halaman Kursus Saya.
Hasil yang
Diharapkan
Tonton : jika menampilkan menampilkan
1 batas waktu halaman list video halaman list video
kursus belum kursus kursus
habis
Tonton : jika menampilkan menampilkan
2 batas waktu kembali halaman kembali halaman
kursus sudah kursus saya kursus saya
habis
Klik Tombol Info Sistem Sistem berhasil Sesuai
3 menampilkan alert menampilkan alert
info pembayaran info pembayaran.
Klik Tombol Sistem menghapus Sistem berhasil Sesuai
4 Hapus kursus user yang kursus user yang
dipilih dipilih
10. Hasil Pengujian Halaman List Video Kursus

Berikut adalah hasil pengujian untuk Halaman List Video Kursus:
Tabel 4.32 Hasil Pengujian Halaman List Video Kursus
Hasil yang
Diharapkan
Klik Tombol Sistem akan Sistem berhasil Sesuai
1 Cetak Sertifikat memberikan file memberikan file
sertifikat kursus sertifikat kursus
80
Klik Tombol Play Sistem Sistem berhasil Sesuai

2
halaman tonton halaman tonton
video video
Kumpul Tugas menampilkan menampilkan
3
halaman kumpul halaman kumpul
tugas kursus tugas kursus
4
Akhir halaman kumpul halaman kumpul
tugas akhir kursus tugas akhir kursus
Video menampilkan menampilkan
5
Selanjutnya halaman video halaman video
Klik Menu Baca Sistem Sistem berhasil Sesuai
Ketentuan menampilkan alert menampilkan alert
6
info cetak sertifikat info cetak
sertifikat
11. Hasil Pengujian Halaman Tonton Video Kursus

Berikut adalah hasil pengujian untuk Halaman Tonton Video Kursus:
Tabel 4.33 Hasil Pengujian Halaman Tonton Video Kursus
Hasil yang
Diharapkan
Klik Menu Sistem akan Sistem berhasil Sesuai
Selanjutnya menampilkan menampilkan
1
halaman video halaman video
selanjutnya selanjutnya
81

Sebelumnya menampilkan menampilkan
2
halaman video halaman video
sebelumnya sebelumnya
Report menampilkan menampilkan
3
halaman report halaman report
video video
4
halaman kumpul halaman kumpul
5
Akhir halaman kumpul halaman kumpul
12. Hasil Pengujian Halaman Report Video

Berikut adalah hasil pengujian untuk Halaman Report Video:
Tabel 4.34 Hasil Pengujian Halaman Report Video
Hasil yang
Diharapkan
Kirim : Input menerima data menerima data
sudah benar report video lalu report video lalu
kembali ke kembali ke
1 halaman report halaman report
video dan video dan
memunculkan alert memunculkan
sukses mengirim alert sukses
report mengirim report
82

Kirim : Input menolak data menolak data
salah atau report video dan report video dan
2
kurang lengkap kembali ke kembali ke
video video
Klik Tombol Sistem akan Sistem akan Sesuai
Kirim : data menolak data menolak data
report video report video lalu report video lalu
sudah ada kembali ke kembali ke
3
video dan video dan
alert
13. Hasil Pengujian Halaman Report Diskusi

Berikut adalah hasil pengujian untuk Halaman Report Diskusi:
Tabel 4.35 Hasil Pengujian Halaman Report Diskusi
Hasil yang
Diharapkan
Kirim : Input menerima data menerima data
sudah benar report diskusi lalu report diskusi lalu
kembali ke kembali ke
1 halaman report halaman report
diskusi dan diskusi dan
sukses mengirim alert sukses
report mengirim report
2 Kirim : Input menolak data menolak data
report diskusi dan report diskusi dan
83
salah atau kembali ke kembali ke

kurang lengkap halaman report halaman report
diskusi diskusi
Klik Tombol Sistem akan Sistem akan Sesuai
Kirim : data menolak data menolak data
report video report diskusi lalu report diskusi lalu
sudah ada kembali ke kembali ke
3
diskusi dan diskusi dan
alert
14. Hasil Pengujian Halaman Kumpul Tugas Kursus

Berikut adalah hasil pengujian untuk Halaman Kumpul Tugas Kursus:
Tabel 4.36 Hasil Pengujian Halaman Kumpul Tugas Kursus
Hasil yang
Diharapkan
Telusuri memunculkan memunculkan
1 tampilan untuk tampilan untuk
memilih file yang memilih file yang
akan di upload akan di upload
Klik Tombol Kirim Sistem akan Sistem berhasil Sesuai
menerima file menerima file
2
tugas kursus yang tugas kursus yang
dipilih dipilih
3 Hapus menghapus file menghapus file
84
15. Hasil Pengujian Halaman Kumpul Tugas Akhir Kursus

Berikut adalah hasil pengujian untuk Halaman Kumpul Tugas Akhir Kursus:
Tabel 4.37 Hasil Pengujian Halaman Kumpul Tugas Akhir Kursus
Hasil yang
Diharapkan
Telusuri memunculkan memunculkan
1 tampilan untuk tampilan untuk
memilih file yang memilih file yang
akan di upload akan di upload
Klik Tombol Kirim Sistem akan Sistem berhasil Sesuai
menerima file menerima file
2
yang dipilih yang dipilih
3 Hapus menghapus file menghapus file
4.6.2 Pengujian Pada Halaman Admin

Berikut merupakan hasil pengujian untuk halaman Admin:
1. Hasil Pengujian Menu Sidebar Admin
Berikut adalah hasil pengujian untuk Menu Sidebar Admin:
Tabel 4.38 Hasil Pengujian Menu Sidebar Admin
Hasil yang
Diharapkan
Klik Menu Data Sistem akan Sistem berhasil Sesuai
Report Diskusi memunculkan memunculkan
1
halaman data halaman data
report diskusi report diskusi
2 Report Video memunculkan memunculkan
85

report video report video

Video memunculkan memunculkan
3
video video
Tambah Data memunculkan memunculkan
4
Video halaman tambah halaman tambah
video video
Anggota memunculkan memunculkan
5
anggota anggota
Klik Menu Belum Sistem akan Sistem berhasil Sesuai
Bayar memunculkan memunculkan
6
halaman belum halaman belum
bayar bayar
Klik Menu Sudah Sistem akan Sistem berhasil Sesuai
Bayar memunculkan memunculkan
7
halaman sudah halaman sudah
bayar kursus bayar kursus
Klik Menu Lolos Sistem akan Sistem berhasil Sesuai
Tugas Kursus memunculkan memunculkan
8
halaman lolos halaman lolos
Lolos Tugas memunculkan memunculkan
9
Kursus halaman belum halaman belum
lolos tugas kursus lolos tugas kursus
86
Klik Menu Sudah Sistem akan Sistem berhasil Sesuai

10 Akhir Kursus halaman sudah halaman sudah
lolos tugas akhir lolos tugas akhir
kursus kursus
11 Akhir Kursus halaman belum halaman belum
lolos tugas akhir lolos tugas akhir
kursus kursus
4.6.3 Pengujian Pada Halaman Super Admin

Berikut merupakan hasil pengujian untuk halaman Admin:
1. Hasil Pengujian Menu Sidebar Super Admin
Berikut adalah hasil pengujian untuk Menu Sidebar Super Admin:
Tabel 4.36 Hasil Pengujian Menu Sidebar Super Admin
Hasil yang
Diharapkan
Tambah Chanel memunculkan memunculkan
1
halaman tambah halaman tambah
chanel chanel
Klik Menu Daftar Sistem akan Sistem berhasil Sesuai
Chanel memunculkan memunculkan
2
chanel chanel
Video memunculkan memunculkan
3
video video
87

Tambah Kategori memunculkan memunculkan
4
halaman tambah halaman tambah
kategori kategori
Klik Menu daftar Sistem akan Sistem berhasil Sesuai
kategori memunculkan memunculkan
5
kategori kategori
tambah paket memunculkan memunculkan
6
kursus halaman tambah halaman tambah
paket kursus paket kursus
Klik Menu Daftar Sistem akan Sistem berhasil Sesuai
Paket Kursus memunculkan memunculkan
7
paket kursus paket kursus
Laporan memunculkan memunculkan
8
Pembelian halaman laporan halaman laporan
pembelian pembelian
Admin memunculkan memunculkan
9
admin admin
Anggota memunculkan memunculkan
10
anggota anggota
88

BAB V
PENUTUP
5.1 Kesimpulan
Berdasarkan hasil perekayasaan yang telah dilakukan, kesimpulan yang dapat
diambil dari perekayasaan ini adalah:
1. Menghasilkan suatu Rancang Bangun Aplikasi E-Course Interaktif
Berbasiskan Website Menggunakan Laravel Pada Yayasan Kampus Amerta
Bakti.
2. Sistem ini telah melalui proses perancangan dengan menggunakan DFD,
ERD, Basis Data Konseptual dan Struktur Tabel.
3. Sistem ini memiliki fitur untuk mengikuti kursus yang disediakan oleh Yayasan
Kampus Amerta Bakti, fitur untuk berdiskusi pada forum online dan setiap
kursus yang diselesaikan terdapat sertifikat yang dapat diunduh.
4. Pengujian pada sistem ini menggunakan Black Box Testing dan seluruh
pengujian yang dilakukan telah memperoleh hasil yang sesuai.
5.2 Saran
Adapun saran yang diberikan untuk pengembangan sistem ini agar menjadi
lebih baik adalah sebagai berikut:
1. Sistem ini dapat dikembangkan ke platform mobile agar pengguna menjadi
lebih mudah untuk melakukan pengelolaan data pada sistem.
2. Sistem ini dapat diuji dengan metode pengujian lain seperti Whitebox Testing
untuk menguji setiap unit fungsi yang ada secara internal.
89
90

DAFTAR PUSTAKA
[1] Hengki Tamando Sitohang, “Pembuatan Aplikasi E-Learning Pada SMK

Swasta Pariwisata Imelda Medan”, STIMIK Pelita Nusantara Medan 2017.
[2] Asvika, Regi, “Optimasi E-Kursus Bahasa Inggris Menggunakan Model
Fast LPK Kampoes Inggris Pangkalpinang”, Pangkalpinang: Stimik Atma
Luhur Pangkal Pinang, 2019.
[3] I Gede Suputra Widharma, “Perancangan Simulasi Sistem Pendaftaran
Kursus Berbasis Web Dengan Metode SDLC”, Politeknik Negeri Bali,.
2017.
[4] Mulyadi, Hoiriah, Deddy Supriadi, Rina Mugiati, “Sistem Informasi
Pendaftaran Kursus Berbasis Web Pada Yayasan Musik Jakarta”, IJCIT
(Indonesian Journal on Computer and Information Technology),
Vol.3.No.2, November 2018.
[5] Wanda Kurniawan, Andi Suprianto, B.Sumardiyono, “Rancangan Sistem
Forum Diskusi Online Untuk Program Studi Sistem Informasi Antara Dosen
Dan Mahasiswa”, Jurnal Rekayasa Informasi, Vol.5 No.2, Oktober 2016.
[6] Yakub, Pengantar Sistem Informasi, Yogyakarta: Graha Ilmu, 2012.
[7] KBBI,2019.Kamus Besar Bahasa Indonesia (KBBI).[Online, diakses 29
Oktober 2019].
[8] Monalia Mariana(113040388), Universitas Pasundan, “Apa Itu E-
Commerce”. [Online, diakses 1 November 2019 ].
[9] Ariyawan Agung Nugroho, Sunaryo Soenarto, Fakultas Ilmu Pendidikan
UNY, Fakultas Teknik UNY, “Pengembangan Website Interaktif Sebagai
Computer-Mediated Communication Untuk Pembelajaran Jaringan
Komputer”.
[10] H. M. Jogiyanto, Desain Analisis & Desain Sistem Informasi, Yogyakarta:
ANDI OFFSET, 2005.
[11] A. Kadir, Mudah Mempelajari Database MySQL. Yogyakarta: Andi, 2010.
[12] I. Warman and R. Ramdaniansyah, “ANALISIS PERBANDINGAN
KINERJA QUERY DATABASE MANAGEMENT SYSTEM ( DBMS ),” vol.
6, no. 1, pp. 32–41, 2018.
[13] Y. Yudhanto and P. Helmi Adi, Mudah Menguasai Framework Laravel. Elex
Media Komputindo, 2019.
91
92
[14] J.F. Lepine, [Online]. Tersedia : http://www.phpmetrics.org, [Diakses : 3

November 2019].
[15] "Getting Started", 2018, [Online]. Tersedia :
https://code.visualstudio.com/docs [Diakses: 04 November 2019].
[16] Sutanta,Edhy, Basis Data dalamTinjauan Konseptual, Edisi I,Yogyakarta :
ANDI, 2011.
[17] Sutabri Tata. Analisis Sistem Informasi. Yogyakarta: CV ANDI OFFSET.
2012.
[18] Pratama E, Sistem Informasi dan Implementasinya, Bandung: Informatika
Bandung, 2014.
[19] Soetam Rizky Wicaksono, “Rekayasa Perangkat Lunak”, Penerbit Seribu
Bintang, 2017.

Ta 2

Diunggah oleh

Informasi Dokumen

Deskripsi Asli:

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Ta 2

Diunggah oleh

Hak Cipta:

Format Tersedia

RANCANG BANGUN APLIKASI E-COURSE INTERAKTIF

BERBASISKAN WEBSITE MENGGUNAKAN LARAVEL PADA

PUTU BAGUS WILLIE YUDHA MAHESWARA (160030219)

INSTITUT TEKNOLOGI DAN BISNIS

DIAJUKAN SEBAGAI SALAH SATU SYARAT UNTUK MENCAPAI

GELAR SARJANA PROGRAM STUDI S1-SISTEM INFORMASI

PUTU BAGUS WILLIE YUDHA MAHESWARA (160030219)

INSTITUT TEKNOLOGI DAN BISNIS

RANCANG BANGUN APLIKASI E-COURSE INTERAKTIF

Dosen Pembimbing Tanda Tangan Tanggal

I Gusti Ngurah Ady Kusuma, S.Kom., M.Kom ……………….. ………….

Agus Purwanto, S.S., M.Kom ……………….. ………….

Ricky Aurelius Nurtanto Diaz, S.Kom., MT

Saya yang bertanda tangan dibawah ini:

(Putu Bagus Willie Yudha

Keywords: Interactive E-Course Application, Application, Amerta Bakti Campus

1. Rektor ITB STIKOM Bali Bapak Dr. Dadang Hermawan.

PERSETUJUAN SEMINAR DAN SIDANG TUGAS AKHIR.......................... i

2.1 Rangkuman State Of The Art .................................................................. 8

3.1 Metode Waterfall ..................................................................................... 19

1.1 Latar Belakang

1.2 Rumusan Masalah

1.3 Tujuan Perekayasaan

1.4 Manfaat Perekayasaan

2. Mengurangi biaya tempat dan tenaga pengajar saat proses-proses

5. Administrator dapat mengelola data paket dengan menambah ,

11. Penelitian ini hanya berfokus pada perancangan dan pembanggunan

1.6 Sistematika Penulisan

BAB II TINJAUAN PUSTAKA

BAB III METODE PEREKAYASAAN

BAB IV HASIL DAN PEMBAHASAN

2.1 State of The Art

Regi Asyika (2019) melakukan penelitian yang berjudul Optimasi E-Kursus

I Gede Suputra Widharma (2017) melakukan penelitian berjudul

Mulyadi, Hoiriah, Deddy Supriadi, Rina Mugiati (2018) melakukan

Wanda Kurniawan, Andi Suprianto, B.Sumardiyono (2016) melakukan

mempermudah kegiatan komunikasi dan berbagi informasi antar

Tabel 2.1 Rangkuman State Of The Art

No Judul Peneliti Metode Hasil

3 Sistem Informasi Mulyadi, Waterfall sistem berbasis

2.2 Sistem Informasi

4. Blok Teknologi (Technology Block), blok teknologi digunakan untuk

2.4 Forum Diskusi

2.5 Website Interaktif

2.6 Apache Web Server

MariaDB dapat dikatakan sama dengan MySQL karena MariaDB

1. MariaDB memasukkan semua engine open source populer dan mengganti

2.8 Framework Laravel

Tabel 2.2 Perbandingan Keunggulan Framework

No Perbandingan Keunggulan Framework

Laravel memiliki keunggulan popularitas di kalangan

2.9 Visual Studio Code

2.10 Data Flow Diagram(DFD)

berhubungan. Keuntungan dari DFD adalah memungkinkan untuk

Tabel 2.3 DFD Notasi Yourdon/DeMarco dan Notasi Gane/Sarson

Simbol aliran data

2.11 Entity Relationship Diagram (ERD)

Tabel 2.4 Simbol Entity Relationship Diagram (ERD) Crow’s Foot

NO. Gambar Keterangan

Objek di luar sistem yang berkomunikasi

Digunakan untuk relasi fungsional

Digunakan pada relasi menunjukkan 1 (one)