Flowchart Storyboard Perancangan Aplikasi Multimedia Pembelajaran Materi Gerund Dalam Bahasa Inggris

3.2 Flowchart

Flowchart adalah gambaran dalam bentuk diagram alir dari algoritma dalam suatu program yang menyatakan arah alur program dalam menyelesaikan suatu masalah. Flowchart dari program aplikasi multimedia pembelajaran bahasa Inggris dengan materi Gerund dapat dilihat pada Gambar 3.4. Tabel 3.1 Bagian-bagian dari Flowchart Universitas Sumatera Utara Start Menu Utama Home Profil Link Materi Latihan Evaluasi Exit Case Home Profil Materi Latihan Evaluasi Home Profil Pengertian Penggunaan Jenis Gerund Perbandingan Soal-soal Latihan Stop Case Pengertian Penggunaan Jenis Gerund Perbandingan Link Link Exit Soal-soal Evaluasi Gambar 3.4 Flowchart Algoritma Perancangan Aplikasi Multimedia Pembelajaran Universitas Sumatera Utara

3.3 Storyboard

Storyboard merupakan uraian yang berisi visual dan audio penjelasan dari masing- masing alur dalam flowchart. Satu kolom dalam storyboard mewakili satu tampilan di layar monitor. Dengan demikian, biasanya storyboard cukup banyak hingga berlembar-lembar. Fungsi dari storyboard antara lain: a. Memperjelas flowchart. b. Pedoman bagi animator, programmer, dan narrator. c. Sebagai dokumen tertulis. d. Bahan pembuatan buku manual. Adapun storyboard dari rancangan aplikasi multimedia pembelajaran materi gerund dalam bahasa Inggris yang akan dibangun dapat dilihat pada tabel 3.2 sebagai berikut. Tabel 3.2 Storyboard Perancangan Aplikasi Multimedia Pembelajaran Materi Gerund dalam Bahasa Inggris No Rancangan Visual Audio 1 Menu Intro. Lihat pada Gambar 3.5 Rancangan Tampilan Menu Intro Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Teks : hitam, bagian tengah Perancangan Aplikasi Multimedia Pembelajaran Materi Gerund dalam Bahasa Inggris Animasi : 1 Logo USU beserta keterangan logonya secara serentak muncul dari tampilan ukuran kecil ke tampilan ukuran normalnya pada bagian tengah. 2 Teks muncul teratur per karakter. Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio 3 Persegi panjang berwarna hijau transparan bergerak dari kiri ke kanan. Tombol navigasi : 1 Tombol “Menu” untuk masuk ke tampilan menu utama. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri bawah 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas Universitas Sumatera Utara No Rancangan Visual Audio 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas 2 Menu Utama. Lihat pada Gambar 3.6 Rancangan Tampilan Menu Utama Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Sub Menu Utama : bagian kiri 1 Tombol Materi 2 Tombol Latihan 3 Tombol Evaluasi Teks : pada bagian tengah Pilihlah menu yang tersedia. 1 Klik pada Materi untuk melihat pembahasan dari materi Gerund. Setiap Pembahasan mempunyai beberapa topik dan memiliki persyaratan tertentu. 2 Klik pada Latihan untuk memulai latihan. 3 Klik pada Evaluasi untuk memulai evaluasi Tombol navigasi : 1 Tombol “Menu” untuk masuk ke tampilan menu utama. Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio Warna : Hitam 2 Tombol “Materi” untuk masuk ke tampilan materi yang berisikan pembahasan tentang materi Gerund. Setiap pembahasan mempunyai beberapa topik tentang Gerund. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 3 Tombol “Latihan” untuk masuk ke tampilan latihan untuk memulai latihan tentang Gerund. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 4 Tombol “Evaluasi” untuk masuk ke tampilan evaluasi untuk memulai evaluasi tentang Gerund. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah Universitas Sumatera Utara No Rancangan Visual Audio 5 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 6 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 7 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 8 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas Animasi: 1 Persegi panjang berwarna hijau transparan bergerak dari kiri ke kanan. 2 Kotak kecil bergerak dari atas ke bawah bagian kiri. 3 Lingkaran kecil berwarna putih berputar searah jarum jam. Universitas Sumatera Utara No Rancangan Visual Audio 3 Menu Materi: Lihat pada Gambar 3.8 Rancangan Tampilan Menu Materi Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Sub Materi : bagian kiri Tombol Pengertian klik untuk ke halaman Pengertian Gerund. Tombol Penggunaan klik untuk ke halaman Penggunaan Gerund. Tombol Jenis Gerund klik untuk ke halaman Jenis Gerund. Tombol Perbandingan klik untuk ke halaman Perbandingan. Tombol Navigasi: 1 Tombol Submenu “Pengertian” Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 2 Tombol Submenu “Penggunaan” Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio 3 Tombol Submenu “Jenis Gerund” Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 4 Tombol Submenu “Perbandingan” Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 5 Tombol “Menu” untuk kembali ke tampilan menu utama. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 6 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Intro. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas Universitas Sumatera Utara No Rancangan Visual Audio 7 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 8 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 9 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas Animasi: Persegi panjang berwarna hijau 1 transparan bergerak dari kiri ke kanan. 2 Kotak kecil bergerak dari atas ke bawah bagian kiri. 3 Lingkaran kecil berwarna putih berputar searah jarum jam. berjalan dari kanan ke kiri. Universitas Sumatera Utara No Rancangan Visual Audio 4 Menu Materi 1: Pengertian Lihat pada Gambar 3.9 Rancangan Tampilan Penyampaian Isi Materi Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Judul Materi : Pengertian Tombol Navigasi: 1 Tombol “Materi” untuk kembali ke tampilan materi. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas Animasi: Teks Isi Materi Pengertian muncul per karakter. 5 Menu Materi 2: Penggunaan. Lihat pada Gambar 3.9 Rancangan Tampilan Penyampaian Isi Materi Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Judul Materi : Penggunaan Tombol Navigasi: 1 Tombol “Materi” untuk kembali ke tampilan materi. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio 3 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas 6 Menu Materi 3: Jenis Gerund. Lihat pada Gambar 3.9 Rancangan Tampilan Penyampaian Isi Materi Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Judul Materi : Jenis Gerund Tombol Navigasi: 1 Tombol “Materi” untuk kembali ke tampilan materi. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio Posisi : Bagian kiri tengah 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas Universitas Sumatera Utara No Rancangan Visual Audio 7 Menu Materi 4: Perbandingan. Lihat pada Gambar 3.9 Rancangan Tampilan Penyampaian Isi Materi Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Judul Materi : Perbandingan Tombol Navigasi: 1 Tombol “Materi” untuk kembali ke tampilan materi. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri tengah 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas 8 Menu Latihan: Lihat pada Gambar 3.10 Rancangan Tampilan Menu Latihan Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Teks : hitam setelah dipilih jawaban pada soal, kemudian akan muncul pesan teks : “Anda Benar” jika benar dan “Anda salah” jika jawaban salah dan pembahasan soal akan muncul jika jawaban benar, berlaku untuk semua soal Tombol navigasi : 1 Tombol “Materi” untuk kembali ke tampilan materi. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas 6 Tombol sebelumnya panah kiri, klik untuk ke soal sebelumnya. Bentuk : Abu-abu, bulat Posisi : Bagian kiri bawah 7 Tombol berikutnya panah kanan, klik untuk ke soal berikutnya. Bentuk : Abu-abu, bulat Posisi : Bagian kiri bawah Universitas Sumatera Utara No Rancangan Visual Audio 9 Menu Evaluasi: Lihat pada Gambar 3.11 Rancangan Tampilan Menu Evaluasi Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Teks : hitam Bagian tengah di dalam sebuah persegi Masukkan Nama Anda minimal 20 Karakter hitam Gambar : kotak persegi panjang berwarna hijau - putih, untuk mengisi nama berada tepat di bawah teks Tombol navigasi : 1 Tombol “Menu” untuk kembali ke tampilan menu utama. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Profil” untuk masuk ke tampilan Profil. Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas 6 Tombol “Lanjut” untuk memulai latihan. Bentuk : Bujur sangkar berwarna hijau - putih Posisi : Bagian tengah 7 Tombol “Tidak”. Bentuk : Bujur sangkar berwarna hijau – putih, teks hitam Posisi : Bagian tengah Universitas Sumatera Utara No Rancangan Visual Audio 10 Menu Home: Lihat pada Gambar 3.5 Rancangan Tampilan Menu Intro Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Teks : hitam, bagian tengah Perancangan Aplikasi Multimedia Pembelajaran Materi Gerund dalam Bahasa Inggris Animasi : 1 Logo USU beserta keterangan logonya secara serentak muncul dari tampilan ukuran kecil ke tampilan ukuran normalnya pada bagian tengah. 2 Teks muncul teratur per karakter. 3 Persegi panjang berwarna hijau transparan bergerak dari kiri ke kanan. Tombol navigasi : 1 Tombol “Menu” untuk masuk ke tampilan menu utama. Bentuk : Persegi panjang berwarna Orange- Putih Warna : Hitam Posisi : Bagian kiri bawah 2 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 5 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas 11 Menu Profil: Lihat pada Gambar 3.7 Rancangan Tampilan Menu Profil Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Teks : hitam, bagian tengah Animasi : 1 Logo USU beserta keterangan logonya secara serentak muncul dari tampilan Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio 2 ukuran kecil ke tampilan ukuran normalnya pada bagian tengah. 3 Teks muncul teratur per karakter. Tombol navigasi: 1 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 2 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 4 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas Universitas Sumatera Utara No Rancangan Visual Audio 12 Menu Link: Lihat pada Gambar 3.12 Rancangan Tampilan Menu Link Judul : Gerund warna hitam di bagian atas. Gambar : Logo USU kiri atas. Teks : hitam, bagian tengah Animasi : 1 Logo USU beserta keterangan logonya secara serentak muncul dari tampilan ukuran kecil ke tampilan ukuran normalnya pada bagian tengah. Tombol navigasi: 1 Tombol “Home” untuk masuk atau kembali pada tampilan Halaman Utama. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 2 Tombol “Profil” untuk masuk ke tampilan Profil. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas 3 Tombol “Link” untuk masuk ke tampilan Link. Bentuk : Oval berwarna Hijau- Putih Posisi : Bagian kanan atas Sound Effect muncul ketika meng-klik tombol Universitas Sumatera Utara No Rancangan Visual Audio 4 Tombol “Exit” untuk keluar dari aplikasi. Bentuk : Bujur sangkar berwarna Merah Posisi : Bagian kanan atas

3.4 Perancangan Tampilan