APLIKASI MOBILE ILMU TAJWID BERBASIS MULTIMEDIA ...

19 downloads 5012 Views 5MB Size Report
APLIKASI MOBILE ILMU TAJWID. BERBASIS MULTIMEDIA. Oleh: Wahyu Al Baihaqi. 104091002853. PROGRAM STUDI TEKNIK INFORMATIKA. FAKULTAS  ...
APLIKASI MOBILE ILMU TAJWID BERBASIS MULTIMEDIA

Oleh: Wahyu Al Baihaqi 104091002853

PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA 2011 M / 1432 H

APLIKASI MOBILE ILMU TAJWID BERBASIS MULTIMEDIA

Skripsi Sebagai Salah Satu Syarat untuk Memperoleh Gelar Sarjana Komputer Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta

Oleh : Wahyu Al Baihaqi 104091002853

PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA 2011 M / 1432 H

i

DAFTAR GAMBAR

Gambar 2.1. Simbol State .................................................................................... 17 Gambar 2.2. Simbol Transisi State ...................................................................... 18 Gambar 2.3. Notasi State Transition Diagram ..................................................... 18 Gambar 2.4. Tahapan Pengembangan Multimedia .............................................. 19 Gambar 2.5. Area kerja Adobe Flash CS4 Professional ...................................... 26 Gambar 2.6. Tampilan Adobe Device Central CS4 ............................................ 29 Gambar 2.7. Area kerja Adobe Photoshop CS4 .................................................... 32 Gambar 2.8. Area kerja Nonosoft KHOT 3 ........................................................... 34 Gambar 3.1. Kerangka pikir pembuatan aplikasi .................................................. 50 Gambar 4.1. Storyboard Opening ......................................................................... 53 Gambar 4.2. Storyboard Intro ............................................................................... 53 Gambar 4.3. Storyboard Menu Utama .................................................................. 55 Gambar 4.4. Storyboard Huruf Hijaiyah .............................................................. 56 Gambar 4.5. Storyboard al-Nūn al-Sākinah dan Tanwin ..................................... 57 Gambar 4.6. Storyboard Iżhār .............................................................................. 59 Gambar 4.7. Storyboard Pengertian Iżhār ............................................................ 60 Gambar 4.8. Storyboard Huruf Iżhār .................................................................... 61 Gambar 4.9. Storyboard Contoh Iżhār...................................................................63 Gambar 4.10. Storyboard Tentang Aplikasi.......................................................... 64 Gambar 4.11. Storyboard Bantuan ....................................................................... 65 Gambar 4.12. Storyboard Keluar .......................................................................... 66 Gambar 4.13. Struktur Navigasi Menu Utama .................................................... 67 Gambar 4.14. Flowchart Menu Utama ................................................................. 68

xvi

Gambar 4.15. Flowchart al-Nūn al-Sākinah dan Tanwin ..................................... 69 Gambar 4.16. Flowchart al-Mīm al-Sākinah ........................................................ 70 Gambar 4.17. Flowchart Iżhār .............................................................................. 71 Gambar 4.18. Flowchart Idgām .............................................................................72 Gambar 4.19. Flowchart Iqlāb .............................................................................. 73 Gambar 4.20. Flowchart Ikhfā .............................................................................. 74 Gambar 4.21. Flowchart Iżhār Syafawi ................................................................ 75 Gambar 4.22. Flowchart Idgām Mimi .................................................................. 76 Gambar 4.23. Flowchart Ikhfā Syafawi ................................................................ 77 Gambar 4.24. Flowchart Menu Pilihan al-Nūn al-Sākinah, Tanwin, dan al-Mīm al-Sākinah .......................................................................................... 78 Gambar 4.25. Flowchart Menu Pilihan Iżhār, Idgām, Iqlāb, Ikhfā ...................... 79 Gambar 4.26. Flowchart Menu Pilihan Iżhār Syafawi, Idgām Mimi, Ikhfā Syafawi ..........................................................................................................80 Gambar 4.27. STD Menu Utama .......................................................................... 81 Gambar 4.28. STD al-Nūn al-Sākinah dan Tanwin .............................................. 82 Gambar 4.29. STD al-Mīm al-Sākinah ................................................................. 83 Gambar 4.30. STD Iżhār ....................................................................................... 84 Gambar 4.31 STD Idgām ...................................................................................... 85 Gambar 4.32. STD Iqlāb ....................................................................................... 86 Gambar 4.33. STD Ikhfā ....................................................................................... 87 Gambar 4.34. STD Iżhār Syafawi ......................................................................... 88 Gambar 4.35. STD Idgām Mimi ............................................................................ 89 Gambar 4.36. STD Ikhfā Syafawi ......................................................................... 90 Gambar 4.37. STD Menu Pilihan al-Nūn al-Sākinah dan Tanwin,

xvii

al-Mīm al-Sākinah................................................................................................. 91 Gambar 4.38. STD Menu Pilihan Iżhār, Idgām, Iqlāb, Ikhfā ............................... 92 Gambar 4.39. . STD Menu Pilihan Iżhār Syafawi, Idgām Mimi, Ikhfā Syafawi ......................................................................................................... 93 Gambar 4.40. Tampilan Opening .......................................................................... 94 Gambar 4.41. Tampilan Intro ................................................................................ 95 Gambar 4.42. Tampilan Menu Utama................................................................... 96 Gambar 4.43. Tampilan Huruf Hijaiyah ............................................................... 97 Gambar 4.44. Tampilan al-Nūn al-Sākinah dan Tanwin ...................................... 98 Gambar 4.45. Tampilan Iżhār ............................................................................... 99 Gambar 4.46. Tampilan Pengertian Iżhār ............................................................. 99 Gambar 4.47. Tampilan Huruf Iżhār................................................................... 100 Gambar 4.48. Tampilan Contoh Iżhār ................................................................ 101 Gambar 4.49. Tampilan Tentang Aplikasi .......................................................... 102 Gambar 4.50. Tampilan Bantuan ........................................................................ 102 Gambar 4.51. Tampilan Keluar ........................................................................... 103 Gambar 4.52. Pembuatan Gambar Background Aplikasi menggunakan Adobe Photoshop CS4 ......................................................................................... 107 Gambar 4.53. Pembuatan Tombol Navigasi ....................................................... 108 Gambar 4.54. Pembuatan Tombol Navigasi Menu Utama dan Submenu 1 ...................................................................................................... 109

Gambar 4.55. Pembuatan Tombol Navigasi Submenu 2 .................................... 109 Gambar 4.56. Pembuatan Tampilan Opening ..................................................... 111 Gambar 4.57. Pembuatan Tampilan Halaman Menu Utama .............................. 112 Gambar 4.58. Pembuatan Tampilan Halaman Contoh........................................ 114

xviii

Gambar 4.59. Pembuatan Teks Arab dan Ayat al-Qur’an ................................. 114 Gambar 4.60. Pengujian aplikasi pada Emulator Adobe Device Central CS4.... 115 Gambar 4.61. Handphone Nokia 5530 XpressMusic ......................................... 116 Gambar 4.62. File Aplikasi ................................................................................ 118 Gambar 4.63. Pengujian aplikasi pada perangkat handphone............................. 119

xix

DAFTAR LAMPIRAN

Lampiran I Surat-surat Penelitian .................................................................... 127 Lampiran II Kuisioner Evaluasi 1 ................................................................... 128 Lampiran III Kuisioner Evaluasi 2 ...................................................................... 129 Lampiran IV Hasil Kuisioner Evaluasi 1 ........................................................... 130 Lampiran V Hasil Kuisioner Evaluasi 2 . ............................................................132 Lampiran VI Testing . ..........................................................................................134 Lampiran VII Source Code . ................................................................................137

xx

APLIKASI MOBILE ILMU TAJWID BERBASIS MULTIMEDIA

Skripsi Sebagai Salah Satu Syarat Untuk Memperoleh Gelar Sarjana Komputer Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta

Oleh : Wahyu Al Baihaqi 104091002853

Menyetujui,

Pembimbing I

Pembimbing II

Viva Arifin, MMSI

Amin Johari, MA

NIP. 19730810 200604 2 001

NIP. 19720911 200212 1008

Mengetahui, Ketua Program Studi Teknik Informatika

Yusuf Durrachman, M.Sc M.IT NIP. 19710522 200604 1 002

ii

PENGESAHAN UJIAN Skripsi yang berjudul “Aplikasi Mobile Ilmu Tajwid Berbasis Multimedia” disusun oleh Wahyu Al Baihaqi 104091002853, telah diuji dan dinyatakan lulus dalam Sidang Munaqosyah Fakultas Sains dan Teknologi, Universitas Islam Negeri Syarif Hidayatullah Jakarta pada Hari Kamis, 18 Agustus 2011. Skripsi ini telah diterima sebagai salah satu syarat untuk memperoleh gelar Sarjana Strata Satu (S1) Program Studi Teknik Informatika. Jakarta, Agustus 2011 Menyetujui, Penguji I

Penguji II

DR. Agus Salim M. Si NIP. 19720816199903 1 003

Muhammad Tabah Rosyadi, MA NIP. 19620714 198903 1 004

Pembimbing I

Pembimbing II

Viva Arifin, MMSI NIP. 19730810 200604 2 001

Amin Johari, MA NIP. 19720911 200212 1008

Mengetahui, Dekan Fakultas Sains dan Teknologi

Ketua Prodi Teknik Informatika

DR. Syopiansyah Jaya Putra, M.Sis NIP. 19680117 200112 1001

Yusuf Durrachman, M.Sc, MIT NIP. 19710522 200604 1 002

iii

PERNYATAAN DENGAN INI SAYA MENYATAKAN BAHWA SKRIPSI INI BENAR – BENAR HASIL KARYA SENDIRI YANG BELUM PERNAH DIAJUKAN SEBAGAI SKRIPSI ATAU KARYA ILMIAH PADA PERGURUAN TINGGI ATAU LEMBAGA MANAPUN.

Jakarta, Agustus 2011

Wahyu Al Baihaqi 104091002853

iv

ABSTRAK WAHYU AL BAIHAQI, Aplikasi Mobile Ilmu Tajwid Berbasis Multimedia. Dibawah bimbingan VIVA ARIFIN dan AMIN JOHARI. Perkembangan teknologi menjadikan handphone tidak lagi berfungsi hanya sebagai sarana komunikasi, fiturnya semakin diperkaya, sehingga lebih fungsional. Salah satu perkembangan handphone yaitu adanya fitur flash lite yang dapat dijadikan media penyampaian informasi berbasis multimedia. Tujuan dari penulisan skripsi ini yaitu merancang aplikasi mobile ilmu tajwid untuk memudahkan para pengajar, pelajar tahsin, qari’ dan juga setiap orang yang ingin belajar tajwid untuk mendapatkan informasi dan panduan ilmu tajwid khususnya untuk hukum al-nūn al-sākinah, tanwin dan al-mīm al-sākinah. Dengan menggunakan dua metode, yaitu metode pengumpulan data yang meliputi studi pustaka, kuisioner dan metode pengembangan multimedia menurut Luther yang terdiri dari enam tahap, yaitu konsep, perancangan, pengumpulan bahan material, pembuatan, testing dan distribusi. Software yang digunakan dalam pembuatan aplikasi ini yaitu Adobe Flash CS4, Adobe Device Central CS4, Adobe Photoshop CS4, Adobe Audition 3.0 dan Nonosoft KHOT 3. Output yang dihasilkan berupa aplikasi mobile ilmu tajwid dengan ukuran 3,30 MB yang menampilkan informasi panduan ilmu tajwid khususnya untuk hukum al-nūn al-sākinah, tanwin dan almīm al-sākinah. Kata Kunci: Ilmu Tajwid, Mobile Application, Hukum Al-nūn Al-Sākinah, Tanwin, Hukum Al-Mīm Al-Sākinah, Flash Lite, Multimedia xx + 138 Halaman; 72 Gambar; 7 Tabel; 7 Lampiran Daftar Pustaka: 15 (1967-2010)

v

KATA PENGANTAR

Assalamu’alaikum wr.wb. Alhamdulillahirabbil’alamiin, Segala puji dan syukur kehadirat Allah SWT, atas segala karunia dan rahmat-Nya sehingga penulis dapat menyelesaikan penyusunan skripsi dengan judul "Aplikasi Mobile Ilmu Tajwid Berbasis Multimedia" dengan baik. Shalawat serta salam penulis sampaikan pada junjungan dan suri teladan kita, Nabi Besar Muhammad Saw. beserta keluarga dan para sahabatnya. Skripsi ini dibuat sebagai salah satu syarat untuk mendapatkan gelar Strata 1 (S1) pada Program Studi Teknik Informatika Universitas Islam Negeri Syarif Hidayatullah Jakarta. Selama penulisan skripsi ini, penulis mengalami hambatan dan kesulitan yang datang silih berganti. Oleh karena itu, penulis mengucapkan terima kasih yang sebesar-besarnya kepada semua pihak yang telah membantu sehingga penulisan skipsi ini selesai, khususnya pada: 1.

Bapak Prof. Dr. Komarudin Hidayat, selaku Rektor UIN Syarif Hidayatullah Jakarta.

2.

Bapak DR. Syopiansyah Jaya Putra, M.Sis, selaku Dekan Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta dan Bapak Yusuf Durrachman, M.Sc, MIT selaku Ketua Program Studi Teknik Informatika Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta.

vi

3.

Ibu Viva Arivin, MMSI dan Bapak Amin Johari MA, selaku pembimbing I dan II yang telah membantu penulis dalam penyusunan skripsi ini. Terima kasih atas kesediaan waktu, tenaga, dan pikiran dalam memberikan arahan dan bimbingan kepada penulis sehingga skripsi ini dapat diselesaikan.

4.

Seluruh dosen Program Studi Teknik Informatika, atas ilmu yang diajarkan dan diberikan selama masa perkuliahan penulis, serta para staff akademik Program Studi Teknik Informatika yang telah membantu penulis dalam pengurusan surat-surat yang diperlukan.

5.

Ibu Dra. Halimah SM, M.Ag, selaku Dosen Praktikum Ibadah dan Tilawah UIN Syarif Hidayatullah Jakarta yang telah mengijinkan penulis

untuk

melakukan

wawancara,

sehingga

mendapatkan

informasi yang diinginkan. 6.

Bapak Kuswanto, selaku Koordinator Bidang Kajian Islam Yayasan Subuh.net yang telah mengijinkan penulis melakukan penelitian, dan para anggota yang banyak membantu selama penulis melakukan penelitian.

7.

Keluarga penulis, kedua orang tua tercinta, Ayahanda Bambang Darusman dan Ibunda Anisatullaila, terima kasih telah mendoakan penulis pagi, siang dan malam, memberi restu dan tak bosan-bosan mengingatkan penulis untuk menyelesaikan skripsi. Penulis juga berterima kasih kepada adik-adikku, Bagus dan Novi yang juga mendoakan penulis.

vii

Penulis menyadari bahwa selama melakukan penyusunan dan penulisan skripsi ini masih banyak terdapat kekurangan dan kesalahan-kesalahan di dalamnya. Oleh karena itu penulis meminta maaf yang sebesar-besarnya kepada semua pihak, atas kekurangan dan kesalahan baik sengaja maupun tidak di sengaja selama melakukan penyusunan skripsi ini. Akhir kata, semoga apa yang telah penulis susun dalam skripsi ini dapat memberikan manfaat bagi siapa saja yang membacanya dan semoga dapat dikembangkan di kemudian hari. Wassalamualaikum wr.wb.

Jakarta, Agustus 2011

Wahyu Al Baihaqi

viii

LEMBAR PERSEMBAHAN

Skripsi ini penulis persembahkan kepada semua pihak yang telah membantu penulis sehingga skripsi ini dapat diselesaikan, di antaranya adalah. 1.

Keluarga penulis, kedua orang tua tercinta, Ayahanda Bambang Darusman dan Ibunda Anisatullaila, terima kasih telah selalu mendoakan penulis pagi, siang dan malam, memberi restu dan tak bosan-bosan mengingatkan penulis untuk menyelesaikan skripsi. Penulis juga berterima kasih kepada kedua adikku, Bagus dan Novi yang juga mendoakan serta memberikan support kepada penulis.

2.

Seluruh teman-teman TI B 2004 yang namanya tidak bisa disebutkan satu persatu.

3.

Serta semua pihak yang telah membantu penulis dalam menyelesaikan penyusunan skripsi ini baik secara langsung maupun tidak langsung yang tidak dapat penulis sebutkan satu persatu.

ix

DAFTAR ISI

Halaman Judul ..................................................................................................... i Lembar Persetujuan Pembimbing .................................................................... ii Lembar Pengesahan Ujian ................................................................................ iii Lembar Pernyataan ........................................................................................... iv Abstrak .................................................................................................................. v Kata Pengantar .................................................................................................. vi Lembar Persembahan ......................................................................................... ix Daftar Isi ............................................................................................................... x Daftar Tabel ........................................................................................................ xv Daftar Gambar ................................................................................................. xvi Daftar Lampiran ................................................................................................ xx

BAB I PENDAHULUAN ..................................................................................... 1 1.1. Latar Belakang ................................................................................... 1 1.2. Perumusan Masalah ............................................................................ 4 1.3. Batasan Masalah ................................................................................. 4 1.4. Tujuan dan Manfaat Penulisan ........................................................... 5 1.4.1.Tujuan ........................................................................................ 5 1.4.2.Manfaat ..................................................................................... 5 1.5. Metodologi Penelitian ........................................................................ 6 1.5.1.Metodologi Pengumpulan Data ................................................ 7 1.5.1.1. Studi Kepustakaan ...................................................... 6 1.5.1.2. Kuisioner ..................................................................... 7

x

1.5.2.Metodologi Pengembangan Multimedia ................................... 7 1.6. Sistematika Penulisan Skripsi ............................................................. 7 BAB II LANDASAN TEORI .............................................................................. 9 2.1. Mobile Application .............................................................................. 9 2.1.1. Handphone ............................................................................... 9 2.2. Multimedia ..........................................................................................10 2.2.1. Definisi Multimedia ............................................................... 10 2.2.2. Elemen Multimedia ..................................................................11 2.2.2.1. Teks ........................................................................... 11 2.2.2.2. Gambar ...................................................................... 11 2.2.2.3. Animasi ..................................................................... 12 2.2.2.4. Audio ......................................................................... 12 2.2.2.6. Video ......................................................................... 13 2.2.2.7. Interactive Link ......................................................... 13 2.3. Perancangan Sistem ........................................................................... 13 2.3.1. Storyboard .............................................................................. 13 2.3.2. Flowchart ............................................................................... 14 2.3.3. Desain Struktur Navigasi ....................................................... 15 2.3.4. State Transition Diagram ....................................................... 17 2.4. Metodologi Pengembangan Multimedia ........................................... 19 2.4.1. Konsep (Concept) ................................................................... 19 2.4.2. Perancangan (Design) ............................................................ 20 2.4.3. Pengumpulan Bahan Material (Material Collecting) ............. 21 2.4.4. Pembuatan (Assembly) ........................................................... 21

xi

2.4.5. Pengujian (Testing) ................................................................ 21 2.4.6. Distrbusi (Distribution) ...........................................................22 2.5. Flash Lite ........................................................................................... 22 2.5.1. Sejarah .................................................................................... 22 2.5.2. Pembahasan Umum Flash Lite .............................................. 22 2.6. Adobe Flash CS4 Professional .......................................................... 24 2.7. Adobe Device Central CS4 ............................................................... 28 2.8. Adobe Photoshop CS4 ...................................................................... 31 2.9. Nonosoft KHOT 3 ............................................................................. 33 2.10. Literatur Sejenis .............................................................................. 35 BAB III METODOLOGI PENELITIAN ........................................................ 38 3.1. Metodologi Pengumpulan Data ........................................................ 38 3.1.1. Studi Kepustakaan .................................................................. 38 3.1.2. Wawancara ............................................................................. 38 3.2. Metodologi Pengembangan Multimedia ........................................... 39 3.2.1. Konsep (Concept) ................................................................... 39 3.2.2. Perancangan (Design) ............................................................ 39 3.2.3. Pengumpulan Bahan Material (Material Collecting) ............. 43 3.2.4. Pembuatan (Assembly) ........................................................... 47 3.2.5. Pengujian (Testing) ................................................................ 48 3.2.6. Distribusi (Distribution) ......................................................... 49 3.3. Kerangka Pikir.....................................................................................49 BAB IV HASIL DAN PEMBAHASAN ........................................................... 51 4.1. Metode Pengembangan Multimedia .................................................. 51 4.1.1. Konsep (Concept) ................................................................... 51

xii

4.1.2. Perancangan (Design) ............................................................ 52 4.1.2.1. Perancangan Storyboard ........................................... 53 4.1.2.2. Perancangan Struktur Navigasi ................................. 67 4.1.2.3. Perancangan Flowchart ............................................. 68 4.1.2.4. Perancangan STD (State Transition Diagram) ......... 81 4.1.2.5. Perancangan Antarmuka Pemakai (Interface) ........... 94 4.1.3. Pengumpulan Bahan Material (Material Collecting) ........... 103 4.1.3.1. Gambar .................................................................... 104 4.1.3.2. Teks ......................................................................... 104 4.1.3.3. Animasi ................................................................... 104 4.1.3.4. Audio ....................................................................... 104 4.1.3.5. Kontrol Navigasi ..................................................... 105 4.1.4. Pembuatan (Assembly) ......................................................... 105 4.1.5. Pengujian (Testing) .............................................................. 115 4.1.6. Distribusi (Distribution) ....................................................... 119 4.1.6.1. Spesifikasi Hardware dan Software ........................ 119 4.1.6.2. Cara Menggunakan Program ................................... 121 BAB V KESIMPULAN DAN SARAN ........................................................... 123 5.1. Kesimpulan ...................................................................................... 123 5.2. Saran ................................................................................................ 123 DAFTAR PUSTAKA . .......................................................................................125

xiii

DAFTAR TABEL

Tabel 2.1. Simbol-simbol flowchart .................................................................... 15 Tabel 3.1. Daftar Gambar ..................................................................................... 44 Tabel 3.2. Daftar Audio ........................................................................................ 45 Tabel 4.1. Spesifikasi hardware dan Software ................................................... 106 Tabel 4.2. Spesifikasi Handphone ...................................................................... 117 Tabel 4.3. Spesifikasi handphone yang disarankan ............................................ 120 Tabel 4.4. Spesifikasi komputer yang disarankan ............................................... 121

xiv

1

BAB I PENDAHULUAN

1.1.

Latar Belakang Penggunaan telepon selular atau yang lebih akrab dengan nama ponsel, di era sekarang posisinya memang sudah tidak tergantikan. Selain sebagai alat komunikasi dan penghubung antar individu, ponsel juga tidak lebih sebagai alat untuk mempermudah serta mempernyaman kebutuhan hidup, Ketika tidak terhubung dengan PC desktop dan ingin melakukan sesuatu yang biasanya dilakukan dengan PC, semisal membaca email, browsing, chatting, dan lain sebagainya, ponsel dapat dipergunakan sebagai media penghubung. (Azis, 2009). Munculnya teknologi komputer, elektronik dan komunikasi menciptakan struktur multimedia yang baru untuk dekade yang akan datang. Bersatunya teknologi multimedia dengan industri telekomunikasi menjadikan telepon dan televisi dapat dikombinasikan, yang menghasilkan peralatan komunikasi yang semakin kaya, sehingga mampu untuk melakukan belanja di rumah, belajar jarak jauh, mendengarkan lagu, nonton film, menabung, membayar telepon dan listrik dan berinteraksi keseluruh dunia. (Suyanto, 2005) Al-Qur’an adalah firman Allah yang maha suci dan agung, yang menjadi pedoman hidup seluruh umat Islam. Membacanya bernilai ibadah dan mengamalkannya merupakan kewajiban yang diperintahkan dalam

2

agama. Seorang muslim harus mampu membaca al-Qur’an dengan benar seperti yang dicontohkan Rasulullah SAW. (Syarbini & Mufidah, 2010) Membaca al-Qur’an tidaklah sama dengan membaca bacaan yang lain, ada aturan – aturan tertentu yang harus dilakukan. Hal yang paling utama bahwa membaca al-Qur’an harus dengan tartīl. Tartīl mengandung arti teratur, perlahan, membaguskan dan memperhatikan tajwidnya. Hal ini tidak dapat dilakukan tanpa mengerti dan memahami kaidah baca alQur’an seperti yang dipelajari dalam ilmu tajwid. (Al Mahfani, 2010) Indonesia merupakan negara yang berpenduduk muslim terbesar di dunia, tetapi masih banyak yang belum bisa membaca al-Qur’an dengan baik dan benar. Data Balitbang Departemen Agama (Depag) tahun 20082009 menunjukkan bahwa 50% sampai 70% masyarakat muslim Indonesia masih dalam kondisi buta huruf al-Qur’an. (Syarbini & Mufidah, 2010) Terdapat beberapa kendala dalam membaca al-Qur’an dengan benar sesuai dengan hukum-hukum tajwid, seperti : 1. Sulitnya membedakan hukum al-nūn al-sākinah, tanwin dan al-mīm al-sākinah. 2. Karena terlalu banyaknya hukum al-nūn al-sākinah, tanwīn dan almīm al-sākinah di dalam al-Qur’an, sehingga sering terlewat. 3. al-Qur’an Tajwid yang berbentuk teks belum memberikan fasilitas contoh cara membaca al-Qur’an yang benar sebagai panduan.

3

4. Pada media tertentu, seperti program acara televisi, aplikasi CD pembelajaran interaktif dan lembaga pengajian, interaksi dengan media tersebut memiliki keterbatasan dalam hal waktu dan tempat. 5. al-Qur’an Digital yang ada belum memberikan fasilitas untuk membedakan hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah. Berdasarkan uraian tersebut maka diperlukan suatu solusi untuk mengatasi masalah tersebut. Solusi yang ditawarkan oleh penulis adalah dengan membuat aplikasi mobile atau mobile application berbasis multimedia yang dijalankan pada perangkat handphone menggunakan aplikasi flash lite yang akan mempermudah umat Islam untuk mengetahui dan mempelajari ilmu tajwid, khususnya hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah, dengan penyampaian yang lebih menarik dan cara pengaksesan lebih cepat, praktis dan efisien. Pengembangan aplikasi ini tidak terlepas dari sudah banyaknya perangkat handphone yang mendukung aplikasi flash lite versi 2.0 dan mendukung berbagai macam elemen multimedia, maka penulis ingin mendalami teknologi aplikasi flash lite dengan mengembangkan aplikasi ilmu tajwid tersebut. Dari permasalahan di atas, maka penulis memilih judul : ”APLIKASI MOBILE ILMU TAJWID BERBASIS MULTIMEDIA”.

4

1.2.

Perumusan Masalah Berdasarkan pada latar belakang yang dijelaskan dan sesuai tujuan dari penulisan skripsi ini, maka pokok permasalahan yang dapat penulis simpulkan adalah sebagai berikut: 1. Bagaimana membuat aplikasi mobile yang dapat menyajikan penyampaian ilmu tajwid untuk hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah berbasis multimedia. 2. Bagaimana menerapkan aplikasi tersebut pada perangkat handphone yang mendukung aplikasi flash lite versi 2.0.

1.3.

Batasan Masalah Dengan luasnya cakupan pembahasan mengenai ilmu tajwid, maka penulis membatasi ruang lingkup pembahasan agar penulisan skripsi dapat terfokus kepada masalah yang ada. Ruang lingkup pembahasan adalah: 1. Penyajian Ilmu tajwid terbatas pada hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah, hal ini bersumber pada buku karya Moh. Wahyudi, Ilmu Tajwid Plus, Halim Jaya, Surabaya, 2008. 2. Tools atau software yang digunakan adalah Adobe Flash CS4, Adobe Device Central CS4, Adobe Photoshop CS 4 Nonosoft KHOT 3, dan Adobe Audition 3.0. 3. Jenis handphone yang digunakan dalam penerapan aplikasi ini adalah Nokia tipe 5530 XpressMusic.

5

4. Aplikasi diterapkan hanya pada handphone yang mendukung aplikasi flash lite versi 2.0 5. Aplikasi ini digunakan sebagai panduan bagi para pengajar dan pelajar tahsin, qari’ serta untuk umum yaitu orang yang ingin belajar tajwid.

1.4.

Tujuan dan Manfaat Penulisan 1.4.1. Tujuan Tujuan dari penulisan skripsi ini adalah untuk merancang suatu mobile application yang berisi tentang ilmu tajwid untuk hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah yang berjalan pada aplikasi flash lite dalam perangkat handphone yang menggunakan teknologi dan aplikasi multimedia. 1.4.2. Manfaat Dengan

melakukan

penulisan

skripsi

ini,

penulis

mendapatkan manfaat-manfaat, antara lain: 1. Bagi Penulis a. Lebih paham secara detail pengetahuan tentang ilmu tajwid dan hukumnya terutama untuk hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah. b. Penulis mampu menerapkan aplikasi mobile menggunakan aplikasi

flash

lite

ke

dalam

handphone

untuk

menyampaikan ilmu tajwid untuk hukum al-nūn alsākinah, tanwīn dan al-mīm al-sākinah

6

2. Bagi Pengguna a. Dengan dirancangnya aplikasi ini, dapat memudahkan pengguna dalam memperoleh ilmu tajwid mengenai hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah b. Membantu pengguna untuk mengetahui hukum dan tata cara menggunakan ilmu tajwid untuk hukum al-nūn alsākinah, tanwīn dan al-mīm al-sākinah dalam membaca alQur’an. 3. Bagi Universitas a. Mengetahui kemampuan mahasiswa dalam menguasai materi ilmu yang telah diperoleh di bangku kuliah. b. Mengetahui kemampuan mahasiswa dalam menerapkan ilmunya dan sebagai bahan evaluasi.

1.5.

Metodologi Penelitian Dalam penulisan skripsi ini penulis menggunakan dua metode dalam perancangan aplikasi dan untuk mendapatkan data-data serta informasi yang diperlukan, yaitu metode pengumpulan data dan metode pengembangan multimedia. 1.5.1. Metodologi Pengumpulan Data: 1.5.1.1. Studi Kepustakaan Metode

pengumpulan

kepustakaan

atau

studi

literatur dilakukan dengan cara membaca buku-buku yang

7

berkaitan,

sehingga

dapat

dijadikan

acuan

dalam

penulisan skripsi ini. 1.5.1.2. Kuisioner Metode ini dilakukan dengan cara membagikan kuisioner kepada pengguna untuk mengetahui sejauh mana aplikasi yang di rancang dapat bermanfaat bagi para pelajar tahsin ilmu tajwid terkait hukum-hukumnya.

1.5.2. Metodologi Pengembangan Multimedia: Menurut Luther (1994) (dalam Ariesto Hadi Sutopo, 2003:32) metodologi pengembangan multimedia dilakukan melalui 6 tahapan, yaitu konsep (concept), desain atau perancangan (design), pengumpulan bahan material (material collecting), pembuatan

(assemby),

pengujian

(testing),

dan

distribusi

(distribution).

1.6.

Sistematik Penulisan Untuk memudahkan penulis dalam menyusun skripsi ini, pembahasan terbagi kedalam 5 (lima) bab yang diuraikan sebagai berikut:

8

BAB I PENDAHULUAN Bab ini berisi pembahasan mengenai uraian tentang Latar Belakang, Rumusan Masalah, Batasan Masalah, Tujuan dan Manfaat Penulisan, dan Sistematika penulisan. BAB II LANDASAN TEORI Bab ini berisi pembahasan tentang landasan teori, definisi dan komponen pembangun yang ada dalam penyusunan skripsi ini, mulai dari al-Qur’an, Ilmu Tajwid, Hukum al-Nūn al-Sākinah dan Tanwīn, Hukum al-Mīm al-Sākinah, Multimedia, Adobe Flash CS4, Adobe Photoshop CS4, Nonosoft KHOT 3, Adobe Device Central CS4, Adobe Audition 3.0. BAB III METODE PENELITIAN Bab ini berisi pembahasan mengenai metodologi yang penulis gunakan dalam pengembangan aplikasi mobile application berbasis multimedia berdasarkan metodologi pengembangan aplikasi multimedia. BAB IV PERANCANGAN DAN PEMBUATAN APLIKASI Bab ini berisi pembahasan perancangan dan proses pembuatan aplikasi mobile application sebagai solusi berdasarkan permasalahan yang ada. BAB V KESIMPULAN DAN SARAN Bab ini berisi mengenai kesimpulan dan saran yang penulis peroleh dari penulisan dan penyusunan skripsi ini.

9

BAB II LANDASAN TEORI

2.1. Mobile Application Mobile Application adalah merupakan suatu aplikasi yang cara mengaksesnya menggunakan perangkat bergerak (Mobile Device) seperti Handphone, Smartphone, dan PDA Phone. (Suryana, 2008) 2.1.1. Handphone Telepon seluler atau lebih dikenal dengan nama ponsel atau handphone saat ini menjadi salah satu alat komunikasi populer. karena perkembangan alat komunikasi yang satu ini belakangan berubah secara seginifikan. ini dibuktikan dengan kemampuan ponsel dijejali dengan berbagai macam software dan hardware multimedia

seperti

kamera,

pemutar

musik,

kemampuan

berselancar di internet dan lain-lain. (Rudi, 2009) Perkembangan handphone atau ponsel telah memasuki babak baru, yaitu babak multimedia. kemunculan babak baru yang dipicu oleh luasnya perkembangan komputer dan perkembangan teknologi internet menjadikan fitur ponsel tidak hanya sekedar untuk SMS atau sebagai telepon. (Sugiarto, 2007)

10

2.2. Multimedia Istilah multimedia merupakan istilah yang diambil dari teater, bukan komputer. Pertunjukan yang memanfaatkan lebih dari satu medium seringkali disebut pertunjukan multimedia. Sistem multimedia dimulai pada akhir 1980-an dan terus berkembang hingga saat ini (Suyanto, 2003). 2.2.1. Definisi Multimedia 1. Menurut McCormick (2003), multimedia secara umum merupakan kombinasi tiga elemen, yaitu suara, gambar dan teks. 2. Menurut Robin dan Linda (2003), multimedia merupakan alat yang dapat menciptakan presentasi yang dinamis dan interaktif yang mengkombinasikan teks, grafik, animasi, audio dan video. 3. Menurut Turban (2003), multimedia adalah kombinasi paling sedikit dua media input atau output dari data, media input atau output dari data, media ini dapat berupa audio (suara atau musik), animasi, video, teks, grafik dan gambar. 4. Menurut Hoftstetter (2001), multimedia adalah pemanfaatan komputer untuk membuat dan menggabungkan teks, grafik, audio, video dan animasi dengan menggabungkan link dan tool yang

memungkinkan

pemakai

melakukan

berinteraksi, berkreasi dan berkomunikasi.

navigasi,

11

2.2.2. Elemen Multimedia Untuk membuat aplikasi multimedia, diperlukan penggabungan dari beberapa elemen, dimana setiap elemen memiliki peranan masing-masing (Suyanto, 2003), yaitu: 2.2.2.1.

Teks Teks merupakan dasar dari pengolahan kata dan informasi berbasis multimedia. Penggunaan teks dalam multimedia sangat efektif untuk menyampaikan ide serta memberikan panduan kepada pengguna. Teks dapat membentuk kata, surat atau narasi dalam multimedia dan merupakan bentuk data yang paling mudah disimpan dan dikendalikan. Teks dapat disajikan dalam berbagai bentuk font maupun ukuran dan merupakan media yang paling umum digunakan dalam penyajian informasi yang bertujuan untuk memudahkan penyampaian informasi ke pengguna.

2.2.2.2.

Gambar Grafik atau gambar digunakan dalam presentasi atau publikasi multimedia

multimedia yang

karena

menarik

dan

dapat dapat

menghasilkan mengurangi

kebosanan dibandingkan dengan teks. (Suyanto, 2003)

12

Gambar

merupakan

elemen

multimedia

yang

dipresentasikan dalam dua dimensi maupun tiga dimensi sebagai media ilustrasi yang memperjelas penyampaian informasi. Gambar yang digunakan dalam multimedia dapat berupa gambar sintesis, artinya gambar yang dibuat dengan program editor gambar seperti Adobe Photoshop, dapat juga berupa gambar hasil scanning dari foto atau lukisan tangan. 2.2.2.3.

Animasi Animasi berarti gerakan image atau video. Konsep dari

animasi

menggambarkan

sulitnya

menyajikan

informasi dengan satu gambar, atau sekumpulan gambar. (Sutopo, 2003) 2.2.2.4.

Audio (suara/musik) Didefinisikan sebagai sembarang bunyi dalam bentuk digital seperti suara, musik, narasi dan sebagainya. Dengan adanya audio (suara atau musik) suatu aplikasi multimedia menjadi lebih menarik dan lebih interaktif. Penyajian audio merupakan cara lain untuk lebih memperjelas pengertian suatu informasi. Audio atau suara dapat lebih menjelaskan karakteristik suatu gambar. (Sutopo, 2003)

13

2.2.2.5.

Video Menurut Agnew dan Kellerman (1996) definisi video adalah sebagai media digital yang menunjukkan susunan atau urutan gambar-gambar dan memberikan ilusi, gambaran serta fantasi kepada gambar yang bergerak. Video menyediakan satu kaedah penyaluran informasi yang amat menarik dan live. Video merupakan sumber atau media

yang

paling

dinamik

serta

efektif

dalam

menyampaikan suatu informasi. 2.2.2.6.

Interactive Link Interactive multimedia

yang

link

merupakan

diperlukan

untuk

sebagian

dari

menggabungkan

beberapa elemen (objek) multimedia, sehingga menjadi informasi yang terpadu, dimana pengguna dapat menekan mouse atau objek pada layer seperti tombol atau teks dan menyebabkan

program

melakukan

perintah

tertentu.

(Sutopo, 2003) Dalam hal ini penulis menggunakan elemen multimedia teks, gambar, animasi, audio dan interactive link. 2.3. Perancangan Sistem 2.3.1. Storyboard Storyboard menurut (Luther 1994, dalam Sutopo, 2003) merupakan deskripsi dari setiap scene yang secara jelas

14

menggambarkan

objek

multimedia

serta

perilakunya

yang

penjelasannya dapat menggunakan symbol maupun teks. Storyboard merupakan serangkaian sketsa dibuat persegi panjang yang menggambarkan suatu urutan (alur cerita) elemenelemen yang diusulkan untuk aplikasi multimedia (Suyanto, 2003). Storyboard memiliki manfaat antara lain: 1. Merupakan visual test bagi pengembang atau pemilik multimedia. 2. Pedoman dari aliran pekerjaan bagi staf pembuat multimedia. 3. Gambaran suatu multimedia yang akan diproduksi bagi sponsor. (Nugroho, 2005) 2.3.2. Flowchart Sistem flowchart menggambarkan tahapan proses dari suatu sistem, termasuk sistem multimedia. Sedangkan program flowchart menggambarkan urutan-urutan instruksi dari suatu program komputer. (Suyanto, 2003) Flowchart view digunakan untuk melengkapi storyboard untuk multimedia non-linier (interaktif) dan multimedia yang menggunakan banyak percabangan. Flowchart disebut juga diagram tampilan yang digunakan pada multimedia interaktif untuk menggambarkan alur dari suatu scene (tampilan) ke scene lainnya. (Sutopo, 2003). Simbol-simbol dalam flowchart di antaranya :

15

Tabel 2.1. Simbol-simbol flowchart No.

Simbol

Fungsi

Menggambarkan proses atau 1. proses perhitungan Sambungan pada halaman 2. yang sama Sambungan pada halaman 3 yang berbeda

4

Arah data / arus data

Mulai (start) atau selesai

5

(stop)

6

Proses input atau output

7

Keputusan (Decision)

2.3.3. Desain Struktur Navigasi Struktur navigasi merupakan rancangan alur program. Dalam pengembangan aplikasi berbasis multimedia maupun pengembangan web menurut Lowery (2001, dalam Sutopo, 2003:

16

37), terdapat beberapa model navigasi dasar, di mana desainer harus mengenal dengan baik karena setiap model memberikan solusi untuk kebutuhan yang berbeda. Secara umum terdapat 4 jenis model struktur navigasi dalam pengembangan aplikasi berbasis multimedia, yaitu : 1. Linear navigation model Merupakan model yang digunakan oleh sebagian besar multimedia linier. Informasi diberikan secara sekuensial dimulai dari satu halaman. Linear navigation model banyak digunakan dan berhasil dengan baik pada beberapa macam aplikasi seperti: a. Presentasi. b. Aplikasi computer based-training. c. Aplikasi yang memerlukan informasi berurutan. 2. Hierarchical model Model ini diadaptasi dari top-down design yang memiliki konsep dimulai dari dari satu node yang menjadi halaman utama dan dibuat beberapa cabang ke halamanhalaman level 1, dari tiap halaman level 1 dikembangkan menjadi beberapa cabang lagi. 3. Spoke-and-hub model Model hub dinyatakan dengan halaman utama yang mempunyai hubungan dengan setiap node, setiap node

17

dapat berhubungan kembali ke halaman utama dan memiliki struktur hyperlink yang fleksibel. 4. Full web model Model ini memberikan kemampuan hyperlink yang banyak yang digunakan untuk dapat mengakses semua topik dengan cepat, namun memiliki kelemahan seperti user akan kehilangan cara untuk kembali ke topik sebelumnya. Dalam hal ini penulis menggunakan struktur navigasi Hierarchical model untuk pembuatan aplikasi. 2.3.4. State Transition Diagram State transition diagram (STD) menunjukkan bagaimana sistem bertingkah laku sebagai akibat dari kejadian eksternal. Untuk melakukannya, STD menunjukkan berbagai model tingkah laku (disebut state) sistem dan cara di mana transisi dibuat dari state satu ke state lainnya. STD berfungsi sebagai dasar bagi pemodelan tingkah laku. (Pressman, 2002: 354) Notasi State Transition Diagram : 1. State ialah kumpulan keadaan atau atribut yang mencirikan seseorang atau suatu benda pada waktu tertentu, bentuk keberadaan tertentu atau kondisi tertentu. State disimbolkan dengan segi empat.

Gambar 2.1. Simbol State

18

2. Transisi State atau perubahan state, disimbolkan dengan panah berarah.

Gambar 2.2. Simbol Transisi State

3. Kondisi dan aksi. kondisi adalah kejadian yang menyebabkan sebuah sistem menunjukkan beberapa bentuk perilaku yang dapat diprediksi, sedangkan aksi didefinisikan proses yang terjadi sebagai konsekuensi dari adanya transisi. Untuk melengkapi STD dibutuhkan dua hal untuk mengubah keadaan. Di bawah ini ilustrasi dari kondisi dan aksi yang ditampilkan di sebelah anak panah yang menghubungkan dua keadaan.

Gambar 2.3. Notasi State Transition Diagram (Sumber: Wisnu, 2002)

19

2.4.

Metodologi Pengembangan Multimedia Metode penelitian yang digunakan dalam penulisan skripsi dan pembuatan aplikasi ini adalah metode menurut Luther (1994, Sutopo: 2003), yaitu pengembangan multimedia dilakukan berdasarkan 6 tahap, yaitu concept, design, material collecting, assembly, testing, dan distribution.

Gambar 2.4. Tahapan Pengembangan Multimedia (Sumber: Sutopo, 2003) 2.4.1. Konsep (Concept) Tahap konsep (concept) yaitu menentukan tujuan, termasuk identifikasi audiens, macam aplikasi (presentasi, interaktif, dan lain-lain), tujuan aplikasi (informasi, hiburan, pelatihan, dan lainlain) dan spesifikasi umum.

20

Pada tahap konsep ini yang penulis lakukan adalah: 1. Menentukan

tujuan,

untuk

apa

aplikasi

dikembangkan dan menentukan pengguna untuk siapa saja aplikasi ini dapat digunakan. 2. Deskripsi konsep aplikasi yang akan dibuat dengan menentukan jenis aplikasi dan spesifikasi umum aplikasi (judul, audien dan lain-lain). 2.4.2. Perancangan (Design) Maksud dari tahap perancangan (design) adalah membuat spesifikasi secara rinci mengenai arsitektur proyek, gaya, dan kebutuhan material untuk proyek. Spesifikasi dibuat cukup rinci sehingga pada tahap berikutnya, yaitu tahap pengumpulan bahan material (material collecting), pembuatan (assembly) tidak diperlukan keputusan baru, tetapi menggunakan apa yang sudah ditentukan pada tahap perancangan (design). Spesifikasi yang akan dibuat disesuaikan berdasarkan pada: 1. Perancangan storyboard. 2. Desain struktur navigasi. 3. Perancangan diagram tampilan (flowchart). 4. Perancangan diagram transisi (state transition diagram). 5. Perancangan antar muka (interface).

21

2.4.3. Pengumpulan Bahan Material (Material Collecting) Pada tahap ini dilakukan pengumpulan bahan seperti clipart image, animasi, audio, berikut pembuatan gambar grafik, foto, audio, dan lain-lain yang diperlukan untuk tahap-tahap berikutnya. Bahan material yang diperlukan dalam multimedia dapat diperoleh dari berbagai sumber seperti buku, internet, koleksi pribadi maupun dari bahan yang terdapat dari pihak tempat di mana penelitian dilaksanakan. 2.4.4. Pembuatan (Assembly) Tahap pembuatan (assembly) merupakan tahap di mana seluruh objek multimedia dibuat. Pembuatan aplikasi berdasarkan storyboard, flowchart, struktur navigasi atau diagram objek yang berasal dari tahap perancangan (design). Pada tahap ini semua objek atau elemen multimedia dibuat dan digabungkan menjadi satu kesatuan aplikasi. 2.4.5. Pengujian (Testing) Tahap

pengujian

(testing)

dilakukan

setelah

tahap

pembuatan dan seluruh data telah dimasukkan. Tahap ini dilakukan setelah tahap pembuatan (assembly) dengan menjalankan aplikasi atau program dengan tujuan untuk melihat apakah ada kesalahan atau tidak dan memastikan hasil pembuatan aplikasi multimedia sesuai dengan yang direncanakan.

22

2.4.6. Distribusi (Distribution) Tahapan di mana hasil aplikasi multimedia disebarluaskan. Tahap ini juga merupakan tahap dimana evaluasi dan implementasi aplikasi multimedia dilakukan. Evaluasi dilakukan

untuk

menentukan apakah sistem yang baru tersebut sesuai dengan tujuan semula dan diputuskan apakah ada revisi atau modifikasi.

2.5. Flash Lite 2.5.1. Sejarah Flash Lite Pada bulan februari 2003, Macromedia (sekarang Adobe) mengumumkan peluncuran flash lite, sebuah flash berdasarkan flash 4 scripting engine. Flash lite ditujukan untuk pasar handphone yang cukup luas.(Siswoutomo, 2005). Flash lite 1.0 diluncurkan pertama kali untuk handset 505i NTT DoCoMo di Jepang dan memberikan kemudahan dalam penempatan konten flash ke pasar ponsel untuk pertama kalinya. Penerapan flash lite di jepang telah sukses dengan flash lite preinstalled pada 25 model handset yang berbeda.(Wilson, 2005) 2.5.2. Pembahasan Umum Flash Lite Flash lite merupakan versi ringan dari adobe flash player (aplikasi perangkat lunak yang di-publish oleh Adobe Systems), versi ini ditujukan untuk ponsel dan perangkat elektronik portabel lainnya yang memungkinkan pengguna perangkat ini untuk melihat

23

konten multimedia dan aplikasi yang dikembangkan dengandengan menggunakan tool adobe flash yang sebelumnya hanya tersedia pada komputer. (YongFei 2010) Flash lite merupakan teknologi untuk mengembangkan aplikasi

yang

berjalan

di

sistem

operasi

mobile

yang

memungkinkan pengembangan aplikasi-aplikasi berbasis flash yang unik, karena terdapat elemen-elemen multimedia di dalamnya. Dalam pengembangan aplikasi flash lite di perlukan tools seperti: 1. Adobe Flash Professional. 2. Adobe Device Central 3. Action Script aplikasi flash lite dapat dibagi menjadi tiga jenis, yaitu: 1. Standalone Aplikasi standalone flash lite merupakan kategori yang paling umum dari aplikasi flash lite. Aplikasi ini tidak memerlukan hubungan ke jaringan. Contoh dari jenis aplikasi ini adalah application dan games. 2. Browser Konten flash lite juga dapat dimasukkan dalam halaman web sehingga konten flash lite ditampilkan pada situs mobile.

24

3. Screensaver Merupakan file SWF yang di dalamnya tidak terdapat interaksi oleh pengguna. tidak semua perangkat dengan flash lite mendukung screensaver, sehingga pengembang harus memastikan sasaran perangkat yang bisa menjalankannya. Perangkat (device) yang mendukung untuk jenis aplikasi

tergantung

pada

platform

perangkat

dan

kemampuan dari flash lite player yang diinstal pada perangkat. (Flash Lite Developer's Library 1.6, 2010)

2.6. Adobe Flash CS4 Professional Adobe Flash CS4 Professional adalah aplikasi perangkat lunak utama yang digunakan untuk membuat dan menyampaikan konten interaktif. Adobe Flash CS4 Profesional adalah program yang sangat handal dan paling maju dalam lingkungan authoring untuk membuat konten interaktif untuk digital, web, dan mobile platform. Flash dirancang dan dikembangkan untuk membuat presentasi, aplikasi dan beberapa karya multimedia interaktif. Pekerjaan yang dapat dilakukan oleh flash meliputi animasi, video, presentasi, dan aplikasi lainnya. Secara umum, semua hasil pekerjaan menggunakan flash disebut aplikasi. Aplikasi dalam flash dapat menggunakan elemen-elemen seperti, gambar atau foto, suara, video, dan efek spesial. (Thabrani, 2006)

25

Secara umum, semua aplikasi flash baik animasi maupun interaktif dibuat mengikuti tahap-tahap berikut: 1. Menentukan jenis aplikasi yang akan dibuat. menurut jenisnya, ada 3 macam aplikasi flash, yaitu: a. Animasi, biasanya berupa film kartun singkat, animasi logo, dan sebagainya b. Interaktif, banyak digunakan untuk pembuatan formulir atau polling online di internet c. Gabungan animasi dan interaktif, paling sering ditemukan berupa permainan flash. Berdasarkan file, flash CS4 professional dapat membuat beberapa aplikasi yaitu, file flash dan file flash mobile, yaitu file yang ditujukan untuk aplikasi pada telepon seluler tipe dan merek tertentu, yang tersedia pada Adobe Device Central 2. Membuat atau menambahkan unsur-unsur media, bisa berupa gambar, video, suara, atau teks. 3. Menyusun

unsur-unsur

media

yang

ditambahkan. 4. Memberi efek khusus. 5. Menambahkan actionscript 6. Menguji aplikasi 7. Mempublikasikan hasil akhir aplikasi.

telah

dibuat

atau

26

Gambar 2.5. Area kerja Adobe Flash CS4 Professional

1. Menu, sekumpulan perintah untuk mengatur objek atau animasi dan berisi kontrol untuk berbagai fungsi seperti membuat, membuka, dan

menyimpan file, copy, paste dan lain-lain.

2. Stages, merupakan lembar kerja berupa area persegi empat yang digunakan untuk mendesain, membuat, membentuk, dan menempatkan atau menganimasikan objek seperti gambar, teks, dan foto. 3. Panel tools atau toolbox, berisi koleksi tombol-tombol perintah untuk

membuat

atau

memformat objek. Panel tools

menggambar, juga

berisi

memilih

dan

fungsi-fungsi

27

untuk membuat tulisan, mewarnai, menghapus, dan membuat path pada stage dan timeline. 4. Panel properties, untuk memformat atau mengatur properti pada stage, seperti ukuran stage, warna dasar stage dan framerate dengan satuan FPS (frame per second). Panel properties juga memberikan informasi seperti versi flash player, script yang sedang digunakan. 5. Timeline merupakan bagian dalam flash yang berfungsi untuk membuat dan mengontrol objek dan animasi, terdiri dari layer, frame dan playhead. Timeline mengatur objek yang muncul dan berfungsi untuk mengatur

waktu

suatu

movie

dan memunculkan objek tertentu serta penempatan efek suara dan musik latar belakang. 6. Layer digunakan untuk menempatkan objek berbeda-beda. Layer digambarkan seperti tumpukan lembaran yang transparan yang berguna untuk pengaturan kerja, animasi dan elemen lainnya dan memudahkan dalam meng-edit suatu objek tanpa mempengaruhi objek lain yang berada pada layer lain. 7. Frame adalah gambar yang membentuk suatu gerakan bila frame tersebut ditampilkan satu demi satu secara berurutan untuk mengatur pembuatan animasi. Berikut istilah-istilah pada frame:

28

a.

Keyframe, merupakan suatu tanda yang digunakan untuk membatasi suatu gerakan animasi, ditandai dengan titik hitam tebal pada frame.

b. Blank Keyframe, merupakan keyframe yang tidak terdapat 8. Playhead , merupakan garis merah vertikal yang menunjukkan posisi frame pada suatu saat. 9. Frame rate adalah Jumlah bingkai gambar atau frame yang ditunjukkan setiap detik dalam membuat gambar bergerak, diwujudkan dalam satuan fps (frames per second), makin tinggi angka fps-nya, semakin mulus pergerakan gambar.

2.7. Adobe Devive Central CS4 Adobe Device Central CS4 adalah perangkat lunak yang berfungsi sebagai emulator yang memungkinkan pengembang untuk menguji konten flash berdasarkan profil menggunakan berbagai perangkat. Device central memudahkan pengembang untuk mengetahui perangkat mana saja yang dapat menjalankan aplikasi, sehingga pengembang dapat melihat bagaimana tampilan aplikasi yang akan terlihat oleh pengguna. (Global Web Site, 2009) Device central memiliki pengaturan-pengaturan untuk menguji aplikasi, seperti kondisi pencahayaan, kekuatan jaringan atau sinyal, dan memori yang tersedia. Device central juga berguna dalam tugas-tugas meliputi desain dan proses pengembangan, termasuk perencanaan, ide,

29

pengetesan, dokumentasi dan presentasi. (Adobe Systems Incorporated, 2008) Device central juga menyediakan pengembang konten mobile dan penguji dengan cara membuat dan mem-preview konten mobile pada berbagai macam perangkat (devices). Device central menampilkan antarmuka realistis dari berbagai perangkat mobile yang menunjukkan: 1. Seperti apa perangkat tersebut. 2. Bagaimana tampilan konten aplikasi pada perangkat tersebut. (Adobe Systems Incorporated, 2008)

Gambar 2.6. Tampilan Adobe Device Central CS4

1. Menu: berisi kontrol untuk berbagai fungsi perintah seperti membuat, membuka, menyimpan file, meng-edit, dan perintahperintah standar windows lainnya.

30

2. Device sets: digunakan untuk membuat suatu perangkat (device) dengan pengaturan tertentu untuk menguji konten aplikasi. 3. Device profiles : merupakan salah satu bagian utama dari device central, yang digunakan untuk melihat dan mengatur informasi perangkat (devices). Device profiles memberikan informasi mengenai perangkat termasuk media dan jenis konten yang didukung, yaitu konten yang dapat digunakan pada masing-masing perangkat seperti screen saver, wallpaper, dan stand-alone. 4. Emulator : merupakan salah satu bagian utama dari device central untuk melihat tampilan aplikasi pada perangkat virtual yang telah dipilih dari device library. Dalam modus ini, device central bisa digunakan sebagai aplikasi stand-alone untuk melihat konten seperti multimedia player dan melakukan interaksi seperti pada perangkat yang sebenarnya. Emulator memiliki panel-panel yang menampilkan informasi yang dibutuhkan dalam pembuatan aplikasi, antara lain: a. Display: fasilitas yang terdapat pada emulator yang berfungsi sebagai simulasi

tampilan yang dapat diatur

untuk dapat melihat bagaimana tampilan aplikasi pada lingkungan tertentu.

31

b. File info : memberikan informasi tentang nama, ukuran, versi flash dan dimensi dari suatu file. c. Content type : memberikan informasi tipe konten aplikasi yang sedang dijalankan pada emulator. d. Memory : panel ini memberikan informasi ukuran memori yang terpakai saat aplikasi dijalankan. 5. Online library: menampilkan semua perangkat yang tersedia untuk di-download ke dalam local library. 6. Local library : menampilkan perangkat umum flash lite dan juga menampilkan perangkat mobile yang telah di-download ke dalam device central dari online library.

2.8. Adobe Photoshop CS4 Adobe

Photoshop

adalah

program

pengolah

gambar

yang

penggunanya sangat luas. Mulai dari membuat gambar animasi, merancang halaman web, desain grafis (graphic design), persiapan presentasi, editing foto atau penyuntingan foto. Adobe Photoshop mampu menghasilkan gambar dengan kualitas tertinggi untuk cetakan web atau yang lainnya. (Riyanto, 2006)

32

Gambar 2.7. Area kerja Adobe Photoshop CS4

1. Menu Bar : Berisi semua menu yang disusun berdasarkan kesamaan tipe, misalnya, semua menu yang berkaitan dengan layer berada didalam menu layer, yang berkaitan dengan efek berada dalam menu filter, dan lain-lain. 2. Option Bar : Berisi pilihan tambahan yang berubah sesuai dengan tool (alat) yang digunakan. 3. Pallete Well : Berisi kumpulan pallete-pallete yang disusun secara berurutan untuk memudahkan dalam mengakses pallete yang bersangkutan. 4. Kanvas

:

Tempat

untuk

(mendesain) gambar/foto.

membuat

dan

mengedit

33

5. Toolbox : Berisi semua tool yang digunakan dalam Adobe Photoshop CS4

2.9.

Nonosoft KHOT 3 Nonosoft KHOT merupakan editor teks Arab yang mempunyai system penulisan berbeda (tidak kompatibel) dengan sistem Arabic bawaan Windows, sehingga dokumen yang huruf-huruf Arabnya diketik dengan menggunakan Nonosoft KHOT tidak bisa diedit oleh editor Arabic semacam Office Arabic ataupun semua editor yang menggunakan system Unicode dalam penulisan Arabicnya, begitu pula sebaliknya. Dengan demikian Nonosoft KHOT tidak memiliki kemampuan seperti editor yang menggunakan sistem Arabic Unicode, dimana dalam perubahan bentuk huruf dan format paragraf sepenuhnya diatur oleh lingkungan Windows. Selain itu sifat tulisan Arabnya tidak universal, misalnya tidak bisa langsung digunakan pada penulisan huruf arab di Website atau semua aplikasi online tanpa menyertakan / menginstal fontfont pendukungnya pada komputer user. (Setiawan, 2010)

34

Gambar 2.8. Area kerja Nonosoft KHOT 3

1. Menu, digunakan untuk pengoperasian dokumen Nonosoft KHOT (membuat, membuka dan menyimpan) pada media penyimpanan disk, selain itu juga terdapat pilihan pengaturan halaman, cetak dokumen dan yang lainnya. 2. Tool, merupakan kumpulan icon yang berfungsi sebagai shortcut dari perintah-perintah pada program Nonosoft KHOT, seperti member warna pada teks, merubah jenis huruf, merubah bahasa penulisan dan lainnya. 3. Status Bar, menyediakan informasi baris dan kolom (dari sebelah kiri), kondisi penulisan apakah dalam mode Auto Replace ataukah Manual dan juga kondisi ON – OFF tombol Caps Lock.

35

2.10. Literatur Sejenis Judul

: Aplikasi Al-Qur’an Tajwid Berbasis Multimedia Untuk Membedakan 5 Hukum Nun Mati Dan Tanwin

Jenis Literatur : Skripsi Penulis

: Indra Mastutik

Tahun

: 2007

No

Hal-hal yang

.

diperbandingkan

1.

Tools

Penulis Sebelumnya

Penulis Sekarang

Menggunakan

Menggunakan

Macromedia Director MX,

Adobe Flash CS4,

Macromedia Flash MX,

Adobe Device Central CS4,

Macromedia Fireworks MX, Adobe Photoshop CS4, Adobe Photoshop 7.0

Adobe Audition 3.0 Nonosoft KHOT 3

2.

Penerapan Aplikasi

3.

Hukum Tajwid

4.

Hasil

CD interaktif pada

Perangkat handphone

komputer

dengan Flash Lite v. 2.0

Hukum nun mati dan tanwin Hukum nun mati dan tanwin Hukum mim mati User dapat membedakan

User dapat membedakan

hukum nun mati dan tanwin

hukum nun mati dan tanwin

dengan kode warna dengan

ditambah mim mati dengan

media CD yang harus

contoh suara dari qari’ dan

menggunakan CD player

juga contoh ayat yang diberi

untuk menjalankannya

tanda warna pada bagian yang terdapat hukum tajwidnya dengan media handphone yang praktis dan bisa dibawa kemana - mana

36

Judul

: Aplikasi Pembelajaran Tajwid

Jenis Literatur : Skripsi Penulis

: Tri Ismiyani

Tahun

: 2009

No

Hal-hal yang

.

diperbandingkan

1.

Tools

Penulis Sebelumnya

Penulis Sekarang

Menggunakan,

Menggunakan

Macromedia Flash MX,

Adobe Flash CS4,

Adobe Photoshop CS

Adobe Device Central CS4, Adobe Photoshop CS4, Adobe Audition 3.0 Nonosoft KHOT 3

2.

Penerapan Aplikasi

3.

Hukum Tajwid

4.

Hasil

CD interaktif pada

Perangkat handphone

komputer

dengan Flash Lite v. 2.0

Hukum Nun mati dan

Hukum nun mati dan tanwin

tanwin

Hukum mim mati

User dapat mempelajari

User dapat mempelajari

hukum tajwid dengan

hukum tajwid dengan media

media CD yang harus

handphone yang praktis dan

menggunakan CD

bisa dibawa kemana - mana

player untuk menjalankannya

37

Judul

: Belajar Mudah Membaca al-Qur’an

Jenis Literatur : Free Stand Alone Aplication Penulis

: Anonym

Tahun

: 2008

No

Hal-hal yang

.

diperbandingkan

1.

Penulis Sebelumnya

Penulis Sekarang

Menggunakan

Menggunakan

Macromedia Flash

Adobe Flash CS4, Adobe Device Central CS4,

Tools

Adobe Photoshop CS4, Adobe Audition 3.0 Nonosoft KHOT 3

2.

Penerapan Aplikasi

3.

Hukum Tajwid

4.

Hasil

Aplikasi stand alone

Perangkat handphone

pada komputer

dengan Flash Lite v. 2.0

Hukum Nun Sakinah

Hukum nun mati dan tanwin

dan Tanwin

Hukum mim mati

User dapat mempelajari

User dapat mempelajari

hukum tajwid untuk

hukum tajwid untuk

membaca al-Qur’an

membaca al-Qur’an dengan

dengan aplikasi stand

media handphone yang

alone yang harus

praktis dan bisa dibawa

menggunakan flash

kemana - mana

player pada komputer untuk menjalankannya

38

BAB III METODOLOGI PENELITIAN

Pada bab ini akan diuraikan tentang tentang metode yang digunakan penulis dalam penyusunan skripsi. 3.1.

Metode Pengumpulan Data Untuk mendapatkan data serta informasi yang diperlukan, penulis menggunakan dua metode pengumpulan data untuk mendapatkan informasi dan kebenaran materi uraian pembahasan. Metode pengumpulan data yang digunakan dalam pembahasan skripsi ini sebagai berikut : 3.1.1.

Studi Kepustakaan Metode pengumpulan data dengan studi kepustakaan atau studi literatur ini dilakukan dengan cara membaca buku karya Moh. Wahyudi, Ilmu Tajwid Plus, Halim Jaya, Surabaya, 2008, yang merupakan buku terkait dengan pembelajaran al-Qur’an dan tajwid, sehingga dapat dijadikan suatu acuan dalam penulisan skripsi ini.

3.1.2.

Kuisioner Penulis menyebarkan kuisioner kepada 10 pengguna (user). Kuisioner ini bertujuan untuk mengetahui sejauh mana aplikasi yang dibuat dapat bermanfaat dan memudahkan para pengguna yang diantaranya adalah pelajar tahsin dalam mempelajari ilmu

39

tajwid dan untuk mengetahui apakah aplikasi mobile yang telah dibuat menarik dan mudah digunakan. Hasil Kuisioner dapat dilihat pada lampiran IV dan V, halaman 130 dan 132. 3.2.

Metode Pengembangan Multimedia 3.2.1.

Konsep (Concept) Tahap konsep (concept) yaitu tahap dimana penulis menentukan

tujuan

dari

pembuatan

aplikasi,

termasuk

identifikasi pengguna, macam aplikasi (informasi, media pembelajaran, hiburan, pelatihan dan lain-lain). Pada tahap konsep ini, yang penulis lakukan adalah : 1. Menentukan tujuan aplikasi, yaitu sebagai panduan dengan bentuk mobile application yang memudahkan para pengajar dan pelajar tahsin, qari’ serta masyarakat umum dalam belajar dan memahami tajwid. 2. Deskripsi aplikasi, yaitu dengan judul Mobile Application Ilmu Tajwid, bentuk aplikasi berupa mobile application dengan audiens Yayasan Subuh.net, dan aplikasi ini dapat dijalankan pada handphone yang mendukung aplikasi flash lite versi 2.0. 3.2.2.

Perancangan (Design) Pada tahap ini penulis membuat spesifikasi secara rinci mengenai arsitektur aplikasi, serta gaya dan kebutuhan material

40

yang digunakan untuk aplikasi. Spesifikasi yang akan dibuat berdasarkan pada : 1. Perancangan Storyboard Storyboard pada aplikasi sebenarnya berjumlah 44 storyboard, tetapi sebagian besar storyboard pada dasarnya memiliki tampilan yang sama, maka yang diberikan sebagai contoh sebanyak 12 storyboard, yaitu : 1) Storyboard Opening (Gambar 4.1) 2) Storyboard Intro (Gambar 4.2) 3) Storyboard Menu Utama (Gambar 4.3) 4) Storyboard Huruf Hijaiyah (Gambar 4.4) 5) Storyboard al-Nūn al-Sākinah dan Tanwīn (Gambar 4.5) 6) Storyboard Iżhār (Gambar 4.6) 7) Storyboard Pengertian Iżhār (Gambar 4.7) 8) Storyboard Huruf Iżhār (Gambar 4.8) 9) Storyboard Contoh Iżhār (Gambar 4.9) 10) Storyboard Tentang Aplikasi (Gambar 4.10) 11) Storyboard Bantuan (Gambar 4.11) 12) Storyboard Keluar (Gambar 4.12) Lengkapnya dapat dilihat pada subbab 4.1.2.1

41

2. Desain Struktur Navigasi Aplikasi ini hanya memiliki satu desain struktur navigasi, hierarchical model, yaitu struktur navigasi Menu Utama, selengkapnya dapat dilihat pada subbab 4.1.2.2 3. Perancangan Bagan Alur (Flowchart) Pada aplikasi ini terdapat 13 bagan alur (flowchart), yaitu : 1) Flowchart Menu Utama 2) Flowchart al-Nūn al-Sākinah dan Tanwin 3) Flowchart al-Mīm al-Sākinah 4) Flowchart Iżhār 5) Flowchart Idgām 6) Flowchart Iqlāb 7) Flowchart Ikhfā 8) Flowchart Iżhār Syafawi 9) Flowchart Idgām Mimi 10) Flowchart Ikhfā Syafawi 11) Flowchart Menu Pilihan al-Nūn al-Sākinah dan Tanwīn, al-Mīm al-Sākinah 12) Flowchart Menu Pilihan Iżhār, Idgām, Iqlāb, Ikhfā 13) Flowchart Menu Pilihan Iżhār Syafawi, Idgām Mīmi, Ikhfā Syafawi Selengkapnya dapat dilihat pada subbab 4.1.2.3

42

4. Perancangan Diagram Transisi (State Transition Diagram) Pada aplikasi ini terdapat 13 state transition diagram (STD), yaitu : 1) STD Menu Utama 2) STD al-Nūn al-Sākinah dan Tanwīn 3) STD al-Mīm al-Sākinah 4) STD Iżhār 5) STD Idgām 6) STD Iqlāb 7) STD Ikhfā 8) STD Iżhār Syafawi 9) STD Idgām Mīmi 10) STD Ikhfā Syafawi 11) STD Menu Pilihan al-Nūn al-Sākinah dan Tanwīn, alMīm al-Sākinah 12) STD Menu pilihan Iżhār, Idgām, Iqlāb, Ikhfā 13) STD Menu Pilihan Iżhār Syafawi, Idgām Mīmi, Ikhfā Syafawi Selangkapnya dapat dilihat pada subbab 4.1.2.4 5. Perancangan Antar Muka (Interface) Antar muka (interface) pada aplikasi sebenarnya berjumlah 44 antar muka (interface), tetapi sebagian besar antar muka (interface) pada dasarnya memiliki tampilan

43

yang sama, maka yang diberikan sebagai contoh sebanyak 12 antar muka (interface), yaitu : 1) Interface Opening 2) Interface Intro 3) Interface Menu Utama 4) Interface Huruf Hijaiyah 5) Interface al-Nūn al-Sākinah dan Tanwīn 6) Interface Iżhār 7) Interface Pengertian Iżhār 8) Interface Huruf Iżhār 9) Interface Contoh Iżhār 10) Interface Tentang Aplikasi 11) Interface Bantuan 12) Interface Keluar Selengkapnya dapat dilihat pada subbab 4.1.2.4

3.2.3.

Pengumpulan Bahan Material (Material Collecting) Pada tahap ini penulis melakukan pengumpulan, pembuatan dan pengeditan data berupa gambar, animasi, audio dan data yang berhubungan dengan al-Qur’an dan ilmu tajwid. Pada pembuatan aplikasi terdapat 52 gambar yang berformat *.JPG dan *.PNG.

44

Tabel 3.1. Daftar Gambar bg_contoh_idgam.jpg

bg_cth_idgam_bighunnah.jpg

bg_cth_idgam_bilaghunnah.jpg

bg_contoh_idgam_mimi.jpg

background_contoh_ikhfa.jpg

background_contoh_iqlab.jpg

bg_contoh_izhhar.jpg

bg_huruf_hijaiyah.jpg

background_huruf_ikhfa.jpg

background_huruf_iqlab.jpg

background_huruf_izhhar.jpg

bg_idgam_bighunnah.jpg

bg_idgam_bilaghunnah.jpg

background_opening_v2.jpg

background_menu_utama.jpg

bg_menu_utama_idgam.jpg

bg_menu_utama_ikhfa.jpg

bg_menu_utama_iqlab.jpg

bg_menu_utama_izhhar.jpg

bg_menu_utama_mim.jpg

bg_menu_utama_nun.jpg

bg_pembagian_idgam.jpg

bg_pengertian_idgam.jpg

bg_pengertian_ikhfa.jpg

bg_pengertian_iqlab.jpg

bg_pengertian_izhhar.jpg

bg_contoh_ikhfa_syafawi.jpg

bg_contoh_izhhar_syafawi.jpg

bg_huruf_idgam_bighunnah.jpg

bg_huruf_idgam_bilaghunnah.jpg

bg_huruf_idgam_mimi.jpg

bg_huruf_ikhfa_syafawi.jpg

bg_huruf_izhhar_syafawi.jpg

bg_idgam_mimi.jpg

bg_mc_keluar_small_half_v2.jpg

bg_menu_utama_ikhfa_syafawi.jpg

bg_menu_utama_izhhar_syafawi.jpg

bg_pengertian_idgam_mimi.jpg

bg_pengertian_ikhfa_syafawi.jpg

bg_pengertian_izhhar_syafawi.jpg

bg_tentang_aplikasi.jpg

button.png

45

button_hover.png

button_submenu2.png

button_submenu2_hover2.png

button_submenu3.png

button_submenu3_hover.png

button_submenu3_hover_v2.png

button_submenu3_v2.png

logo_subuhnet.png

bg_intro.jpg

bg_bantuan.jpg

Pada pembuatan aplikasi ini terdapat 60 audio yang berformat *.MP3 Tabel 3.2. Daftar Audio Bismillah.mp3

'Abasa_2.mp3

'Abasa_17.mp3

al-Balad_15.mp3

al-Fajr_21.mp3

al-Fajr_22.mp3

al-Gasyiyah_6.mp3

al-Gasyiyah_12.mp3

al-Infitar_19.mp3

al-Insan_26.mp3

al-Kahf_74.mp3

al-Lail_3.mp3

al-Lail_14.mp3

al-Ma'un_5.mp3

al-Mulk_27.mp3

al-Mutaffifin_31.mp3

an-Naba'_14.mp3

an-Naba'_18.mp3

an-Naba'_40.mp3

an-Naba'_40_dzo.mp3

an-Naba'_40_ta.mp3

an-Najm_22.mp3

an-Nazi'at_12.mp3

an-Nazi'at_37.mp3

al-Insyiqaq_1.mp3

an-Nazi'at_43.mp3

asy-Syams_9.mp3

asy-Syams_10.mp3

at-Takwir_28.mp3

at-Tariq_13.mp3

46

az-Zukhruf_17.mp3

al-Humazah_4.mp3

'Abasa_13.mp3

'Abasa_37.mp3

al-Buruj_20.mp3

al-Gasyiyah_8.mp3

al-Insyiqaq_14.mp3

al-Mutaffifin_15.mp3

an-Naba'_13.mp3

an-Naba'_30.mp3

an-Naziat_33.mp3

an-Nazi'at_36.mp3

at-Takwir_25.mp3

at-Tariq_6.mp3

'Abasa_18.mp3

'Abasa_18_kho.mp3

al-Bayyinah_8.mp3

al-Haqqah_36.mp3

al-Insyiqaq_25.mp3

al-Kausar_2.mp3

al-Mutaffifin_5.mp3

al-Qadr_5.mp3

an-Naba'_29.mp3

an-Naba'_36_izhhar.mp3

an-Nazi'at_33.mp3

at-Takwir_27.mp3

al-Adiyat_11.mp3

al-Humazah_8.mp3

al-Bayyinah_8_izhhar_syafawi.mp3

an-Naba'_3.mp3

Pada aplikasi ini terdapat 1 animasi, yaitu “tap screen untuk masuk”. Bahan-bahan yang digunakan untuk kebutuhan aplikasi, diperoleh melalui membuat sendiri dengan menggunakan beberapa program, seperti, Adobe Flash CS4, Adobe Photoshop CS4, Adobe Audition 3.0, Nonosoft KHOT 3, namun ada beberapa bahan yang diperoleh melalui internet dan buku-buku yang terkait dengan al-Qur’an dan tajwid yang kemudian diolah

47

menggunakan program yang telah disebutkan sebelumnya, untuk buku-buku yang penulis gunakan, secara lengkap dapat dilihat pada daftar pustaka. 3.2.4.

Pembuatan (Assembly) Tahap pembuatan (assembly) merupakan tahap dimana seluruh obyek multimedia akan dibuat. Pembuatan aplikasi berdasarkan storyboard, flowchart, struktur navigasi, state transition diagram dan perancangan antarmuka. Pada tahap ini software yang akan digunakan untuk membangun aplikasi adalah Adobe Flash CS4, Adobe Photoshop CS4, Nonosoft KHOT 3 dan Adobe Audition 3.0. Pada Adobe Flash CS4 penulis menggunkan fitur yang terdapat didalamnya yaitu, layer, frame, keyframe, actionscript, blank keyframe, dan juga beberapa menu seperti open file, save, import, dan test movie. Pada Adobe Photoshop CS4, penulis menggunakan fitur layer, text tools, dan effect, Pada Nonosoft KHOT 3, penulis menggunakan fitur text tools, untuk membuat tulisan arab. Pada Adobe Audition 3.0, penulis menggunakan fitur selecting, cutting, deleting dan converting audio. Spesifikasi minimum dalam pembuatan aplikasi ini adalah, menggunakan software Adobe Flash CS3, Adobe Device Central CS3, Adobe Photoshop 7, dan Adobe Audition 1.5.

48

Perangkat

handphone

yang

dapat

digunakan

untuk

menjalankan aplikasi ini harus memiliki spesifikasi minimal seperti : Spesifikasi

3.2.5.

Keterangan

Layar

360x640 pixel

OS

Symbian Versi 60

Flash Lite Versi

Flash Lite 2.0

Memori Kosong

5 Megabyte

Memory Internal

64 RAM

Pengujian (Testing) Tahap pengujian ini dilakukan setelah selesai tahap pembuatan dan seluruh data telah dimasukkan. Pada tahap ini penulis melakukan pengujian kepada ibu Dra. Halimah SM, MAg. selaku dosen Praktikum Ibadah dan Tilawah Fakultas Dakwah dan Ushuluddin UIN Syarif Hidayatullah Jakarta, dan juga kepada bapak Kuswanto, selaku Koordinator Bidang Kajian Islam Yayasan Subuh.net. Penulis melakukan pengujian dengan dua tahap, tahap pertama dilakukan pada lingkungan emulator dan tahap kedua diterapkan pada perangkat (device) sebenarnya, yaitu pada handphone.

Cara

pengujian

pada

lingkungan

emulator

menggunakan software Adobe Device Central CS4, yang dapat menampilkan

bentuk

handphone

sebenarnya

beserta

49

spesifikasinya dengan membuka file hasil dari test movie pada Adobe Flash CS4, untuk melihat apakah aplikasi sudah berjalan dengan benar. Pengujian pada handphone penulis lakukan dengan cara mentransfer file aplikasi dari komputer ke handphone dan menjalankannya, dapat dilihat pada subbab 4.1.5 3.2.6.

Distribusi (Distribution) Pada tahap distribusi ini dilakukan implementasi serta evaluasi terhadap aplikasi multimedia. Dalam hal ini penulis melakukan distribusi kepada Yayasan Subuh.net, adapun pihak Yayasan yang selanjutnya berwenang untuk meneruskan kepada para pengajar dan pelajar tahsin, qari’ dan juga masyarakat umum.

3.3.

Kerangka Pikir Kerangka pikir dalam pembuatan aplikasi ini digambarkan pada diagram berikut ini,

50

Media Pembelajaran Ilmu Tajwid

Sulit mengetahui cara membaca ayat yang didalamnya terdapat hukum tajwid

Permasalahan

Sulit membedakan hukumhukum al-nūn al-sākinah, tanwin dan al-mīm alsākinah

Adanya keterbatasan waktu, tempat dan tidak paraktis

Media pembelajaran interaktif dengan memberi contoh cara membaca ayat yang didalamnya terdapat hukum tajwid dengan suara

Solusi

Media pembelajaran interaktif dengan memberikan warna pada ayat yang terdapat hukum tajwid

Media pembelajaran interaktif dlm bentuk CD (Comppact Disk), website, dan perangkat gadged

Kekurangan

Aplikasi pembelajaran yang ada, masing-masing memiliki kelebihan dan kekurangan, terutama adanya keternatasan waktu dan tempat

Solusi

Menggabungkan teknik dari masing-masing media pembelajaran yang telah ada

Hasil

1. Adanya media pembelajaran yang praktis dengan fitur yang lengkap 2. Bisa dibawa kemana-mana (mobile) 3. Hanya menggunakan satu perangkat 4. Tanpa terbatas waktu dan tempat

Aplikasi Mobile

Gambar 3.1. Kerangka pikir pembuatan aplikasi

51

BAB IV HASIL DAN PEMBAHASAN

4.1. Metode Pengembangan Multimedia 4.1.1. Konsep (Concept) Aplikasi mobile tajwid berbasis multimedia ini berbentuk aplikasi mobile yang akan digunakan sebagai salah satu panduan agar para pengajar dan pelajar tahsin serta para qari’ dan juga masyarakat luas, khususnya umat Islam lebih mudah dalam menentukan dan mempelajari hukum tajwid, khusunya untuk hukum al-Nūn al-Sākinah dan tanwin beserta hukum al-Mīm al-Sākinah yang jumlahnya cukup banyak dalam setiap ayat al-Qur’an. Aplikasi ini juga disertai dengan panduan suara dari seorang qari’, dan juga memberikan tanda warna pada bagian yang terdapat hukum tajwid pada contoh ayat-ayatnya, hal ini akan membuat orang yang ingin mempelajari tajwid lebih terfokus untuk menerapkan hukum bacaan tersebut, sehingga dapat langsung menerapkannya dalam membaca al-Qur’an secara benar sesuai ilmu tajwid. Deskripsi konsep aplikasi adalah sebagai berikut : Judul

: Aplikasi

Mobile

Multimedia

Ilmu

Tajwid

Berbasis

52

Audiens

: Yayasan Subuh.net, umum yaitu para pengajar, pelajar tahsin, qari’ dan orang yang ingin belajar tajwid

Bentuk Aplikasi

: Mobile Application

Gambar

: Menggunakan file berformat JPEG dan PNG yang dibuat dan di edit menggunakan software Adobe Photoshop CS4

Audio

: Suara Murottal al-Qur’an Syech Sa’ad Al Ghomidy, yang berformat MP3 yang di edit dengan menggunakan software Adobe Audition 3.0

Animasi

: Animasi teks, tombol dan gambar di buat sendiri dengan menggunakan software Adobe Flash CS4

Interaktif

: Menggunakan link, baik berupa tombol, gambar, maupun teks yang memungkinkan pengguna menuju halaman yang diinginkan

4.1.2. Perancangan (Design) Tahap ini merupakan tahap perancangan aplikasi, dimana perancangan tersebut berupa perancangan storyboard, perancangan flowchart, perancangan struktur navigasi, perancangan diagram transisi

53

atau STD (State Transition Diagram), dan perancangan antarmuka pengguna (user interface). 4.1.2.1. Perancangan Storyboard Storyboard merupakan deskripsi dari tiap scene (tampilan), dengan mencantumkan semua obyek multimedia dan link ke scene lain (Suyanto : 2003) Adapun rancangan storyboard untuk tampilan aplikasi mobile tajwid berbasis multimedia ini adalah :

Storyboard Opening Modul

:1

Halaman

: Opening

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 1

Scene

: opening

Gambar

:

background_opening_v2.jpg, logo_suguhnet.png Animasi

: Teks

Audio

:-

54

Navigasi Tap Screen/Enter

: Masuk ke Intro

Notes

: Halaman Opening merupakan halaman pembuka, pada halaman ini terdapat satu tombol untuk masuk ke halaman Intro Gambar 4.1. Storyboard Opening

Storyboard Intro Modul

:2

Halaman

: Intro

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 1

Scene

: intro

Gambar

: bg_intro.jpg

Animasi

:-

Audio

: bismillah.mp3

Navigasi Notes

: Halaman Intro merupakan halaman pembuka kedua setelah halaman

55

Opening Gambar 4.2. Storyboard Intro

Storyboard Menu Utama Modul

:3

Halaman

: Menu Utama

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 1

Scene

: menu_utama

Gambar

:

background_menu_utama.jpg, button_submenu2.png, button.png Animasi

:-

Audio

:-

Navigasi Huruf Hijaiyah

: Untuk menuju halaman menu Huruf Hijaiyah

al-Nūn al-Sākinah dan Tanwin

: Untuk menuju halaman menu al-Nūn al-Sākinah dan Tanwin

56

al-Mīm al-Sākinah

: Untuk menuju halaman menu al-Mīm al-Sākinah

Pilihan

: Untuk menampilkan menu Pilihan

Kembali

: Untuk kembali menuju halaman Intro

Notes

: Halaman Menu Utama merupakan halaman pertama dari aplikasi ini, dimana pada halaman ini terdapat 3 tombol untuk menuju ke menu berikutnya, 1 tombol untuk kembali ke halaman intro dan 1 tombol lagi untuk menampilkan menu Pilihan yaitu, “Bantuan”, “Tentang Aplikasi”, dan “Keluar” Gambar 4.3. Storyboard Menu Utama

Storyboard Huruf Hijaiyah Modul

:4

Halaman

: Huruf Hijaiyah

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 2

Scene

: huruf_hijaiyah

Gambar

: bg_huruf_hijaiyah.jpg,

button_submenu2.png, button.png Animasi

:-

57

Audio

:-

Navigasi Pilihan

: Untuk menampilkan menu PIlihan

Lanjut

: Untuk menuju halaman Huruf Hijaiyah selanjutnya

Notes

: Pada halaman ini terdapat huruf-huruf hijaiyah berupa teks arab, dan terdapat 2 tombol, 1 tombol untuk melanjutkan ke halaman Huruf Hijaiyah berikutnya dan 1 tombol lagi untuk menampilkan menu Pilihan yaitu, “Menu Utama”, “Bantuan”, “Tentang Aplikasi”, dan “Keluar” Gambar 4.4. Storyboard Huruf Hijaiyah

Storyboard al-Nūn al-Sākinah dan Tanwin Modul

:5

Halaman

: al-Nūn al-Sākinah dan Tanwin

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 1

Scene

: menu_utama_nun

Gambar

:

58

bg_menu_utama_nun.jpg, button_submenu2.png, button.png Animasi

:-

Audio

:-

Navigasi Iżhār

: Untuk menuju halaman Iżhār

Idgām

: Untuk menuju halaman Idgām

Iqlāb

: Untuk menuju halaman Iqlāb

Ikhfā

: Untuk menuju halaman Ikhfā

Pilihan

: Untuk menampilkan menu Pilihan

Kembali

: Untuk kembali menuju halaman Menu Utama

Notes

: Pada halaman ini terdapat 4 tombol untuk menuju menu berikutnya,yaitu halaman Iżhār, Idgām, Iqlāb, Ikhfā , 1 tombol untuk kembali ke Menu Utama dan 1 tombol untuk menampilkan menu Pilihan, yaitu, “Menu Utama”, “Bantuan”, “Tentang Aplikasi”, dan “Keluar” Gambar 4.5. Storyboard al-Nūn al-Sākinah dan Tanwin

59

Storyboard Iżhār Modul

:6

Halaman

: Iżhār

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 9

Scene

: izhhar

Gambar

:

bg_menu_utama_izhhar.jpg, button_submenu2.png, button.png, button_submenu3.png Animasi

:-

Audio

:-

Navigasi Pengertian Iżhār

: Untuk menuju halaman Pengertian Iżhār

Huruf & Contoh Iżhār

: Untuk menuju halaman Huruf Iżhār

Pilihan

: Untuk menampilkan menu Pilihan

Kembali

: Untuk kembali menuju halaman al-Nūn al-Sākinah dan Tanwin

Notes

: Pada halaman ini terdapat 2 tombol untuk masuk ke

60

halaman berikutnya, yaitu, halaman Pengertian Iżhār dan halaman Huruf Iżhār, 1 tombol untuk kembali ke halaman al-Nūn al-Sākinah dan Tanwin dan 1 tombol untuk menampilkan menu Pilihan, yaitu “al-Nūn alSākinah dan Tanwin”, “Menu Utama”, “Bantuan”, “Tentang Aplikasi”, dan “Keluar”. Gambar 4.6. Storyboard Iżhār

Storyboard Pengertian Iżhār Modul

:7

Halaman

: Iżhār

Nama File

: mobile_tajwid.fla

Frame No.

: 2 dari 9

Scene

: izhhar

Gambar

:

bg_pengertian_izhhar.jpg, button.png Animasi

:-

Audio

:-

61

Navigasi Pilihan

: Untuk menampilkan menu Pilihan

Kembali

: Untuk kembali menuju halaman Iżhār

Notes

: Pada halaman ini terdapat definisi Iżhār dan terdapat 2 tombol, 1 tombol untuk kembali ke halaman Iżhār dan 1 tombol untuk menampilkan menu Pilihan, yaitu “al-Nūn al-Sākinah dan Tanwin”, “Menu Utama”, “Bantuan”, “Tentang Aplikasi”, dan “Keluar”. Gambar 4.7. Storyboard Pengertian Iżhār

Storyboard Huruf Iżhār Modul

:8

Halaman

: Iżhār

Nama File

: mobile_tajwid.fla

Frame No.

: 3 dari 9

Scene

: izhhar

Gambar

:

background_huruf_izhhar.jpg, button.png button_submenu2.png Animasi

:-

62

Audio

:-

Navigasi Huruf Iżhār

: Untuk menuju halaman Contoh Iżhār

Pilihan

: Untuk menampilkan menu Pilihan

Kembali

: Untuk kembali menuju halaman Iżhār

Notes

: Pada halaman ini terdapat huruf-huruf iżhār yang merupakan tombol untuk menuju halaman Contoh Iżhār dan terdapat 2 tombol, 1 tombol untuk kembali ke halaman Iżhār dan 1 tombol untuk menampilkan menu Pilihan, yaitu “al-Nūn al-Sākinah dan Tanwin”, “Menu Utama”, “Bantuan”, “Tentang Aplikasi”, dan “Keluar”. Gambar 4.8. Storyboard Huruf Iżhār

63

Storyboard Contoh Iżhār Modul

:9

Halaman

: Iżhār

Nama File

: mobile_tajwid.fla

Frame No.

: 4 dari 9

Scene

: izhhar

Gambar

: bg_contoh_izhhar.jpg, button.png, button_submenu2.png

Animasi

:-

Audio

:-

Navigasi Baca

: Untuk memainkan suara bacaan contoh ayat

Pilihan

: Untuk menampilkan menu Pilihan

Kembali

: Untuk kembali menuju halaman Huruf Iżhār

Notes

: Pada halaman ini terdapat ayat-ayat contoh iżhār dan terdapat 1 tombol Baca untuk setiap ayat yang berfungsi untuk memainkan suara bacaan contoh ayat dan terdapat 2 tombol, 1 tombol untuk kembali ke halaman Huruf Iżhār dan 1 tombol untuk menampilkan

64

menu Pilihan, yaitu “al-Nūn al-Sākinah dan Tanwin”, “Menu Utama”, “Bantuan”, “Tentang Aplikasi”, dan “Keluar”. Gambar 4.9. Storyboard Contoh Iżhār

Storyboard Tentang Aplikasi Modul

: 10

Halaman

: Tentang Aplikasi

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 1

Scene

:-

Gambar

: bg_tentang_aplikasi.jpg, button.png,

Animasi

:-

Audio

:-

Navigasi Tutup

: Untuk menutup halaman Tentang Aplikasi

Notes

: Pada halaman ini terdapat keterangan judul aplikasi, versi aplikasi, nama pembuat, nama qari’, tools-tools yang digunakan dan terdapat 1

65

tombol untuk menutup halaman Tentang Aplikasi. Gambar 4.10. Storyboard Tentang Aplikasi

Storyboard Bantuan Modul

: 11

Halaman

: Bantuan

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 1

Scene

:-

Gambar

: bg_bantuan.jpg, button.png,

Animasi

:-

Audio

:-

Navigasi Tutup

: Untuk menutup halaman Tentang Aplikasi

Notes

: Pada halaman ini terdapat panduan untuk menjalankan aplikasi dan terdapat 1 tombol untuk menutup halaman Bantuan. Gambar 4.11. Storyboard Bantuan

66

Storyboard Keluar Modul

: 12

Halaman

: Keluar

Nama File

: mobile_tajwid.fla

Frame No.

: 1 dari 1

Scene

:-

Gambar

:

bg_mc_keluar_small_half_v2.jpg, button.png, Animasi

:-

Audio

:-

Navigasi Ya

: Untuk menutup dan keluar dari aplikasi

Tidak

: Untuk tetap menjalankan aplikasi

Notes

: Pada halaman ini terdapat sebuah pertanyaan untuk menentukan pilihan, dan terdapat 2 tombol, yaitu “Ya” dan “Tidak” Gambar 4.12. Storyboard Keluar

67

4.1.2.2. Perancangan Struktur Navigasi

Gambar 4.13. Struktur Navigasi Menu Utama

68

4.1.2.3. Perancangan Flowchart

Gambar 4.14. Flowchart Menu Utama

69

Gambar 4.15. Flowchart al-Nūn al-Sākinah dan Tanwin

70

Gambar 4.16. Flowchart al-Mīm al-Sākinah

71

Gambar 4.17. Flowchart Iżhār

72

Gambar 4.18. Flowchart Idgām

73

Gambar 4.19. Flowchart Iqlāb

74

Gambar 4.20. Flowchart Ikhfā

75

Gambar 4.21. Flowchart Iżhār Syafawi

76

Gambar 4.22. Flowchart Idgām Mimi

77

Gambar 4.23. Flowchart Ikhfā Syafawi

78

Gambar 4.24. Flowchart Menu Pilihan al-Nūn al-Sākinah, Tanwin, dan al-Mīm al-Sākinah

79

Gambar 4.25. Flowchart Menu Pilihan Iżhār, Idgām, Iqlāb, Ikhfā

80

Gambar 4.26. Flowchart Menu Pilihan Iżhār Syafawi, Idgām Mimi, Ikhfā Syafawi

81

4.1.2.4. Perancangan STD (State Transition Diagram)

Gambar 4.27. STD Menu Utama

82

Gambar 4.28. STD al-Nūn al-Sākinah dan Tanwin

83

Gambar 4.29. STD al-Mīm al-Sākinah

84

Gambar 4.30. STD Iżhār

85

Gambar 4.31. STD Idgām

86

Gambar 4.32. STD Iqlāb

87

Gambar 4.33. STD Ikhfā

88

Gambar 4.34. STD Iżhār Syafawi

89

Gambar 4.35. STD Idgām Mimi

90

Gambar 4.36. STD Ikhfā Syafawi

91

Gambar 4.37. STD Menu Pilihan al-Nūn al-Sākinah dan Tanwin, al-Mīm al-Sākinah

92

Gambar 4.38. STD Menu Pilihan Iżhār, Idgām, Iqlāb, Ikhfā

93

Gambar 4.39. STD Menu Pilihan Iżhār Syafawi, Idgām Mimi, Ikhfā Syafawi

94

4.1.2.5. Perancangan Antarmuka (Interface) Rancangan antarmuka yang ditampilkan pada aplikasi Mobile Tajwid berbasis multimedia ini disesuaikan dengan kebutuhan dan pengetahuan pengguna, tujuannya agar dapat memudahkan pengguna untuk mendapatkan panduan dan juga informasi yang dibutuhkan. Pada aplikasi Mobile Tajwid berbasis multimedia ini secara umum terdapat 12 tampilan, yaitu : 1. Tampilan Opening Tampilan Opening merupakan tampilan awal ketika aplikasi pertama kali dijalankan, pada tampilan ini terdapat animasi teks yang berisi perintah untuk menekan atau menyentuh layar agar dapat masuk ke tampilan selanjutnya yaitu tampilan Intro.

Gambar 4.40. Tampilan Opening

95

2. Tampilan Intro Tampilan Intro merupakan tampilan yang muncul setelah tampilan Opening, setelah menekan atau menyentuh layar, pada tampilan ini terdapat potongan ayat dari surat Al-Muzzammil ayat 4 dan terdapat suara pengucapan Basmallah.

Gambar 4.41. Tampilan Intro

3. Tampilan Menu Utama Tampilan Menu Utama ini merupakan tampilan yang paling utama dari aplikasi Mobile Tajwid, pada tampilan ini terdapat beberapa tombol navigasi yang menghubungkan ke tampilan menu berikutnya, yaitu ke tampilan menu Huruf Hijaiyah, al-Nūn al-Sākinah dan Tanwin, serta tampilan menu al-Mīm al-Sākinah, pada

96

tampilan ini juga terdapat tombol navigasi untuk kembali ke tampilan sebelumnya, yaitu tampilan Intro dan juga tombol Pilihan yang didalamnya terdapat beberapa tombol lagi, seperti tombol Bantuan, Tentang Aplikasi, dan tombol Keluar untuk keluar dari aplikasi.

Gambar 4.42. Tampilan Menu Utama

4. Tampilan Huruf Hijaiyah Pada tampilan Huruf Hijaiyah ini berisi informasi mengenai huruf-huruf hijaiyah yang terdapat dalam al-Qur’an, dan juga terdapat 2 tombol navigasi yaitu, tombol Kembali, untuk kembali ke tampilan Menu Utama, dan tombol Pilihan, yang terdiri dari beberapa tombol navigasi di dalamnya seperti, tombol Menu Utama,

97

Bantuan, Tentang Aplikasi dan tombol Keluar untuk keluar dari aplikasi

Gambar 4.43. Tampilan Huruf Hijaiyah

5. Tampilan al-Nūn al-Sākinah dan Tanwin Pada tampilan al-Nūn al-Sākinah dan Tanwin ini terdapat tombol-tombol untuk menuju ke tampilan hukum-hukum al-Nūn al-Sākinah dan Tanwin, yaitu tombol Iżhār, Idgām, Iqlāb, dan Ikhfā, serta terdapat juga tombol untuk kembali ke Menu Utama dan tombol Pilihan yang sama dengan Menu Utama.

98

Gambar 4.44. Tampilan al-Nūn al-Sākinah dan Tanwin

6. Tampilan Iżhār Pada tampilan Iżhār ini terdapat beberapa tombol navigasi untuk menuju ke tampilan berikutnya yang masih berhubungan dengan Iżhār, seperti Pengertian Iżhār serta Huruf dan Contoh Iżhār pada tampilan ini juga terdapat tombol untuk kembali ke tampilan al-Nūn alSākinah dan Tanwin dan tombol Pilihan yang didalamnya terdapat beberapa tombol yang sedikit berbeda dari tombol Pilihan pada tampilan sebelumnya, yaitu, Tombol al-Nūn al-Sākinah dan Tanwin,yang berfungsi untuk kembali ke tampilan al-Nūn al-Sākinah dan Tanwin.

99

Gambar 4.45. Tampilan Iżhār

7. Tampilan Pengertian Iżhār Pada tampilan Pengertian Iżhār

terdapat

informasi mengenai definisi Iżhār dan juga terdapt tombol untuk kembali ke tampilan Iżhār dan tambol Pilihan yang sama dengan tombol Pilihan pada tampilan Iżhār.

Gambar 4.46. Tampilan Pengertian Iżhār

100

8. Tampilan Huruf Iżhār Pada tampilan Huruf Iżhār ini berisikan informasi huruf-huruf Iżhār yang juga merupakan tombol navigasi menuju ke tampilan Contoh Iżhār, dengan menekan atau menyentuh salah satu huruf yang diinginkan untuk menampilkan contohnya, pada tampilan ini juga terdapat tombol untuk kembali ke tampilan Iżhār dan tombol pilihan yang sama dengan tombol pilihan pada tampilan Iżhār.

Gambar 4.47. Tampilan Huruf Iżhār

9. Tampilan Contoh Iżhār Pada tampilan Contoh Iżhār ini terdapat contohcontoh ayat yang didalamnya terdapat hukum Iżhār yang diberi tanda warna kuning pada huruf yang dimaksud dan

101

juga

terdapat

tombol

Baca

yang

berfungsi

untuk

mengeluarkan suara cara membaca ayat tersebut, pada tampilan contoh Iżhār ini juga terdapat tombol untuk kembali ke tampilan Huruf Iżhār untuk memilih huruf yang lain yang akan ditampilkan contohnya, dan juga tombol pilihan yang sama dengan tombol Pilihan pada tampilan Iżhār.

Gambar 4.48. Tampilan Contoh Iżhār

10. Tampilan Tentang Aplikasi Tampilan

Tentang

Aplikasi

ini

berisikan

informasi mengenai judul aplikasi, versi aplikasi, pembuat aplikasi, qari’, dan tools-tools yang digunakan dalam pembuatan aplikasi, pada tampilan ini juga terdapat tombol Tutup untuk menutup Tampilan Tentang Aplikasi.

102

Gambar 4.49. Tampilan Tentang Aplikasi

11. Tampilan Bantuan Pada tampilan Bantuan ini terdapat informasi panduan untuk menggunakan aplikasi seperti penggunaan tombol navigasi dan yang lainnya.

Gambar 4.50. Tampilan Bantuan

103

12. Tampilan Keluar Tampilan Keluar ini muncul ketika tombol Keluar di tekan, tampilan Keluar ini berisikan pesan untuk meyakinkan pengguna apakah memang mau keluar dan menutup aplikasi atau tidak.

Gambar 4.51. Tampilan Keluar

4.1.3. Pengumpulan Bahan Material (Material Collecting) Bahan-bahan yang diperlukan untuk membangun aplikasi ini, baik berupa file gambar, teks, animasi, audio dan kontrol navigasi diperoleh dari berbagai sumber, tetapi sebagian besar bahan dibuat sendiri menggunakan software image editing dan programming, text editing serta audio editing.

104

4.1.3.1. Gambar File gambar untuk background penulis ambil dari internet yang kemudian diolah menggunakan aplikasi Adobe Photoshop CS4, dengan menambahkan beberapa efek dan gambar lain di dalamnya. 4.1.3.2. Teks File teks untuk isi materi tajwid dipeoleh dari beberapa buku pembahasan al-Qur’an dan tajwid, sedangkan untuk teks tulisan arab dan ayat-ayatnya dibuat sendiri oleh penulis dengan menggunakan aplikasi Nonosoft KHOT 3, dengan melihat dan mencontoh ayat-ayat yang ada di dalam al-Qur’an dan buku pembahasan tajwid. 4.1.3.3. Animasi Animasi yang ada pada aplikasi ini hanya berupa animasi teks yang diolah menggunakan aplikasi Adobe Flash CS4 untuk menganimasikannya. 4.1.3.4. Audio File suara pada aplikasi ini penulis peroleh dari koleksi pribadi, berupa CD Murottal al-Qur’an oleh Syech Sa’ad Al Ghomidy, baik suara pengucapan Basmallah pada intro maupun pengucapan contoh-contoh ayat untuk hukum-hukum tajwid yang diolah menggunakan aplikasi Adobe Audition 3.0.

105

4.1.3.5. Kontrol Navigasi Kontrol navigasi pada aplikasi ini berupa tomboltombol (button) yang didalamnya terdapat link-link yang menghubungkan antara halaman yang satu ke halaman yang lainnya, tombol navigasi tersebut penulis buat sendiri dengan menggunakan aplikasi Adobe Photoshop CS4 dan Adobe Flash CS4.

4.1.4. Pembuatan (Assembly) Pada tahap pembuatan (assembly) ini semua bahan-bahan berupa elemen-elemen multimedia dikumpulkan dan diintegrasikan menjadi satu menggunakan aplikasi Adobe Flash CS4. Pada aplikasi Adobe Flash CS4 dilakukan pengkodean dengan bahasa pemrograman flash yaitu berupa actionscript 2.0 dengan acuan pemrograman untuk flash lite 2.0, yang pada akhirnya akan menghasilkan aplikasi dalam bentuk file berformat SWF Movie (.swf) atau file yang dapat dijalankan menggunakan flash lite player. Aplikasi ini menggunakan layar dengan ukuran 640x360 pixel dengan tampilan fullscreen. Dalam pembuatan aplikasi Mobile Tajwid ini, menggunakan perangkat keras (hardware) dan perangkat lunak (software) dengan spesifikasi sebagai berikut,

106

Tabel 4.1. Spesifikasi hardware dan Software Spesifikasi

Keterangan

Processor

AMD Athlon 64 X2 2.0 GHz

Memory RAM

2 GB

Harddisk

512 GB

VGA

1 GB

Sistem Operasi / OS

Windows XP SP3

Software

1. Adobe Flash CS4 2. Adobe Photoshop CS4 3. Adobe Audition 3.0 4. Adobe Device Central CS4 5. Nonosoft KHOT 3

Monitor

17” Wide Screen, 1440x900 pixel

Media Koneksi

Bluetooth Device

Perangkat Lainnya

1. Keyboard 2. Mouse 3. Sound Card 4. Active Speaker

107

Setelah semua spesifikasi perangkat keras (hardware) dan perangkat lunak (software) dipenuhi, maka tahap selanjutnya adalah tahap pembuatan aplikasi dengan menggunakan perangkat lunak (software) yang telah disiapkan. Beberapa tahapan penting dalam pembuatan aplikasi Mobile Tajwid ini akan dibahas sebagai berikut. Langkah awal yang penulis lakukan adalah membuat gambar untuk background aplikasi, yang selanjutnya diteruskan dengan pembuatan gambar-gambar yang lain menggunakan aplikasi Adobe Photoshop CS4.

Gambar 4.52. Pembuatan Gambar Background Aplikasi menggunakan Adobe Photoshop CS4 Setelah gambar background telah selesai dibuat sesuai keinginan, dan di save dengan format *.jpg, maka langkah selanjutnya yang penulis lakukan adalah dengan membuat gambar untuk tombol-

108

tombol navigasi, seperti tombol-tombol pada Menu Utama, tomboltombol submenu 1, submenu 2, tombol Kembali, tombol Pilihan dan tombol-tombol yang ada di dalam menu Pilihan, semua tombol dibuat oleh penulis dengan menggunakan aplikasi Adobe Photoshop CS4, yang kemudian di save dengan format *.png dan selanjutnya dianimasikan dengan menggunakan apliksi Adobe Flash CS4

Gambar 4.53. Pembuatan Tombol Navigasi

109

Gambar 4.54. Pembuatan Tombol Navigasi Menu Utama dan Submenu 1

Gambar 4.55. Pembuatan Tombol Navigasi Submenu 2

110

Langkah berikutnya yang penulis lakukan adalah bekerja dengan menggunakan aplikasi Adobe Flash CS4 untuk membuat tampilan dan halaman-halaman menu aplikasi mulai dari tampilan opening, intro, halaman Menu Utama dan halaman-halaman menu lainnya

serta

menambahkan

elemen-elemen

pendukung

seperti,

menambahkan teks arab, ayat-ayat al-Qur’an, audio, serta memasukkan actionscript. Pembuatan tampilan Opening dan tampilan Intro kurang lebih sama, yang berbeda hanya pada content dan tata letaknya, pada tampilan halaman Opening ini penulis memasukkan content berupa teks untuk judul aplikasi, teks berupa perintah yang dianimasikan dengan salah satu teknik animasi tweened yaitu animasi alpha serta gambar untuk background dan gambar logo, penulis juga memberikan actionscript yang ditempatkan pada frame agar ketika aplikasi dijalankan dan pengguna menekan atau menyentuh layar, aplikasi secara otomatis langsung berpindah ke tampilan Intro, yang selanjutnya langsung masuk ke halaman Menu Utama,

111

Gambar 4.56. Pembuatan Tampilan Opening

Selanjutnya penulis masuk ke tahap pembuatan tampilan halaman Menu Utama, untuk pembuatan tampilan halaman Menu Utama, Menu al-Nūn al-Sākinah dan Tanwin, al-Mīm al-Sākinah,huruf Iżhār, Idgām, Iqlāb, Ikhfā serta menu huruf Iżhār Syafawi, Idgām Mimi, Ikhfā Syafawi, secara garis besar pembuatannnya sama, yang sedikit membedakan adalah ukuran tombol yang ada teks arabnya lebih kecil daripada tombol Menu Utama, untuk menambahkan teks arab pada halaman ini, penulis menggunakan aplikasi Nonosoft KHOT 3, dengan cara mengcopy hasil dari ketikan pada aplikasi Nonosoft KHOT 3 ke halaman Menu Utama yang dibuat pada aplikasi Adobe Flash CS4 pada tahap ini penulis juga memberikan actionscript yang ditempatkan di

112

setiap frame pada tombol-tombol untuk menuju ke menu berikutnya apabila tombol tersebut di tekan dan actionscript untuk menampilakan movie clip

Gambar 4.57. Pembuatan Tampilan Halaman Menu Utama

Pada halaman Menu Utama ini terdapat beberapa movie clip untuk menampilkan menu ketika tombol Pilihan di tekan, movie clip untuk menampilkan halaman Tentang Aplikasi ketika tombol Tentang Aplikasi ditekan serta movie clip tampilan keluar ketika tombol Keluar ditekan, pada halaman menu-menu yang lainnya juga terdapat movie clip yang sama. Selanjutnya penulis membuat tampilan halaman untuk contoh dari hukum-hukum al-Nūn al-Sākinah dan Tanwin, serta al-Mīm al-

113

Sākinah, seperti, tampilan halaman contoh Iżhār, Idgām, Iqlāb, Ikhfā dan tampilan halaman contoh Iżhār Syafawi, Idgām Mimi, Ikhfā Syafawi, untuk pembuatan tampilan halaman contoh dari hukum-hukum al-Nūn al-Sākinah dan Tanwin, serta al-Mīm al-Sākinah ini semua tahap dan prosesnya secara garis besar sama, pada tahap ini penulis memasukkan beberapa file audio Murottal al-Qur’an oleh Syech Sa’ad Al Ghomidy yang berformat *.mp3 ke setiap tombol Baca yang berbeda-beda, penulis juga memasukkan beberapa ayat-ayat al-Qur’an yang sebagian besar diambil dari juz 30, dengan cara mengetiknya terlebih dahulu pada aplikasi Nonosoft KHOT 3 lalu mengcopy kasil ketikan tersebut ke halaman contoh dari hukum-hukum al-Nūn al-Sākinah dan Tanwin, serta al-Mīm al-Sākinah yang dibuat pada aplikasi Adobe Flash CS4. Penulis juga memasukkan actionscript pada setiap frame tombol terutama tombol Baca yang berfungsi untuk memainkan suara ketika tombol tersebut di tekan dan suara yang keluar sesuai dengan contoh ayat yang ditampilkan pada setiap hukum-hukum al-Nūn alSākinah dan Tanwin, serta al-Mīm al-Sākinah.

114

Gambar 4.58. Pembuatan Tampilan Halaman Contoh

Gambar 4.59. Pembuatan Teks Arab dan Ayat al-Qur’an

115

4.1.5. Pengujian (Testing) 1. Pengujian oleh penulis pada emulator Setelah aplikasi selesai dibuat, pada tahap ini penulis melakukan pengujian (testing) aplikasi, pengujian ini dilakukan bertujuan untuk memastikan bahwa hasil pembuatan aplikasi sesuai dengan yang direncanakan dan diharapkan serta dapat berjalan dengan baik. Sebelum melakukan pengujian pada perangkat sebenarnya yaitu handphone, penulis terlebih dahulu melakukan pengujian pada emulator Adobe Device Central CS4.

Gambar 4.60. Pengujian aplikasi pada Emulator Adobe Device Central CS4

116

2. Pengujian oleh penulis pada Handphone Pada tahap ini penulis melakukan pengujian pada perangkat sebenarnya yaitu pada handphone untuk memastikan apakah aplikasi yang dibuat dapat berjalan dengan baik seperti pada emulator. Dalam pengujian aplikasi penulis menggunakan handphone Nokia 5530 XpressMusic. Handphone ini telah memenuhi kebutuhan spesifikasi minimal untuk menjalankan aplikasi yang dibuat

Gambar 4.61. Handphone Nokia 5530 XpressMusic (Sumber : Snapshot Adobe Device Central CS4)

117

Tabel 4.2. Spesifikasi Handphone Spesifikasi Layar

Keterangan TFT Resistive Touchscreen 16 Juta Warna 360x640 pixels 2.9”

Jaringan

GSM 850 / 900 / 1800 / 1900, EDGE, GPRS

OS

Symbian v9.4 S60 5th Edition

CPU

434 Mhz ARM 11 Processor

Koneksivitas

Bluetooth, Micro USB

Versi Flash Lite

Flash Lite 3.0

Memory Eksternal

4 GB

Memory Internal

70 MB, 128 SDRAM

118

Tahapan

untuk

menjalankan

aplikasi

pada

perangkat

handphone adalah sebagai berikut, a. Aplikasi yang telah diuji dan dijalankan pada emulator menghasilkan sebuah file berformat *.swf, file inilah yang di transfer ke dalam perangkat handphone

Gambar 4.62. File Aplikasi

b. File aplikasi ditransfer dari komputer ke perangkat handphone dengan

menggunakan

media

Bluetooth

atau

dengan

menggunakan microUSB c. Penulis menjalankan aplikasi pada perangkat handphone tanpa melakukan proses instalasi terlebih dahulu, karena aplikasi yang dibuat bersifat standalone

119

Gambar 4.63. Pengujian aplikasi pada perangkat handphone

Hasil dari pengujian aplikasi dengan menggunakan perangkat handphone, memperlihatkan bahwa aplikasi ini dapat berjalan dengan baik sesuai dengan pengujian yang dilakukan pada emulator Adobe Device Central CS4 4.1.6.

Distribusi (Distribution) Aplikasi yang telah melalui tahap pengujian (testing) pada emulator dan pada perangkat handphone, selanjutnya dikemas dalam bentuk CD (Compact Disk), CD tersebut diberikan kepada pihak Yayasan

Subuh.net,

untuk

digunakan

sebagai

sarana

dalam

pendistribusian aplikasi ini. 4.1.6.1. Spesifikasi Hardware dan Software Aplikasi Mobile Tajwid ini dapat berjalan dengan baik apabila spesifikasi perangkat keras (hardware) dan perangkat

120

lunak (software) sesuai dengan yang penulis sarankan, antara lain, 1. Perangkat Handphone Spesifikasi yang disarankan untuk perangkat handphone adalah sebagai berikut,

Tabel 4.3. Spesifikasi handphone yang disarankan Spesifikasi

Keterangan

Layar

640x360 pixels

OS

Symbian v9.4 S60 5th Edition

Versi Flash Lite

Flash Lite 3.0

Memori Kosong

5 MB

Memori

128 SDRAM

2. Komputer Untuk menjalankan CD yang berisi file aplikasi pada komputer, penulis sarankan untuk menggunakan perangkat komputer dengan spesifikasi sebagai berikut,

121

Tabel 4.4. Spesifikasi komputer yang disarankan Spesifikasi

Keterangan

OS

Windows XP

Processor

Intel Pentium 4 1.5 GHz

VGA

64 MB

Memori RAM

256 MB

Monitor

15” 1024x768 pixels

Perangkat lainnya

1. Keyboard 2. Mouse 3. Sound Card 4. Active Speaker

4.1.6.2. Cara Menggunakan Program Setelah melakukan transfer file aplikasi dari komputer ke perangkat handphone dengan menggunakan media koneksi yang tersedia, maka cara menggunakan mobile application ilmu tajwid atau mobile tajwid ini pada perangkat handphone adalah dengan cara pengguna dapat membuka dan menjalan

122

file aplikasi langsung pada perangkat handphone tanpa melakukan proses instalasi, karena aplikasi ini bersifat standalone, ketika pertama kali dijalankan maka pengguna akan dihadapkan pada tampilan Opening, dimana pada tampilan Opening ini pengguna diminta untuk menekan atau menyentuh layar handphone untuk masuk ke tampilan Intro dan selanjutnya akan masuk ke Menu Utama, pada halaman inilah pengguna dapat memilih menu dan masuk ke submenu dengan tombol navigasi yang ada.

123

BAB V KESIMPULAN DAN SARAN

5.1.

Kesimpulan Hasil dari pembuatan skripsi ini, penulis mendapatkan beberapa kesimpulan, yaitu: 1.

Pembuatan aplikasi mobile ilmu tajwid menghasilkan aplikasi mobile yang dapat memberikan panduan untuk mempelajari hukum al-nūn alsākinah, tanwīn dan al-mīm al-sākinah.

2.

Penggunaan flash lite menjadikan aplikasi mobile berbasis multimedia ini lebih menarik dan interaktif.

5.2.

Saran Aplikasi mobile ilmu tajwid ini masih sangat bisa dikembangkan, oleh sebab itu penulis mencoba memberikan saran bagi yang ingin mengembangkan aplikasi ini, yaitu. 1.

Aplikasi mobile ilmu tajwid dapat terkoneksi dengan internet sehingga data maupun materi ilmu tajwid dapat di update secara online

2.

Adanya penerapan sistem kode warna yang lebih berfariasi

3.

Penggunaan multi bahasa pada aplikasi ini akan memberikan manfaat kepada pengguna (user) yang lebih luas dibanding menggunakan satu bahasa.

124

4.

Aplikasi tidak hanya mengkaji hukum-hukum al-nūn al-sākinah, tanwin dan al-mīm al-sākinah, tetapi membahas keseluruhan ilmu tajwid

5.

Aplikasi mobile ilmu tajwid tidak hanya dapat berjalan pada handphone dengan layar sentuh (touch screen)

tetapi dapat juga

dijalankan pada handphone yang memiliki keypad. 6.

Aplikasi mobile ilmu tajwid ini perlu diterapkan di masyarakat agar umat islam dapat mempelajari hukum-hukum al-nūn al-sākinah, tanwīn dan al-mīm al-sākinah tanpa harus terbatas tempat dan waktu

125

Daftar Pustaka Al Mahfani M. K. 2010. Juz ‘Ama Tajwid Berwarna & Terjemahannya. Jakarta: PT WahyuMedia.

Fanani, A.Z. 2007. Bermain Logika ActionScript. Macromedia Flash Pro 8. Jakarta: PT Elex Media Komputindo.

Fanani A. Z. & Syarif A. M. 2010, Mudah Membuat Mobile Application dengan Flash Lite 3.0. Yogyakarta: Andi.

Fathin, A. A. & Tim Al-Bana 2009. Metode Al-Bana; Belajar Membaca AlQur’an Secara Mandiri. Jakarta: Bana Publishing.

Global Web Site. 2009. Introduction to Flash Lite E-learning. http://www.forum. nokia.com/info/sw.nokia.com/id/184088f1-358d-4b5b-ba4db1262ae32f9f/ Introduction_to_Flash_Lite_E-learning.html#). 21 Februari 2010, 09.30 WIB.

Madcoms. 2009. Panduan Lengkap Adobe Flash CS4 Professional. Yogyakarta: Andi.

Mussahada M. H. & Rohanto U. 2010. Membuat Company Profile dengan Adobe Flash. Yogyakarta: Skripta Media Creative.

Rauf, A. A. A. 2008. Pedoman Dauroh Al-Qur’an. Jakarta: Markaz Al-Qur’an.

Sidik. 2010. 14 Trik Tersembunyi Flash Lite. Yogyakarta: Andi.

Sjafi.i A. M. 1967. Pelajaran Tajwid. Semarang: MG. Semarang

Sutopo. A.H. 2003. Multimedia Interaktif dengan Flash. Yogyakarta: Graha Ilmu.

126

Suyanto, M. 2003. Multimedia Alat untuk Meningkatkan Keunggulan Bersaing. Yogyakarta: Andi. Syarbini, A & Mufidah, A. 2010. 5 Langkah Lancar Membaca Al-Qur’an. Bandung: Ruang Kata.

Wahana Komputer. 2010. Adobe Flash CS4 untuk Pembuatan Animasi Interaktif. Yogyakarta: Andi.

Wahyudi, M. 2008. Ilmu Tajwid Plus. Surabaya: Halim Jaya

127 Lampiran I – Surat-surat Penelitian

128 Lampiran II – Kuisioner Evaluasi 1

Nama

: ______________________________

Tanggal

: ______________________________

1. Apakah anda tahu hukum mempelajari ilmu tajwid ? a. Ya b. TIdak

2. Apakah anda tahu hukum-hukum dalam ilmu tajwid ? a. Ya b. Tidak 3. Apakah anda dapat membedakan hukum-hukum nūn mati, tanwīn dan mīm mati ? a. Ya b. Tidak

4. Apakah media pembelajaran ilmu tajwid yang ada sekarang dapat dijadikan suatu solusi praktis dan mobile (dapat dengan mudah dibawa kemana-mana) ? a. Ya b. Tidak

5. Apakah perlu dibuatnya suatu aplikasi mobile yang dapat diakses dengan mengunakan handphone sebagai panduan untuk mempelajari ilmu tajwid ? a. Ya b. Tidak

129 Lampiran III – Kuisioner Evaluasi 2

Nama

: ______________________________

Tanggal

: ______________________________

1. Apakah aplikasi mobile tajwid ini dapat memberikan pengetahuan kepada anda mengenai hukum-hukum dalam ilmu tajwid ? a. Ya b. Tidak

2. Apakah aplikasi mobile tajwid ini dapat memberikan anda panduan untuk membedakan hukum nūn mati, tanwīn dan mīm mati ? a. Ya b. Tidak

3. Apakah icon serta navigasi pada aplikasi mobile tajwid ini dapat digunakan dan dipahami dengan mudah ? a. Ya b. Tidak

4. Apakah tampilan serta fasilitas pada aplikasi mobile tajwid ini cukup menarik ? a. Ya b. Tidak

5. Apakah aplikasi mobile tajwid ini dapat dijadikan suatu solusi praktis dan mobile untuk mempelajari hukum-hukum tajwid terutama hukum nūn mati, tanwīn dan mīm mati ? a. Ya b. Tidak

130 Lampiran IV – Hasil Kuisioner Evaluasi 1

1. Apakah anda tahu hukum mempelajari ilmu tajwid ? Pertanyaan ini dimaksudkan untuk mengetahui apakah sebelum dibuatnya aplikasi mobile tajwid ini para penguna mengetahui hukum mempelajari ilmu tajwid. Hasilnya adalah, sebagian besar pengguna tidak mengetahui hukum mempelajari ilmu tajwid.

Jawaban Ya Tidak Jumlah

Jumlah 1 9 10

Presentase (%) 10 % 90 % 100%

2. Apakah anda tahu hukum-hukum dalam ilmu tajwid ? Pertanyaan ini dimaksudkan untuk mengetahui apakah sebelum dibuatnya aplikasi mobile tajwid ini para pengguna mengetahui hukum-hukum tajwid yang ada dalam ilmu tajwid. Hasilnya adalah, sebagian besar pengguna tidak mengetahui hukum-hukum tajwid.

Jawaban Ya Tidak Jumlah

Jumlah 4 6 10

Presentase (%) 40 % 60 % 100%

3. Apakah anda dapat membedakan hukum-hukum nūn mati, tanwīn dan mīm mati ? Pertanyaan ini dimaksudkan untuk mengetahui apakah sebelum dibuatnya aplikasi mobile tajwid ini, para pengguna dapat membedakan hukum-hukum nūn mati, tanwīn dan mīm mati. Hasilnya adalah, sebagian besar pengguna tidak dapat membedakan hukum nūn mati, tanwīn dan mīm mati

Jawaban Ya Tidak Jumlah

Jumlah 2 8 10

Presentase (%) 20 % 80 % 100%

131 Lampiran IV – Hasil Kuisioner Evaluasi 1

4. Apakah media pembelajaran ilmu tajwid yang ada sekarang dapat dijadikan suatu solusi praktis dan mobile (dapat dengan mudah dibawa kemana-mana) ? Pertanyaan ini dimaksudkan untuk mengetahui apakah sebelum dibuatnya aplikasi mobile tajwid ini, media pembelajaran yang digunakan oleh pengguna sekarang, dapat dijadikan suatu solusi praktis dan mobile. Hasilnya adalah, media pembelajaran yang ada sekarang belum dapat dijadikan sebagai suatu solusi praktis dan mobile

Jawaban Ya Tidak Jumlah

Jumlah 0 10 10

Presentase (%) 0% 100 % 100%

5. Apakah perlu dibuatnya suatu aplikasi mobile yang dapat diakses dengan mengunakan handphone sebagai panduan untuk mempelajari ilmu tajwid ? Pertanyaan ini dimaksudkan untuk mengetahui apakah sebelum dibuatnya aplikasi mobile tajwid ini para pengguna menginginkan suatu aplikasi mobile sebagai panduan untuk mempelajari ilmu tajwid yang dapat di akses melalui handphone. Hasilnya adalah, seluruh pengguna menjawab “Ya”, yang artinya mereka sangat menginginkan suatu aplikasi mobile untuk mempelajari ilmu tajwid.

Jawaban Ya Tidak Jumlah

Jumlah 10 0 10

Presentase (%) 100 % 0% 100%

132 Lampiran V – Hasil Kuisioner Evaluasi 2

1. Apakah aplikasi mobile tajwid ini dapat memberikan pengetahuan kepada anda mengenai hukum-hukum dalam ilmu tajwid ? Pertanyaan ini dimaksudkan untuk mengetahui apakah aplikasi mobile tajwid ini dapat memberikan pengetahuan mengenai hukum-hukum dalam ilmu tajwid kepada pengguna. Hasilnya adalah seluruh pengguna menjawab “Ya” yang artinya aplikasi mobile tajwid dapat memberikan pengetahuan kepada pengguna.

Jawaban Ya Tidak Jumlah

Jumlah 10 0 10

Presentase (%) 100 % 0% 100%

2. Apakah aplikasi mobile tajwid ini dapat memberikan anda panduan untuk membedakan hukum nūn mati, tanwīn dan mīm mati ? Pertanyaan ini dimaksudkan untuk mengetahui apakah aplikasi mobile tajwid ini dapat memberikan panduan untuk membedakan hukum nūn mati, tanwīn dan mīm mati kepada pengguna. Hasilnya adalah aplikasi mobile tajwid dapat memberikan panduan kepada pengguna untuk membedakan hukum nūn mati, tanwīn dan mīm mati

Jawaban Ya Tidak Jumlah

Jumlah 10 0 10

Presentase (%) 100 % 0% 100%

3. Apakah icon serta navigasi pada aplikasi mobile tajwid ini dapat digunakan dan dipahami dengan mudah ? Pertanyaan ini dimaksudkan untuk mengetahui apakah icon serta navigasi pada aplikasi mobile tajwid ini dapat digunakan dan dipahami dengan mudah oleh pengguna. Hasilnya adalah sebagian besar pengguna dapat menggunakan dan memahami dengan mudah icon dan navigasi pada apliksi mobile tajwid.

133 Lampiran V – Hasil Kuisioner Evaluasi 2

Jawaban Ya Tidak Jumlah

Jumlah 9 1 10

Presentase (%) 90 % 10 % 100%

4. Apakah tampilan serta fasilitas pada aplikasi mobile tajwid ini cukup menarik ? Pertanyaan ini dimaksudkan untuk mengetahui ketertarikan pengguna terhadap aplikasi mobile tajwid. Hasilnya adalah seluruh pengguna menjawab “Ya” yang artinya mereka sangat tertarik terhadap tampilan dan fasilitas yang ada pada mobile tajwid.

Jawaban Ya Tidak Jumlah

Jumlah 10 0 10

Presentase (%) 100 % 10 % 100%

5. Apakah aplikasi mobile tajwid ini dapat dijadikan suatu solusi praktis untuk mempelajari hukum-hukum tajwid terutama hukum nūn mati, tanwīn dan mīm mati ? Pertanyaan ini dimaksudkan untuk mengetahui apakah aplikasi mobile tajwid dapat dijadikan suatu solusi praktis dan mobile untuk mempelajari hukum-hukum tajwid terutama hukum nūn mati, tanwīn dan mīm mati. Hasilnya adalah seluruh pengguna menjawab “Ya” yang artinya aplikasi mobile tajwid ini dapat dijadikan suatu solusi praktis dan mobile.

Jawaban Ya Tidak Jumlah

Jumlah 10 0 10

Presentase (%) 100 % 10 % 100%

134 Lampiran VI – Testing

135 Lampiran VI – Testing

136 Lampiran VI – Testing

137 Lampiran VII – Source Code Source Code Menu Utama stop(); btn_kembali_mutama.onRelease = function() { gotoAndPlay("intro", 1); } btn_nun_menu_utama.onRelease = function() { gotoAndStop("menu_utama_nun", 1); } btn_mim_menu_utama.onRelease = function() { gotoAndStop("menu_utama_mim", 1); } btn_huruf_hijaiyah_mutama.onRelease = function() { gotoAndStop("huruf_hijaiyah", 1); }

Source Code Menu Pilihan Menu Utama stop(); btn_mc_full_onstage_mutama.onRelease = function() { play(); } btn_mc_pilihanmenu1_mutama.onRelease = function() { gotoAndStop(1); _root.mc_bantuan_mutama.gotoAndPlay("frame1_mc_bantuan"); }

btn_mc_pilihanmenu2_mutama.onRelease = function() { gotoAndStop(1); _root.mc_tentang_aplikasi_mutama.gotoAndPlay("frame1_mc_tentan g_aplikasi"); }

btn_mc_pilihanmenu3_mutama.onRelease = function() { gotoAndStop(1); _root.mc_kotak_dialog_keluar_mutama.gotoAndPlay("frame1_mc_kot ak_dialog_keluar");

138 } Source Code Iqlab stop();

btn_pengertian_iqlab.onRelease = function() { gotoAndStop(2); } btn_huruf_iqlab.onRelease = function() { gotoAndStop(3); } btn_kembali_mutama_iqlab.onRelease = function() { gotoAndStop("menu_utama_nun", 1); } btn_kembali_pengertian_iqlab.onRelease = function() { gotoAndStop(1); } btn_kembali_huruf_iqlab.onRelease = function() { gotoAndStop(1); } btn_ba_huruf_iqlab.onRelease = function() { gotoAndStop(4); } btn_kembali_cth_iqlab.onRelease = function() { stopAllSounds(); gotoAndStop(3); } Source Tombol Baca Contoh Iqlab stopAllSounds(); nextFrame();