Aplikasi Pembelajaran Huruf Hijaiyah Dan Tajwid Berbasis Android Menggunakan Adobe Flash Dan Air

APLIKASI PEMBELAJARAN HURUF HIJAIYAH DAN TAJWID BERBASISANDROID MENGGUNAKAN ADOBE FLASH DAN AIRSano Sempati1)Jurusan Sistem Informasi, Fakultas Ilmu KomputerUniversitas GunadarmaE-mail: [email protected])Abt!a"Seringkalianak-anakusiadinisaatinimengalamikesulitanuntukmempelajari danmengenalhurufhijaiyah,anak-anak tersebut kesulitan karena media pembelajaran yang sering kali membosankan dan tidak interaktif.arenahal-hal tersebutlah anak-anak menjadi malas atau kesulitan dalam mempelajari huruf hijaiyah dan taj!id.. "plikasibertemakan edukasi ini yang disajikan dalam bentuk sebuah aplikasi #isual, dan dapat digunakan anak-anak usiadini dengan mudah. "plikasi ini merupakan salah satu cara media pembelajaran interaktif yang diharapkan dapatmenambah minat dan keinginan belajar anak-anak terhadap pengenalan dan pembelajaran huruf hijaiyah dan taj!id..$etode yang digunakan dalam pembuatan aplikasi ini yaitu dengan System %e#elopment &ife 'ycle (S&%') yangdimulai dari tahap perencanaan, analisis, perancangan, pengkodean hingga uji coba.Software yang digunakan padapembuatan aplikasi adalah Adobe Flash CC dengan Adobe AIR dan di impementasikan pada smartphone Smartfrenandroma)-i danSamsung*ala)y+ab ,ote -. .erdasarkan hasil uji coba dapat disimpulkan bah!a aplikasipembelajaranhurufhijaiyahdantaj!idpadaperangkatmobileberbasisandroidberjalandenganbaiksehinggadapat membantu memudahkan pengguna dalam mempelajari dan mengenal huruf hijaiyah dan taj!id. ata kunci: ata unci : "ndroid,/ijaiyah, +aj!id, $obile, 0lash, "dobe "11.1 &atar .elakang .elajar membaca "l-2uran merupakan ke!ajibanbagi setiapumat islam. Sesuai denganhadits,abi$uhammad S"3 yaitu 4Yang membaca Al-Qur`andan dia mahir membacanya, dia bersama paramalaikat yangmulia. SedangkanyangmembacaAl-Qur`an namun dia tidak tepat dalammembacanya dan mengalami kesulitan, makabaginya dua pahala. #A$%B&"'a!i5678, M&$im 955()danjugasesuai denganfirman"&&"/ yaitu Ini adalah sebuah kitab yang Kamiturunkan kepadamu penuh dengan berkah, supayamereka mentadabburi memperhatikan! ayat-ayat-"ya dan supayamendapat pela#aran $rang-$rang yang mempunyai%ikiran. #S'a* + ,-(, untuk dapat belajar membaca"l-2urandenganbaikmakaperlumempelajaridanmengenalkanhurufhijaiyahsertataj!id.Seringkalianak-anak usia dini saat ini mengalami kesulitanuntuk mempelajari dan mengenal huruf hijaiyah, halini dikarenakan media pembelajaran yang ada seringkali membosankan dan tidak interaktif. /al inimerupakan salah satu yang membuat anak-anakmenjadi malas atau kesulitan dalammempelajarihuruf hijaiyah dan taj!id..erdasarkan permasalahan diatas, makapenulis mengambil aplikasi bertemakan edukasi yangdisajikan dalam bentuk aplikasi #isual. "plikasi inimerupakan salah satu cara media pembelajaraninteraktif yangdiharapkandapat menambahminatdan keinginan belajar anak-anak terhadap pengenalandan pembelajaran huruf hijaiyah dan taj!id.1.9 .atasan $asalah $asalah yang dibahas pada penulisan pembuatanaplikasi ikhfa ini adalah bagaimana membuat aplikasiikhfa yang bertemakan edukasi untuk pengenalan danpembelajaran huruf hijaiyah dan beberapa taj!idyaitu 1d:har, 1khfa, 1;lab, 1khfa@S+"" 9.1 >engertian /uruf /ijaiyah/uruf hijaiyah adalah bentuk jaman dari al"ahrfuyang berarti bagian terkecil dari lafal yangtidak dapat membentuk makna sendiri kecuali harusdirangkai denganhuruf lain, sedangkaan#i$aii%ahmemiliki arti ejaan.$aksud ejaan disini adalah ejaan"rab sebagai bahasa asli "l-2urrocessor 1ntel(D) 'ore(+$)i7971B$ '>@ @9,1B */: b. D"$ C*. %%D7c. &ayar display 15G (17CC ) 8C-d. H*" /% =58B 1*.,9. >erangkat &unak (Software'(a) 3indo!s -.1 Enterprise C5-bit b. "dobe flash ''c."dobe1llustratordan "dobe"1D- "nalisia 0ungsional"nalisis kebutuhan fungsional adalah bagianpaparanmengenai fitur-fituryangakandimasukkankedalam aplikasi yang akan dibuat. .erikutpenjelasan fitur-fitur yang terdapat dalam aplikasi:1. /ijaiyah.erisi informasimengenai huruf-hurufhijaiyah. >adalatihan hijaiyah terdapatpembelajaran mengenai huruf hijaiyah.9. +aj!id.erisi informasimengenai bentuk taj!id.>adalatihantaj!idterdapat pembelajaranmengenai hokum taj!id7. >anduan .erisi tentang panduan penggunaan aplikasi.5. +entang aplikasi.erisi informasi mengenaikegunaanaplikasi dan tentang penulis.7.9 >erancangan >ada tahap ini dilakukan tahap perancanganmenggunakan @$&dengan use case dan acti#itydiagramUse asediagram menggambarkanfungsionalitas yangdiharapkandari sebuahsistem.Iang ditekankan adalah apa yang dibuat sistem danbukan bagaimana. Sebuah usecase merepresentasikan sebuah interaksi antara aktordengan sistem. *ambar 7.1menunjukaninteraksi antarapenggunadansistemaplikasi denganmenggunakanuseasediagram.*ambar 7.1. @se 'ase %iagram "plikasi 1khfa..7 Dancangan "cti#ity %iagram "plikasi 1khfaAtivit%%iagrammerepentasikan sebuahaktifitas-aktifitas yangterjadi pada sebuahdengansistem. *ambar 7.9 menunjukanativit%diagrampada aplikasi 1khfa.*ambar 7.9. "cti#ity %iagram"plikasi1khfa7.5. Dancangan Se;uence %iagram "plikasi ikhfaSe*uene%iagrammerepentasikansebuahproses secara terurut. Se;uence diagram pada aplikasiikhfa di bagi 5 kategori yaitu se;uence diagram menuhijiayah, se;uencediagrammenutaj!id, se;uencediagram menu latihan,se;uence diagram menulatihan dan se;uence diagram menu tentang.1. Se*uene %iagram $enu /ijaiyahSe;uence diagram menu hijaiyah merupakanproses secara terurut antara penggunaterhadap sistem menu seperti penjelasanpada *ambar 7.7. *ambar 7.7. Se;uence %iagram $enu/ijaiyah9. Se*uene%iagram +aj!idSe*uenediagram menu panduanmerupakan proses secara terurut antarapengguna terhadap sistemmenu panduanseperti penjelasan pada *ambar 7.5.*ambar 7.5. Se;uence %iagram $enu +aj!id5. Se*uene%iagram $enu&atihanSe*uenediagram menu tentang merupakanproses secara terurut antara penggunaterhadap sistem menulatihansepertipenjelasan pada *ambar 7.=.

*ambar 7.=. Se*uene %iagram $enu &atihan =. Se*uene%iagram $enu +entangSe*uenediagram menu tentang merupakanproses secara terurut antara penggunaterhadap sistem menu tentang sepertipenjelasan pada *ambar 7.C. *ambar 7.8. Se;uence %iagram $enu +entangC. Se;uence %iagram $enu eluarSe;uencediagrammenukeluarmerupakanproses secara terurut antara pengguna(pengendara) terhadapsistemmenukeluarseperti penjelasan pada *ambar 7.-. *ambar 7.-.Se;uence%iagram$enueluar7.= 1>embuatan /alaman $enu @tama>ada menu utama terdapat lima tombol yaitutombol hijaiyah, tombol taj!id, tombol latihan,tombol keluar dan terdapatmotiontweenuntukmembuat tulisan judul 4ikhfaG.&angkah-langkahdalam pembuatannya adalah sebagai berikut:1. Setelah membuatsplashsreendilanjutkandengan membuat layer baru dengan caraarahkankursor kekananba!ahkemudianpilihnewla%erlalu ubah nama menjadiintroScreen. /asilnya dapat dilihat pada*ambar 7.91.

*ambar 7.91 +ampilan pembuatan &ayer baru9. &alu dilanjutkan dengam memasukanbak&round+,G'yangsebelumnyatelahdidesain di "dobe 1llustrator sesuaikanukuran dengan ukuran pi)el yang digunakansebelumnyayaitu-BB)5-Bp-laluubahmenjadimovielipdengancaraklikkananlalupilihonvert toS%mbollaluubahisi.amemenjadiintro/%pemenjadi0ovieClip. Seperti pada *ambar 7.99 berikut ini.*ambar 7.99 +ampilan pembuatan movie Clip pada,G7. likduakali untukmemasuki layar baruyaitu intro, tambahkan layer baru untukmemasukan judul Jikhfa< danmenambahkan layer dengan nama4tombolKutamaGuntukmemasukanbutton-button yang ada di menu./asilnya dapat dilihat pada *ambar 7.97berikut ini.*ambar 7.97 +ampilan pada layer intro7. &aludilajutkandenganmemasukantombolE tombol yang telah desain setelah itu ubahmenjadi button dengan klik kanan kemudianpilih'on#ert to Symbol lalu ubah isi .amemenjadi 4btnKhijaiyahG dan ubah/%pemenjadi,utton. Seperti pada*ambar7.95berikut.*ambar 7.95 +ampilan pembuatan button5 &akukan hal yang sama dengan pembuatan tombol taj!id, tombol latihan, tombol tentang dan tombol keluar.7. &alu masukan kode programdengan klikkanan pada layertimelinebuttonKutamakemudian pilih Ations)Seperti pada *ambar7.9= yang menunjukan tampilan untukmemasukan kode program.*ambar 7.9= +ampilan memasukan kode program-. +ampilan menu utama seperti berikutdapatdilihat pada *ambar 7.9C.

*ambar 7.9C /alaman $enu @tama7.=.9 >embuatan /alaman 1si /ijaiyah/uruf hijaiyah terdiri dari96 huruf dan didalamsetiap pengucapan huruf hijaiyah ditambahkandengan tanda baca berupa (fathah, kasrah, dammah)total sejumlah-5huruf hijaiyahyangditampilkan.>enulis membuat bentuk tampilan slide denganhalamanper halamandenganmenggunakanteknikframe dimana setiap scene terdapat gambar yangditampilkan yang berisi huruf hijaiyah berupa buttonagar user dapat menekan tombol tersebut ,lalu tombolmengeluarkan suara sesuai huruf yang ditekan.

*ambar 7.9- /alaman 1si /ijaiyah7.=.7 >embuatan /alaman $enu +aj!id>ada halaman menu ini terdapatIma&e,uttonuntukjudul hulum taj!id yang terdiri dari delapan macam,tombolbantuan,tombolna#igasi,dantombolhome(kembalikemenuutama).>adatombol untukjudulhukum taj!id penulis menggunakan ation sript :*ambar 7.96/alaman $enu +aj!id7.=.5 >embuatan /alaman 1si +aj!id/ukum taj!id pada nun sukun dan tan!in terdiri darienam macam, untuk hukum taj!id mim sukun terdiridari dua macam. Seperti yang dijelaskan sebelumnya,macam-macam hukum taj!id ini dibuat dalambentukIma&e,utton. etika button di pilih makaakan masuk ke halaman baru, yang berisi penjelasandari taj!id tersebut. /alamanisi dari hukumtaj!idterdiri daridelapanhalamandenganlangkahpembuatanyangsamadenganisi penjelasanmasing-masunghukumtaj!id. %isini penulis melampirkan salah satuhalamanisi hukumtaj!id. +ampilanmenu halaman1si +aj!id pada *ambar 7.7B.*ambar 7.7B /alaman 1si +aj!id7.=.C >embuatan /alaman $enu &atihan+erdapat dua menu latihan pada aplikasi ini,tujuannya untuk memberikan pemahaman yang lebihkepadauser, menulatihanterdiridarimenulatihanhijaiyahdanlatihantaj!id.>adatombol salahsatumenu latihan penulis menggunakan ation sript *ambar 7.71 /alaman $enu &atihan7.=.8 >embuatan /alaman 1si &atihan/alaman menu ini terdiri dari dua yaitu halaman isi latihan hijaiyah dan taj!id untuk latihan ini menggunakan konsep seperti kuis dimana *ambar 7.79 /alaman 1si &atihan5.1.esimpulan "plikasi pembelajaran huruf hijaiyah dantaj!idJikhfa< ini dapat digunakanuntukmembantuanak-anak dalam proses mengenal huruf hijaiyah dantaj!id dengan media yang interaktif. "plikasi inimenyediakan informasi berupa huruf hijaiyah dantaj!iddengansuarauntukmemudahkananak-anakdalam mempelajari lalu terdapat latihan hijaiyah dantaj!id untuk menambah pemahaman anak-anak. 5.9.SaranPembuatan aplikasi ini masihmemerlukan pengembangan selanjutnyaseperti suarayangdihasilkanpadahurufhijaiyah dan tajwid diperjelas, adanyapenyimpanan nilai terbaik pada latihanuntuk memotivasi anak-anak danpenambahan contoh-contoh padatajwidnya. Oleh sebab itu, penulismenyarankan kepada siapa saja yangmembaca penulisan ini dapatmengembangkan dan menyempurnakanaplikasi ini agar lebih baik dari yangsebelumnya.DAFTAR PUSTAKAL1M"bdul ,aeem, JU1 2A00AKU 34US, ?akarta, 5667)8590irdaus, 3embela$aran 0odel Struktur .avi&asi, ?urnal +eknologi 1nformasi #ol 11. /al 9-C, 9B1B.L7M>riyanto /idayatullah, Animasi 3endidikan Flash,>enerbit 1,0AD$"+1", .andung, 9B11.L5MHeroni;ue .rossier, :evelopin& Android Appliations with Adobe AIR, ANDeilly ""$edia, Sebastopol, 9B11.L=MEmanuele 0eronato, Flash Game :evelopment b% ;-ample, >ackt >ublishing, 9B11LCMStephen 'hin, As!ald 'ampesato,%ean 1#erson, >aul +rani, 3ro Android Flash,Apress,9B11