PENGEMBANGAN APLIKASI INFORMASI SHALAT BERBASIS

PENGEMBANGAN APLIKASI INFORMASI SHALAT BERBASIS MULTIMEDIA MENGGUNAKAN FLASHLITE MOBILE APPLICATION

Oleh: IRHAM HAYAT DAUD NIM. 104091003205

PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA 2011

PENGEMBANGAN APLIKASI INFORMASI SHALAT BERBASIS MULTIMEDIA MENGGUNAKAN FLASHLITE MOBILE APPLICATION

Oleh: IRHAM HAYAT DAUD NIM. 104091003205

PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA 2011

PENGEMBANGAN APLIKASI INFORMASI SHALAT BERBASIS MULTIMEDIA MENGGUNAKAN FLASH LITE MOBILE APPLICATION

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

Oleh : IRHAM HAYAT DAUD 104091003205

Menyetujui,

Pembimbing I

Pembimbing II

Viva Arifin, MMSi

Yusuf Durrachman, M.Sc. MIT

NIP. 19730810 200604 2 001

NIP. 19710522 200604 1 002

Mengetahui : Ketua Program Studi Teknik Informatika

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

PENGESAHAN UJIAN Skripsi yang berjudul “Pengembangan Aplikasi Informasi Shalat Berbasis Multimedia Menggunakan Flash Lite Mobile Application” telah diuji dan dinyatakan lulus dalam Sidang Munaqosyah Fakultas Sains dan Teknologi, Universitas Islam Negeri Syarif Hidayatullah Jakarta pada Hari Jum’at, 12 Agustus 2011. Skripsi ini telah diterima sebagai salah satu syarat untuk memperoleh gelar Sarjana Strata Satu ( S1 ) Program Studi Teknik Informatika. Jakarta, September 2011 Menyetujui, Penguji I

Penguji II

Dr. Agus Salim, M.Si NIP. 19720816 199903 1 003

Amin Johari, MA NIP. 19720911 200212 1 008

Pembimbing I

Pembimbing II

Viva Arifin, MMSI NIP. 19730810 200604 2 001

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

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

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

Irham Hayat Daud 104091003205

ABSTRAK IRHAM HAYAT DAUD, Pengembangan Aplikasi Informasi Shalat Berbasis Multimedia Menggunakan Flash Lite Mobile Application. Di bawah bimbingan VIVA ARIFIN dan YUSUF DURRACHMAN. Perkembangan teknologi menjadikan handphone tidak lagi berfungsi sekedar 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 mobile application informasi shalat untuk memudahkan umat Islam untuk mendapatkan informasi mengenai tata cara pelaksanaan shalat wajib. Dengan menggunakan dua metode, yaitu pengumpulan data yang meliputi studi pustaka, wawancara dan observasi dan 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 CS3, dan Audacity. Output yang dihasilkan berupa mobile application informasi shalat dengan ukuran 1,7 MB yang menampilkan informasi panduan berwudhu, panduan tayamum, dan panduan shalat. Kata Kunci: Informasi Shalat, Mobile Application, Flash Lite, Multimedia xix + 116 Halaman; 79 Gambar; 6 Tabel; 4 Lampiran Daftar Pustaka: 47 (1996-2010)

KATA PENGANTAR

Assalamualaikum wr.wb. Alhamdulillahirabbilalamiin, Segala puji dan syukur kehadirat Allah SWT, atas segala karunia dan rahmat-Nya sehingga penulis dapat menyelesaikan penyusunan

skripsi

yang

berjudul

"PENGEMBANGAN

APLIKASI

INFORMASI SHALAT BERBASIS MULTIMEDIA MENGGUNAKAN FLASH LITE MOBILE APPLICATION" dengan baik. Shalawat serta salam penulis sampaikan pada junjungan dan suri teladan kita, Nabi Besar Muhammad Saw. beserta keluarga dan para sahabatnya. Skripsi ini adalah salah satu tugas wajib sebagai persyaratan untuk mendapatkan gelar Strata 1 (S1) bagi mahasiswa Universitas Islam Negeri Syarif Hidayatullah Jakarta, khususnya Program Studi Teknik Informatika, Fakultas Sains dan Teknologi. Selama penulisan skripsi ini, penulis mengalami hambatan dan kesulitan yang datang silih berganti. Oleh karena itu, penulis mengucapkan terima kasih yang sebesar-besarnya sehingga penulisan skipsi ini selesai, khususnya kepada: 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.

3.

Bapak Yusuf Durrachman, MIT selaku Ketua Program Studi dan Ibu Viva Arifin, MMSI selaku Sekretaris Program Studi Teknik

Informatika Fakultas Sains dan Teknologi, Universitas Islam Negeri Syarif Hidayatullah Jakarta, dan juga selaku dosen pembimbing II dan I 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.

Keluarga penulis, kedua orang tua tercinta, Ayahanda Alm. Drs. H. Syamsul Hayat Daud (maafkan Irham ya Pa, tidak menyelesaikan skripsi tepat pada waktunya... Semoga seluruh Amal dan Ibadahnya diterima di sisi Allah Swt. dan diampuni dosa-dosanya, dilapangkan kuburnya dan diberikan nikmat kubur untuknya) dan Ibunda Relawati 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 Oma, Bibi dan Paman, serta kepada adik-adik penulis Resya dan Bariy yang terus memberi dukungan, semangat dan doa untuk menyelesaikan skripsi ini.

6.

Teman-teman UIN TI B 2004, yang tidak dapat penulis sebutkan semuanya karena kalian semua adalah teman-teman terbaik penulis

yang telah memberikan persahabatan senasib seperjuangan dan selalu memberikan semangat serta dukungan kepada penulis untuk menyelesaikan skripsi ini. 7.

Dan semua pihak yang tidak dapat disebutkan satu persatu yang telah membantu penulis selama penyusunan skripsi ini.

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

Penulis

DAFTAR ISI Halaman Judul ..................................................................................................... i Lembar Persetujuan Pembimbing .................................................................... ii Lembar Pengesahan Ujian ................................................................................ iii Lembar Pernyataan ............................................................................................ iv Abstrak .................................................................................................................. v Kata Pengantar ................................................................................................... vi Daftar Isi ............................................................................................................. ix Daftar Tabel ....................................................................................................... xiv Daftar Gambar ................................................................................................... xv Daftar Lampiran .............................................................................................. xix BAB I PENDAHULUAN ..................................................................................... 1 1.1. Latar Belakang ................................................................................... 1 1.2. Perumusan Masalah ............................................................................ 5 1.3. Batasan Masalah ................................................................................. 6 1.4. Tujuan dan Manfaat Penulisan ........................................................... 6 1.4.1.Tujuan ........................................................................................ 6 1.4.2.Manfaat ..................................................................................... 7 1.5. Metodologi Penelitian ........................................................................ 9 1.5.1.Metodologi Pengumpulan Data ................................................ 9 1.5.2.Metodologi Pengembangan Multimedia ................................. 10 1.6. Sistematika Penulisan Skripsi ........................................................... 10 BAB II LANDASAN TEORI ............................................................................ 12 2.1. Mobile Application ........................................................................... 12 2.1.1. Ponsel ..................................................................................... 12 2.2. Multimedia ....................................................................................... 13 2.2.1. Definisi Multimedia ............................................................... 13 2.2.2. Objek Multimedia .................................................................. 15 2.2.2.1. Teks ........................................................................... 15 2.2.2.2. Grafik atau Gambar ................................................... 18 2.2.2.3. Animasi ..................................................................... 22 2.2.2.4. Audio ......................................................................... 23 2.2.2.5. Video ......................................................................... 24 2.2.2.6. Interactive Link ......................................................... 24 2.3. Multimedia Interaktif ........................................................................ 25 2.4. Perancangan Sistem ........................................................................... 26 2.4.1. Storyboard .............................................................................. 26 2.4.2. Flowchart ............................................................................... 27 2.4.3. Desain Struktur Navigasi ....................................................... 28 2.4.4. State Transition Diagram ....................................................... 30 2.5. Shalat ................................................................................................. 32 2.6. Adobe Flash CS4 Professional .......................................................... 33 2.6.1. Area Kerja .............................................................................. 36 2.6.2. Action Script pada Flash ......................................................... 40

2.7. Flash Lite ........................................................................................... 41 2.7.1. Sejarah .................................................................................... 41 2.7.2. Pembahasan umum Flash Lite ............................................... 42 2.7.3. Pembahasan umum Action Script pada Flash Lite ................. 47 2.8. Adobe Device Central CS4 ............................................................... 49 2.8.1. Area Kerja Adobe Device Central CS4 .................................. 50 2.8.2. Cara Kerja Adobe Device Central .......................................... 54 2.9. Adobe Photoshop CS3 ...................................................................... 54 2.10. Audacity ........................................................................................... 56 2.11. Literatur Sejenis .............................................................................. 57 2.12. Metodologi Pengembangan Multimedia ......................................... 60 2.12.1. Konsep (Concept) ................................................................ 61 2.12.2. Perancangan (Design) ......................................................... 62 2.12.3. Pengumpulan Bahan Material (Material Collecting) .......... 62 2.12.4. Pembuatan (Assembly) ........................................................ 63 2.12.5. Pengujian (Testing) ............................................................. 63 2.12.6. Distribusi (Distribution) ...................................................... 64 BAB III METODOLOGI PENELITIAN ........................................................ 65 3.1. Metodologi Pengumpulan Data ........................................................ 65 3.1.1. Studi Kepustakaan .................................................................. 65 3.1.2. Wawancara ............................................................................. 66 3.1.3. Observasi ................................................................................ 66 3.1.4. Kuisoner ................................................................................. 66 3.2. Metodologi Pengembangan Multimedia .......................................... 67 3.2.1. Konsep (Concept) ................................................................... 67 3.2.2. Perancangan (Design) ............................................................ 67 3.2.3. Pengumpulan Bahan Material (Material Collecting) ............. 70 3.2.4. Pembuatan (Assembly) ........................................................... 71 3.2.5. Pengujian (Testing) ................................................................ 73 3.2.6. Distribusi (Distribution) ......................................................... 74 BAB IV PERANCANGAN DAN PEMBUATAN APLIKASI ....................... 75 4.1. Metode Pengembangan Multimedia .................................................. 75 4.1.1. Konsep (Concept) ................................................................... 75 4.1.2. Perancangan (Design) ............................................................ 76 4.1.2.1. Perancangan Storyboard ........................................... 76 4.1.2.2. Perancangan Struktur Navigasi ................................. 82 4.1.2.3. Perancangan Flowchart ............................................. 83 4.1.2.4. Perancangan STD (State Transition Diagram ........... 87 4.1.2.5. Perancangan Antarmuka Pemakai (Interface) ........... 89 4.1.3. Pengumpulan Bahan Material (Material Collecting) ........... 103 4.1.3.1. Teks ......................................................................... 103 4.1.3.2. Gambar .................................................................... 104 4.1.3.3. Animasi ................................................................... 104 4.1.3.4. Audio ....................................................................... 105 4.1.3.5. Kontrol Navigasi ..................................................... 105 4.1.4. Pembuatan (Assembly) ......................................................... 105

4.1.5. Pengujian (Testing) .............................................................. 110 4.1.5.1. Pengujian Pada Emulator ........................................ 110 4.1.5.2. Pengujian Pada Ponsel ............................................ 111 4.1.6. Distribusi (Distribution) ....................................................... 114 4.1.6.1. Spesifikasi Hardware dan Software ........................ 115 4.1.6.2. Cara Menggunakan Program ................................... 116 BAB IV KESIMPULAN DAN SARAN .......................................................... 117 5.1. Kesimpulan ...................................................................................... 117 5.2. Saran ................................................................................................ 118 DAFTAR PUSTAKA ....................................................................................... 119

DAFTAR TABEL Tabel 2.1. Simbol-simbol flowchart .................................................................... 27 Tabel 3.1. Daftar Gambar ..................................................................................... 70 Tabel 3.2. Spesifikasi minimum handphone ........................................................ 73 Tabel 4.1. Spesifikasi hardware dan software yang digunakan ........................ 106 Tabel 4.2. Spesifikasi ponsel Nokia E5 yang digunakan.................................... 112 Tabel 4.3. Spesifikasi handphone yang disarankan ........................................... 115

DAFTAR GAMBAR Gambar 2.1 Gambar 2.2. Gambar 2.3. Gambar 2.4. Gambar 2.5. Gambar 2.6.

Gambaran definisi multimedia....................................................... 15 Teks yang Dicetak Pada Koran ...................................................... 16 Teks hasil scan dari buku .............................................................. 17 Teks elektronik .............................................................................. 17 Contoh situs web yang mengandung hypertext ............................. 18 Contoh Image Vector dan tampilannya setelah diperbesar ternyata tetap bagus ....................................................................... 16 Gambar 2.7. Contoh Image Bitmap dan tampilannya setelah diperbesar menampakkan susunan kotak-kotak ............................................ 17 Gambar 2.8. Contoh dari animasi bola bergerak dan mobil bergerak ................ 18 Gambar 2.9. Simbol State .................................................................................. 31 Gambar 2.10. Simbol Transisi State .....................................................................31 Gambar 2.11. Notasi State Transition Diagram .................................................. 31 Gambar 2.12. Proses desain aplikasi pada flash ................................................... 36 Gambar 2.13. Area kerja Adobe Flash CS4 Professional .................................... 37 Gambar 2.14. Bagian dari Timeline ..................................................................... 39 Gambar 2.15. Proses desain aplikasi ponsel ........................................................ 43 Gambar 2.16. Aplikasi peta digital ...................................................................... 44 Gambar 2.17. Aplikasi Aplikasi games GO SUSHI berbasis Flashlite ............... 44 Gambar 2.18. Aplikasi client twitter berbasis flash lite ....................................... 45 Gambar 2.19. Screensaver Flashlite pada Nokia.................................................. 45 Gambar 2.20. Screensaver pada layar utama dan layar sub-LCD ........................ 46 Gambar 2.21. Tampilan wallpaper flash lite ........................................................ 46 Gambar 2.22. Tampilan Adobe Device Central CS4 ........................................... 50 Gambar 2.23. Tampilan Device Profiles ............................................................. 51 Gambar 2.24. Tampilan emulator dengan skin Nokia E5..................................... 52 Gambar 2.25. Tampilan Simulasi Display dengan Reflection Indoor ................. 53 Gambar 2.26. Tampilan aplikasi Adobe Photoshop CS3 ..................................... 55 Gambar 2.27. Tampilan aplikasi Audacity ........................................................... 56 Gambar 2.28. Tahapan Pengembangan Multimedia ............................................ 60 Gambar 2.29. Rincian Tahapan Pengembangan Multimedia .............................. 61 Gambar 4.1. Flowchart Menu Utama ................................................................ 83 Gambar 4.2. Flowchart Panduan Shalat ............................................................. 84 Gambar 4.3. Flowchart Risalah Shalat ............................................................... 85 Gambar 4.4. Flowchart Pilihan........................................................................... 86 Gambar 4.5. Struktur Navigasi Menu Utama ..................................................... 82 Gambar 4.6. STD Menu Utama .......................................................................... 87 Gambar 4.7. STD Panduan Shalat ...................................................................... 87 Gambar 4.8. STD Risalah Shalat ....................................................................... 88 Gambar 4.9. STD Pilihan ................................................................................... 88 Gambar 4.10. Tampilan Intro .............................................................................. 89 Gambar 4.11. Tampilan Menu Utama .................................................................. 90 Gambar 4.12. Tampilan Menu Utama dengan Pilihan......................................... 91 Gambar 4.13. Tampilan Keluar Aplikasi .............................................................. 91

Gambar 4.14. Tampilan Menu Panduan Shalat .................................................... 92 Gambar 4.15. Gambar Berwudhu Tahap 1 mencuci tangan ................................ 93 Gambar 4.16. Gambar Berwudhu Tahap 2 berkumur dan mencuci hidung ........ 93 Gambar 4.17. Gambar Berwudhu Tahap 3 mencuci muka................................... 93 Gambar 4.18. Gambar Berwudhu Tahap 4 mencuci tangan hingga siku ............. 94 Gambar 4.19. Gambar Berwudhu Tahap 5 mencuci rambut dan kepala .............. 94 Gambar 4.20. Gambar Berwudhu Tahap 6 mencuci telinga................................. 94 Gambar 4.21. Gambar Berwudhu Tahap trerakhir mencuci kaki ......................... 95 Gambar 4.22. Gambar Bertayammum langkah 1 berniat ..................................... 95 Gambar 4.23. Gambar Bertayammum langkah 2 membasuh muka ..................... 96 Gambar 4.24. Gambar Bertayammum langkah 3 membasuh muka kedua kali.... 96 Gambar 4.25. Gambar Bertayammum langkah 4 kedua belah tangan hingga siku dua kali ................................................................................... 96 Gambar 4.26. Tampilan Gerakan Shalat Niat ....................................................... 97 Gambar 4.27. Tampilan Gerakan Shalat Takbiratul ihram ................................... 97 Gambar 4.28. Tampilan Gerakan Shalat Membaca Alfatihah dan surat pendek .. 98 Gambar 4.29. Tampilan Gerakan Shalat Rukuk ................................................... 98 Gambar 4.30. Tampilan Gerakan Shalat I’tidal .................................................... 98 Gambar 4.31. Tampilan Gerakan Shalat Sujud..................................................... 99 Gambar 4.32. Tampilan Gerakan Shalat Duduk antara dua sujud........................ 99 Gambar 4.33. Tampilan posisi kaki Gerakan Shalat Duduk antara dua sujud...... 99 Gambar 4.34. Tampilan Gerakan Shalat Sujud kedua ........................................ 100 Gambar 4.35. Tampilan posisi kaki Gerakan Shalat Tahiyat awal ..................... 100 Gambar 4.36. Tampilan telunjuk bergerak Gerakan Shalat Tahiyat awal .......... 100 Gambar 4.37. Tampilan posisi kaki Gerakan Shalat Tahiyat akhir .................... 101 Gambar 4.38. Tampilan telunjuk bergerak Gerakan shalat Tahiyat akhir .......... 101 Gambar 4.39. Tampilan Gerakan Shalat Salam ke kanan................................... 101 Gambar 4.40. Tampilan Gerakan Shalat Salam ke kiri....................................... 102 Gambar 4.41. Tampilan Tentang Saya................................................................ 102 Gambar 4.42. Tampilan Info Aplikasi ................................................................ 103 Gambar 4.43. Hasil Pengolahan Animasi dengan Flash ..................................... 104 Gambar 4.44. Pembuatan gambar latar aplikasi dengan Adobe Photoshop CS3 108 Gambar 4.45. Pembuatan Menu Utama .............................................................. 109 Gambar 4.46. Pengujian aplikasi pada emulator Adobe Device Central CS4.... 110 Gambar 4.47. Ponsel Nokia E5 ........................................................................... 111 Gambar 4.48. File aplikasi .................................................................................. 112 Gambar 4.49 Perangkat Bluetooth pada laptop................................................... 113 Gambar 4.50. Pengujian aplikasi pada perangkat ponsel Nokia E5 ................... 114

DAFTAR LAMPIRAN Lampiran I Lampiran II Lampiran III Lampiran IV

Surat-surat Penelitian ................................................................. 124 Hasil Wawancara ....................................................................... 126 Kuisioner ..................................................................................... 127 Source Code ............................................................................... 128

BAB I PENDAHULUAN 1. 1

Latar Belakang Perkembangan teknologi informasi saat ini sangat mempengaruhi segala bidang dalam kehidupan manusia, seperti dalam bidang pendidikan, hiburan, perekonomian, telekomunikasi dan banyak bidang lainnya yang terkena dampak perkembangan teknologi informasi tersebut. Perkembangan teknologi informasi telah dapat menghasilkan suatu perangkat teknologi yang mendukung pengintegrasian dari berbagai media yang mampu menghasilkan suatu aplikasi multimedia yang dapat dimanfaatkan di berbagai bidang. Salah satu hasil perkembangan teknologi informasi tersebut adalah perangkat telepon genggam atau handphone. Perkembangan teknologi perangkat lunak saat ini telah menjadikan handphone, suatu perangkat yang berfungsi sebagai sarana penunjang telekomunikasi tanpa kabel yang memiliki berbagai fitur yang canggih selain hanya untuk telepon ataupun mengirim pesan singkat. Karena bersifat mobile yang mudah dan praktis untuk dibawa, menjadikan handphone sebagai perangkat yang tidak terpisahkan dalam kehidupan sehingga hampir semua orang dapat dipastikan menggunakan handphone untuk menjalankan aktivitasnya sehari-hari. Salah satu fitur handphone saat ini adalah memiliki kemampuan untuk menjalankan aplikasi mobile atau mobile application dengan berbagai macam format, dengan

kemampuan tersebut, maka handphone dapat digunakan sebagai sarana dalam penyampaian informasi. Multimedia menjadi penting karena dapat dipakai sebagai alat persaingan antar perusahaan. Disamping itu pada abad ke-21 ini multimedia menjadi suatu keterampilan dasar yang sama pentingnya dengan keterampilan membaca. Sesungguhnya multimedia pun mengubah hakikat membaca itu sendiri. Multimedia menjadikan kegiatan membaca itu dinamis dengan memberi dimensi baaru pada kata-kata. Apalagi dalam hal penyampaian makna, kata-kata dalam aplikasi multimedia bisa menjadi pemicu yang dapat digunakan untuk memperluas ilmu atau penyampaian informasi (Suyanto, 2003). Shalat sebagai tiang agama merupakan ibadah yang sangat penting halnya dalam kehidupan sehingga dalam pelaksanaannya kadang umat masih membutuhkan bantuan atau panduan dalam menjalankan ibadah tersebut. Untuk penyampaian informasi ini dapat juga memanfaatkan teknologi untuk membantu memudahkan umat Islam memperoleh informasi mengenai shalat dan tata cara pelaksanaannya beserta hikmahnya. Pada umumnya mendapatkan informasi melalui buku-buku, brosur atau sejenisnya yang kurang praktis dalam penggunaannya, sehingga dapat dipermudah hanya dengan menggunakan sebuah aplikasi mobile yang lebih interaktif, praktis dan efisien. Untuk memahami lebih jelas permasalahan-permasalahan umat terhadap media pembelajaran yang sudah ada seperti, buku-buku tuntunan

shalat dan untuk mengetahui kebutuhan umat terhadap aplikasi yang akan dibuat ini, penulis telah melakukan pengamatan dan observasi di lembaga pendidikan keagamaan Mesjid Falatehan yang beralamat di Jl. Palatehan No.10 Kebayoran Baru Jakarta Selatan, yaitu dalam pengamatan ini penulis membagi objek pengamatan menjadi empat kategori : 1. Kategori anak 2. Kategori terdidik dan memiliki background keagamaan 3. Kategori terdidik dan tidak memiliki background keagamaan 4. Kategori tidak terdidik dan tidak memiliki background keagamaan Diperoleh hasil pengamatan sebagai berikut : 1. Pada kategori terdidik dan tidak memiliki background keagamaan tuntutan pekerjaan di luar rumah atau karier merupakan hal yang sangat penting bagi mereka, namun mereka sangat menginginkan untuk tetap bisa mempelajari shalat. Bahkan bagi mereka solusi yang akan dirancang ini menjadi lebih mudah dan menarik jika bisa digunakan pada ponsel. 2. Pada kategori anak dan kategori tidak terdidik dan tidak memiliki background keagamaan, masih banyak yang tidak mengetahui bacaan-bacaan dalam shalat, rukun, hukum-hukum dalam shalat, syarat serta gerakan-gerakan dalam shalat dengan baik dan benar.

3. Bagi mereka buku-buku tuntunan shalat yang statis tidak memberikan fasilitas contoh cara membaca bacaan shalat serta gerakan-gerakan dalam shalat yang dijelaskan dan diperlihatkan secara baik dan benar, serta bacaannya. 4. Pada media tertentu (contohnya televisi atau lembaga pengajian), interaksi dengan media tersebut memiliki keterbatasan dalam hal waktu dan tempat. 5. Dibutuhkan alat bantu ajar yang dinamis dan menarik yang dapat memberikan contoh gerakan shalat, bacaan shalat serta yang dapat menjelaskan hukum-hukum dalam shalat dengan jelas. 6. Dalam perancangan aplikasi diharapkan mampu menyediakan fasilitas tombol navigasi yang bersifat dinamis yang dapat memberikan kemudahan bagi umat untuk memilih halaman yang sesuai dengan yang diinginkan. Oleh karena itu penulis mencoba membantu memfasilitasi umat dalam mempelajari shalat dan memberikan dampak positif atau manfaat dari perkembangan perangkat handphone dengan mengembangkan suatu aplikasi mobile atau mobile application berbasis multimedia yang dapat didistribusikan dan dijalankan pada perangkat handphone menggunakan aplikasi Flash lite versi 2.1, yaitu sebuah fitur yang sekarang ini dalam perkembangannya sudah terdapat pada banyak jenis handphone yang mendukung berbagai macam elemen multimedia.

Berdasarkan latar belakang tersebut kemudian penulis memilih judul : “PENGEMBANGAN APLIKASI INFORMASI SHALAT BERBASIS MULTIMEDIA MENGGUNAKAN FLASH LITE MOBILE APPLICATION”.

1.2

Perumusan Masalah Perumusan masalah dalam skripsi ini adalah : 1. Bagaimana membuat aplikasi mobile yang dapat menyajikan penyampaian informasi shalat wajib dan pelaksanaannya berbasis multimedia. 2. Bagaimana

menerapkan

aplikasi

tersebut

pada

perangkat

handphone yang mendukung aplikasi Flash lite.

1.3

Batasan Masalah Berdasarkan perumusan masalah di atas, batasan masalah yang dibahas meliputi : 1. Penyajian panduan informasi mengenai shalat wajib beserta tata cara pelaksanaannya mulai dari gerakan shalat, bacaan shalat beserta hikmahnya. 2. Berdasarkan hasil wawancara di tempat penelitian, aplikasi ini mengambil sumber dari buku “Risalah Tuntunan Shalat Lengkap”, Drs. Moh Rifai, 2010, Penerbit PT. Karya Toha Putra, Semarang.

3. Aplikasi ini dikhususkan untuk umat Islam atau bagi umat yang sudah memiliki dasar pengetahuan agama Islam. 4. Beerdasarkan hasil kuisioner Jenis handphone yang digunakan dalam pembuatan aplikasi ini adalah Nokia tipe E5 dimana aplikasi ini diterapkan hanya terbatas pada handphone multimedia yang memiliki fitur Flash lite versi 2.1.

1.4

Tujuan dan Manfaat Penelitian 1.4.1 Tujuan Tujuan dari penelitian ini adalah merancang suatu aplikasi mobile yang berisi informasi shalat yang dapat berjalan pada aplikasi Flashlite 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 Pengguna : a. Dengan dirancangnya aplikasi ini dapat membantu dan memudahkan pengguna khususnya umat Islam dalam memperoleh informasi mengenai shalat.

b. Dapat memanfaatkan teknologi sebagai dampak positif bagi masyarakat terhadap penunjang kebutuhan dalam penyajian informasi. c. Mendapatkan

aplikasi

interaktif

mengenai

panduan

informasi shalat beserta pelaksanaannya secara praktis, efisien, dan sangat mudah untuk didistribusikan. 2.

Bagi Penulis : a. Sebagai salah satu syarat kelulusan dalam menyelesaikan program strata 1. b. Penulis mampu menerapkan aplikasi mobile menggunakan flash lite ke dalam handphone untuk menyajikan informasi shalat. c. Menambah pengalaman, memperluas wawasan pemikiran dan mengembangkan potensi diri dalam pengembangan aplikasi berbasis mobile.

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 Metodologi yang digunakan dalam penulisan skripsi ini meliputi dua bagian yaitu metode pengumpulan data dan metode pengembangan: 1.5.1 Metode Pengumpulan Data 1. Studi Kepustakaan Pengumpulan data dilakukan dengan cara membaca dan mempelajari buku-buku yang berhubungan dengan multimedia serta buku-buku yang mendukung topik yang dibahas.

2. Studi Lapangan a. Observasi Dilakukan dengan cara meneliti ke lapangan yaitu Masjid Falatehan sebagai tempat pelaksanaan shalat pada umumnya dan lembaga pendidikan keagamaan yang beralamat di Jl. Palatehan No.10 Kebayoran Baru Jakarta Selatan dimana informasi dan materi akan diperoleh sebagai bahan dari penulisan. b. Wawancara Melakukan wawancara pada pihak yang berkaitan dengan alur permasalahan. Wawancara ini dilakukan untuk

mendapatkan bahan penulisan dan penjelasan mengenai pengamatan yang dilakukan. c. Kuisioner Kuisioner dibagikan kepada pengguna untuk menentukan jenis handphone apa yang digunakan dan sebagai dasar dalam perancangan aplikasi informasi shalat.

1.5.2. Metode Pengembangan Mulltimedia Menurut Arch Luther (1994) (dalam Ariesto Hadi Sutopo, 2003) metodologi pengembangan multimedia dilakukan melalui enam tahapan, yaitu : 1. Konsep (concept), 2. Desain atau perancangan (design), 3. Pengumpulan bahan material (material collecting), 4. Pembuatan (assemby), 5. Pengujian (testing), dan 6. Distribusi (distribution).

1.6.

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

BAB I PENDAHULUAN Bab ini berisi pembahasan mengenai uraian tentang Latar Belakang, Rumusan Masalah, Batasan Masalah, Tujuan dan Manfaat dari Pembuatan Aplikasi Informasi Shalat Berbasis Multimedia, Metodologi dan Sistematika Penulisan. BAB II LANDASAN TEORI Bab ini berisi pembahasan tentang landasan teori, definisi dan komponen pembangun yang ada dalam penyusunan skripsi ini. 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.

BAB II LANDASAN TEORI

2.1.

Mobile Application Mobile application merupakan aplikasi yang cara aksesnya menggunakan perangkat bergerak (mobile device) seperti handphone, smartphone dan PDAphone (Suryana, 2008). Aplikasi

yang

menggunakan

perangkat

bergerak

semakin

meningkat dan beragam saat ini, seperti aplikasi mobile berbasis java, berbasis android ataupun berbasis Flash lite. 2.1.1. Ponsel 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).

2.2

Multimedia Multimedia berasal dari dua kata, yaitu multi dan media. Multi berarti banyak dan media biasa diartikan alat untuk menyampaikan atau membuat sesuatu, perantaraan, alat pengantar, suatu bentuk komunikasi seperti surat kabar, majalah, atau televisi (Arius, 2009). 2.2.1 Definisi Multimedia Dalam Suyanto 2003, terdapat definisi-definisi multimedia, antara lain : 1.

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 navigasi, berinteraksi, berkreasi dan berkomunikasi.

2.

Menurut Rosch (1996), Multimedia adalah Kombinasi dari komputer dan video.

3.

Menurut Mc Comick (1996) multimedia secara umum merupakan kombinasi tiga elemen yaitu, suara, gambar dan teks.

4.

Menurut Turban dan Kawan-kawan (2002) multimedia adalah kombinasi dari paling sedikit dua media input atau output dari data, media ini dapat berupa audio (suara, musik), animasi, video, teks, grafik dan gambar.

Definisi lain multimedia adalah kombinasi teks, seni, suara, gambar, animasi, dan video yang disampaikan dengan komputer atau dimanipulasi secara digital dan dapat disampaikan dan/atau dikontrol secara interaktif (Vaughn, 2004) . Ada tiga jenis multimedia : 1.

Multimedia interaktif Pengguna dapat mengontrol apa dan kapan elemenelemen multimedia akan dikirimkan atau ditampilkan.

2.

Multimedia hiperaktif Multimedia jenis ini mempunyai suatu struktur dari elemen-elemen

terkait

dengan

pengguna

yang

dapat

mengarahkannya. Dapat dikatakan bahwa multimedia jenis ini mempunyai banyak tautan (link) yang menghubungkan elemen-elemen multimedia yang ada. Contoh pada internet atau game. 3.

Multimedia linear Pengguna hanya menjadi penonton dan menikmati produk multimedia yang disajikan dari awal hingga akhir. Contoh pada televisi atau bioskop. Menurut penulis dari definisi diatas sebuah sistem

multimedia dapat digambarkan seperti pada Gambar 2.1

Teks Grafik

Video MULTIMEDIA

Animasi

Audio Interaktifitas

Gambar 2.1 Gambaran definisi multimedia. (Sumber: Arius, 2009)

2.2.2. Objek Multimedia Menurut Sutopo (2003), Multimedia terdiri dari beberapa objek (element), yaitu teks, grafik atau image, animasi, audio, video dan link interaktif. 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. Menurut (Suyanto, 2003), teks secara umum terbagi menjadi empat macam, yaitu : 1. Teks cetak, yaitu teks yang tercetak di atas kertas.

Gambar 2.2. Teks yang Dicetak Pada Koran (Sumber: Tuhusetya, 2009) 2. Teks hasil scan, yaitu teks tercetak di atas kertas yang di-scan oleh scanner, dan mengkonversinya menjadi format yang dapat dibaca oleh komputer.

Gambar 2.3. Teks hasil scan dari buku (Sumber: Thabrani, 2006)

3. Teks elektronik, yaitu jenis teks yang bisa dibaca oleh komputer dan dikirim secara elektronis melalui jaringan.

Gambar 2.4. Teks elektronik (Sumber: Hasil Olahan Penulis, 2011)

4. Hypertext, pertama kali diperkenalkan oleh Ted Nelson (1965). Hypertext merupakan dasar untuk produksi multimedia virtual dan mengacu ke proses linking (teks yang telah masuk link (linked)) yang membuat multimedia menjadi interaktif.

Gambar 2.5. Contoh situs web yang mengandung hypertext (Sumber: Hasil Olahan Penulis, 2011)

2.2.2.2. Grafik atau 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). Gambar dapat meringkas dan menyajikan data kompleks dengan cara yang baru dan lebih berguna.

Grafik seringkali muncul sebagai latar belakang suatu

teks

untuk

menghadirkan

kerangka

yang

mempermanis teks. Secara garis besar terdapat dua jenis gambar, yaitu gambar vektor dan gambar bitmap. 1. Gambar Vektor Gambar vektor merupakan gambar yang terbentuk atas kumpulan garis dan kurva yang peletakannya dicatat dan diperhitungkan secara matematis (Kusrianto, 2006). Kumpulan

garis

dan

kurva

tersebut

dinamakan vektor. Gambar vektor posisinya dapat dipindah-pindahkan, ukuran atau warnanya diubah tanpa mempengaruhi kualitas gambar. Sifat dari grafis vektor adalah resolusi bebas (independent resolution) (Yoga, 2005).

Gambar 2.6. Contoh Image Vector dan tampilannya setelah diperbesar ternyata tetap bagus. (Sumber: Kusrianto, 2006)

2. Gambar Bitmap Bitmap secara teknis disebut raster, yaitu metode komputer untuk menampilkan informasi menggunakan kumpulan titik-tikit (dot), disebut juga pixel (picture element), dengan warna sendiri-sendiri yang disusun pada bidang tegak lurus (grid), dengan tingkat kerapatan tertentu, sehigga jika dilihat pada jarak tertentu, kumpulan titik-titik tersebut akan membentuk gambar yang diinginkan (Yoga, 2005).

Sifat gambar bitmap tergantung pada tingkat kerapatan pixel penyusunnya (resolution dependent), sehingga ketika gambar diperbesar melampaui batas toleransi pixel-pixel penyusunnya, gambar akan terlihat pecah, yang umumnya disebut dengan istilah jaggy (Yoga, 2005).

Gambar 2.7. Contoh Image Bitmap/raster dan tampilannya setelah diperbesar menampakkan susunan kotak-kotak atau tampak terpecah. (Sumber: Kusrianto, 2006) Dalam hal ini penulis menggunakan kedua jenis gambar tersebut dalam pembuatan aplikasi ini.

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). Animasi adalah rangkaian gambar yang disusun secara berurutan. Ketika rangkaian gambar tersebut ditampilkan dengan kecepatan yang memadai, rangakaian gambar tersebut akan terlihat bergerak (Bunadi, 2007). Dalam multimedia, animasi merupakan penggunaan komputer untuk menciptakan gerak pada layar yang bertujuan untuk menarik perhatian dan menghilangkan kejenuhan yang monoton (Suyanto,2003). Animasi dapat didefinisikan sebagai suatu teknik untuk membuat ilusi yang bergerak yang ditampilkan pada layar, atau merekam dengan perangkat dari serangkaian kejadian individu menjadi sebuah adegan yang dinamis (Thalmann, 1991).

Gambar 2.8. Contoh dari animasi bola bergerak dan mobil bergerak. (Sumber: Baba: 2008)

2.2.2.4. Audio 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).

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 (Sutopo, 2003).

2.2.2.6. Interactive Link Interactive

link

merupakan

sebagian

dari

multimedia yang diperlukan untuk menggabungkan beberapa elemen (objek) multimedia sehingga menjadi informasi yang terpadu, di mana pengguna dapat menekan mouse atau objek pada layer seperti tombol atau teks dan menyebabkan program melakukan perintah tertentu (Sutopo, 2003). Dalam penelitian ini yang digunakan oleh penulis adalah teks, gambar (vektor dan bitmap), animasi, audio dan interactive link.

2.3.

Multimedia Interaktif Multimedia interaktif atau disebut juga sebagai non-linear multimedia adalah multimedia yang dapat menangani interaktif dari pengguna (user) (Sutopo, 2003). Pengertian interaktif terkait dengan komunikasi 2 arah atau lebih dari komponen-komponen komunikasi. komunikasi dalam multimedia interaktif (berbasis komputer) adalah hubungan antara manusia (sebagai

user) dan komputer (perangkat lunak atau aplikasi dalam format tertentu yang diharapkan memiliki hubungan 2 arah atau timbal balik antara aplikasi dengan penggunanya (user) (Harto, 2008). Interaktivitas dalam multimedia menurut Zeemry (Harto, 2008) diberikan batasan sebagai berikut: 1. Pengguna (user) dilibatkan untuk berinteraksi dengan program aplikasi. 2. Aplikasi informasi interaktif bertujuan agar pengguna bisa mendapatkan informasi yang dibutuhkan. Perancangan aplikasi mobile berbasis multimedia interaktif pada prinsipnya sama dengan multimedia interaktif berbasis komputer, karena pada saat ini handphone tidak hanya berfungsi sebagai telepon saja, melainkan dapat memainkan dan menampilkan objek-objek multimedia seperti memutar musik dan memainkan video. Aplikasi mobile berbasis multimedia memungkinkan user memilih informasi yang diinginkan dan mudah digunakan.

2.4.

Perancangan Sistem 2.4.1. Storyboard Storyboard menurut Luther (1994, dalam Sutopo, 2003) merupakan deskripsi dari setiap scene yang secara jelas menggambarkan

objek

multimedia

serta

perilakunya

penjelasannya dapat menggunakan symbol maupun teks.

yang

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. Bagi Pengembang dan pemilik multimedia, storyboard merupakan visual test yang pertama-tama dari gagasan dimana secara keseluruhan dapat dilihat apa yang akan disajikan. 2. Bagi staf pembuat multimedia, storyboard merupakan pedoman dari aliran pekerjaan yang harus dilakukan. 3. Bagi

sponsor,

storyboard

merupakan

gambaran

suatu

multimedia yang akan diproduksi (Sutopo, 2003).

2.4.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 : Tabel 2.1. Simbol-simbol flowchart No

Simbol

Fungsi Menggambarkan proses atau

1. proses perhitungan Proses

penggabungan

2. (merge) Proses pemecahan (extract) 3.

4.

Proses secara manual Pemasukan

data

melalui

5. keyboard 6. 7.

Arah data / arus data Sambungan pada halaman berbeda Mulai (start) atau selesai

8. (stop) 9.

Proses input atau output Keputusan (decision)

10.

2.4.3. Desain Struktur Navigasi Struktur navigasi merupakan rancangan alur program. Dalam pengembangan aplikasi berbasis multimedia maupun pengembangan web menurut Lowery (2001, dalam Sutopo, 2003: 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 halaman-

halaman 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 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 model struktur navigasi

Hierarchical model dalam pembuatan aplikasi ini.

2.4.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 dimana transisi dibuat dari state satu ke state lainnya. STD berfungsi sebagai dasar bagi pemodelan tingkah laku (Pressman, 2002).

Notasi State Transition Diagram yang digunakan oleh penulis untuk membangun aplikasi adalah sebagai berikut: 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.9. Simbol State

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

Gambar 2.10. 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.11. Notasi State Transition Diagram (Sumber: Wisnu, 2002)

2.5.

Shalat Sebagaimana dimaklumi tak ada suatu perintah yang sangat dipentingkan dalam Islam, sebgaimana pentingnya perintah mendirikan shalat. Banyak ayat-ayat Al Qur-an dan hadits-hadits Nabi yang menunjukkan dan dibandingkan

menekankan tentang pentingnya

ibadat-ibadat

lainnya.

Perintah

ibadat shalat

mendirikan

tersebut

adakalanya dalam bentuk suruhan yang tegas, dan adakalanya dengan cara memuji

orang

yang

mengerjakannya

dan

mencela

orang

yang

meninggalkannya. Ditegaskan, bahwa shalat adalah tiang agama Islam, siapa yang mendirikannya berarti dia mendirikan tiang agama, dan siapa yang meninggalkannya berarti ia merobohkan agama (Pedoman Shalat, 1996). Shalat merupakan kewajiban bagi setiap muslim sehari semalam lima kali. Perintah shalat petama kali disampaikan kepada Nabi Muhammad SAW ketika beliau sedang isra' dan mi'raj langsung dari Allah SWT. Hal ini dijelaskan dalam hadits berikut :

Rasulullah SAW bersabda : “Allah SWT telah mewajibkan atas umatku pada malam isra' lima puluh kali shalat, maka aku selalu kembali menghadap-Nya dan memohon keringanan sehinggga dijadikan kewajiban shalat lima kali dalam sehari semalam." (HR Al-Bukhori dan Muslim) "Hai orang-orang yang beriman, rukuk'lah kamu, sujudlah kamu, sembahlah Tuhanmu dan perbuatlah kebajikan, supaya kamu mendapat kemenangan." (QS. Al-Hajj : 77) "Dan dirikanlah salat, tunaikanlah zakat dan rukuk'lah beserta orang-orang yang rukuk."(QS. Al-Baqarah : 43) Ibadah shalat merupakan ibadah yang pertama kali diperhitungkan dalam hisab, sebagaimana hadits Rasulullah berikut : "Amal yang pertama kali dihisab bagi seorang hamba pada hari kiamat adalah shalat. Jika shalatnya baik maka baiklah seluruh amalnya yang lain, dan jika shalatnya rusak maka rusaklah seluruh amalnya yang lain." (HR. At-Thabrani) Shalat juga merupakan sarana penghapus kesalahan dan dosa. Dalam sebuah hadits dinyatakan sebagai berikut : Dari Abi Hurairah ra, ia berkata : Rasulullah SAW bersabda : "Shalat lima waktu dan shalat jum'at yang satu kepada shalat jum'at yang lain adalah sebagai penghapus kesalahan yang terjadi pada waktu antara dua jum'at selama tidak melakukan dosa besar." Berdasarkan hasil wawancara, mengenai shalat ini penulis berujuk pada buku yang berjudul “Risalah Tuntunan Shalat Lengkap”, Drs. Moh Rifai., 2010 Penerbit PT. Karya Toha Putra, Semarang sebagai dasar pembuatan aplikasi.

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 Professional adalah program yang sangat handal dan paling maju dalam lingkungan authoring untuk membuat konten interaktif untuk digital, web, dan mobile platform (Adobe System Incorporated, 2010). 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). Menurut (Wahana, 2008) 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 telah dibuat atau ditambahkan. 4. Memberi efek khusus. 5. Menambahkan action script. 6. Menguji aplikasi. 7. Mempublikasikan hasil akhir aplikasi. Secara ringkas tahap-tahap pembuatan aplikasi dalam flash dapat digambarkan menurut bagan berikut:

Gambar 2.12. Proses desain aplikasi pada flash (Sumber: Wahana, 2008) Dalam hal ini penulis menerapkan aplikasi Flash lite untuk digunakan pada telepon seluler.

2.6.1. Area Kerja Lingkungan kerja adobe flash cs4 professional terdiri dari menu, jendela-jendela, dan beberapa panel. Susunan jendela, panel dan menu inilah yang merupakan lingkungan kerja atau lebih dikenal dengan sebutan area kerja.

Gambar 2.13. Area kerja Adobe Flash CS4 Professional (Sumber: Madcoms, 2009) 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

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.

Gambar 2.14. Bagian dari Timeline (Sumber: Hasil Pengolah Penulis, 2011)

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: 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 objek di dalamnya, ditandai dengan lingkaran pada frame. 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.6.2. Action Script pada Flash Action script adalah bahasa pemrograman flash yang digunakan untuk membuat animasi atau interaksi. Action script dapat digunakan untuk mengontrol navigasi dalam movie flash,

menganimasi objek, mengontrol movie clip, memanipulasi teks, dan yang lainnya (Fanani, 2007). Action script pada flash diterapkan pada frame (di dalam panel timeline), button (tombol) atau movie clip (di dalam stage) (Syarif, 2003). 1. Action script yang diterapkan pada frame akan dieksekusi pada saat playhead mencapai frame tersebut. 2. Action script yang diterapkan pada movie atau button (tombol) dieksekusi pada saat event terjadi. Event adalah suatu kejadian di dalam movie, misalnya pergerakan mouse, penekanan tombol, atau movie clip yang sedang di-load. Action script merupakan pemrograman visual berorientasi objek yang memiliki sintaks, tata bahasa dan struktur yang mirip dengan bahasa pemrograman C++ yang digunakan dengan tujuan: 1. Memberikan kebebasan berkreasi bagi desainer. 2. Membuat animasi interaktif. 3. Dapat menampilkan animasi tertentu (non-linier).

2.7.

Flash lite 2.7.1. Sejarah 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, 2007). 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). Pada Adobe Flash CS4 saat ini untuk action script pada Flash lite sudah mencapai versi 3.0. 2.7.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 konten multimedia dan aplikasi yang dikembangkan dengan menggunakan tool adobe flash yang sebelumnya hanya tersedia pada komputer (YongFei, 2010). Flash lite adalah sejenis penampil atau player yang dirancang untuk ponsel (handphone) atau peralatan sejenisnya (device) (Thabrani,2006). Flash lite dioptimalkan untuk perangkat dengan sumber daya terbatas, seperti layar yang kecil dan kekuatan pemrosesan yang terbatas (Forum Nokia, 2010).

Dalam pengembangan aplikasi Flash lite diperlukan tools seperti: 1. Adobe Flash Professional. 2. Adobe Device Central. 3. Action Script. Untuk

menjalankan

aplikasi

Flash

lite,

diperlukan

handphone atau device yang telah terinstal Flash lite player. Ilustrasi berikut ini menjelaskan tentang proses kerja desain aplikasi mobile dalam flash.

Gambar 2.15. Proses desain aplikasi ponsel (Sumber: Thabrani, 2006)

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.

Gambar 2.16. Aplikasi peta digital (Sumber: Siswoutomo, 2006)

Gambar 2.17. Aplikasi games GO SUSHI berbasis Flash lite (Sumber: Hamrowi, 2010)

2. Browser Konten Flash lite juga dapat dimasukkan dalam halaman web sehingga konten Flash lite ditampilkan pada situs mobile.

Gambar 2.18. Aplikasi client twitter berbasis Flash lite (Sumber: Faraday, 2009)

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.

Gambar 2.19. Screensaver Flash lite pada Nokia (Sumber: Rankine, 2009)

Wallpaper merupakan bagian dari screensaver. Wallpaper ditampilkan sebagai gambar latar belakang pada layar perangkat atau dalam sub-LCD. Perangkat yang mendukung screensaver otomatis mendukung wallpaper.

Gambar 2.20. Screensaver pada layar utama dan layar sub-LCD (Sumber: Rankine, 2009)

Gambar 2.21. Tampilan wallpaper Flash lite (Sumber: Forum Nokia, 2010) Perangkat (device) yang mendukung untuk jenis aplikasi tergantung pada platform perangkat dan kemampuan dari Flash lite player yang diinstal pada perangkat (Forum Nokia, 2010). Karena berupa aplkasi interaktif maka dalam hal ini penulis menggunakan jenis aplikasi Flash lite Standalone.

2.7.3. Pembahasan umum Action Script pada Flash lite Action script merupakan 'urat nadi' dari aplikasi yang dibangun dengan berbasis flash. peranan action script sulit diabaikan dalam membangun aplikasi berbasis flash, termasuk dalam membangun aplikasi mobile berbasis flash. Mobile device (handphone) mempunyai banyak keterbatasan, tidak seperti komputer, beban yang dapat ditanggung tidak sebanyak yang bisa ditanggung oleh komputer (Siswoutomo, 2007).

Action script dalam pembuatan aplikasi mobile berbasis Flash lite pada dasarnya tidak berbeda dengan action scipt dalam pembuatan aplikasi berbasis flash seperti web interaktif, companyprofile, maupun aplikasi lainnya. Dengan didukung Flash 4 Action Script, pengembang dapat memakai script-script seperti operator perhitungan, movie clip properties (_height,_x dan _y, fungsi kontrol timeline (gotoAndPlay() atau stop()), dan fungsi jaringan seperti loadvariables() dan loadMovie(), namun juga terdapat script yang tidak didukung oleh Flash lite seperti fungsi startdrag,

stopDrag()

dan _dropTarget (Adobe Systems

Incorporated, 2007). Karena berbasis mobile, action script pada Flash lite memiliki kemampuan seperti mengakses tombol-tombol navigasi handphone, mengirim SMS, dan mengaskes status baterai dan sinyal. Berikut ini contoh-contoh action script dalam Flash lite: 1. <Enter>, merupakan script untuk mengakses tombol select atau enter pada handphone. contoh

:

on(keyPress "<Enter>") { trace("Anda menekan tombol enter"); }

2. GetBatteryLevel : mengembalikan level baterai saat ini contoh: baterai = fscommand2("GetBattery Level"); 3. GetDeviceID

:

Mengatur

sebuah

parameter

yang

mempresentasikan identitas unik dari device seperti serial number.

Contoh: Status = fscommand2("GetDeviceID","deviceID);

4. GetNetworkName : Mengeset sebuah parameter dari nama jaringan saat ini. Contoh: netNameStatus = fscommand2 (”GetNetworkName”, myNetName);

2.8.

Adobe Device 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, 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).

2.8.1. Area Kerja Adobe Device Central CS4

Gambar 2.22. Tampilan Adobe Device Central CS4 (Sumber: Hasil Olahan Penulis, 2011)

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

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.

Gambar 2.23. Tampilan Device Profiles (Sumber: Adobe Creative Team, 2009)

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.

Gambar 2.24. Tampilan emulator dengan skin Nokia E5 (Sumber: Hasil Olahan Penulis, 2011)

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.

Gambar 2.25. Tampilan Simulasi Display dengan Reflection Indoor (Sumber: Hasil Olahan Penulis, 2011)

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.2. Cara Kerja Adobe Device Central Berikut ini adalah cara kerja dari adobe device central, meliputi: 1. Menyediakan informasi menyediakan perangkat (device) seperti hardware, software dan kemampuan media untuk menjalankan bitmap, video, web dan tipe Flash lite, dan memungkinkan untuk merancang secara tepat untuk setiap perangkat. 2. Membantu untuk mengatur efisiensi proyek pada perancangan untuk beberapa perangkat. 3. Memungkinkan untuk melihat hasil pekerjaan di dalam lingkungan emulator perangkat secara interaktif.

2.9.

Adobe Photoshop CS3 Photoshop adalah aplikasi atau software yang digunakan untuk memanipulasi foto, mengedit gambar, dan menciptakan sebuah karya grafis orisinal (SmithDev Community, 2009). Photoshop merupakan salah satu software pengolah grafis berbasis bitmap yang memiliki fitur yang sangat kompleks dibanding software

sejenisnya (Soeherman, 2007). Dengan fitur yang sangat kompleks, menjadikan photoshop sebagai standar program aplikasi pengolah foto dan penyunting gambar yang banyak digunakan oleh para desainer untuk keperluan media cetak, reklame, elektronik, stiker, iklan dan internet (Hakim, 2004).

Gambar 2.26. Tampilan aplikasi Adobe Photoshop CS3 (Sumber: SmithDev Community, 2009)

2.10. Audacity

Audacity merupakan sebuah aplikasi editor audio digital dan perekaman. Editor audio digital adalah sebuah aplikasi komputer untuk pengeditan audio, misalnya pemanipulasian audio digital. Audacity bersifat cross-platform dan tersedia untuk Mac OS X, Linux, dan Windows (Binanto, 2010).

Gambar 2.27. Tampilan aplikasi Audacity (Sumber: Hasil Olahan Penulis, 2011)

2.11. Literatur Sejenis Judul

: Aplikasi Panduan Informasi Shalat Berbasis Multimedia

Jenis Literatur : Skripsi Penulis

: Ahmad Zainal

Tahun

: 2009

No

Hal-hal yang

.

diperbandingkan

Penulis Sebelumnya

Penulis Sekarang

Menggunakan

1.

2.

3.

Tools

Penerapan Aplikasi

Informasi Shalat

Macromedia Director MX,

Menggunakan

Macromedia Flash MX,

Adobe Flash CS4,

Adobe Audition 1.5,

Audacity, Adobe Device

Ulead Video Studio,

Central CS4,

Adobe Photoshop 7.0

Adobe Photoshop CS3,

CD interaktif pada

Handphone dengan Flash

komputer

Lite v. 2.1

Gerakan dan Tata cara

Tata cara berwudhu,

pelaksanaan Shalat Wajib,

tayammum, pelaksanaan

Shalat Subuh, Shalat

shalat wajib, risalah shalat.

Dzuhur, Shalat Ashar, Shalat Maghrib, Shalat Isya.

4.

Hasil

User dapat berinteraktif

User dapat berinteraksi

menggunakan komputer.

menggunakan telepon selular.

Judul

: Learn How to Pray Salat (with pictures)

Jenis Literatur : Website

Penulis

: Alsunna

Tahun

: 2009

No

Hal-hal yang

.

diperbandingkan

Penulis Sebelumnya

Penulis Sekarang Menggunakan

1.

Tools

Menggunakan bahasa pemrograman html.

Adobe Flash CS4, Audacity Adobe Device Central CS4, Adobe Photoshop CS3,

2.

Penerapan Aplikasi

Aplikasi dibangun

Handphone dengan Flash

berbasis web

Lite v. 2.1

Gerakan dan tata cara 3.

Informasi Shalat

Berwudhu, Tayammum, dan Shalat Wajib User dapat berinteraksi

4.

Hasil

dengan teks dan gambar, melalui jaringan internet.

Tata cara berwudhu, tayammum, pelaksanaan shalat wajib, risalah shalat. User dapat berinteraksi dengan teks, gambar, animasi, dan audio menggunakan telepon selular.

Judul

: Let’s Learn Salah

Jenis Literatur : Website Penulis

: BD Islam

Tahun

: 2009

No

Hal-hal yang

.

diperbandingkan

Penulis Sebelumnya

Penulis Sekarang Menggunakan

1.

Tools

Menggunakan bahasa pemrograman php

Adobe Flash CS4, Audacity, Adobe Device Central CS4, Adobe Photoshop CS3,

2.

Penerapan Aplikasi

Aplikasi dibangun

Handphone dengan Flash

berbasis web

Lite v. 2.1

Gerakan dan tata cara 3.

Informasi Shalat

Berwudhu, Tayammum, dan Shalat Wajib User dapat berinteraksi

4.

Hasil

dengan teks, gambar, dan audio melalui jaringan internet.

Tata cara berwudhu, tayammum, pelaksanaan shalat wajib, risalah shalat. User dapat berinteraksi dengan teks, gambar, animasi, dan audio menggunakan telepon selular.

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

Gambar 2.28. Tahapan Pengembangan Multimedia (Sumber: Sutopo, 2003)

Tahapan pengembangan multimedia dapat dijabarkan secara rinci terlihat pada gambar 2.28.

Gambar 2.29. Rincian Tahapan Pengembangan Multimedia (Sumber: Sutopo, 2003)

2.12.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. 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.12.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.

Perancangan diagram tampilan (flowchart).

3.

Desain struktur navigasi.

4.

Perancangan

diagram

transisi

(state

transition

diagram). 5.

Perancangan antar muka (interface).

2.12.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.12.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.12.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. 2.12.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.

BAB III METODOLOGI PENELITIAN

Dalam rangka menyusun skripsi ini, diperlukan kelengkapan dan keabsahan data-data serta informasi yang dapat mendukung kebenaran materi uraian dan pembahasan. Oleh karena itu sebelum menyusun skripsi ini, dalam persiapannya terlebih dahulu dilakukan riset atau penelitian untuk menjaring data serta informasi atau bahan materi yang diperlukan. 3.1.

Metode Pengumpulan Data Dalam metodologi pengumpulan data yang digunakan oleh penulis dalam merancang mobile application informasi shalat ini adalah : 3.1.1. Studi Kepustakaan Metode pengumpulan kepustakaan atau studi literatur, dilakukan dengan cara membaca buku-buku yang berkaitan, mencari di perpustakaan dan melalui website-website yang berkaitan sehingga dapat dijadikan acuan dalam penulisan skripsi ini. Secara detail dapat dilihat pada daftar pustaka. 3.1.2. Wawancara Metode ini dilakukan dengan mewawancarai pihak yang bersangkutan, yaitu Ketua Majelis Bapak Achmad Zuki pada Mesjid Falatehan 16 Maret 2011 mengenai hal-hal yang berkaitan dan apa-apa yang dibutuhkan dan diharapkan oleh pengguna dalam

perancangan aplikasi mobile ini agar didapatkan data dan masukan yang mendukung. Hasil wawancara dapat dilihat pada lampiran. 3.1.3. Observasi Metode pengumpulan data ini dilakukan dengan pengamatan langsung pada objek yang ada pada badan atau instansi terkait untuk mendapatkan data-data yang diperlukan. Penulis melakukan observasi dengan datang langsung ke lokasi penelitian yakni Mesjid Falatehan yang beralamat di Jl. Palatehan No. 10 Kebayoran Baru guna melihat dari dekat kegiatan yang dilakukan serta mencatat dan mengambil data-data informasi yang dibutuhkan. 3.1.4. Kuisioner Penulis menyebarkan kuisioner kepada para pengguna (user) dengan responden sebanyak 20 orang. Kuisioner ini bertujuan untuk menentukan jenis handphone apa yang digunakan dan sebagai dasar dalam perancangan aplikasi informasi shalat. Kuisioner dapat dilihat pada lampiran.

3.2.

Metode Pengembangan Multimedia 3.2.1. Konsep (Concept) Pada tahap konsep ini yang penulis lakukan adalah: 3.

Menentukan tujuan aplikasi yaitu untuk memberikan informasi dengan bentuk mobile application yang memudahkan umat

Islam dan masyarakat luas dalam mendapatkan informasi mengenai panduan shalat. 4.

Deskripsi aplikasi yaitu dengan judul Mobile Application Infomasi Shalat, bentuk aplikasi mobile application, dengan user Majelis Mesjid Falatehan dan aplikasi ini dijalankan pada handphone yang mendukung aplikasi flash lite versi 2.1.

3.2.2. Perancangan (Design) Pada tahap ini penulis membuat spesifikasi aplikasi secara rinci dalam perancangan aplikasi. Spesifikasi yang akan dibuat disesuaikan berdasarkan pada: 1. Perancangan Storyboard Pada aplikasi terdapat storyboard , yaitu 1)

Storyboard intro,

2)

Storyboard menu utama,

3)

Storyboard menu panduan shalat,

4)

Storyboard panduan wudhu,

5)

Storyboard indeks,

6)

Storyboard bantuan,

7)

Storyboard tentang saya,

8)

Storyboard info aplikasi.

Secara detail dapat dilihat pada subbab 4.1.2.1. 2. Perancangan diagram tampilan (flowchart).

Pada aplikasi ini terdapat diagram tampilan (flowchart), yaitu. 1) Flowchart menu utama, 2) Flowchart panduan shalat, 3) Flowchart Risalah shalat, Secara detail dapat dilihat pada subbab 4.1.2.2 3. Desain Struktur Navigasi Pada aplikasi ini hanya terdapat 1 desain struktur navigasi hierarchical model, yaitu struktur navigasi menu utama. Secara detail dapat dilihat pada subbab 4.1.2.3. 4.

Perancangan diagram transisi (state transition diagram). Pada aplikasi ini terdapat state transition diagram (STD), yaitu 1) STD Menu Utama, 2) STD Panduan Shalat, 3) STD Risalah Shalat 4) STD Pilihan, Secara detail dapat dilihat pada subbab 4.1.2.4.

5,

Perancangan antar muka (interface). Pada aplikasi terdapat interface, yaitu 1) Interface intro, 2) Interface menu utama, 3) Interface keluar,

4) Interface panduan shalat, 5) Interface panduan wudhu, 6) Interface panduan tayammum, 7) Interface gerakan shalat, 8) Interface risalah shalat, 9) Interface index, 10) Interface bantuan, 11) Interface tentang saya, 12) Interface info aplikasi. Secara detail dapat dilihat pada subbab 4.1.2.5.

3.2.3. Pengumpulan Bahan Material (Material Collecting) Pada tahap ini dilakukan pengumpulan dan pembuatan bahan gambar, animasi, audio dan pengumpulan informasi shalat. Pada aplikasi terdapat 69 gambar yang berupa bitmap atau vektor yang dapat di lihat pada tabel 3.1. Tabel 3.1. Daftar Gambar IntroApp.jpg

BG_MenuUtama.jpg

Ico.png

Ico2.png

Bg2.png

Ico3.png

Iapp.png

Wd1.png

Bg4.png

Bg3.jpg

Wd2.png

Wd6png

Ts.png

Wd3.png

Wd7.png

Sh1.png

Wd4.png

Ms.png

Sh2.png

Wd5.png

Bg6.jpg

Sh3.png

Bg5.jpg

Bg7.jpg

Sh4.png

Sh5.png

Sh6.png

Sh7.png

Sh8.png

Sh9.png

Sh10.png

Sh11.png

Sh12.png

Bg8.jpg

ttgsy.jpg

logosoftware.jpg

keypadponsel

appin.jpg

Ico1

tombol

bgshl.jpg

bgwd.jpg

Bahan material yang diperlukan dalam multimedia penulis peroleh dari berbagai sumber, seperti internet, koleksi pribadi, dan hasil pembuatan penulis. Sedangkan bahan-bahan informasi shalat penulis peroleh dari hasil wawancara bersumber dari buku yang berjudul “Risalah Tuntunan Shalat Lengkap”, Drs. Moh Rifai., 2010 Penerbit PT. Karya Toha Putra, Semarang sebagai referensi isi penelitian penulis, internet dan lain-lain seperti yang secara lengkap dapat dilihat pada daftar pustaka. 3.2.4. Pembuatan (Assembly) Tahap pembuatan (assembly) merupakan tahap dimana 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. Pada tahap ini penulis menggunakan software seperti Adobe Flash CS4, Adobe Device Central CS4, Adobe Photoshop CS3, dan Audacity. Pada Adobe Flash CS4 penulis menggunakan fitur yang terdapat di dalamnya yaitu layer, action script, frame, keyframe, blank keyframe, playhead, stages, toolbox seperti teks, panel properties yang digunakan untuk mengatur framerate dan warna background aplikasi, mengatur bentuk, jenis dan warna teks dan penggunaan menu seperti save, open file, import, dan test movie. Pada Adobe Device Central CS4 penulis menggunakan fitur yang terdapat di dalamnya, yaitu device sets, emulator, file info, memori, display, local library, dan device profiles. Sedangkan pada Audacity penulis hanya menggunakan fitur kompres file mp3 dan pada Adobe Photoshop CS3 penulis menggunakan fitur yang terdapat di dalamnya yaitu layer, text tools dan effect layer. Spesifikasi minimum dalam pembuatan aplikasi ini adalah menggunakan software Adobe Flash CS3, Adobe Device Central CS3 Adobe Photoshop 7, dan Audacity. Perangkat handphone yang dapat digunakan untuk menjalankan aplikasi ini harus memiliki spesifikasi minimal seperti pada tabel 3.2. Tabel 3.2. Spesifikasi minumum handphone Spesifikasi Layar

Keterangan 320x240 pixel

OS Flash Lite Version Memori kosong Memori Internal

Symbian versi 60 Flash Lite 2.1 2 Megabyte 64 RAM

3.2.5. Pengujian (Testing) Pada tahap ini, pengujian dilakukan oleh dua pihak, yaitu penulis dan pihak pengguna yang dilakukan oleh Bapak Achmad Zuki selaku ketua majelis dan kepada masyarakat umum dengan menggunakan kuisioner. Pengujian dilakukan penulis sebanyak 2 tahap. Tahap pertama dilakukan pada lingkungan emulator, dan tahap kedua diterapkan pada perangkat (device) sebenarnya, yaitu media handphone. Cara pengujian pada lingkungan emulator menggunakan software Adobe Device Central CS4 yang dapat menampilkan skin handphone beserta spesifikasinya dengan cara membuka file hasil test movie dari Adobe Flash CS4 untuk melihat apakah aplikasi sudah berjalan dengan benar. Untuk pengujian pada handphone, penulis melakukan transfer file aplikasi dari komputer ke handphone. 3.2.6. Distribusi (Distribution) Tahapan dimana hasil aplikasi multimedia disebarluaskan. Tahap ini juga merupakan tahap dimana evaluasi dan implementasi aplikasi multimedia dilakukan. Distribusi dari aplikasi ini dilakukan melalui konektivitas dari perangkat yang ada.

BAB IV PERANCANGAN DAN PEMBUATAN APLIKASI

4.1.

Metode Pengembangan Multimedia 4.1.1. Konsep (Concept) Aplikasi mobile application informasi shalat ini berbentuk file berekstensi *.swf yang akan digunakan sebagai sarana penyampaian informasi. Deskripsi konsep aplikasi ini adalah sebagai berikut: Judul

:

Mobile Application Informasi Shalat Berbasis Multimedia.

User

:

Umat Muslim.

Bentuk Aplikasi

:

Mobile Application.

Gambar

:

Menggunakan file berformat JPEG dan PNG

Audio

:

Menggunakan file berformat MP3 dengan bitrate 8 kbps.

Animasi

:

Animasi gambar dan tombol dibuat oleh penulis. Menggunakan tombol navigasi yang

Interaktif

:

memungkinkan user menuju halaman yang diinginkan.

4.1.2. Perancangan (Design) Pada tahap ini penulis melakukan perancangan aplikasi berupa perancangan storyboard, perancangan flowchart, desain struktur navigasi berupa hirarki menu, rancangan diagram transisi atau STD (State Transition Diagram) dan perancangan antarmuka pengguna (user interface). 4.1.2.1. Perancangan Storyboard Storyboard merupakan deskripsi masing-masing tampilan suatu kejadian dari movie yang akan dimainkan. Dengan pencantuman semua objek atau elemen multimedia serta komponen-komponen aplikasi yang akan dibuat. Adapun rancangan storyboard untuk tampilan aplikasi diuraikan seperti di bawah ini. Storyboard Intro Modul Nama File Frame Gambar Animasi Audio Navigasi Enter

: Intro : iShalat :1 : Background 1 : Judul Aplikasi :: Menuju Menu Utama

Storyboard Menu Utama Modul : Menu Utama Nama File : iShalat Frame :2 Gambar : Background 2, tombol, icon Animasi : Icon Audio : Maher-insAllah.mp3 Navigasi Panduan Shalat : Menuju Menu Panduan Shalat Risalah Shalat : Menuju Menu Risalah Shalat Info Aplikasi : Menuju Info Aplikasi Pilihan : Menampilkan tampilan bantuan Ok : Memilih tombol yang diinginkan Keluar : Menampilkan tampilan keluar aplikasi Index : Menuju menu indeks Bantuan : Menuju menu bantuan Tentang Saya : Menuju layar tentang saya Ya : Keluar dari aplikasi Tidak : Kembali ke menu utama

Storyboard Menu Panduan Shalat Modul : Menu Panduan Shalat Nama File : iShalat Frame :4 Gambar : Background 2.jpg, tombol, icon Animasi : Icon Audio :Navigasi Panduan Wudhu : Menuju layar Cara Berwudhu Panduan Tayammum : Menuju layar Cara Tayammum Gerakan Shalat : Menuju layar Tata Cara Shalat Ok : Memilih tombol yang diinginkan Kembali : Kembali ke menu utama

Storyboard Cara Berwudhu Modul Nama File Frame Gambar Animasi Audio Navigasi Menu Utama Kembali 1 2 3 4 5 6 7

: Cara Berwudhu : iShalat :5 : Background 3, Gambar wudhu ::: Kembali ke menu utama : Kembali ke menu Panduan Shalat : Menampilkan tampilan wudhu langkah 1 : Menampilkan tampilan wudhu langkah 2 : Menampilkan tampilan wudhu langkah 3 : Menampilkan tampilan wudhu langkah 4 : Menampilkan tampilan wudhu langkah 5 : Menampilkan tampilan wudhu langkah 6 : Menampilkan tampilan wudhu langkah 7

Storyboard Gerakan Shalat Modul Nama File Frame Gambar Animasi Audio Navigasi Menu Utama Kembali 1 2 3 4

: Gerakan Shalat : iShalat :8 : Background 4, Gambar shalat : Gambar shalat : Takbir, tasbih, AlFatihah : Kembali ke menu utama : Kembali ke menu Panduan Shalat : Menampilkan tampilan shalat langkah 1 Niat : Menampilkan tampilan shalat langkah 2 Takbiratul ihram : Menampilkan tampilan shalat langkah 3 Al Fatihah dan surat pendek : Menampilkan tampilan shalat langkah 4 Rukuk

5 6 7 8 9 10 11 12

: Menampilkan tampilan shalat langkah 5 I’tidal : Menampilkan tampilan shalat langkah 6 Sujud : Menampilkan tampilan shalat langkah 7 Duduk antara dua sujud : Menampilkan tampilan shalat langkah 8 Sujud kedua : Menampilkan tampilan shalat langkah 9 Tahiyat awal : Menampilkan tampilan shalat langkah 10 Tahiyat akhir : Menampilkan tampilan shalat langkah 11 Salam ke kanan : Menampilkan tampilan shalat langkah 12 Salam ke kiri

Storyboard Info Aplikasi Modul Nama File Frame Gambar Animasi Audio Navigasi Kembali 1 2 3

: Info Aplikasi : iShalat :8 : Background 5 ::: Kembali ke menu utama : Menampilkan tampilan halaman 1 : Menampilkan tampilan halaman 2 : Menampilkan tampilan halaman 3

4.1.2.2.

Perancangan Flowchart

Gambar 4.1. Flowchart Menu Utama

Gambar 4.2. Flowchart Panduan Shalat

Gambar 4.3. Flowchart Risalah Shalat

C

Pilih menu

Index

Tampilkan index

Bantuan

Tampilkan bantuan

Tentang Saya

Tampilkan tentang saya

End

Gambar 4.4. Flowchart Pilihan

4.1.2.3.

Perancangan Struktur Navigasi

Gambar 4.5. Struktur Navigasi Menu Utama

4.1.2.4. Perancangan STD (State Transition Diagram) Panduan Shalat

Tekan “Risalah Shalat” Tampilkan Risalah Shalat Tekan “Panduan Shalat” Tampilkan Panduan Shalat

Tekan “Keluar” Menutup Aplikasi Keluar

Risalah Shalat

Tekan “Pilihan” Tampilkan Pilihan Menu Utama

Pilihan Tekan “Info Aplikasi” Tampilkan Info Aplikasi

Info Aplikasi

Gambar 4.6. STD Menu Utama

Gambar 4.7. STD Panduan Shalat

Gambar 4.8. STD Risalah Shalat

Gambar 4.9. STD Pilihan

4.1.2.5. Perancangan Antarmuka Pemakai (Interface) Perancangan antarmuka pemakai (interface) dibuat menggunakan konsep yang telah dibuat sebelumnya. User interface disesuaikan dengan kebutuhan agar dapat memudahkan pengguna untuk mendapatkan informasi yang dibutuhkan. Pada aplikasi ini terdapat beberapa menu yang memuat tampilan-tampilan informasi. Menu dan tampilan yang terdapat pada aplikasi ini, yaitu: 1. Tampilan Intro Tampilan ini digunakan sebagai tampilan awal yaitu tampilan pembuka dan tampilan animasi. Tampilan berisi judul aplikasi dan tombol enter. Tombol enter ini digunakan untuk memasuki tampilan menu utama aplikasi yang ditampilkan secara otomatis.

Gambar 4.10. Tampilan Intro 2. Tampilan Menu Utama

Merupakan tampilan utama dari aplikasi yang dibuat. Tampilan ini memuat beberapa unsur elemen penting dalam multimedia, yaitu animasi, teks, gambar, suara latar dan tombol-tombol navigasi. Tombol navigasi pada tampilan ini terdiri dari 3 tombol utama yang menuju halaman isi informasi atau materi dari aplikasi, 3 tombol pada opsi pilihan yang menuju informasi tambahan dari aplikasi seperti pilih indeks, bantuan dan tentang saya yang berisi profil pembuat serta tombol untuk keluar aplikasi.

Gambar 4.11. Tampilan Menu Utama

Gambar 4.12. Tampilan Menu Utama dengan Pilihan 3. Tampilan Keluar Tampilan ini digunakan sebagai tampilan keluar aplikasi. Setelah user memilih keluar dari aplikasi terdapat pilihan jika ya maka keluar dari aplikasi kila tidak maka akan kembali ke menu utama.

Gambar 4.13. Tampilan Keluar Aplikasi

4. Tampilan Menu Panduan Shalat

Tampilan ini digunakan untuk menampilkan panduan shalat yang terdiri dari 3 tombol navigasi yang menuju halaman materi panduan shalat dan tombol navigasi untuk memilih menu dan tombol navigasi untuk kembali ke halaman menu utama.

Gambar 4.14. Tampilan Menu Panduan Shalat 5. Tampilan Panduan Wudhu Tampilan ini digunakan untuk menampilkan panduan berwudhu, dimana terdapat navigasi untuk melihat tahapan-tahapan dalam berwudhu dan juga terdapat navigasi untuk kembali ke halaman semula atau kembali menu utama..

Gambar 4.15. Gambar Berwudhu Tahap 1 mencuci tangan

Gambar 4.16. Gambar Berwudhu Tahap 2 berkumur dan mencuci hidung

Gambar 4.17. Gambar Berwudhu Tahap 3 mencuci muka

Gambar 4.18. Gambar Berwudhu Tahap 4 mencuci tangan hingga siku

Gambar 4.19. Gambar Berwudhu Tahap 5 mencuci rambut dan kepala

Gambar 4.20. Gambar Berwudhu Tahap 6 mencuci telinga

Gambar 4.21. Gambar Berwudhu Tahap terakhir mencuci kaki 6. Tampilan Menu Tayammum Tampilan terdiri dari tombol navigasi yang menampilkan setiap tahapan dalam melakukan tayammum dan tombol navigasi untuk kembali ke halaman sebelumnya atau ke menu utama.

Gambar 4.22. Gambar Bertayammum langkah 1 berniat

Gambar 4.23. Gambar Bertayammum langkah 2 membasuh muka

Gambar 4.24. Gambar Bertayammum langkah 3 membasuh muka kedua kalinya

Gambar 4.25. Gambar Bertayammum langkah 4 kedua belah tangan hingga siku dua kali

7. Tampilan Menu Gerakan Shalat Tampilan terdiri dari tombol navigasi yang menampilkan setiap tahapan dalam mengerjakan shalat dan tombol navigasi untuk kembali ke halaman sebelumnya atau ke menu utama.

Gambar 4.26. Tampilan Gerakan Shalat Niat

Gambar 4.27. Tampilan Gerakan Shalat Takbiratul ihram

Gambar 4.28. Tampilan Gerakan Shalat Membaca Alfatihah dan surat pendek

Gambar 4.29. Tampilan Gerakan Shalat Rukuk

Gambar 4.30. Tampilan Gerakan Shalat I’tidal

Gambar 4.31. Tampilan Gerakan Shalat Sujud

Gambar 4. 32. Tampilan Gerakan Shalat Duduk antara dua sujud

Gambar 4.33. Tampilan posisi kaki Gerakan Shalat Duduk antara dua sujud

Gambar 4.34. Tampilan Gerakan Shalat Sujud kedua

Gambar 4.35. Tampilan posisi kaki Gerakan Shalat Tahiyat awal

Gambar 4.36. Tampilan telunjuk bergerak Gerakan Shalat Tahiyat awal

Gambar 4.37. Tampilan posisi kaki Gerakan Shalat Tahiyat akhir

Gambar 4.38. Tampilan telunjuk bergerak Gerakan shalat Tahiyat akhir

Gambar 4.39. Tampilan Gerakan Shalat Salam ke kanan

Gambar 4.40. Tampilan Gerakan Shalat Salam ke kiri 8. Tampilan Menu Pilihan Tentang Saya Tampilan ini digunakan untuk menampilkan data penulis. Terdapat tombol untuk kembali ke menu utama.

Gambar 4.41. Tampilan Tentang Saya 9. Tampilan Info Aplikasi Tampilan ini digunakan untuk menampilkan info mengenai aplikasi. Terdapat 3 halaman navigasi dan tombol untuk kembali ke menu utama.

Gambar 4.42. Tampilan Info Aplikasi

4.1.3. Pengumpulan Bahan Material (Material Collecting) Pengumpulan material atau bahan-bahan untuk memenuhi kebutuhan aplikasi berupa file teks, gambar animasi, audio dan kontrol navigasi diperoleh dengan cara mengambil dari berbagai sumber dan dibuat sendiri oleh penulis. 4.1.3.1. Teks File teks atau isi materi shalat penulis peroleh dari buku yang penulis gunakan yaitu “Risalah Tuntunan Shalat Lengkap”, Drs. Moh Rifai, 2010, Penerbit PT. Karya Toha Putra, Semarang. 4.1.3.2. Gambar Tampilan background dasar atau gambar latar aplikasi ini penulis buat menggunakan aplikasi utama Adobe Photoshop CS3 dan aplikasi pendukung Adobe Flash CS4, file gambar diperoleh penulis dari internet,

koleksi pribadi dan dibuat sendiri oleh penulis. Gambargambar tersebut lalu diolah menggunakan Adobe Photoshop CS3 untuk menambahkan efek-efek seperti bayangan pada gambar. 4.1.3.3. Animasi Animasi pada aplikasi ini dibuat dari gambar berbasis bitmap dengan format PNG dan gambar berbasis vector yang penulis animasikan menggunakan Adobe Flash CS4.

Gambar 4.43. Hasil Pengolahan Animasi dengan Flash 4.1.3.4. Audio Musik latar dan suara pada aplikasi ini didapatkan dari internet dan koleksi pribadi penulis, berformat MP3. File audio tersebut penulis olah menggunakan Audacity dengan melakukan penurunan bitrate dan pemotongan pada bagian tertentu. 4.1.3.5. Kontrol Navigasi Kontrol navigasi berupa tombol (button) yang mengandung link yang menghubungkan dari satu halaman ke halaman lainnya. Tombol yang terdapat pada

aplikasi didapat dari internet dan penulis buat sendiri menggunakan Adobe Photoshop dan Adobe Flash. Animasi tombol dibuat menggunakan Adobe Flash.

4.1.4. Pembuatan (Assembly) Pada tahap ini semua bahan-bahan yang telah terkumpul seperti elemen-elemen multimedia diintegrasikan menggunakan Adobe Flash CS4. Pada Adobe Flash CS4 ini dilakukan pengkodingan dengan bahasa pemrograman flash yaitu actionscript 2.0 dengan acuan pemrograman flash lite versi 2.1 hingga menghasilkan file berformat SWF Movie (.swf) atau file yang dapat dijalankan menggunakan flash lite player. Dalam pembuatan aplikasi ini penulis menggunakan spesifikasi ukuran layer 320x240 pixel dengan tampilan fullscreen dengan quality di set high, dan framerate 15 fps. Dalam pembuatan aplikasi mobile application informasi shalat ini menggunakan komputer dengan spesifikasi perangkat keras (hardware) dan spesifikasi perangkat lunak (software) seperti pada tabel 4.1. Tabel 4.1. Spesifikasi hardware dan software yang digunakan Spesifikasi

Keterangan

OS

Windows XP SP2

Software

1. Adobe Flash CS4

2. Adobe Device Central CS4 3. Adobe Photoshop CS3 4. Audacity Processor

DualCore 2.00 GHz

VGA

256 MB

Memori RAM

2 GB

Harddisk

250 GB

Monitor

15 “ dengan resolusi 1280x800 pixel

Media konektivitas

Kabel data mini USB Bluetooth device

Perangkat lainnya

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

Setelah spesifikasi hardware dan software dipenuhi, tahap selanjutnya adalah tahap pembuatan dengan menggunakan perangkat lunak yang telah disiapkan, berikut tahapan penting dalam pembuatan aplikasi. Proses pertama yang penulis lakukan adalah membuat gambar latar aplikasi dan gambar lainnya seperti logo-logo, icon menggunakan aplikasi pengolah gambar Adobe Photoshop CS3

. Gambar 4.44. Pembuatan gambar latar aplikasi dengan Adobe Photoshop CS3 Setelah gambar latar dan gambar lainnya yang dibutuhkan selesai, penulis menggunakan Adobe Flash CS4 untuk membuat aplikasi mobile, terkait navigasi, dan perancangan user interface atau tampilan aplikasi. Demikian pula dengan animasi yang dibuat penulis dalam pembuatan aplikasi. Animasi digunakan pada tampilan intro menggunakan teknik motion tween pada judul. Gambar berikut adalah pembuatan tampilan menu utama. Menu utama.

Gambar 4.45. Pembuatan Menu Utama Gambar latar dan gambar lainnya dirancang, teks keterangan untuk tombol-tombol dibuat untuk melengkapi tampilan menu utama. Script pada menu utama digunakan pada frame untuk menampilkan jam, tanggal dan waktu. Script juga digunakan pada tombol untuk masuk ke content aplikasi, membuka menu opsi dan keluar aplikasi. Proses selanjutnya, penulis memasukkan suara latar dengan format mp3, Penulis menggunakan perangkat lunak Audacity untuk pengeditan file audio sehingga mendapatkan mp3 dengan bitrate 16 KBps dengan tujuan mendapatkan file ukuran kecil.

4.1.5. Pengujian (Testing) 4.1.5.1.

Pengujian pada Emulator Pada tahap ini penulis melakukan pengujian (testing) aplikasi setelah aplikasi multimedia dibuat. Pengetesan ini

bertujuan untuk memastikan hasil aplikasi sesuai dengan yang direncanakan dan berjalan dengan baik. Sebelum melakukan pengujian pada perangkat ponsel, penulis terlebih dahulu melakukan pengujian pada emulator Adobe Device Central CS4.

Gambar 4.46. Pengujian aplikasi pada emulator Adobe Device Central CS4

4.1.5.2.

Pengujian pada Ponsel Penulis melakukan pengujian pada perangkat ponsel untuk melihat hasil aplikasi apakah berjalan baik seperti pada emulator. Dalam pengujian aplikasi, penulis menggunakan ponsel Nokia E5 yang dapat dilihat pada gambar 4.43. Ponsel ini telah memenuhi kebutuhan spesifikasi minimal untuk menjalankan aplikasi.

Gambar 4.47. Ponsel Nokia E5. (Sumber: Peters, 2010) Tabel 4.2. merupakan spesifikasi ponsel yang digunakan dalam pengujian aplikasi mobile application informasi shalat ini.

Tabel 4.2. Spesifikasi ponsel Nokia E5 yang digunakan Spesifikasi

Keterangan

Layar

TFT 2,36 ", 320x240 pixel 256K warna

Network

GPRS, EDGE, HSDPA, WLAN

OS

Symbian OS v9.3, Series 60 rel. 3.2

CPU

ARM 11 600 MHz processor, browser WAP 2.0/xHTML, HTML

Konektivitas

Bluetooth, Infrared, Mini USB

Flash Lite Version

Flash Lite 3.0

Memori Eksternal

microSD, up to 32GB

Memori Internal

250 MB; 256MB RAM

Untuk pengujian menggunakan perangkat ponsel, penulis melakukan tahapan, yaitu. 1) Aplikasi yang telah diuji pada tahapan emulator akan menghasilkan sebuah file berformat *.SWF, file inilah yang akan di transfer ke dalam handphone.

Gambar 4.48. File aplikasi 2) File aplikasi ditransfer dari komputer ke dalam ponsel dengan memanfaatkan fitur konektivitas yang tersedia pada perangkat ponsel di antaranya: Bluetooth, miniUSB dan card reader. Dalam hal ini penulis menggunakan Bluetooth.

Gambar 4.49. Perangkat Bluetooth pada laptop 3) Pengguna (user) dapat membuka aplikasi pada folder inbox tanpa harus melalui proses instalasi terlebih dahulu. Pada gambar 4.50. menunjukan tampilan pada ponsel setelah aplikasi dijalankan.

Gambar 4.50. Pengujian aplikasi pada perangkat ponsel Nokia E5

Hasil dari pengujian pada perangkat ponsel memperlihatkan bahwa aplikasi ini dapat berjalan dengan baik dan sesuai dengan pengujian pada emulator Adobe Device Central CS4 yang dilakukan sebelumnya.

4.1.6. Distribusi (Distribution) Aplikasi yang telah melalui tahap pengetesan pada emulator maupun perangkat ponsel selanjutnya dapat didistribusikan secara langsung antar perangkat ponsel dengan ponsel ataupun dikemas dalam bentuk CD (Compact Disk), untuk didistribusikan melalui perangkat komputer. 4.1.6.1. Spesifikasi Hardware dan Software Aplikasi mobile application informasi shalat ini akan berjalan dengan baik dengan spesifikasi perangkat keras (hardware) dan perangkat lunak (software) yang penulis sarankan, yaitu: Spesifikasi yang disarankan untuk perangkat ponsel dapat dilihat pada tabel 4.3. Tabel 4.3. Spesifikasi handphone yang disarankan Spesifikasi

Keterangan

Layar

320x240 pixel

OS

Symbian versi 9.2 S60 3rd Edition

Flash Lite Version

Flash Lite 3.0

Memori kosong

1.2 Megabyte

Memori internal

128 RAM

4.1.6.2. Cara Menggunakan Program Cara menggunakan aplikasi mobile application informasi shalat ini tidak memerlukan proses instalasi, dengan mentransfer aplikasi dari komputer ke perangkat ponsel dengan media konektivitas yang tersedia, maka aplikasi akan langsung dapat digunakan. User dapat langsung membuka file yang telah ditransfer untuk memulai menggunakan aplikasi, pertama-tama user diminta untuk menekan tombol keypad tengah (enter) pada layer intro info, maka aplikasi akan masuk ke menu utama secara otomatis. Pada halaman ini user dapat memilih menu yang tersedia dengan memilih tomboltombol menu yang ada.

BAB V KESIMPULAN DAN SARAN

5.1.

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

Pembuatan mobile application informasi shalat menghasilkan aplikasi mobile yang menyajikan informasi shalat seperti panduan shalat (tata cara berwudhu, tayammum, gerakan dan bacaan shalat, rukun dan sunah shalat).

2.

Pengguna lebih mudah untuk mendapatkan tuntunan shalat dengan lebih praktis.

3.

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

5.2.

Saran Aplikasi mobile application informasi shalat ini masih belum sempurna, oleh sebab itu penulis mencoba memberikan saran bagi pihak yang ingin mengembangkan aplikasi ini, yaitu. 1.

Mobile application informasi shalat dapat terkoneksi dengan internet agar data dapat menjadi up to date.

2.

Penambahan materi informasi tambahan seperti mengenai shalat sunah, Al Qur’an, puasa, zakat, haji dan informasi ke Islaman lainnya.

3.

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

4.

Dapat dikonversikan dan berjalan pada multi platform (berbagai sistem operasi mobile), baik itu Symbian, Android, Windows Mobile, iOs, dan lain sebagainya.

5.

Aplikasi mobile application informasi shalat tidak hanya dapat berjalan pada handphone dengan keypad atau tombol tetapi dapat juga dijalankan pada handphone touch screen atau layar sentuh.

DAFTAR PUSTAKA

Adobe System Incorporated. 2007. Adobe Flash CS3 Professional Create and Deliver Rich, Interactive Content. http://wwwimages.adobe.com/www.adobe.com /products/flash/pdfs/flash_datasheet.pdf. 11 Juni 2011, 11.11 WIB.

Adobe

System

Incorporated.

2007.

LEARNING

FLASHLITE

1.x

ACTIONSCRIPT. http://livedocs.adobe.com/flash/9.0/main/flashlite1_as_learning. pdf. 12 Juni 2011, 15.00 WIB.

Adobe

System

Incorporated.

2008.

About

Adobe

Device

Central.

http://help.adobe.com/en_US/DeviceCentral/2.0_UsingDeviceCentral/WS3E3B31 C4-CD66-4bad-B6E8-56F88AED8511a.html. 16 Juni 2011, 08.56 WIB.

Adobe

System

Incorporated.

2008.

Introducing

Device

Central.

http://www.adobe.com /devnet/devices/ articles/introducing_device_central.html. 14 Juni 2011, 10.15 WIB.

Agung, G. 2009. Beginner's Guide Adobe Photoshop CS3. Jakarta: PT Elex Media Komputindo.

Alsunna, 2009. Learn How to Pray Salat with Pictures. http://alsunna.org/LearnHow-to-Pray-Salat-with-Pictures.html 20 Juni 2011, 19.15 WIB Arius, D. 2009. Keamanan Multimedia. Yogyakarta: Penerbit Andi.

Baba. 2003. Animasi Kartun dengan Flash MX. Jakarta: PT Elex Media Komputindo.

Binanto, I. 2010. Multimedia Digital - Dasar Teori + Pengembangannya. Yogyakarta: Penerbit Andi

Bunadi, S. 2007. Membuat Animasi Kartu Ucapan dengan Flash 8. Jakarta: PT Elex Media Komputido.

Elrom, E. 2009. AdvancED Flash on Devices: Mobile Development with Flash Lite and Flash 10. United States of America: Friendsof.

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

Faraday. 2009. Twittle: A Flash Lite Twitter Client. http://flashedmobile.blogspot. com/2009/04/twittle-flash-lite-twitter-client.html. 10 Juni, 2011 13:49.

Forum Nokia, 2010. Flash Lite Developer's Library 1.6. http://library.forum. nokia.com/index.jsp?topic=/Flash_Lite_Developers_Library/GUID-A53E10222EC2-44D3-A04D-E6735C9637C3.html. 09 Juni 2011, 09.11 WIB.

Global Web Site. 2009. Introduction to Flash Lite E-learning. http://www.forum. nokia.com/info/sw.nokia.com/id/184088f1-358d-4b5b-ba4d-b1262ae32f9f/ Introduction_to_Flash_Lite_E-learning.html#). 14 Juni 2011, 07.15 WIB.

Hamrowi, M. 2007. GO SUSHI. http://m-edukasi.net/conten-mobile.php? kode=MAT102010. 24 Juni 2011, 12:57 WIB.

Harto, D. B. 2008. Pertimbangan Estetika Dalam Perancangan Multimedia Interaktif (MPI). http://www.scribd.com/doc/57243858/15-Dwi-Budi-Harto, 01 Juni 2011, 23:12 WIB.

ICFoundation. 2009. Learn how to make wudu http://www.icfoundation.com/wudu_learn.html. 26 Juni 2011 23:00

Khoiruddin, A. 2009. Panduan Praktis Memilih & Membeli BlackBerry. Yogyakarta: Gradien Mediatama.

Kusrianto, A. 2006. Panduan Lengkap Memakai Macromedia Flash Professional 8. Jakarta: PT Elex Media Komputido.

Madcoms. 2009. Mahir dalam 7 Hari: Adobe Flash CS4. Madiun: Madcoms Madiun.

UIN, FST. 2010. Pedoman Penulisan Skripsi Jilid Dua (Revisi). Jakarta: UIN Press.

Peters, M. 2010. Nokia E5 Review. http://www.letsgodigital.org/en/25988/nokiae5-review/. 13 Juni 2011 13:49.

Pressman, R. S. 2002. Rekayasa Perangkat Lunak Pendekatan Praktisi. Yogyakarta: Andi.

Pustaka, R.K. 2008. Pintar 256 Software Komputer. Jakarta: Kawan Pustaka

Rankine, D. 2009. What Can I Make with Flash Lite. http://vimeo.com/6727455. 11 Juni 2011, 13:25 WIB.

Rifai, M. 2010. Risalah Tuntunan Shalat Lengkap. Semarang: PT. Karya Toha Putra

Rudi, R. 2009. Game Ponsel Paling Populer. Yogyakarta: MediaKom.

Seadie, A. 1996. Penuntun Shalat Lengkap. Jakarta:Rica Grafika

Shidiqqiey, T. M. H. A. 1996. Pedoman Shalat. Yogyakarta: PT. Bulan Bintang

Soeherman, B. 2007. Membuat Karikatur dengan Photoshop. Jakarta: PT Elex Media Komputindo.

Siswoutomo, W. 2007. Membangun Aplikasi Ponsel Menggunakan Flash 8. Jakarta: PT. Elex Media Komputindo

SmithDev Community. 2009. 36 Menit Belajar Komputer Adobe Photoshop CS4. Jakarta: PT Elex Media Komputindo.

Sugiarto, A. 2007. Fotografi Ponsel Murah, Mudah, Indah. Jakarta: PT Gramedia Pustaka Utama.

Suryana, N. 2008. Arsitektur Mobile Application dengan Platform Propietary. http://informatika.lipi.go.id/publikasi/arsitektur-mobile-application-denganplatform-propietary.html, 08 Juni 2011, 14:45 WIB.

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

Suyanto, M. 2003. Multimedia Alat untuk Meningkatkan Keunggulan Bersaing. Yogyakarta: Andi.

Syarif, A.M. 2003. Bedah Action Script : Menguasi Penulisan Skrip Macromedia Flash MX. Jakarta: PT. Elex Media Komputindo.

Thalmann, N & Thalmann, D. 1991. Computer Animation. Michigan: SpringerVerlag.

Thabrani, S. 2006. Buku Latihan Membuat Aplikasi untuk Ponsel dan Web dengan Flash Professional 8. Jakarta: PT Elex Media Komputido.

Tuhusetya, S. 2010. Ragam Bahasa Media dalam Perspektif Pembelajaran http://www.cintabahasa.co.cc/2009/04/ragam-bahasa-media-dalam-

Bahasa.

perspektif_24.html, 20 Juni 2011, 14:47 WIB. Vaughn, T. 2004. Multimedia: Make It Work. Berkeley CA: McGraw-Hill

Wahana Komputer. 2008. Seri Profesional: Teknik Pembuatan Animasi dengan Adobe Flash CS3. Jakarta: Salemba Infotek

Wilson, P. 2005. Getting Started With Flash Lite. http://www.communitymx.com/download.cfm?cid=95A1E. 07 Maret 2011, 16:27 WIB.

Wisnu. 2002. Topik 3 : Analisis. http://images.lie2phoet.multiply.multiplycontent. com/attachment/0/S1atNwooCkUAABDhZ6c1/bab_3_analisis.pdf?key=lie2phoet :journal:45&nmid=311680078. 08 Juni 2011, 22.10 WIB.

Yoga. 2005. CorelDraw untuk Bisnis. Jakarta: PT Elex Media Komputido.

YongFei,

L.

2010.

Video: Flash

Lite

and

Flash

10.1’s

http://www.adobe-flashlite.com/?p=1624. 07 Juni 2011, 17:21 WIB. .

Difference.

Lampiran I - Surat-surat Penelitian

Lampiran I - Surat-surat Penelitian

Lampiran II - Hasil Wawancara

Hasil Wawancara dengan Bapak Achmad Zuki Ketua Majelis Masjid Falatehan berikut pertanyaan yang diajukan beserta jawabannya: 1. Apakah terdapat informasi mengenai tata cara pelaksanaan shalat yang disediakan oleh Mejelis Masjid Falatehan untuk pembelajaran umat?

2. Apakah media penyampaian yang disediakan oleh Masjid Falatehan ini sudah dikatakan efektif dan efisien?

3. Bersumber dari apa media informasi shalat yang disampaikan ke umat?

4. Apakah ada media yang menggunakan teknologi informasi seperti komputer, internet, dan lain sebagainya?

5. Apakah Masjid Falatehan memiliki aplikasi mobile untuk menyampaikan informasi mengenai shalat?

6. Apakah Bapak setuju jika dibuatkan sebuah aplikasi mobile informasi shalat?

Jakarta, 16 Maret 2011 Ketua Majelis Masjid Falatehan

H. Achmad Zuki, SE. QA

Lampiran III - Kuisioner Nama : Jenis Kelamin : 1. Tipe jenis/merk handphone yang anda gunakan dan juga tipe modelnya jika tahu? a. Nokia ( ) .............. b. Blackberry ( ) ........... c. CDMA ( ) ............ d. Android ( ) ............ e. iPhone ( ) ............ 2. Apakah anda mengetahui fitur flash lite pada handphone? a. Ya ( ) b. Tidak ( ) 3. Menurut anda apakah tuntunan tata cara pelaksanaan shalat melalui media buku lebih efektif jika dibandingkan dengan media lain? a. Ya ( ) b. Tidak ( ) 4. Setujukah anda jika dibuatkan aplikasi mobile mengenai informasi tuntunan tata cara pelaksanaan shalat ? a. Ya ( ) b. Tidak ( ) 5. Jika berupa aplikasi mobile apakah anda akan tertarik untuk menggunakannya? a. Ya ( ) b. Tidak ( ) Hasil Kuisioner 1. Tipe jenis/merk handphone yang anda gunakan dan juga tipe modelnya jika tahu? Jawaban Nokia Blackberry CDMA Android iPhone Jumlah

Tipe E72 (2) E5 (4) E63 (2) Bold (2) Gemini (1) Esia Samsung LG -

Jumlah 9 3 6 2 0 20

Presentase (%) 45 % 15 % 30 % 10 % 0% 100%

2. Apakah anda mengetahui fitur flash lite pada handphone? Jawaban Ya Tidak Jumlah

Jumlah 7 13 20

Presentase (%) 35 % 65 % 100%

3. Menurut anda apakah tuntunan tata cara pelaksanaan shalat melalui media buku lebih efektif jika dibandingkan dengan media lain? Jawaban Ya Tidak Jumlah

Jumlah 15 5 20

Presentase (%) 75 % 25 % 100%

4. Setujukah anda jika dibuatkan aplikasi mobile mengenai informasi tuntunan tata cara pelaksanaan shalat ? Jawaban Ya Tidak Jumlah

Jumlah 18 2 20

5. Jika berupa aplikasi menggunakannya ? Jawaban Ya Tidak Jumlah

Presentase (%) 90 % 10 % 100%

mobile

Jumlah 19 1 20

apakah

anda

akan

tertarik

untuk

Presentase (%) 95 % 5% 100%

Dengan menggunakan kuisioner ini maka penulis menyimpulkan untuk menggunakan Handphone Nokia Tipe E5

Lampiran IV - Source Code Source Code Menu Utama fscommand2("SetSoftKeys", "menu", "quit"); exit._x = 500; stop(); pressed = false; option._x = 500; Key.removeListener(menuListener); var menuListener:Object = new Object(); menuListener.onKeyDown = function(){ var keyCode2 = Key.getCode(); if (keyCode2 == ExtendedKey.SOFT2) { if (exit._x == 500) { exit._x = 0; } } if (keyCode2 == ExtendedKey.SOFT1) { if (exit._x == 500) { if(!pressed) { pressed = true; if (option._x == 500) { option._x = 0; } } else { pressed = false; option._x = 500; } } } } Key.addListener(menuListener); \\Pada Key Cather Menu Utama on (keyPress "") { if (exit._x == 500)

{ if (option._x == 0) { if (pressed && option.pilih._y != 7.5) { option.pilih._y -= 15; } else { option.pilih._y = 37.5; } } } } on (keyPress "") { if (exit._x == 500) { if (option._x == 0) { if (pressed && option.pilih._y != 37.5) { option.pilih._y += 15; } else { option.pilih._y = 7.5; } } } } on (keyPress "") { if (exit._x == 500) { option._x = 500; if (menu.pilih2._x == -53) { menu.pilih2._x = 0; textMenuUtama = "Panduan Shalat"; menu_mc.gotoAndPlay("icon_1"); } else if (menu.pilih2._x != 0) { menu.pilih2._x -= 53;

if (menu.pilih2._x == 0) { textMenuUtama = "Panduan Shalat"; menu_mc.gotoAndPlay("icon_1"); } if (menu.pilih2._x == 53) { textMenuUtama = "Risalah Shalat"; menu_mc.gotoAndPlay("icon_2"); } if (menu.pilih2._x == 106) { textMenuUtama = "Info Aplikasi"; menu_mc.gotoAndPlay("icon_3"); } } else { menu.pilih2._x = 106; textMenuUtama = "Info Aplikasi"; menu_mc.gotoAndPlay("icon_3"); } } else if (exit._x == 0) { exit.exitpil._x = 98.9; } } on (keyPress "") { if (exit._x == 500) { option._x= 500; if (menu.pilih2._x == -53) { menu.pilih2._x = 0; textMenuUtama = "Panduan Shalat"; menu_mc.gotoAndPlay("icon_1"); } else if (menu.pilih2._x != 106) { menu.pilih2._x += 53; if (menu.pilih2._x == 53) { textMenuUtama = "Risalah Shalat"; menu_mc.gotoAndPlay("icon_2");

} if (menu.pilih2._x == 106) { textMenuUtama = "Info Aplikasi"; menu_mc.gotoAndPlay("icon_3"); } } else { menu.pilih2._x = 0; textMenuUtama = "Panduan Shalat"; menu_mc.gotoAndPlay("icon_1"); } } else if (exit._x == 0) { exit.exitpil._x = 176.3; } } on (keyPress "<Enter>") { if (exit._x == 0) { if (exit.exitpil._x == 176.3) { exit._x = 500; } else if (exit.exitpil._x == 98.9) { fscommand2("quit"); } } else if (option._x == 0 and option.pilih._y == 37.5) { gotoAndPlay(3); } else if (option._x == 0 and option.pilih._y == 15) { gotoAndPlay(3); } else if (option._x == 0 and option.pilih._y == 7.5) { gotoAndPlay(3); } else if (menu.pilih2._x == 0) {

gotoAndPlay(4); } else if (menu.pilih2._x == 53) { gotoAndPlay(6); } else if (menu.pilih2._x == 106) { gotoAndPlay(9); } } Source Code Pada Menu Panduan Shalat fscommand2("SetSoftKeys", "", "kembali"); stop(); Key.removeListener(menuListener); var menuListener:Object = new Object(); menuListener.onKeyDown = function(){ var keyCode2 = Key.getCode(); if (keyCode2 == ExtendedKey.SOFT2) { gotoAndPlay(2); } } Key.addListener(menuListener); //Pada Key Catcher Menu Panduan Shalat on (keyPress "") { if (menu1.pil_m1._x == -55) { menu1.pil_m1._x = 0; textMenu1 = "Panduan Wudhu"; menu1_mc.gotoAndPlay("ic1"); } else if (menu1.pil_m1._x != 0) { menu1.pil_m1._x -= 55; if (menu1.pil_m1._x == 0) { textMenu1 = "Panduan Wudhu"; menu1_mc.gotoAndPlay("ic1"); } if (menu1.pil_m1._x == 55) {

textMenu1 = "Tayammum"; menu1_mc.gotoAndPlay("ic2"); } if (menu1.pil_m1._x == 110) { textMenu1 = "Gerakan Shalat"; menu1_mc.gotoAndPlay("ic3"); } } else { menu1.pil_m1._x = 110; textMenu1 = "Gerakan Shalat"; menu1_mc.gotoAndPlay("ic3"); } } on (keyPress "") { if (menu1.pil_m1._x == -55) { menu1.pil_m1._x = 0; textMenu1 = "Panduan Wudhu"; menu1_mc.gotoAndPlay("ic1"); } else if (menu1.pil_m1._x != 110) { menu1.pil_m1._x += 55; if (menu1.pil_m1._x == 55) { textMenu1 = "Tayammum"; menu1_mc.gotoAndPlay("ic2"); } if (menu1.pil_m1._x == 110) { textMenu1 = "Gerakan Shalat"; menu1_mc.gotoAndPlay("ic3"); } } else { menu1.pil_m1._x = 0; textMenu1 = "Panduan Wudhu"; menu1_mc.gotoAndPlay("ic1"); } }

on (keyPress "<Enter>") { if (menu1.pil_m1._x == 0) { gotoAndPlay(5); } else if (menu1.pil_m1._x == 55) { gotoAndPlay(7); } else if (menu1.pil_m1._x == 110) { gotoAndPlay(8); } } Source Code pada Menu Risalah Shalat fscommand2("SetSoftKeys", "kembali"); stop(); Key.removeListener(menuListener); var menuListener:Object = new Object(); menuListener.onKeyDown = function(){ var keyCode2 = Key.getCode(); if (keyCode2 == ExtendedKey.SOFT2) { gotoAndPlay(2); } } Key.addListener(menuListener); // Pada Key Catcher Menu Risalah Shalat on (keyPress "") { //baris atas if (menurs.navrs._y == 0 and menurs.navrs._x == 0) { menurs.navrs._x = 100; } else if (menurs.navrs._y == 0 and menurs.navrs._x == 50) { menurs.navrs._x = 0; } else if (menurs.navrs._y == 0 and menurs.navrs._x == 100) { menurs.navrs._x = 50;

} //baris bawah if (menurs.navrs._y == 70 and menurs.navrs._x == 0) { menurs.navrs._x = 100; } else if (menurs.navrs._y == 70 and menurs.navrs._x == 50) { menurs.navrs._x = 0; } else if (menurs.navrs._y == 70 and menurs.navrs._x == 100) { menurs.navrs._x = 50; } } on (keyPress "") { //baris atas if (menurs.navrs._y == 0 and menurs.navrs._x == 0) { menurs.navrs._x = 50; } else if (menurs.navrs._y == 0 and menurs.navrs._x == 50) { menurs.navrs._x = 100; } else if (menurs.navrs._y == 0 and menurs.navrs._x == 100) { menurs.navrs._x = 0; } //baris bawah if (menurs.navrs._y == 70 and menurs.navrs._x == 0) { menurs.navrs._x = 50; } else if (menurs.navrs._y == 70 and menurs.navrs._x == 50) { menurs.navrs._x = 100; } else if (menurs.navrs._y == 70 and menurs.navrs._x == 100) { menurs.navrs._x = 0; } }

on (keyPress "") { menurs.navrs._y = 70; } on (keyPress "") { menurs.navrs._y = 0; } on (keyPress "<Enter>") { if (menurs.navrs._y == 0 and menurs.navrs._x == 0) { gotoAndPlay(10); } else if (menurs.navrs._y == 0 and menurs.navrs._x == 50) { gotoAndPlay(11); } else if (menurs.navrs._y == 0 and menurs.navrs._x == 100) { gotoAndPlay(12); } if (menurs.navrs._y == 70 and menurs.navrs._x == 0) { gotoAndPlay(13); } else if (menurs.navrs._y == 70 and menurs.navrs._x == 50) { gotoAndPlay(14); } else if (menurs.navrs._y == 70 and menurs.navrs._x == 100) { gotoAndPlay(15); } }