APLIKASI PEMBELAJARAN HURUF HIJAIYAH HIJAIYAH DAN TAJWID TAJWID BERBASIS ANDROID MENGGUNAKAN ADOBE FLASH DAN AIR Sano Sempati1)
Jurusan Sistem Informasi, Informasi, Fakultas Fakultas Ilmu Komputer Komputer Universitas Gunadarma E-mail:
[email protected] [email protected])
Abt!a"
Sering kali anak-anak usia dini saat ini mengalami kesulitan untuk mempelajari dan mengenal huruf hijaiyah, anak-anak tersebut kesulitan kesulitan karena media pembelajaran yang sering kali membosankan membosankan dan tidak interaktif. arena hal-hal tersebutlah anak-anak menjadi malas atau kesulitan dalam mempelajari huruf hijaiyah dan taj!id.. "plikasi bertemakan edukasi ini yang disajikan dalam bentuk sebuah aplikasi #isual, dan dapat digunakan anak-anak usia dini dengan mudah. "plikasi ini merupakan merupakan salah satu cara media pembelajaran interaktif interaktif yang diharapkan dapat menambah 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&%') yang dimulai dari tahap perencanaan, analisis, perancangan, pengkodean hingga uji coba. Software yang Software yang digunakan pada pembuatan aplikasi adalah Adobe adalah Adobe Flash CC dengan Adobe dengan Adobe AIR dan AIR dan di impementasikan pada smartphone pada smartphone Smartfren Smartfren andromaandroma-ii danSamsun danSamsung g *alay *alay +ab +ab ote . erdasar erdasarkan kan hasil hasil uji coba dapat disimpulkan disimpulkan bah!a aplikasi aplikasi pembelajaran huruf hijaiyah dan taj!id pada perangkat mobile mobile berbasis android berjalan dengan baik sehingga dapat membantu memudahkan pengguna dalam mempelajari dan mengenal huruf hijaiyah dan taj!id.
ata kunci: ata unci : "ndroid,/ijaiyah, +aj!id, $obile, 0lash, "dobe "
1.1 &atar elakang elajar elajar membaca membaca "l-2ura "l-2uran n merupakan merupakan ke!ajiban ke!ajiban bagi setiap umat islam. Sesuai dengan hadits abi $uhammad S"3 yaitu 4Yang membaca Al-Qur`an dan dia mahir mahir mem membac bacany anya, a, dia bersama bersama para malaika malaikatt yang yang mulia. mulia. Sedang Sedangkan kan yang yang membaca membaca Al-Qur`an namun dia tidak tepat dalam memb membac acan anya ya dan dan meng mengal alami ami kesu kesuli litan tan,, maka maka baginya dua pahala.” #A$%B&"'a!i #A$%B&"'a!i 5678, M&$im 955() dan juga sesuai dengan firman "&&"/ yaitu “Ini adalah sebuah kitab yang Kami turunkan kepadamu penuh dengan berkah, supaya mereka mentadabburi mem mempe perh rhat atik ikan an!! ayat ayat-a -aya yatt-"y "ya a dan dan supa supaya ya mendapat pela#aran $rang-$rang yang mempunyai %ikiran.” #S'a* + ,-(, untuk dapat dapat belajar belajar membaca membaca "l-2uran dengan baik maka perlu mempelajari dan mengenalkan huruf hijaiyah serta taj!id.Sering kali anak-a anak-anak nak usia usia dini dini saat saat ini mengal mengalam amii kesuli kesulitan tan
untuk mempelajari dan mengenal huruf hijaiyah, hal ini dikarenakan media pembelajaran yang ada sering kali kali membos membosank ankan an dan tidak tidak intera interakti ktif. f. /al ini merupa merupakan kan salah salah satu satu yang yang membua membuatt anak-a anak-anak nak menjadi menjadi malas malas atau kesulita kesulitan n dalam dalam mempelaj mempelajari ari huruf hijaiyah dan taj!id. erdas erdasark arkan an permas permasala alahan han diatas diatas,, maka maka penulis mengambil aplikasi bertemakan bertemakan edukasi yang disajikan dalam dalam bentuk aplikasi aplikasi #isual. "plikasi ini merupa merupakan kan salah salah satu satu cara cara media media pembel pembelaja ajaran ran interakt interaktif if yang diharapka diharapkan n dapat dapat menambah menambah minat dan keinginan belajar anak-anak terhadap pengenalan dan pembelajaran huruf hijaiyah dan taj!id. 1.9 atasan $asalah $asalah $asalah yang dibahas dibahas pada penulisan penulisan pembuatan pembuatan aplikasi ikhfa ini adalah bagaimana membuat aplikasi ikhfa yang bertemakan edukasi untuk pengenalan dan pembelajaran huruf hijaiyah dan beberapa taj!id
yaitu dhar, khfa, ;lab, khfa
rogram aplikasi yang dibuat menggunakan bahasa pemrograman Ationsript ! dan menggunakan "dobe0lash '' yang dapat diterapkan pada smatphone berbasis android. 9
+?"" >S+""
9.1 >engertian /uruf /ijaiyah /uruf hijaiyah adalah bentuk jaman dari al" ahrfu yang berarti bagian terkecil dari lafal yang tidak dapat membentuk makna sendiri kecuali harus dirangkai dengan huruf lain, sedangkaan #i$aii%ah memiliki arti ejaan. $aksud ejaan disini adalah ejaan "rab sebagai bahasa asli "l-2ur
"ctionScript 7.B"ctionScript 7.B adalah bahasa pemrograman berorientasi objek yang menandakan sebuah langkah penting dalam e#olusi kemampuan 0las runtime. $oti#asi pembuatan "ctionScript 7.B adalah untuk menciptakan bahasa ideal untuk cepat membangun pengayaan aplikasi nternet. menjadi bagian penting dari pengalaman dalam pembuatan !eb. "ctionScript 7.B didasarkan pada E'$"Script, bahasa pemrograman standar internasional untuk scripting. "ctionScript 7.B ini kompatibel dengan ahasa Spesifikasi E'$"Script, Edisi etiga (E'$"-9C9). /al ini juga berisi fungsi didasarkan pada pekerjaan yang sedang berlangsung pada E'$"Script Edition 5, terjadi di dalam badan standar E'$". 9.C "dobe "ir "dobe "ir asalah salah satu produk dari "dobe Systems ncorporated yang memiliki kemampuan untuk diunakan pada beda sistem operasi. "dobe "ir digunakan untuk menambah kemampuan dalam membangun dan menggunakan aplikasi pada mobile "ndroid dan AS dan web development pada /+$& , ja#ascript dan dapat terhubung dengan aolikasi jaringan internet. 9.8 >engenalan "ndroid
*ambar 9.1 $acam-$acam /uruf #i$ai%ah 9.9 "dobe 0lash '' "dobe 0lash (dahulu bernama $acromedia 0lash) adalah salah satu perangkat lunak komputer yang merupakan produk unggulan "dobe Systems. "dobe 0lash digunakan untuk membuat gambar #ektor maupun animasi gambar tersebut. erkas yang dihasilkan dari perangkat lunak ini mempunyai file etension .s!f dan dapat diputar di penjelajah !eb yang telah dipasangi "dobe 0lash >layer. 0lash menggunakan bahasa pemrograman bernama "ctionScript yang muncul pertama kalinya pada 0lash =. 9.7 "ctionScript 7.B"ctionScript 7.B
"ndroid merupakan salah satu sistem operasi untuk telepon seluler yang berbasis &inu. %an "ndroid merupakan perangkat mobile yang meliputi sistem operasi, middle!are. "ndroid menyediakan platform terbuka agar dapat dikembangkan oleh pengembang untuk aplikasi mereka sendiri untuk digunakan pada bermacam peranti bergerak. 7. >ED"'"*" %" $>&E$E+"S 7.1 *ambaran "plikasi %alam aplikasi ini penulis menyediakan media pembelajaran pengenalan huruf huruf hijaiyah dan taj!id pada "l-;uran seperti ikhfa, ihar syafa!i, idgam mimi, ;al;alah dan lain-lain dengan tampilan menu gambar dan !arna yang menarik untuk anak anak, didalam aplikasi ini terdapat latihan untuk
mempermudah anak-anak dalam memahami hurufhuruf hijaiyah dan taj!id. "plikasi ini terdiri dari 7 menu utama yaitu menu hijaiyah yang dimana user akan diperkenalkan huruf-huruf hijaiyah bentuk huruf dan pengucapan setiap hurufnya ketika user memilih salah satu huruf yang ditekannya, yang kedua yaitu menu taj!id yang akan mengarahkan user ke menu selanjutnya yaitu menu ikhfa, ihar, idgam mimi, ;al;alah dan yang lainnya terdapat penjelasan mengenai hukum bacaan pada "l-;uran beserta contohnya dalam bentuk suara dan gambar, yang ketiga adalah menu latihan didalamnya terdapat dua menu yaitu menu latihan hijaiyah dan latihan taj!id yang masing masing berisi latihan berupa kuis untuk mengasah kemampuan pemahaman user dengan sistem penilaian berdasarkan jumlah kebenaranya berdasarkan !aktu yang ditentukan. -
"nalisa "plikasi
>ada tahap ini dilakukan analisis dan pengumpulan kebutuhan informasi yang diperlukan seperti spesifikasi perangkat keras dan perangkat lunak yang mendukung dalam pembuatan aplikasi dan fungsional pada tiap menu. "dapun pendataan informasi hukum taj!id dari buku 4?F< "$$" >&S dengan taj!id blok !arnaG dan browsin& dengan mengunakan internet yang dibutuhkan seperti informasi mengenai penjelasan dari contoh contoh hukum taj!id. -"nalisa ebutuhan Soft!are dan /ard!are %alam membuat aplikasi ini, penulis membutuhkan beberapa kebutuhan hardware dan software sebagai berikut: 1. >erangkat eras ( #ardware' ( a. >rocessor ntel(D) 'ore(+$) i7971B$ '> @9,1B */ b. D"$ C* %%D7 c. &ayar display 15G (17CC 8C d. H*" /% =58B 1*, 9.
>erangkat &unak (Software'( a) 3indo!s .1 Enterprise C5-bit b. "dobe flash '' c. "dobe llustrator dan "dobe "D
-
"nalisia 0ungsional "nalisis kebutuhan fungsional adalah bagian paparan mengenai fitur-fitur yang akan dimasukkan kedalam aplikasi yang akan dibuat. erikut penjelasan fitur-fitur yang terdapat dalam aplikasi: 1. /ijaiyah erisi informasi mengenai huruf-huruf hijaiyah. >ada latihan hijaiyah terdapat pembelajaran mengenai huruf hijaiyah. 9. +aj!id erisi informasi mengenai bentuk taj!id. >ada latihan taj!id terdapat pembelajaran mengenai hokum taj!id 7. >anduan erisi tentang panduan penggunaan aplikasi. 5. +entang aplikasi erisi informasi mengenai kegunaan aplikasi dan tentang penulis.
7.9 >erancangan >ada tahap ini dilakukan tahap perancangan menggunakan $& dengan use case dan acti#ity diagram Use ase diagram menggambarkan fungsionalitas yang diharapkan dari sebuah sistem. Iang ditekankan adalah apa yang dibuat sistem dan bukan bagaimana. Sebuah use case merepresentasikan sebuah interaksi antara aktor dengan sistem. *ambar 7.1 menunjukan interaksi antara pengguna dan sistem aplikasi dengan menggunakan use ase diagram.
*ambar 7.1. se 'ase %iagram "plikasi khfa ..7 Dancangan "cti#ity %iagram "plikasi khfa
Ativit% %iagram merepentasikan sebuah aktifitas-aktifitas yang terjadi pada sebuah dengan sistem. *ambar 7.9 menunjukan ativit% diagram pada aplikasi khfa.
*ambar 7.9. "cti#ity %iagram "plikasi
*ambar 7.5. Se;uence %iagram $enu +aj!id
khfa 5. 7.5. Dancangan Se;uence %iagram "plikasi ikhfa Se*uene %iagram merepentasikan sebuah proses secara terurut. Se;uence diagram pada aplikasi ikhfa di bagi 5 kategori yaitu se;uence diagram menu hijiayah, se;uence diagram menu taj!id, se;uence diagram menu latihan, se;uence diagram menu latihan dan se;uence diagram menu tentang. 1.
Se*uene %iagram $enu &atihan Se*uene diagram menu tentang merupakan proses secara terurut antara pengguna terhadap sistem menu latihan seperti penjelasan pada *ambar 7.=.
Se*uene %iagram $enu /ijaiyah Se;uence diagram menu hijaiyah merupakan proses secara terurut antara pengguna terhadap sistem menu seperti penjelasan pada *ambar 7.7.
*ambar 7.=. Se*uene %iagram $enu &atihan =.
*ambar 7.7. Se;uence %iagram $enu /ijaiyah 9.
Se*uene %iagram $enu +entang Se*uene diagram menu tentang merupakan proses secara terurut antara pengguna terhadap sistem menu tentang seperti penjelasan pada *ambar 7.C.
%iagram +aj!id Se*uene Se*uene diagram menu panduan merupakan proses secara terurut antara pengguna terhadap sistem menu panduan seperti penjelasan pada *ambar 7.5.
*ambar 7.8. Se;uence %iagram $enu +entang
C.
.ame menjadi intro /%pe menjadi 0ovie Clip. Seperti pada *ambar 7.99 berikut ini.
Se;uence %iagram $enu eluar Se;uence diagram menu keluar merupakan proses secara terurut antara pengguna (pengendara) terhadap sistem menu keluar seperti penjelasan pada *ambar 7..
*ambar 7.99 +ampilan pembuatan movie Clip pada G 7. *ambar 7.. Se;uence %iagram $enu eluar 7.= 1 >embuatan /alaman $enu tama >ada menu utama terdapat lima tombol yaitu tombol hijaiyah, tombol taj!id, tombol latihan, tombol keluar dan terdapat motiontween untuk membuat tulisan judul 4ikhfaG. &angkah-langkah dalam pembuatannya adalah sebagai berikut: 1. Setelah membuat splashsreen dilanjutkan dengan membuat layer baru dengan cara arahkan kursor ke kanan ba!ah kemudian pilih new la%er lalu ubah nama menjadi introScreen. /asilnya dapat dilihat pada *ambar 7.91.
*ambar 7.91 +ampilan pembuatan &ayer baru 9.
&alu dilanjutkan dengam memasukan bak&round +G' yang sebelumnya telah didesain di "dobe llustrator sesuaikan ukuran dengan ukuran piel yang digunakan sebelumnya yaitu BB 5B p- lalu ubah menjadi movielip dengan cara klik kanan lalu pilih onvert to S%mbol lalu ubah isi
lik dua kali untuk memasuki layar baru yaitu intro, tambahkan layer baru untuk memasukan judul Jikhfa< dan menambahkan layer dengan nama 4tombolKutamaG untuk memasukan button button yang ada di menu. /asilnya dapat dilihat pada *ambar 7.97 berikut ini.
*ambar 7.97 +ampilan pada layer intro 7.
&alu dilajutkan dengan memasukan tombol tombol yang telah desain setelah itu ubah menjadi button dengan klik kanan kemudian pilih 'on#ert to Symbol lalu ubah isi .ame menjadi 4btnKhijaiyahG dan ubah /%pe menjadi utton. Seperti pada *ambar 7.95 berikut.
7.=.9
>embuatan /alaman si /ijaiyah
/uruf hijaiyah terdiri dari 96 huruf dan didalam setiap pengucapan huruf hijaiyah ditambahkan dengan tanda baca berupa (fathah, kasrah, dammah) total sejumlah 5 huruf hijaiyah yang ditampilkan. >enulis membuat bentuk tampilan slide dengan halaman per halaman dengan menggunakan teknik frame dimana setiap scene terdapat gambar yang ditampilkan yang berisi huruf hijaiyah berupa button agar user dapat menekan tombol tersebut ,lalu tombol mengeluarkan suara sesuai huruf yang ditekan. *ambar 7.95 +ampilan pembuatan button 5
&akukan hal yang sama dengan pembuatan tombol taj!id, tombol latihan, tombol tentang dan tombol keluar.
7.
&alu masukan kode p rogram dengan k lik kanan pada layer timeline buttonKutama kemudian pilih Ations)Seperti pada *ambar 7.9= yang menunjukan tampilan untuk memasukan kode program.
*ambar 7.9 /alaman si /ijaiyah 7.=.7
*ambar 7.9= +ampilan memasukan kode program
.
>embuatan /alaman $enu +aj!id
>ada halaman menu ini terdapat Ima&eutton untuk judul hulum taj!id yang terdiri dari delapan macam, tombol bantuan, tombol na#igasi, dan tombol home (kembali ke menu utama).>ada tombol untuk judul hukum taj!id penulis menggunakan ation sript :
+ampilan menu utama seperti berikut dapat dilihat pada *ambar 7.9C.
*ambar 7.96 /alaman $enu +aj!id 7.=.5 *ambar 7.9C /alaman $enu tama
>embuatan /alaman si +aj!id
/ukum taj!id pada nun sukun dan tan!in terdiri dari enam macam, untuk hukum taj!id mim sukun terdiri
dari dua macam. Seperti yang dijelaskan sebelumnya, macam-macam hukum taj!id ini dibuat dalam bentuk Ima&eutton. etika button di pilih maka akan masuk ke halaman baru, yang berisi penjelasan dari taj!id tersebut. /alaman isi dari hukum taj!id terdiri dari delapan halaman dengan langkah pembuatan yang sama dengan isi penjelasan masing-masung hukum taj!id . %isini penulis melampirkan salah satu halaman isi hukum taj!id. +ampilan menu halaman si +aj!id pada *ambar 7.7B.
*ambar 7.79 /alaman si &atihan
5.1.
*ambar 7.7B /alaman si +aj!id 7.=.C
>embuatan /alaman $enu &atihan
+erdapat dua menu latihan pada aplikasi ini, tujuannya untuk memberikan pemahaman yang lebih kepada user , menu latihan terdiri dari menu latihan hijaiyah dan latihan taj!id. >ada tombol salah satu menu latihan penulis menggunakan ation sript
*ambar 7.71 /alaman $enu &atihan 7.=.8
>embuatan /alaman si &atihan
/alaman menu ini terdiri dari dua yaitu halaman isi latihan hijaiyah dan taj!id untuk latihan ini menggunakan konsep seperti kuis dimana
esimpulan
"plikasi pembelajaran huruf hijaiyah dan taj!id Jikhfa< ini dapat digunakan untuk membantu anak-anak dalam proses mengenal huruf hijaiyah dan taj!id dengan media yang interaktif. "plikasi ini menyediakan informasi berupa huruf hijaiyah dan taj!id dengan suara untuk memudahkan anak-anak dalam mempelajari lalu terdapat latihan hijaiyah dan taj!id untuk menambah pemahaman anak-anak. 5.9.
Saran
Pembuatan aplikasi ini masih memerlukan pengembangan selanjutnya seperti suara yang dihasilkan pada huruf hijaiyah dan tajwid diperjelas, adanya penyimpanan nilai terbaik pada latihan untuk memotivasi anak-anak dan penambahan contoh-contoh pada tajwidnya. Oleh sebab itu, penulis menyarankan kepada siapa saja yang membaca penulisan ini dapat mengembangkan dan menyempurnakan aplikasi ini agar lebih baik dari yang sebelumnya.
8590irdaus, 3embela$aran 0odel Struktur .avi&asi, ?urnal +eknologi nformasi #ol 11. /al 9- C, 9B1B. L7M>riyanto /idayatullah, Animasi 3endidikan Flash, >enerbit 0AD$"+", 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, 9B11 LCMStephen 'hin, As!ald 'ampesato,%ean #erson, >aul +rani, 3ro Android Flash, Apress,9B11
DAFTAR PUSTAKA
L1M"bdul aeem, JU1 2A00AKU 34US, ?akarta , 5667)
