DAFTAR ISI LEMBAR PENGESAHAN ...................................................................... i SURAT PERNYATAAN .......................................................................... ii ABSTRACK .............................................................................................. iii ABSTRAKSI .............................................................................................. iv KATA PENGANTAR ............................................................................... v DAFTAR ISI .............................................................................................. vii DAFTAR TABEL ...................................................................................... xiii DAFTAR GAMBAR ................................................................................. xvi DAFTAR LAMPIRAN ............................................................................. xix BAB I PENDAHULUAN 1.1
Latar Belakang ........................................................................ I – 1
1.2
Rumusan Masalah ................................................................... I – 2
1.3
Tujuan dan Manfaat ................................................................ I – 2
1.4
Batasan Masalah...................................................................... I – 2
1.5
Metodologi Penelitian ............................................................. I – 3
1.6
Sistematika Penulisan.............................................................. I – 4
BAB II LANDASAN TEORI 2.1
Konsep Dasar Multimedia....................................................... II – 1 2.1.1
Pentingnya Multimedia ............................................... II – 1
2.1.2
Pertumbuhan Multimedia ............................................ II – 2
2.1.3
Peranan Multimedia di Dunia ..................................... II – 2
2.1.4
Pengguna Multimedia ................................................. II – 4
2.1.5
PC Multimedia ............................................................ II – 4
2.1.6
Elemen-Elemen Multimedia ....................................... II – 6
2.1.7
Aplikasi Multimedia.................................................... II – 12
2.2
Rekayasa Piranti Lunak........................................................... II – 13 2.2.1
Pengertian Perangkat Lunak ....................................... II – 13
2.2.2
Karakteristik Perangkat Lunak .................................... II – 13
2.2.3
Metode Rekayasa Perangkat Lunak dengan Fountain Model ............................................................ II – 13
2.3
2.4
Interaksi Manusia dan Komputer ............................................ II – 17 2.3.1
Pengenalan Interaksi Manusia dan Komputer............. II – 17
2.3.2
Kriteria Interaksi Manusia dan Komputer................... II – 17
Konsep Dasar Perangkat Ajar Berbantukan Komputer ........... II – 18 2.4.1
Pengertian Istilah Perangkat Ajar Berbantukan Komputer ............................................... II – 18
2.5
2.6
2.4.2
Tujuan Perangkat Ajar Berbantukan Komputer.......... II – 18
2.4.3
Kriteria Perangkat Ajar Berbantukan Komputer......... II – 19
2.4.4
Komponen-Komponen Perangkat Ajar ...................... II – 20
2.4.5
Jenis Aplikasi Pelatihan Komputer ............................. II – 20
2.4.6
Contoh Aplikasi Perangkat Ajar ................................ II – 23
Sistem Basis Data .................................................................... II – 24 2.5.1
Pengertian Sistem Basis Data...................................... II – 24
2.5.2
Komponen-Komponen Sistem Basis Data .................. II – 25
2.5.3
Struktur Basis Data ..................................................... II – 26
Perancangan System dengan UML (Unified Modeling Language) ................................................ II – 27 2.6.1
Use Case Diagram ...................................................... II – 27
2.6.2
Class Dalam Model Analisis ...................................... II – 28
2.6.3
Class Diagram ............................................................ II – 28
2.6.4
Sequence Diagram ...................................................... II – 29
2.6.5
Collaboration Diagram ............................................... II – 30
2.6.6
Activity Diagram ........................................................ II – 31
2.6.2
State Chart Diagram ................................................... II – 32
2.7
Piranti Lunak Adobe Flash ..................................................... II – 33 2.7.1
2.7.2
Pengenalan Lingkungan Adobe Flash ........................ II – 33 2.7.1.1
Menu Bar ..................................................... II – 33
2.7.1.2
Tool Box ...................................................... II – 34
2.7.1.3
Kanvas (Stage) ............................................. II – 35
2.7.1.4
Batas Waktu (Time Line) ............................ II – 35
2.7.1.5
Jendela Library ............................................ II – 36
2.7.1.6
Jendela Color ............................................... II – 36
2.7.1.7
Symbol dan Instance .................................... II – 37
2.7.1.8
Movie Explorer ............................................ II – 38
2.7.1.9
Komponen-Komponen Lainnya .................. II – 38
Sintaks Dasar dalam ActionScript dalam Adobe Flash ................................................................ II – 39 2.7.2.1 Tanda baca ActionScript ................................. II – 39 2.7.2.2 Curly braces dan semicolon ............................ II – 39 2.7.2.3 Action panel .................................................... II – 40 2.7.2.4 Kategori Action Script .................................... II – 41
2.8
Komponen Kendaraan Bermotor............................................. II – 41 2.8.1
Engine Assembly ........................................................ II – 42
2.8.2
Frame atau Chassis...................................................... II – 42
2.8.3
Drive Train .................................................................. II – 42 2.8.3.1 Kopling......................................................... II – 43 2.8.3.2 Transmisi ...................................................... II – 43 2.8.3.3 Propeller Shaft.............................................. II – 43 2.8.3.4 Real-Axle Assembly .................................... II – 43 2.8.3.5
2.8.4
Front Wheel Drive........................................ II – 44
Running Gear .............................................................. II – 44 2.8.4.1 Suspensi........................................................ II – 44 2.8.4.2 Roda dan Ban ............................................... II – 44
2.8.4.3 Rem .............................................................. II – 45 2.8.4.4 Sistem Steer.................................................. II – 45 2.8.4.5 Sistem Elektrik ............................................. II – 45 2.8.4.6 Body ............................................................. II – 45
BAB III ANALISIS SISTEM 3.1
3.2
Identifikasi Masalah ................................................................ III – 1 3.1.1
Analisis Sistem Lama ................................................. III – 1
3.1.2
Analisis Sistem Baru .................................................. III – 1
3.1.3
Analisis Kuisioner ...................................................... III – 1
Hasil Analisa Sistem ............................................................... III – 4 3.2.1 Analisa Hasil Kuisioner ................................................ III – 4 3.2.2 StateChart Sistem Lama ............................................... III – 10 3.2.3 FlowChart Mekanik ...................................................... III – 12
BAB III PERANCANGAN SISTEM 4.1
4.2
4.3
Perancangan Aplikasi ............................................................. IV - 1 4.1.1
Fungsi Utama Aplikasi ............................................... IV – 1
4.1.2
Karakteristik Pengguna .............................................. IV – 1
Kebutuhan Antarmuka Perangkat Lunak ............................... IV – 2 4.2.1
Kebutuhan Antarmuka Pemakai ................................ IV – 2
4.2.2
Kebutuhan Fungsional Perangkat Lunak ................... IV – 3
Storyboard Outline Modul ..................................................... IV – 4 4.3.1
Deskripsi Modul ........................................................ IV – 4
4.3.2
Modul Outline ........................................................... IV – 4
4.3.3
Learning Units ........................................................... IV – 5
4.4
Perancangan Aplikasi ............................................................. IV – 6
4.5
Perancangan Content .............................................................. IV – 10 4.5.1
Pembuatan Objek dan Animasi .................................. IV – 10
4.5.2 4.6
Penempatan Objek ..................................................... IV – 11
Perancangan Tampilan dan Menu ........................................ IV – 11 4.6.1
Perancangan Tampilan Intro Program ....................... IV – 11
4.6.2
Perancangan Tampilan E-Learning ........................... IV – 11
4.6.3
Perancangan Tampilan Pilihan Menu ....................... IV – 12
4.7
Pembuatan Sistem e-Learning ............................................. IV – 13
4.8
Analisa Konten .................................................................... IV – 14
4.9
Perancangan Perangkat Lunak yang di Kembangkan ......... IV – 16 4.9.1
Use case Diagram ...................................................... IV – 16
4.9.2
Skenario Use Case ...................................................... IV – 17 4.9.2.1 Skenario Use Case Login ............................ IV – 17 4.9.2.2 Skenario Use Case Daftar User ................... IV – 17
4.9.2.3
Skenario Use Case Ambil Modul ................ IV – 18
4.9.2.4
Skenario Use Case Hapus Modul ................ IV – 19
4.9.2.5
Skenario Use Case Ganti kata Kunci .......... IV – 20
4.9.2.6
Skenario Use Case Pilih Modul .................. IV – 21
4.9.2.7
Skenario Use Case Reload Modul .............. IV – 21
4.9.2.8
Skenario Use Case Logout .......................... IV – 22
4.9.3 Class Diagram Tahap Analisis .................................... IV – 22 4.9.4 Sequence Diagram ...................................................... IV – 24 4.9.5 Alur Class Diagram .................................................... IV – 28
BAB V IMPLEMENTASI 5
Implementasi ........................................................................... V – 1
5.1
Lingkup Implementasi ............................................................ V – 1
5.2
Implementasi Aplikasi ............................................................ V – 1 5.2.1 Implementasi Perangkat Keras ..................................... V – 1 5.2.2 Implementasi Perangkat Lunak .................................... V – 2
5.3
Tampilan Layar ....................................................................... V – 2 5.3.1 Layar Login .................................................................. V – 2 5.3.2 Layar Daftar ................................................................. V – 3 5.3.3 Form Menu ................................................................... V – 4 5.3.4 Layar Ambil Modul ...................................................... V – 5 5.3.5 Layar Hapus Modul ...................................................... V – 6 5.3.6 Layar Ganti Password ................................................... V – 7
5.4
Tampilan Layar Content Pelatihan Tentang Mesin ................. V – 8
5.5. Tampilan Layer Content Time management ........................... V – 16 5.6
Pengujian (Testing) .................................................................. V – 29
BAB VI KESIMPULAN DAN SARAN 6.1
Kesimpulan ............................................................................. VI – 1
6.2
Saran........................................................................................ VI – 1
DAFTAR PUSTAKA LAMPIRAN
DAFTAR TABEL Tabel 2.2 Simbol-simbol pada Use Case Diagram ...................................... II-27 Tabel 2.3 Simbol-simbol pada Class Model Analisis ................................... II-28 Tabel 2.4 Simbol-simbol pada Class Diagram .............................................. II-29 Tabel 2.5 Simbol-simbol pada Sequence Diagram ...................................... II-29 Tabel 2.6 Simbol-simbol pada Collaboration Diagram ................................ II-30 Tabel 2.7 Simbol-simbol pada Activity Diagram ......................................... II-31 Tabel 2.8 Simbol-simbol pada Statechart Diagram ...................................... II-32 Tabel 3.1 Tabel Hasil Kuisioner No. 1 ......................................................... III-2 Tabel 3.2 Tabel Hasil Kuisioner No. 2 ......................................................... III-2 Tabel 3.3 Tabel Hasil Kuisioner No. 3 ......................................................... III-2 Tabel 3.4 Tabel Hasil Kuisioner No. 4 ......................................................... III-3 Tabel 3.5 Tabel Hasil Kuisioner No. 5 ......................................................... III-3 Tabel 3.6 Tabel Hasil Kuisioner No. 6 ......................................................... III-3 Tabel 3.7 Tabel Hasil Kuisioner No. 7 ......................................................... III-3 Tabel 3.8 Tabel Hasil Kuisioner No. 8 ......................................................... III-4 Tabel 3.9 Tabel Hasil Kuisioner No. 9 ......................................................... III-4 Tabel 3.10 Tabel Hasil Kuisioner No. 10 ..................................................... III-4 Tabel 4.1 Karakteristik Pengguna ................................................................. IV-2 Tabel 4.2 Karakteristik Pengguna ................................................................. IV-3 Tabel 4.3 Tabel Modul .................................................................................. IV-4 Tabel 4.4 Tabel Modul .................................................................................. IV-4 Tabel 4.5 Skenario Use Case Login ............................................................. IV-17 Tabel 4.6 Skenario Use Case Daftar User .................................................... IV-18 Tabel 4.7 Skenario Use Case Ambil Modul.................................................. IV-19 Tabel 4.8 Skenario Use Case Hapus Modul.................................................. IV-19 Tabel 4.9 Skenario Use Case Ganti Kata Kunci........................................... IV-20 Tabel 4.10 Skenario Use Case Pilih Modul.................................................. IV-21 Tabel 4.11 Skenario Use Case Reload Modul .............................................. IV-21 Tabel 4.12 Skenario Use Case Logout ......................................................... IV-22 xiv
Tabel 5.1 Penjelasan Pengujian Aplikasi.................................................... V-29 Tabel 5.3 Penjelasan Pengujian modul Content Time management .......... V-31 Tabel 5.3. Penjelasan Pengujian modul Content Pelatihan Tentang Mesin.. V-33
xv
DAFTAR GAMBAR Gambar 2.1 Metode Fountain Model ...........................................................
II-14
Gambar 2.2 Jendelah Utama Adobe Flash ....................................................
II-33
Gambar 2.3 Menu Bar ...................................................................................
II-34
Gambar 2.4 ToolBox ....................................................................................
II-34
Gambar 2.5 Kanvas ......................................................................................
II-35
Gambar 2.6 Time Line ..................................................................................
II-36
Gambar 2.7 Jendela Library ..........................................................................
II-36
Gambar 2.8 Jendela Color .............................................................................
II-37
Gambar 2.9 Symbol ......................................................................................
II-37
Gambar 2.10 Movie Explorer .......................................................................
II-38
Gambar 2.11 Panel buka tutup kedua ...........................................................
II-39
Gambar 2.12 Action Panel ............................................................................
II-40
Gambar 3.1 Diagram Hasil Kuisioner No.1 .................................................. III-5 Gambar 3.2 Diagram Hasil Kuisioner No.2 .................................................. III-5 Gambar 3.3 Diagram Hasil Kuisioner No.3 .................................................. III-6 Gambar 3.4 Diagram Hasil Kuisioner No.4 .................................................. III-6 Gambar 3.5 Diagram Hasil Kuisioner No.5 .................................................. III-7 Gambar 3.6 Diagram Hasil Kuisioner No.6 .................................................. III-7 Gambar 3.7 Diagram Hasil Kuisioner No.7 .................................................. III-8 Gambar 3.8 Diagram Hasil Kuisioner No.8 .................................................. III-9 Gambar 3.9 Diagram Hasil Kuisioner No.9 .................................................. III-9 Gambar 3.10 Diagram Hasil Kuisioner No.10 .............................................. III-10 Gambar 3.11 StateChart Pegawai ................................................................. III-11 Gambar 3.12 StateChart Mekanik ................................................................. III-11 Gambar 3.13 FlowChart Mekanik................................................................. III-12 Gambar 4.1 Proses Aplikasi .......................................................................... IV-1 Gambar 4.2 Tampilan Layar Login ............................................................... IV-7 Gambar 4.3 Tampilan Layar Daftar .............................................................. IV-7 Gambar 4.4 Tampilan Layar Halaman Utama .............................................. IV-8 xvi
Gambar 4.5 Tampilan Layar Ganti Kata Kunci ............................................ IV-9 Gambar 4.6 Layar Ambil Modul ................................................................... IV-9 Gambar 4.7 Layar Hapus Modul .................................................................. IV-10 Gambar 4.8 Tampilan Intro Program ........................................................... IV-11 Gambar 4.9 Tampilan Rancangan Umum................................................... IV-12 Gambar 4.10 Gambar Tampilan Rancangan Menu...................................... IV-12 Gambar 4.11 Diagram Rancangan Sistem Menu ......................................... IV-13 Gambar 4.12 Gambar Alur Proses Konten e-Learning ................................ IV-14 Gambar 4.13 Diagram Use Case Diagram .................................................... IV-17 Gambar 4.14 Class Diagram Tahap Analisis dari Use Case Login ............. IV-22 Gambar 4.15 Class Diagram Tahap Analisis dari Use Case Pendaftaran ... IV-23 Gambar 4.16 Class Diagram Tahap Analisis dari Use Case Ambil Modul . IV-23 Gambar 4.17 Class Diagram Tahap Analisis dari Use Case Hapus Modul . IV-23 Gambar 4.18 Class Diagram Tahap Analisis dari Use Case Ganti Kata Kunci .............................................................................................................. IV-23 Gambar 4.19 Class Diagram Tahap Analisis dari Use Case Reload Modul . IV-23 Gambar 4.20 Class Diagram Tahap Analisis dari Use Case Pilih Modul ... IV-24 Gambar 4.21 Class Diagram Tahap Analisis dari Use Case Logout ........... IV-24 Gambar 4.22 Sequence Diagram Login ....................................................... IV-24 Gambar 4.23 Sequence Diagram Daftar ....................................................... IV-25 Gambar 4.24 Sequence Diagram Ambil Modul ............................................ IV-25 Gambar 4.25 Sequence Diagram Hapus Modul ............................................ IV-26 Gambar 4.26 Sequence Diagram Ganti Kata Kunci ..................................... IV-26 Gambar 4.27 Sequence Diagram Reload ...................................................... IV-27 Gambar 4.28 Sequence Diagram Pilih Modul .............................................. IV-27 Gambar 4.29 Sequence Diagram Logout ...................................................... IV-28 Gambar 4.30 Class Diagram ......................................................................... IV-28 Gambar 5.1 Layar login ...............................................................................
V-2
Gambar 5.2 Layar Daftar .............................................................................
V-3
Gambar 5.3 Layar Halaman Utama .............................................................
V-4
Gambar 5.4 Layar Ambil Modul ..................................................................
V-5
xvii
Gambar 5.5 Layar Hapus Modul ..................................................................
V-6
Gambar 5.6 Layar Ganti Password ..............................................................
V-7
Gambar 5.7 Layar Ganti Password ..............................................................
V-7
Gambar 5.24 Tampilan Menu Logout ...........................................................
V-19
Gambar 5.25 Tampilan Menu Dosen ............................................................
V-19
Gambar 5.26 Tampilan Menu Mahasiswa ....................................................
V-20
Gambar 5.27 Tampilan Penyedia Jasa Hosting Gratis ..................................
V-21
Gambar 5.28 Tampilan Account Information ...............................................
V-21
Gambar 5.29 Tampilan Manajemen Basis Data pada phpMyAdmin ............
V-22
Gambar 5.30 Tampilan Manajemen File Pada File Manager ......................
V-22
Gambar 5.31 Tampilan Halaman Utama ......................................................
V-23
Gambar 5.32 Tampilan Menu Login .............................................................
V-24
Gambar 5.33 Tampilan Menu Admin ...........................................................
V-24
Gambar 5.34 Tampilan Pesan Sukses Penyimpanan Data ............................
V-26
Gambar 5.35 Tampilan Detail Materi ...........................................................
V-26
Gambar 5.36 Tampilan Detail Soal ..............................................................
V-27
Gambar 5.37 Tampilan Menu Dosen ............................................................
V-27
Gambar 5.38 Tampilan Menu Mahasiswa ....................................................
V-28
xviii
DAFTAR LAMPIRAN Lampiran A : Source Code Lampiran B : Kartu Bimbingan Tugas Akhir Lampiran C : Daftar Riwayat Hidup
xix
