Umumnya untuk membuat aplikasi multimedia digunakan storyboard yang disusun berurutan layar demi layar. Dalam storyboard ini selain digambarkan perkiraan dari tampilan akhir yang diinginkan, juga turut dituliskan penjelasan serta spesifikasi tiap layar. Selain itu hal yang perlu diperhatikan dalam membuat storyboard adalah tetap mengikuti rancangan peta navigasi, dengan demikian setiap tahapan desain menjadi lebih terarah dan dapat dikerjakan dengan mudah.
Tabel 3.20 Storyboard Aplikasi Pembelajaran Tajwid
Page Visualisasi Audio Keterangan
Awal Backsound lagu insya allah versi instrumental . Background : Gambar masjid. Image View: Gambar bismillah. Button [1]: Tombol bergambar panah ke kiri untuk keluar dari aplikasi dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [2]:
Tombol bergambar panah ke kanan untuk masuk ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Background 1 2 A1 A2 A3 Image View
Animasi [A1]: Teks bertuliskan "ASSALAMU'ALAIKU M WR. WB." yang berganti-ganti warna. Animasi [A2]: Teks bertuliskan "APLIKASI" yang bergerak memantul dari kiri ke kanan dan terhenti ditengah.
Teks bertuliskan "PEMBELAJARAN" yang bergerak memantul dari kanan ke kiri dan terhenti ditengah.
Teks bertuliskan "TAJWID" yang bergerak naik turun dan terhenti ditengah.
Animasi [A3]:
2 orang yang
menggerakkan tangannya.
Menu Utama Backsound lagu insya allah versi instrumental . Background :
Gambar padang pasir.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman awal dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [2]:
Tombol bergambar papan bertuliskan "Pengertian Tajwid" untuk masuk ke halaman menu pengertian tajwid dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [3]:
Tombol bergambar papan bertuliskan "Lafadz Allah" untuk masuk ke halaman menu lafadz allah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Background 1 2 3 4 5 6 7 8 9 A2 A1
Button [4]:
Tombol bergambar papan bertuliskan "Alif Lam" untuk masuk ke halaman menu alif lam dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [5]:
Tombol bergambar papan bertuliskan "Mad" untuk masuk ke halaman menu mad dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [6]:
Tombol bergambar papan bertuliskan "Mim Mati" untuk masuk ke halaman menu mim mati dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [7]:
Tombol bergambar papan bertuliskan "Nun Mati/Tanwin" untuk masuk ke halaman menu nun mati/tanwin dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [8]:
Tombol bergambar papan bertuliskan "Qalqalah" untuk masuk ke halaman menu qalqalah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [9]:
Tombol bergambar papan bertuliskan "Evaluasi" untuk masuk ke halaman menu evaluasi dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Animasi [A1]:
Teks bertuliskan "MENU" yang berganti-ganti warna.
Animasi[A2]:
Matahari yang
Menu Pengertian Tajwid Suara yang menjelaskan tentang pengertian tajwid. Background :
Gambar padang pasir.
Teks View: Teks bertuliskan penjelasan mengenai pengertian tajwid. Button [1]: Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Animasi [A1]:
Teks bertuliskan "PENGERTIAN
TAJWID" yang berganti-ganti warna.
Animasi [A2]:
Orang yang
menggerakkan mata dan mulutnya. Background 1 A1 A2 Text View
Menu Lafadz Allah
Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [2]: Tombol bergambar papan bertuliskan "TAFKHIM" untuk menampilkan halaman tajwid tafkhim dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [3]: Tombol bergambar papan bertuliskan "TARQIQ" untuk menampilkan halaman tajwid tarqiq dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Background 3 2
Menu Alif Lam
Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [2]: Tombol bergambar papan bertuliskan "SYAMSIYAH" untuk menampilkan halaman tajwid syamsiyah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [3]: Tombol bergambar papan bertuliskan "QAMARIYAH" untuk menampilkan halaman tajwid qamariyah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Background 1
Menu Mad Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [2]:
Tombol bergambar papan bertuliskan "MAD THABI'I" untuk menampilkan halaman tajwid mad thabi'i dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [3]:
Tombol bergambar papan bertuliskan "MAD WAJIB MUTTASHIL" untuk menampilkan halaman tajwid mad wajib muttashil dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Background 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
Button [4]:
Tombol bergambar papan bertuliskan "MAD JAIZ MUNFASHIL" untuk menampilkan halaman tajwid mad jaiz munfashil dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [5]:
Tombol bergambar papan bertuliskan "MAD ARID LISUKUN" untuk menampilkan halaman tajwid mad arid lisukun dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [6]:
Tombol bergambar papan bertuliskan "MAD BADAL" untuk menampilkan halaman tajwid mad badal dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [7]:
Tombol bergambar papan bertuliskan "MAD IWAD" untuk menampilkan halaman tajwid mad iwad dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [8]:
Tombol bergambar papan bertuliskan "MAD LAZIM MUTSAQQAL KALIMI" untuk menampilkan halaman tajwid mad lazim mutsaqqal kalimi dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [9]:
Tombol bergambar papan bertuliskan "MAD LAZIM MUKHAFFAF KALIMI" untuk menampilkan halaman tajwid mad lazim mukhaffaf kalimi dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [10]:
Tombol bergambar papan bertuliskkan "MAD LAZIM HARFI MUSBA" untuk menampilkan halaman tajwid mad lazim harfi musba dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [11]:
Tombol bergambar papan bertuliskan "MAD LAZIM MUKHAFFAF HARFI" untuk menampilkan halaman tajwid mad lazim mukhaffaf harfi dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [12]:
Tombol bergambar papan bertuliskan "MAD LAYYIN" untuk menampilkan halaman tajwid mad layyin dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [13]:
Tombol bergambar papan bertuliskan "MAD SHILAH QASHIRAH" untuk menampilkan halaman tajwid mad shilah qashirah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [14]:
Tombol bergambar papan bertuliskan "MAD SHILAH THAWILAH" untuk menampilkan halaman tajwid mad shilah thawilah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [15]:
Tombol bergambar papan bertuliskan "MAD TAMKIN" untuk menampilkan halaman tajwid mad tamkin dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Menu Mim Mati
Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [2]: Tombol bergambar papan bertuliskan "IDZHAR SAFAWI" untuk menampilkan halaman tajwid idzhar safawi dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [3]:
Tombol bergambar papan bertuliskan "IKHFA SAFAWI" untuk menampilkan halaman tajwid ikhfa safawi dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Background 1
2 3
Button [4]: Tombol bergambar papan bertuliskan "IDGHOM MUTAMATSILAIN" untuk menampilkan halaman tajwid idghom mutamatsilain dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Menu Nun Mati/ Tanwin
Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [2]: Tombol bergambar papan bertuliskan "IDZHAR" untuk menampilkan halaman tajwid idzhar dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Background 1 2 5 6 3 4
Button [3]:
Tombol bergambar papan bertulisan "IQLAB" untuk menampilkan halaman tajwid iqlab dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [4]: Tombol bergambar papan bertuliskan "IKHFA" untuk menampilkan halaman tajwid ikhfa dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [5]: Tombol bergambar papan bertuliskan "IDGHOM BIGUNNAH" untuk menampilkan halaman tajwid idghom bigunnah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [6]: Tombol bergambar papan bertuliksan "IDGHOM BILAGUNNAH" untuk menampilkan halaman tajwid idghom
bilagunnah dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Menu Qalqalah
Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Button [2]: Tombol bergambar papan bertuliskan "SUGHRA" untuk menampilkan halaman tajwid sughra dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Background 1
Button [3]:
Tombol bergambar papan bertuliskan "KUBRA untuk menampilkan halaman tajwid kubra dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Isi Menu Tajwid (Tafkhim, Tarqiq, Syamsiyah, Qamariyah, Mad Thabi'i, Mad Wajib Muttashil, Mad Jaiz Munfashil, Mad Arid Lisukun, Mad Badal, Mad Iwad, Mad Lazim Mutsaqqal Kalimi, Mad Lazim Mukhaffaf Kalimi, Mad Lazim Harfi Musba, Mad Lazim Mukhaffaf Harfi, Mad Layyin, Mad Shilah Qashirah, Mad Shilah Thawilah,
Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [2]:
Tombol bergambar
speaker untuk
mengeluarkan suara dari contoh tajwid yang pertama dan ketika tombol ditekan akan ada efek animasi seperti menekan tombol. Background 1 3 2 A1 A2 4 A3 Image View1 Image View2 Image View3 Teks View
Mad Tamkin, Idzhar Safawi, Ikhfa Safawi, Idghom Mutamatsil ain, Idzhar, Iqlab, Ikhfa, Idghom Bigunnah, Idghom Bilagunnah, Sughra dan Kubra. Button [3]: Tombol bergambar speaker untuk
mengeluarkan suara dari contoh tajwid yang pertama dan ketika tombol ditekan akan ada efek animasi seperti menekan tombol.
Button [2]:
Tombol bergambar
speaker untuk
mengeluarkan suara dari contoh tajwid yang ketiga dan ketika tombol ditekan akan ada efek animasi seperti menekan tombol.
Animasi [A1]:
Teks contoh tajwid pertama yang berganti warna.
Animasi [A2]:
Teks contoh tajwid kedua yang berganti warna.
Animasi [A3]:
Teks contoh tajwid ketiga yang berganti warna.
Image View [1]
Gambar contoh tajwid yang pertama.
Image View [2]
Gambar contoh tajwid yang kedua.
Image View [3]
Gambar contoh tajwid yang ketiga. Menu Evaluasi (Isi Nama User) Backsound tanda baca versi intrumental. Background : Gambar taman. Button [1]: Tombol bertuliskan "OK" yang berati telah setuju dengan nama yang telah dimasukkan, dan untuk akan ke halaman soal evaluasi, ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Text View
Teks bertuliskan "Masukkan Nama Anda".
Static Text:
Untuk memasukkan dan menulis nama user.
Animasi[A1]:
Matahari yang
mengeluarkan sinarnya.
Animasi[A2]:
Awan yang bergerak dari kiri ke kanan tanpa berhenti. Background A1 A2 Text View 1 Static Text
Menu Evaluasi (Soal Evaluasi) Background : Gambar taman. Button [1]: Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [2]:
Tombol bertuliskan "A" yang merupakan pilihan jawaban pertama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Button [3]:
Tombol bertuliskan "B" yang merupakan pilihan jawaban kedua dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Buttom [4]:
Tombol bertuliskan "C" yang merupakan pilihan jawaban ketiga dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Background 1 A1 2 5 Static Text 3 4 Image/Text View 2 Image/Text View 3 Image/Text View 4 Image/Text View 1 A3 A2 A4
Button[5]:
Tombol bergambar papan bertuliskan "soal berikutnya..." untuk menampilkan halaman soal evaluasi berikutnya dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. Tombol ini baru akan muncul jika user telah memilih. Khusus di halaman soal evaluasi terakhir
Image/Text View[1]:
Soal evaluasi, dapat berupa gambar ataupun teks.
Image/Text View[2]:
Pilihan jawaban pertama evaluasi, dapat berupa gambar ataupun teks.
Image/Text View[3]:
Pilihan jawaban kedua evaluasi, dapat berupa gambar ataupun teks.
Image/Text View[4]:
Pilihan jawaban ketiga evaluasi, dapat berupa gambar ataupun teks.
Static Text:
Untuk menampilkan nilai score soal evaluasi, jika benar nilai 10 dan jika salah nilai 0.
Animasi[A1]:
Teks bertuliskan "Soal Evaluasi" yang tiap hurufnya bergerak naik turun.
Animasi[A2]:
Matahari yang
mengeluarkan sinarnya.
Animasi[A3]:
Awan yang bergerak dari kiri ke kanan tanpa berhenti.
Animasi[A4]:
Emoticon yang
menandakan benar/salah jawaban yang telah dipilih user. Animasi ini baru akan muncul jika user telah memilih pilihan jawaban.
Menu Evaluasi (Total Score User)
Tidak ada Background :
Gambar taman.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol.
Text View[1]:
Teks bertuliskan "Total Score". Background 1 Static Text 1 Static Text 2 Text View 1 A3 A2
Static Text[1]:
Untuk menampilkan nama user yang telah dimasukkan di halaman isi nama user.
Static Text[2]:
Untuk menampilkan total score user dari soal evaluasi pertama hingga terakhir.
Animasi[A1]:
Matahari yang
mengeluarkan sinarnya.
Animasi[A2]:
Awan yang bergerak dari kiri ke kanan tanpa berhenti.
Menu Video Belajar
Tidak ada. Background :
Gambar polos berwarna abu-abu bergaris pinggir hitam.
Button [1]:
Tombol bergambar panah ke kiri untuk kembali ke halaman menu utama dan ketika tombol ditekan akan keluar suara serta ada efek animasi seperti menekan tombol. 1 Background 1 V1 A1 A2
Video[V1]: Video yang menampilkan pembelajaran tajwid. Animasi [A1]: Teks bertuliskan "VIDEO BELAJAR" yang berganti-ganti warna. Animasi [A2]: 2 orang yang menggerakkan tangannya.