BAB II LANDASAN TEORI

DAFTAR ISI LEMBAR PENGESAHAN... i SURAT PERNYATAAN... ii ABSTRAK... iii ABSTRACT... iv KATA PENGANTAR... v DAFTAR ISI... vii DAFTAR TABEL... xi DAFTAR GAMBAR... xii BAB I PENDAHULUAN 1.1 Latar Belakang Masalah... I-1 1.2 Rumusan Masalah... I-2 1.3 Maksud dan Tujuan... I-2 1.4 Batasan Masalah... I-3 1.5 Metode Penelitian... I-3 1.6 Sistematika Penulisan... I-5 BAB II LANDASAN TEORI 2.1 Multimedia... II-1 2.1.1 Pengertian Multimedia... II-1 2.1.2 Sistem Multimedia... II-1 2.1.3 Multimedia Interaktif... II-2 2.2 Adobe Flash... II-3 2.3 Animasi Flash... II-5 2.4 Donor Darah... II-7 2.5 Model ADDIE... II-12 2.6 Flowchart (Diagram Alir)... II-13 2.7 Pengertian Game (permainan)... II-15 2.7.1 Game Get Human Donor... II-15 2.7.2 Game Soal Donor Darah... II-16 vii

BAB III MODEL ANALISIS 3.1 Pembangunan Sistem Dengan Model ADDIE... III-1 3.2 Deskripsi Sistem yang Akan Dibangun... III-1 3.3 Analisa Kebutuhan Perangkat Lunak yang Akan Dibangun... III-1 3.3.1 Materi Yang Dibutuhkan... III-1 3.3.2 Perancangan Menu Navigasi Aplikasi... III-2 3.4 Struktur Menu Navigasi... III-4 3.4.1 Struktur Menu Inti Aplikasi... III-4 3.4.2 Struktur Submenu Donor Darah... III-4 3.4.3 Struktur Submenu Persyaratan... III-5 3.4.4 Struktur Submenu Tips... III-5 3.4.5 Struktur Submenu Info... III-6 3.5 Perancangan Storyboard... III-6 3.5.1 Storyboard Halaman Intro... III-6 3.5.2 Storyboard Halaman Home... III-7 3.5.3 Storyboard Halaman Donor... III-8 3.5.4 Storyboard Halaman Persyaratan... III-14 3.5.5 Storyboard Halaman Tips... III-17 3.5.6 Storyboard Halaman Tata Cara Donor... III-19 3.5.7 Storyboard Halaman Peta... III-20 3.5.8 Storyboard Halaman Peralatan... III-21 3.5.9 Storyboard Halaman Gallery Video... III-22 3.5.10 Storyboard Halaman Game Soal Donor Darah... III-23 3.5.11 Storyboard Halaman Game Get Human Donor... III-24 3.5.12 Storyboard Halaman Info... III-27 BAB IV MODEL PERANCANGAN 4.1 Perancangan Sistem... IV-1 4.2 Perancangan Flowchart (Diagram Alir)... IV-1 4.2.1 Flowchart Donor Darah... IV-1 4.2.2 Flowchart Persyaratan... IV-2 4.2.3 Flowchart Tips... IV-4 viii

4.2.4 Flowchart Tata Cara Donor... IV-5 4.2.5 Flowchart Peta... IV-6 4.2.6 Flowchart Peralatan... IV-7 4.2.7 Flowchart Gallery Video... IV-8 4.2.8 Flowchart Game Soal Donor Darah... IV-9 4.2.9 Flowchart Game Get Human Donor... IV-10 4.2.10 Flowchart Info... IV-11 4.3 Perancangan Antarmuka... IV-12 4.3.1 Rancangan Antarmuka Halaman Home... IV-12 4.3.2 Rancangan Antarmuka Donor Darah... IV-13 4.3.3 Rancangan Antarmuka Persyaratan... IV-14 4.3.4 Rancangan Antarmuka Tips... IV-15 4.3.5 Rancangan Antarmuka Tata Cara Donor... IV-16 4.3.6 Rancangan Antarmuka Peta... IV-17 4.3.7 Rancangan Antarmuka Peralatan... IV-18 4.3.8 Rancangan Antarmuka Gallery Video... IV-19 4.3.9 Rancangan Antarmuka Game Soal Donor Darah... IV-20 4.3.10 Rancangan Antarmuka Game Get Human Donor... IV-21 4.3.11 Rancangan Antarmuka Info... IV-23 BAB V MODEL IMPLEMENTASI DAN EVALUASI 5.1 Lingkungan Implementasi... V-1 5.1.1 Lingkungan Perangkat Lunak (Software)... V-1 5.1.2 Lingkungan Perangkat Keras (Hardware)... V-1 5.1.3 Lingkungan User... V-1 5.2 Implementasi Interface... V-2 5.2.1 Interface Intro... V-2 5.2.2 Interface Home... V-3 5.2.3 Interface Donor Darah... V-3 5.2.4 Interface Tips... V-4 5.2.5 Interface Tata Cara Donor... V-5 5.2.6 Interface Peta... V-6 ix

5.2.7 Interface Peralatan... V-7 5.2.8 Interface Gallery Video... V-8 5.2.9 Interface Game Soal Donor Darah... V-9 5.2.10 Interface Game Get Human Donor... V-10 5.2.11 Interface Info... V-11 5.3 Evaluasi Aplikasi oleh User... V-12 BAB VI KESIMPULAN DAN SARAN 6.1 Kesimpulan... VI-1 6.2 Saran... VI-1 LAMPIRAN... vx DAFTAR PUSTAKA... vxi x

DAFTAR TABEL Tabel 2.1 Bagan-bagan Flowchart Secara Umum (Diagram Alir)... II-14 Tabel 3.1 Storyboard Tampilan Halaman Intro... III-7 Tabel 3.2 Storyboard Tampilan Halaman Home... III-8 Tabel 3.3 Storyboard Tampilan Submenu Definisi Donor Darah... III-9 Tabel 3.4 Storyboard Tampilan Submenu Manfaat Donor Darah... III-10 Tabel 3.5 Storyboard Tampilan Submenu Fakta Donor Darah... III-11 Tabel 3.6 Storyboard Tampilan Submenu Mitos Donor Darah... III-12 Tabel 3.7 Storyboard Tampilan Submenu Pertimbangan Donor Darah... III-13 Tabel 3.8 Storyboard Halaman Submenu Persyaratan Donor Darah... III-14 Tabel 3.9 Storyboard Tampilan Submenu Larangan Donor Darah... III-15 Tabel 3.10 Storyboard Tampilan Halaman Golongan Donor Darah... III-16 Tabel 3.11 Storyboard Tampilan Halaman Tips... III-18 Tabel 3.12 Storyboard Tampilan Halaman Tata Cara Donor... III-19 Tabel 3.13 Storyboard Tampilan Halaman Peta... III-20 Tabel 3.14 Storyboard Tampilan Halaman Peralatan... III-21 Tabel 3.15 Storyboard Tampilan Halaman Gallery Video... III-22 Tabel 3.16 Storyboard Tampilan Halaman Game Soal Donor Darah... III-23 Tabel 3.17 Storyboard Tampilan Halaman Get Human Donor... III-26 Tabel 3.18 Storyboard Tampilan Halaman Info... III-28 Tabel 5.1 Evaluasi Kelayakan Aplikasi... V-13 xi

DAFTAR GAMBAR Gambar 2.1 Adobe Flash Logo... II-3 Gambar 2.2 Donor Darah PMI Logo... II-11 Gambar 2.3 Proses Model ADDIE... II-12 Gambar 3.1 Struktur Menu Inti Aplikasi... III-4 Gambar 3.2 Struktur Submenu Donor Darah... III-4 Gambar 3.3 Struktur Menu Donor Darah... III-5 Gambar 3.4 Struktur Menu Tips... III-5 Gambar 3.5 Struktur Menu Info... III-6 Gambar 3.6 Storyboard Halaman Intro... III-6 Gambar 3.7 Storyboard Halaman Home... III-9 Gambar 3.8 Storyboard Halaman Submenu Definisi Donor Darah... III-8 Gambar 3.9 Storyboard Halaman Submenu Manfaat Donor Darah... III-9 Gambar 3.10 Storyboard Halaman Submenu Fakta Donor Darah... III-10 Gambar 3.11 Storyboard Halaman Submenu Mitos Donor Darah... III-11 Gambar 3.12 Storyboard Halaman Submenu Pertimbangan Donor Darah... III-13 Gambar 3.13 Storyboard Halaman Submenu Persyaratan Donor Darah... III-14 Gambar 3.14 Storyboard Halaman Submenu Larangan Donor Darah... III-15 Gambar 3.15 Storyboard Halaman Golongan Donor... III-16 Gambar 3.16 Storyboard Halaman Sebelum Donor... III-17 Gambar 3.17 Storyboard Halaman Setelah Donor... III-17 Gambar 3.18 Storyboard Halaman Donor Saat Berpuasa... III-18 Gambar 3.19 Storyboard Halaman Tata Cara Donor... III-19 Gambar 3.20 Storyboard Halaman Peta... III-20 Gambar 3.21 Storyboard Halaman Peralatan... III-21 Gambar 3.22 Storyboard Halaman Gallery Video... III-22 Gambar 3.23 Storyboard Halaman Game Soal Donor Darah... III-23 Gambar 3.24 Storyboard Halaman Awal Game Get Human Donor... III-24 Gambar 3.25 Storyboard Halaman Game Get Human Donor... III-24 Gambar 3.26 Storyboard Halaman Game Get Human Donor Gagal Misi... III-25 xii

Gambar 3.27 Storyboard Halaman Get Human Donor Game Over Berhasil. III-25 Gambar 3.28 Storyboard Halaman Submenu Info... III-27 Gambar 3.29 Storyboard Halaman Submenu Designer... III-25 Gambar 3.30 Storyboard Halaman Submenu Kampus... III-28 Gambar 4.1 Flowchart Donor Darah... IV-2 Gambar 4.2 Flowchart Persyaratan... IV-3 Gambar 4.3 Flowchart Tips... IV-4 Gambar 4.4 Flowchart Tata Cara Donor... IV-5 Gambar 4.5 Flowchart Peta... IV-6 Gambar 4.6 Flowchart Peralatan... IV-7 Gambar 4.7 Flowchart Gallery Video... IV-8 Gambar 4.8 Flowchart Game Soal Donor Darah... IV-9 Gambar 4.9 Flowchart Game Get Human Donor... IV-10 Gambar 4.10 Flowchart Info... IV-11 Gambar 4.11 Rancangan Antarmuka Halaman Home... IV-12 Gambar 4.12 Rancangan Antarmuka Halaman Donor Darah... IV-13 Gambar 4.13 Rancangan Antarmuka Halaman Persyaratan... IV-14 Gambar 4.14 Rancangan Antarmuka Halaman Tips... IV-15 Gambar 4.15 Rancangan Antarmuka Halaman Tata Cara Donor... IV-16 Gambar 4.16 Rancangan Antarmuka Halaman Peta... IV-17 Gambar 4.17 Rancangan Antarmuka Halaman Peralatan... IV-18 Gambar 4.18 Rancangan Antarmuka Halaman Gallery Video... IV-19 Gambar 4.19 Rancangan Antarmuka Halaman Game Soal Donor Darah... IV-20 Gambar 4.20 Rancangan Antarmuka Game Get Human Donor Pembuka... IV-21 Gambar 4.21 Rancangan Antarmuka Game Get Human Donor... IV-22 Gambar 4.22 Rancangan Antarmuka Game Get Human Donor Game Over. IV-23 Gambar 4.23 Rancangan Antarmuka Halaman Info... IV-24 Gambar 5.1 Interface Intro... V-2 Gambar 5.2 Interface Home... V-3 Gambar 5.3 Interface Donor Darah... V-4 Gambar 5.4 Interface Tips... V-5 xiii

Gambar 5.5 Interface Tata Cara Donor... V-6 Gambar 5.6 Interface Peta... V-7 Gambar 5.7 Interface Peralatan... V-8 Gambar 5.8 Interface Gallery Video... V-9 Gambar 5.9 Interface Game Soal Donor Darah... V-10 Gambar 5.10 Interface Interface Game Get Human Donor... V-11 Gambar 5.11 Interface Info... V-12 xiv

LAMPIRAN LAMPIRAN A: Daftar Riwayat Hidup LAMPIRAN B: Lembar Kartu Bimbingan LAMPIRAN D: Revisi Tugas Akhir LAMPIRAN E: Kuesioner Evaluasi Penggunaan Aplikasi xv