View
224
Download
0
Category
Preview:
Citation preview
SKRIPSI
Rancang Bangun Aplikasi Pembelajaran Haji dan Umrah
Berbasis Multimedia pada Smartphone Bersistem Operasi
Android
Oleh :
Ahmad Fadhilah Albani
1110091000017
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH
JAKARTA
2015
i
RANCANG BANGUN APLIKASI PEMBELAJARAN HAJI DAN
UMRAH BERBASIS MULTIMEDIA PADA SMARTPHONE
BERSISTEM OPERASI ANDROID
Skripsi
Sebagai Salah Satu Syarat untuk Memperoleh Gelar
Sarjana Komputer (S.Kom)
Fakultas Sains dan Teknologi
Universitas Islam Negeri Syarif Hidayatullah Jakarta
Oleh :
AHMAD FADHILAH ALBANI
1110091000017
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH
JAKARTA
2015 M/1436 H
ii
iii
iv
HALAMAN PERNYATAAN
Dengan ini sayamenyatakan bahwa :
1. Skripsi/tesis/disertasi ini merupakan hasil karya asli saya yang diajukan
untuk memenuhi salah satu persyaratan memperoleh gelar strata 1 di UIN
Syarif Hidayatullah Jakarta.
2. Semua sumber yang saya gunakan dalam penulisan ini telah saya
cantumkan sesuai dengan ketentuan yang berlaku di UIN Syarif
Hidayatullah Jakarta.
3. Jika di kemudian hari terbukti bahwa karya ini bukan hasil karya asli saya
atau merupakan hasil jiplakan dari karya orang lain, maka saya bersedia
menerima sanksi yang berlaku di UIN Syarif Hidayatullah Jakarta.
Jakarta, Juni 2015
Ahmad Fadhilah Albani
1110091000017
v
AHMAD FADHILAH ALBANI – 1110091000017, RANCANG BANGUN
APLIKASI PEMBELAJARAN HAJI DAN UMRAH BERBASIS
MULTIMEDIA PADA SMARTPHONE BERSISTEM OPERASI ANDROID
, dibimbing oleh Arini, M.T. dan Andrew Fiade, M.Kom
ABSTRAK
Ibadah haji adalah ibadah yang wajib dilaksanakan bagi kaum muslimin yang mampu
dan wajib hanya dilakukan satu kali selama masa hidup. Dalam melaksanakan ibadah
haji yang satu kali seumur hidup itu, tentunya kaum muslimin ingin melaksanakan
ibadah itu dengan sempurna agar diterima amalannya oleh Allah SWT. Agar dapat
sempurna, tentunya diperlukan persiapan dan pengetahuan yang matang untuk
melaksanakan ibadah haji tersebut. Dalam perkembangan teknologi saat ini,
perkembangan dan penyebaran informasi berkembang dengan pesat. Salah satu
perkembangan yang mempengaruhi hal tersebut adalah perkembangan teknologi
smartphone. Smartphone yang saat ini paling berkembang pesat adalah smartphone
bersistem operasi android. Untuk itulah, dibangun sebuah aplikasi pembelajaran
ibadah haji yang dapat dilaksanakan pada perangkat smartphone bersistem operasi
android agar para kaum muslimin dapat belajar dan mengetahui hal-hal yang tentang
ibadah haji dengan lebih mudah dan cepat. Metode pengembangan sistem ini
menggunakan Rapid Application Development (RAD) dengan tiga fase yaitu,
perencanaan kebutuhan, fase workshop design, dan fase implementasi dengan
perancangan proses UML (Unified Model Language) dan dikembangkan dengan
menggunakan Android SDK, bahasa pemograman java, HTML untuk menampilkan
konten-konten aplikasi, SQLite sebagai database dan Google Maps untuk
menampilkan peta. Dengan aplikasi ini, para kaum muslimin yang ingin melaksanakan
haji dapat mempelajari dan mendapatkan informasi mengenai ibadah haji maupun
umrah dengan lebih cepat dan mudah.
Kata Kunci : Android, Smartphone, Rapid Application Development, UML, Google
Maps, Haji, Umrah, Java, Android SDK
vi
KATA PENGANTAR
Syukur tiada henti penulis panjatkan kepada Allah SWT yang telah
memberikan nikmat, rahmat dan hidayah-Nya kepada penulis sehingga penulis
dapat menyelesaikan penulisan skripsi dengan judul “Perancangan Aplikasi
Pembelajaran Haji dan Umrah Berbasis Multimedia pada Smartphone Bersistem
Operasi Android”. Skripsi ini penulis ajukan sebagai syarat kelulusan dalam
menempuh pendidikan Strata-1 (S1) di Universitas Islam Negeri Syarif
Hidayatullah Jakarta.
Penulis menyadari, penelitian dan penulisan skripsi ini tidak akan berjalan
baik dan lancar tanpa bantuan dari segenap pihak, baik secara langsung maupun
tidak langsung. Oleh karena itu, penulis ucapkan terima kasih kepada :
1. Prof. DR. Dede Rosyada, MA selaku Rektor UIN Syarif Hidayatullah
Jakarta.
2. Dr. Agus Salim, M.Si selaku Dekan Fakultas Sains dan Teknologi UIN
Syarif Hidayatullah Jakarta.
3. Arini, M.T. selaku Ketua Prodi Teknik Informatika, Fakultas Sains dan
Teknologi UIN Syarif Hidayatullah Jakarta serta pembimbing I penulisan
skripsi.
4. Feri Fahrianto, M.Sc. selaku Sekretaris Prodi Teknik Informatika, Fakultas
Sains dan Teknologi UIN Syarif Hidayatullah Jakarta.
5. Andrew Fiade, M.Kom.,selaku pembimbing II penulisan skripsi.
6. Seluruh Dosen Program Studi Teknik Informatika yang tidak mungkin
penulis sebutkan satu persatu.
7. Keluarga, Ayah, Ibu, dan kakak yang senantiasa memberikan doa,
inspirasi dan semangat.
8. Sholahuddin Alisyahbana, Abdullah M.A, Chulman Chirzi dan Zikrillah
yang memberikan dukungan dan bantuan selama pembuatan skripsi, serta
9. Seluruh teman-teman Teknik Informatika angkatan 2010.
Penulis menyadari bahwa penelitian dalam skripsi ini masih jauh dari
sempurna, oleh karena itu penulis sangat mengharapkan saran dan kritik yang
bersifat membangun demi kesempurnaan skripsi ini. Akhir kata, penulis
vii
berharap skripsi ini dapat berguna dan bermanfaat bagi semua pihak yang
terkait.
Jakarta, Juni 2015
Ahmad Fadhilah Albani
1110091000017
viii
DAFTAR ISI
PENGESAHAN UJIAN ........................................................................................ iii
HALAMAN PERNYATAAN ............................................................................... iv
ABSTRAK .............................................................................................................. v
KATA PENGANTAR ........................................................................................... vi
DAFTAR ISI ........................................................................................................ viii
DAFTAR GAMBAR ............................................................................................. xi
DAFTAR TABEL ................................................................................................ xiv
BAB I ...................................................................................................................... 1
PENDAHULUAN .................................................................................................. 1
1.1 Latar Belakang ......................................................................................... 1
1.2 Perumusan Masalah .................................................................................. 5
1.3 Batasan Masalah ....................................................................................... 5
1.4 Tujuan ....................................................................................................... 6
1.5 Manfaat ..................................................................................................... 6
1.5.1 Manfaat bagi Mahasiswa................................................................... 6
1.5.2 Manfaat bagi User ............................................................................. 6
1.5.3 Manfaat bagi Universitas .................................................................. 7
1.6 Metode Penelitian ..................................................................................... 7
1.7 Sistematika Penelitian .............................................................................. 7
BAB II ..................................................................................................................... 9
LANDASAN TEORI .............................................................................................. 9
2.1 Multimedia ............................................................................................... 9
2.1.2. Elemen Multimedia ........................................................................... 9
2.2 E-Learning .............................................................................................. 12
2.3. Android ................................................................................................... 13
2.3.1 Versi – Versi Android ..................................................................... 13
2.3.2 Fitur dan Arsitektur Android ........................................................... 14
2.4. Android Studio ...................................................................................... 16
2.5. Java ......................................................................................................... 17
2.6. Android Software Development Kit (SDK) ........................................... 17
2.7. HTML (Hyper Text Markup Language) ................................................ 17
ix
2.8. JSOUP .................................................................................................... 18
2.9. SQLiteDatabase ...................................................................................... 19
2.10. Haji dan Umrah ................................................................................... 19
2.10.1. Pengertian Haji ................................................................................ 19
2.10.2. Rukun Haji ...................................................................................... 20
2.10.3. Wajib Haji ....................................................................................... 20
2.10.4. Syarat Haji ....................................................................................... 20
2.10.5. Pengertian Umrah............................................................................ 21
2.10.6. Rukun Umrah .................................................................................. 21
2.10.7. Wajib Umrah ................................................................................... 21
2.10.8. Syarat Umrah .................................................................................. 21
2.10.9. Macam-Macam Haji........................................................................ 22
2.11. Literatur Sejenis .................................................................................. 23
2.12. Metode Pengembangan Penelitian RAD ............................................ 27
2.12.1. Definisi RAD .................................................................................. 27
2.12.2. Tahapan-tahapan RAD .................................................................... 28
2.13. Pengujian Black-Box .......................................................................... 29
2.14. Pengujian White-Box .......................................................................... 30
2.14.1. Pengujian Basis Path ....................................................................... 30
2.15. Unified Modeling Language. (UML) ................................................. 32
2.16. Diagram Class ..................................................................................... 33
2.17. Use Case Diagram .............................................................................. 34
2.18. Activity Diagram ................................................................................ 35
2.19. Sequence Diagram .............................................................................. 37
BAB III ................................................................................................................. 39
METODE PENELITIAN ...................................................................................... 39
3.1. Metode Pengumpulan Data .................................................................... 39
3.1.1. Studi Pustaka ................................................................................... 39
3.1.2. Studi Lapangan................................................................................ 39
3.2. Metodologi Pengembangan Sistem ........................................................ 40
3.2.1. Fase perencanaan syarat-syarat ....................................................... 40
3.2.2. Tahap Desain (Desain Workshop) .................................................. 40
3.2.3. Fase Implementasi/Pelaksanaan ...................................................... 44
3.3. Alur/Kerangka Berfikir .......................................................................... 44
x
BAB IV ................................................................................................................. 46
PERANCANGAN DAN IMPLEMENTASI ........................................................ 46
4.1. Tahap Perencanaan Syarat-Syarat .......................................................... 46
4.1.1. Mencari informasi tentang haji dan umrah ..................................... 46
4.1.2. Mengidentifikasi tujuan –tujuan aplikasi ........................................ 46
4.1.3. Menentukan fitur-Fitur yang akan ada pada aplikasi ...................... 46
4.1.4. Kebutuhan Hardware dan Software ................................................ 50
4.2. Tahap Perancangan (Design Workshop) ................................................ 51
4.2.1. Tahap Perancangan Proses .............................................................. 51
4.2.2. Tahap Perancangan Interface .......................................................... 88
4.2.3. Tahap Perancangan Database .......................................................... 92
4.2.4. Membangun Sistem (Pengkodean) ................................................. 95
4.3. Fase Pelaksanaan/Implementasi ........................................................... 110
4.3.1. Implementasi pada Perangkat Keras dan Perangkat Lunak .......... 110
4.3.2. Implementasi antar muka .............................................................. 112
4.3.3. Instalasi Aplikasi pada Perangkat Android ................................... 115
4.3.4. Pengujian Aplikasi ........................................................................ 116
BAB V ................................................................................................................. 132
PENUTUP ........................................................................................................... 132
5.1. Kesimpulan ........................................................................................... 132
5.2. Saran ..................................................................................................... 132
DAFTAR PUSTAKA ......................................................................................... 133
LAMPIRAN ........................................................................................................ 135
Kuisioner Penelitian ........................................................................................ 135
Hasil Kuisioner ................................................................................................ 136
Source Code .................................................................................................... 141
xi
DAFTAR GAMBAR
Gambar 1. 1 Grafik Perkembangan Sistem Operasi di Indonesia 2008-2014 ......... 3
Gambar 2. 1 serif dan sans serif (Vaughan, 2011) ................................................. 10
Gambar 2.2 Arsitektur Sistem Operasi Android ( Hermawan S, Stephanus, 2011.)
............................................................................................................................... 15
Gambar 3. 1 Alur Pemikiran Penelitian ................................................................. 45
Gambar 4. 1 Perancangan Sistem dari Aplikasi ..................................................... 51
Gambar 4. 2 Kegiatan Aktor dalam Use Case ....................................................... 56
Gambar 4.3 Activity Diagram Pengenalan Haji dan Umrah................................. 68
Gambar 4. 4 Activity Diagram Pengenalan Haji ................................................... 69
Gambar 4. 5 Activity Diagram Detail Pengenalan Haji ......................................... 70
Gambar 4. 6. Activity Diagram Pengenalan Umrah .............................................. 71
Gambar 4. 7 Activity Diagram Detail Pengenalan Umrah .................................... 72
Gambar 4. 8 Activity Diagram Hikmah Haji dan Umrah ...................................... 73
Gambar 4. 9 Activity Diagram Detail Hikmah Haji dan Umrah ........................... 74
Gambar 4.10 Activity Diagram Persiapan Haji .................................................... 74
Gambar 4.11 Activity Diagram Detail Persiapan Haji.......................................... 75
Gambar 4.12 Activity Diagram Pelaksanaan Haji ................................................ 75
Gambar 4. 13 Activity Diagram Detail Pelaksanaan Haji ..................................... 76
Gambar 4. 14 Activity Diagram Amalan Haji ....................................................... 76
Gambar 4. 15. Activity Diagram Detail Amalan Haji ........................................... 77
Gambar 4. 16 Activity Diagram Doa Haji ............................................................. 77
Gambar 4. 17 Activity Diagram Detail Doa-Doa Haji .......................................... 78
Gambar 4. 18 Activity Diagram Berita Haji .......................................................... 79
Gambar 4. 19 Activity Diagram Detail Berita Haji. .............................................. 80
Gambar 4. 20. Activity Diagram Detail Pengumuman Haji .................................. 81
Gambar 4. 21 Activity Diagram Peta Lokasi ......................................................... 82
Gambar 4. 22 Activity Diagram Detail Peta Lokasi .............................................. 82
Gambar 4. 23. Activity Diagram Video Haji ......................................................... 83
xii
Gambar 4. 24 Activity Diagram Istilah Haji .......................................................... 83
Gambar 4. 25 Activity Detail Istilah Haji .............................................................. 84
Gambar 4. 26 Activity Cek Keberangkatan Haji ................................................... 85
Gambar 4. 27 Sequence Diagram Pengenalan Haji dan Umrah, Persiapan haji,
Pelaksanaan Haji, Amalan Haji, dan Istilah Haji ................................................. 86
Gambar 4. 28 Sequence Diagram Detail Doa Haji ................................................ 86
Gambar 4. 29 Sequence Diagram Video Haji ........................................................ 87
Gambar 4. 30 Sequence Diagram Berita Haji dan Pengumuman Haji .................. 87
Gambar 4. 31 Sequence Diagram Cek Keberangkatan .......................................... 88
Gambar 4. 32. Rancangan Tampilan Menu Utama ................................................ 89
Gambar 4. 33 Rancangan Tampilan Bahasan Haji ................................................ 89
Gambar 4. 34. Rancangan Tampilan Doa Haji ...................................................... 90
Gambar 4. 35. Rancangan Tampilan Video Haji ................................................... 90
Gambar 4. 36 Rancangan Tampilan List Berita Haji ............................................. 91
Gambar 4. 37 Rancangan Tampilan Berita Haji .................................................... 91
Gambar 4. 38 Rancangan Tampilan Cek Keberangkatan ...................................... 92
Gambar 4. 39 contoh file HTML yang digunakan oleh aplikasi............................ 96
Gambar 4. 40 isi tabel konten pada database dilihat dengan SQLiteBrowser ....... 96
Gambar 4. 41. Isi Tabel doa pada Database dilihat dengan SQLiteBrowser ......... 98
Gambar 4. 42 Tampilan Situs Berita Haji tanggal 1 Mei 2015 ............................ 100
Gambar 4. 43 Elemen-elemen pada situs
http://haji.kemenag.go.id/v2/publikasi/berita/ .................................................... 101
Gambar 4. 44 tampilan situs berita haji (Sumber :
http://www.haji.kemenag.go.id/v2/content/masyarakat-dapat-pantau-pelunasan-
haji-reguler). ........................................................................................................ 103
Gambar 4. 45 elemen-elemen pada situs berita haji (Sumber :
http://haji.kemenag.go.id/v2/content/masyarakat-dapat-pantau-pelunasan-haji-
reguler) ................................................................................................................ 104
Gambar 4. 46 Tampilan Situs Pengumuman Haji tanggal 1 Mei 2015 ........... 105
Gambar 4. 47 elemen-elemen pada situs berita haji ............................................ 105
Gambar 4. 48 Tampilan Situs Pengumuman Haji tanggal 1 Mei 2015 (Sumber :
http://www.haji.kemenag.go.id/v2/content/pelunasan-jemaah-haji-reguler-tahun-
1436h2015m) ...................................................................................................... 107
xiii
Gambar 4. 49 Elemen – Elemen ada situs Pengumuman Haji tanggal 1 Mei 2015
(Sumber : http://www.haji.kemenag.go.id/v2/content/pelunasan-jemaah-haji-
reguler-tahun-1436h2015m) ............................................................................... 107
Gambar 4. 50 Tampilan Situs Cek Keberangkatan Haji tanggal 1 Mei 2015
(Sumber :http://haji.kemenag.go.id/v2/basisdata/xml/2300098444) .................. 109
Gambar 4. 51 Tampilan Menu Utama.................................................................. 112
Gambar 4. 52 Tampilan Bahasan Haji ................................................................. 112
Gambar 4. 53 Tampilan Doa Haji ........................................................................ 113
Gambar 4. 54 Tampilan Video Haji ..................................................................... 113
Gambar 4. 55 Tampilan List Berita Haji .............................................................. 114
Gambar 4. 56 Tampilan Berita Haji ..................................................................... 114
Gambar 4. 57 Tampilan Cek Keberangkatan Haji ............................................... 115
Gambar 4.58 Flowgraph Berita Haji ................................................................... 117
Gambar 4.59 Flowgraph Cek Keberangkatan Haji ............................................. 120
Gambar 4. 60 Tampilan aplikasi pada android v.4.1. .......................................... 131
Gambar 4. 61 Tampilan aplikasi pada android v.5.1 ........................................... 131
xiv
DAFTAR TABEL
Tabel 1.1 Penelitian Aplikasi yang Serupa di Penelitian Terdahulu ....................... 3
Tabel 2.1 Versi-Versi Android yang telah Rilis.................................................... 14
Tabel 2.2 Perbandingan Aplikasi I ........................................................................ 24
Tabel 2.3 Perbandingan Aplikasi II ...................................................................... 25
Tabel 2.4 Perbandingan Aplikasi III ..................................................................... 26
Tabel 2.5 Simbol pada Diagram Kelas ................................................................. 33
Tabel 2.6 Simbol pada Diagram Use Case ........................................................... 34
Tabel 2.7 Simbol pada Diagram Aktifitas ............................................................ 36
Tabel 2.8 Simbol pada Diagram Sekuen ............................................................... 37
Tabel 3.1 Use Case yang digunakan dalam Penelitian ......................................... 41
Tabel 3.2 Activity Diagram yang digunakan dalam Penelitian ............................ 42
Tabel 4.1 Aktor pada Use Case ............................................................................. 52
Tabel 4.2 Diagram Use Case ................................................................................. 52
Tabel 4.3 Use Case Scenario Pengenalan Haji dan Umrah .................................. 57
Tabel 4.4 Use Case Scenario Pengenalan Haji ..................................................... 57
Tabel 4.5 Use Case Scenario Detail Pengenalan Haji .......................................... 58
Tabel 4.6 Use Case Scenario Pengenalan Umrah ................................................. 58
Tabel 4.7 Use Case Scenario Detail Pengenalan Umrah ...................................... 59
Tabel 4.8 Use Case Scenario Hikmah Haji dan Umrah........................................ 59
Tabel 4.9 Use Case Scenario Detail Hikmah Haji dan Umrah ............................. 60
Tabel 4.10 Use Case Scenario Persiapan Haji ...................................................... 60
Tabel 4.11 Use Case Scenario Detail Persiapan Haji ........................................... 61
Tabel 4.12 Use Case Scenario Pelaksanaan Haji.................................................. 61
Tabel 4.13 Use Case Scenario Detail Pelaksanaan Haji ....................................... 62
Tabel 4.14 Use Case Scenario Do‟a Haji dan Umrah .......................................... 62
Tabel 4.15 Use Case Scenario Detail Do‟a Haji dan Umrah ................................ 62
Tabel 4.16 Use Case Scenario Berita Haji............................................................ 63
Tabel 4.17 Use Case Scenario Detail Berita Haji ................................................. 63
Tabel 4.18 Use Case Scenario Detail Pengumuman Haji..................................... 64
Tabel 4.19 Use Case Scenario Peta Lokasi .......................................................... 64
Tabel 4.20 Use Case Scenario Detail Peta Lokasi ................................................ 65
xv
Tabel 4.21 Use Case Scenario Video Haji............................................................ 65
Tabel 4.22 Use Case Scenario Amalan Haji ......................................................... 66
Tabel 4.23 Use Case Scenario Detail Amalan Haji .............................................. 66
Tabel 4.24 Use Case Scenario Istilah Haji ........................................................... 67
Tabel 4.25 Use Case Scenario Detail Istilah Haji................................................. 67
Tabel 4.26 Use Case Scenario Cek Keberangkatan Haji ...................................... 67
Tabel 4.27 Waktu Mulai Video Haji ..................................................................... 98
Tabel 4.28 Tabel Pengujian Test Case pada Berita Haji ..................................... 116
Tabel 4.29 Tabel Pengujian Test Case pada Cek Keberangkatan Haji ............... 119
Tabel 4.30 Hasil Pengujian Aplikasi dengan Metode Black-box ........................ 121
1
BAB I
PENDAHULUAN
1.1 Latar Belakang
Haji merupakan rukun Islam yang kelima yang wajib dilaksanakan oleh
seorang muslim telah yang mampu melaksanakannya. Haji juga merupakan salah
satu ibadah dalam agama Islam yang wajib hanya dilakukan sekali dalam seumur
hidupnya, selebihnya akan dinilai sebagai tathawwu’ (ibadah tambahan), Sesuai
yang disabdakan oleh Nabi SAW yang diriwayatkan oleh Muslim :
“Dari Abu Hurairah ra. bahwa : Rasulullah saw. berkhutbah kepada kita
lalu bersabda: Wahai sekalian manusia, sesungguhnya Allah telah mewajibkan
haji kepada kalian, Karena itu, berhajilah. Seorang laki-laki bertanya: Apakah
setiap tahun, ya Rasulullah? Beliau saw. diam, hingga orang itu menanyakannya
sampai tiga kali. Lalu Rasulullah saw. bersabda: Apabila aku mengatakan: Ya,
maka akan menjadi wajib, dan kalian tidak akan mampu. Selanjutnya Beliau saw.
bersabda: Jangan kalian tanyakan apa yang aku diamkan. Sesungguhnya, orang-
orang sebelum kalian binasa karena banyaknya pertanyaan mereka, dan
perselisihan mereka dengan Nabi mereka. Karena itu, apa yang aku perintahkan,
kerjakanlah semampu kalian, dan jika aku melarang kalian dari sesuatu,
tinggalkan (HR Muslim).”
Haji yang sempurna adalah haji yang dilaksanakan dengan niat ikhlas
hanya karena Allah, manasik atau rukun haji dikerjakan dengan benar. Dalam haji
ada rukun-rukun dan syarat yang harus dilakukan oleh orang yang sedang
melaksanakan ibadah haji. Rukun haji merupakan kegiatan yang wajib dilakukan
pada saat melaksanakan haji. Apabila seorang muslim yang melaksanakan haji
melanggar atau tidak melakukan salah satu dari rukun haji maka ibadah hajinya
akan dianggap tidak sah dan batal dimata Allah SWT.
Seorang muslim tentunya ingin ibadah haji yang dilakukan sekali dalam
seumur hidupnya sempurna dan diterima oleh Allah SWT. Untuk mencapai
2
kesempurnaan dalam melaksanakan ibadah hajinya maka diperlukan panduan dan
pembelajaran dalam ibadah haji ini agar calon haji dapat mempersiapkan dan
membekali dirinya dengan informasi-informasi yang berkaitan dengan haji.
Menurut survei yang dilakukan oleh penulis kepada 50 orang muslimin
berusia 25-50 tahun yang memiliki dan menggunakan smartphone android,
sebanyak 60% responden yang disurvei oleh penulis masih belum memahami
pengetahuan tentang haji. 58% mengatakan hal tersebut disebabkan terbatasnya
waktu dan 28% disebabkan oleh kurang jelasnya penjelasan yang ada pada buku
panduan yang diberikan.
Dari masalah tersebut, penulis ingin membuat para kaum muslimin dapat
dengan mudah menerima dan mempelajari informasi tentang haji. Dengan
bantuan teknologi, multimedia dan media elektronik saat ini, hal tersebut dapat
dilakukan. Menurut Malik dan Agarwal (2012), multimedia memiliki potensi
untuk membentuk pendidikan dengan berbagai macam model pembelajaran untuk
target pengguna dengan berbagai tingkatan umur. Dan menurut Jackson, Media
elektronik membuat konten-konten multimedia seperti game, digital audio,
digital video, animasi dan gambar dapat dinikmati semuanya hanya dengan
sebuah perangkat elektronik (Jackson, 2011). Contoh perangkat elektronik yang
sedang sangat berkembang saat ini adalah smartphone. Smartphone adalah salah
satu media elektronik yang dapat menggunakan media-media tersebut dan praktis
karena dapat digunakan hanya dengan genggaman tangan dan mempunyai
mobilitas yang tinggi.
Dari uraian diatas, penulis ingin merancang aplikasi multimedia pada
perangkat smartphone bersistem operasi android tentang informasi-informasi dan
tata cara terkait ibadah haji yang baik dan benar yang diharapkan dapat
memudahkan, menambah ilmu pengetahuan dan membantu para muslimin dalam
pelaksanaan ibadah hajinya.
Smartphone bersistem operasi android dipilih oleh penulis karena menurut
data statistik StatsCounter, sistem operasi android merupakan sistem operasi yang
saat ini paling berkembang di Indonesia dan banyak digunakan oleh para warga
Indonesia.
3
Gambar 1.01 Grafik Perkembangan Sistem Operasi di Indonesia 2008-2014
(Sumber: http://gstatscounter.com)
Pada saat ini sudah ada penelitian dan aplikasi yang serupa dengan apa
yang ingin dirancang penulis, diantaranya adalah
Tabel 1.1. Tabel Penelitian Aplikasi yang Serupa di Penelitian Terdahulu
No Nama Aplikasi Sumber Kelebihan dan Kekurangan
Aplikasi
1 Aplikasi Simulator
Manasik Haji Berbasis
Mobile
Yayan
Supriatna,
2012
+ Terdapat fitur video
- Isi Konten : Video simulasi
haji, Pedoman-pedoman haji,
persiapan sebelum haji.
2 Analisis dan
Perancangan Aplikasi
Manasik Haji
Menggunakan
Teknologi J2ME
Robimadipa
Yanriko, 2012
- Hanya untuk Handphone
berbasis J2ME
- Konten hanya berupa Teks
- Isi Konten : Pencarian istilah-
istilah haji, informasi Haji,
informasi tentang Umrah,
Doa-Doa Haji, Jadwal Ibadah
Haji, Tips Ibadah Haji
3 Perancangan dan Abdur - Hanya untuk Handphone
4
Implementasi Mobile
Aplication
Pembelajaran Haji dan
Umrah Berbasis
Multimedia
Rahman, 2013 berbasis Symbian
- konten berupa teks dan audio
- Isi Konten : Pengertian, Dasar
Hukum Sejarah Haji dan Umrah,
Pelaksanaan Haji dan Umrah,
Doa-Doa Haji Umrah dan Istilah-
Istilah
4 Panduan Haji &
Umrah
https://play.go
ogle.com/store/
apps/details?id
=com.andromo
.dev272448.ap
p260477
+ Sudah ada konten video
- Konten berupa teks dari file
pdf yang masih membutuhkan
pihak ketiga untuk
membukanya
5 Aplikasi Manasik Haji
https://play.go
ogle.com/store/
apps/details?id
=com.haji
- Konten berupa teks dan audio
- Isi Konten :Persiapan Haji,
Do‟a Haji, Rukun dan Wajib
Haji, Kegiatan Ibadah Haji
6 Haji dan Umrah Saku
https://play.go
ogle.com/store/
apps/details?id
=com.Lukman
Harun.HajiUm
roh
- Konten hanya berupa teks
- Isi Konten : Penjelasan Haji,
Umrah, Jenis Ibadah Haji,
Tips Ibadah Haji, Rukun dan
Wajib Haji
Tetapi masih ada kekurangan dan hal yang dapat dikembangkan pada
penelitian dan aplikasi tersebut, diantara kekurangannya adalah mayoritas aplikasi
tersebut hanya melakukan penyampaian tata cara dan informasi tentang haji dan
umrah melalui teks, tidak dapat mendapatkan informasi terkini dan hanya dapat
beroperasi pada perangkat khusus yang sudah kurang berkembang pada saat ini.
(dapat dilihat pada Tabel 1.1 nomor 1, 2, dan 3).
5
Sesuai dengan uraian penulis diatas, maka penulis ingin menulis Tugas
Akhir ini dengan penelitian berjudul “Perancangan Aplikasi Pembelajaran Haji
dan Umrah Berbasis Multimedia pada Smartphone Bersistem Operasi
Android” yang berfokus pada pemberian informasi baik secara offline maupun
online dan tata cara melaksanakan haji dengan bantuan media teks, suara, gambar
dan video.
Berdasarkan judul diatas, pada penelitian ini penulis akan merancang
aplikasi tentang haji dan umrah yang memberikan informasi haji secara online dan
menjelaskan tata cara dan do‟a – do‟a haji dan umrah dengan bantuan visual dan
audio seperti teks, gambar, video, suara, beserta peta dan fitur-fitur lain.
1.2 Perumusan Masalah
Berdasarkan latar belakang yang telah dijelaskan maka dikembangkan
suatu rumusan masalah pada penelitian ini yaitu bagaimana merancang dan
membangun aplikasi tentang haji dan umrah untuk mendapatkan informasi berita
tentang haji dan umrah secara online dan tata cara melaksanakan haji yang
dibantu dengan media video, suara dan gambar pada smartphone berbasis
android?
1.3 Batasan Masalah
Batasan-batasan masalah dalam penelitian ini adalah sebagai berikut :
1. Aplikasi ini diperuntukan hanya pada pengguna smartphone dengan
operasi sistem android.
2. Aplikasi ini hanya menyediakan informasi terkini tentang haji dan umrah
yang diambil dari situs berita haji di Indonesia dan panduan
melaksanakan haji dan umrah, tidak menyediakan hal terkait pendaftaran,
pembayaran yang berkaitan dengan haji dan umrah
3. Pengenalan dan tata cara pelaksanaan haji dan umrah bersumber dari buku
dan e-book (selengkapnya dapat dilihat pada bab II dan daftar pustaka).
4. Pelaksanaan haji hanya menjelaskan tata cara pelaksanaan haji tamattu‟.
5. Informasi online tentang haji dan umrah bersumber dari situs kementerian
agama tentang haji (http://www.haji.kemenag.or.id).
6
6. Aplikasi ini memiliki konten teks, audio dan visual. Visual berupa video
yang membutuhkan koneksi internet dan gambar.
7. Jalur pada peta hanya menampilkan jalur darat.
8. Software pendukung yang digunakan yaitu , Android Studio 1.2.1, Android
SDK ,dan Android Emulator
9. Aplikasi yang dihasilkan hanya terbatas untuk pengguna Android dengan
versi 4.1 keatas.
10. Aplikasi hanya ada dalam bahasa Indonesia
1.4 Tujuan
Adapun Tujuan yang akan dicapai dari penelitian ini adalah untuk
merancang dan membangun aplikasi tentang haji dan umrah pada smartphone
berbasis android untuk mendapatkan informasi berita tentang haji dan umrah
secara online dan tata cara melaksanakan haji dengan dibantu media video, suara
dan gambar dimana saja dan kapan saja melalui smartphone berbasis android.
1.5 Manfaat
Manfaat yang dapat diambil dari penelitian ini diantaranya:
1.5.1 Manfaat bagi Mahasiswa
1. Dapat menerapkan ilmu-ilmu yang didapat selama perkuliahan
khususnya mengenai perancangan perangkat lunak terutama yang
memiliki konten multimedia pada mobile android
2. Bertambahnya wawasan dan pengalaman peneliti dalam
merancang dan membangun aplikasi terutama yang memiliki
konten multimedia pada perangkat android.
1.5.2 Manfaat bagi Pengguna
1. Dapat memudahkan para calon haji maupun umrah dalam
mengakses dan mendapatkan informasi tentang haji dan umrah
dimana saja dan kapan saja melalui smartphone-nya.
2. Dapat mengetahui tata cara melaksanakan haji dan umrah melalui
smartphone-nya.
3. Para calon haji maupun umrah dapat lebih mudah dalam
mempersiapkan diri mereka sebelum melaksanakan ibadahnya
7
1.5.3 Manfaat bagi Universitas
1. Mengetahui kemampuan mahasiswanya dalam menguasai ilmu
yang telah didapatkan di bangku perkuliahan
2. Mengetahui kemampuan mahasiswa dalam menerapkan ilmunya
dan sebagai bahan evaluasi
1.6 Metode Penelitian
Dalam menyusun tugas akhir ini penulis akan menggunakan metode
pengumpulan data sebagai berikut :
1. Studi Pustaka
Pada metode ini penulis mengumpulkan data dari buku-buku atau
literatur yang sejenis yang berhubungan dengan penelitian sebagai
referensi sehingga dapat membantu penulis dalam melakukan tugas akhir
ini.
2. Studi Lapangan
Pada metode ini penulis menggunakan salah satu jenis studi lapangan
yaitu kuisioner. Pada metode ini penulis menyebarkan kuisioner untuk
mengetahui permasalahan dan kesulitan pada saat mempelajari haji dan
umrah. Kuisioner ini juga bertujuan untuk mengetahui keinginan yang
diharapkan oleh calon pengguna aplikasi serta menganalisa kelayakan
aplikasi. Hasil kuisioner akan dijadikan sebagai sampel data.
Sedangkan dalam metode pengembangan penelitian, penulis
menggunakan metode pengembangan RAD yang menekankan pada fase-
fase sebagai berikut:
1. Tahap perencanaan syarat-syarat
2. Tahap desain (desain workshop)
3. Tahap implementasi
1.7 Sistematika Penelitian
Dalam penelitian ini pembahasan terbagi dalam 5 Bab yang secara singkat
akan diuraikan sebagai berikut :
8
BAB 1 PENDAHULUAN
Dalam bab ini akan dibahas mengenai latar belakang dari penulisan tugas
akhir ini, perumusan masalah, batasan masalah, tujuan penelitian, manfaat
penulisan, metodologi penelitian, dan sistematika penelitian yang
merupakan gambaran menyeluruh dari penulisan tugas akhir ini .
BAB 2 LANDASAN TEORI
Dalam bab ini akan dibahas berbagai teori yang melandasi penelitian ini
dan yang berhubungan dengan topik yang dibahas di penelitian ini .
BAB 3 METODOLOGI PENELITIAN
Bab ini berisikan metode pengumpulan data yang digunakan dalam
penelitian ini serta metode yang digunakan dalam perancangan aplikasi
hasil dari penelitian ini .
BAB 4 PEMBAHASAN
Bab ini berisikan pembahasan dari penelitian ini , yang meliputi tentang
perancangan dan pembuatan dari aplikasi mobile hasil dari penelitian ini .
Bab ini menjelaskan secara terperinci langkah – langkah yang digunakan
dalam melakukan perancangan dan pembuatan Aplikasi Pembelajaran Haji
dan Umrah Berbasis Multimedia
BAB 5 PENUTUP
Bab ini menguraikan tentang kesimpulan yang didapat dari hasil penelitian
yang dilakukan, dan juga saran yang dapat dilakukan untuk pengembangan
aplikasi ke arah yang lebih baik di masa yang akan datang.
9
BAB II
LANDASAN TEORI
2.1 Multimedia
2.1.1. Pengertian Multimedia
Menurut Vaughan (2011) Multimedia adalah kombinasi dari teks,
gambar, grafis, suara, animasi, dan elemen-elemen video yang
dimanipulasi secara digital. Multimedia Interaktif adalah kombinasi dari
elemen-elemen multimedia yang memungkinkan pengguna mengontrol
langsung aplikasi multimedia dan mendapatkan feedback secara langsung.
Multimedia dapat membantu memberikan informasi secara jelas,
menarik, dan efektif. Hal ini dikarenakan terdapat elemen-elemen
multimedia yang membantu informasi menjadi lebih efektif.
2.1.2. Elemen Multimedia
Menurut Vaughan (2011) komponen multimedia terbagi atas lima
jenis yaitu:
1. Teks
Teks adalah bagian penting dalam multimedia. Teks dapat
membentuk kata, surat atau narasi. Penggunaan teks bervariasi,
tergantung fungsi dan aplikasi yang dibuat. Contohnya pada
pembuatan game, hanya sedikit sekali teks yang dibutuhkan.
Sementara itu pada pembuatan ensiklopedia akan membutuhkan teks
dalam jumlah banyak. Secara umum ada empat macam teks yaitu teks
cetak, teks hasil scan, teks elektronik, dan hypertext.
Vaughan (2011) secara umum membagi teks menjadi dua istilah,
yaitu serif dan sans serif. Perbedaan keduanya adalah serif merupakan
contoh kecil pada akhir huruf. Times, New Century Schoolbook,
Bookman, dan Palatino merupakan contoh dari font serif. Sedangkan,
10
Helvetica, Verdana, Arial, Optima, dan Avant Garde merupakan sans
serif. Perhatikan perbedaan antara serif dan sans serif.
Gambar 2.01 serif dan sans serif (Vaughan, 2011)
Pada halaman yang dicetak, font serif biasanya digunakan untuk
badan teks karena serif dapat membantu menuntun mata pembaca
melihat baris-baris teks. Sebaliknya, font sans serif digunakan untuk
headline dan pernyataan yang dicetak tebal.
2. Grafik (image)
Menurut Vaughan (2011), Penilaian terhadap suatu aplikasi
multimedia dipengaruhi oleh pengaruh visual dari aplikasi. Karena itu
gambar merupakan salah satu elemen paling dalam pembuatan sebuah
proyek multimedia. Secara umum gambar dibagi dalam dua jenis,
yaitu vektor dan bitmap.
Bitmap adalah sebuah data matriks yang menjelaskan karakteristik
dari titik-titik individual dalam gambar, biasa disebut pixel, yang
membentuk suatu gambar. Bitmap digunakan untuk gambar-gambar
yang berupa foto realistik dan gambar yang memerlukan detail
kompleks. Kekurangan utama gambar bitmap adalah ukurannya yang
besar dan tidak dapat diperbesar tanpa menjaga kualitas gambar.
Contoh kompresi bitmap adalah JPEG dan Tagged Image File Format
(TIFF).
Vektor digunakan untuk garis, kotak, lingkaran, poligon , dan
bentuk-bentuk lain yang bisa diekspresikan secara matematis dalam
sudut, koordinat, dan jarak. Untuk suatu gambar yang sama, besar file
gambar vektor jauh lebih kecil daripada gambar bitmap. Selain itu
gambar vektor dapat diperbesar dan diperkecil tanpa mengurangi
kualitas atau menambah ukuran file gambar. Kekurangan gambar
11
vektor yaitu tidak bisa digunakan untuk menyimpan foto ataupun
gambar-gambar kompleks dan tidak bisa dibuka di halaman web tanpa
plug-in seperti Flash Player. Contoh format vektor adalah Scalable
Vector Graphics (SVG) dan Vector Markup Language (VML).
3. Audio
Menurut Vaughan (2011), Suara merupakan gabungan berbagai
sinyal, tetapi suara murni secara teoritis dapat dijelaskan dengan
kecepatan frekuensi yang diukur dalam Hertz (HZ) dan kenyaringan
bunyi dengan pengukuran dalam desibel. Menurut Vaughan, audio
digital dibuat saat sebuah gelombang dikonversikan dari sebuah
gelombang suara ke dalam angka---prosesnya disebut digitizing
(mendigitalkan). Suara digital dapat dibuat dari sebuah mikrofon,
synthesizer, tape recoding yang ada, siaran televisi dan radio secara
live, dan CD-CD populer. Untuk mendigitalkan suara dapat dari
sumber apapun, natural atau sudah direkam.
4. Video
Menurut Vaughan (2011), Video sebagai integrasi sempurna antara
gambar bergeda audio yang serempak. Klip video yang cocok,
direncanakan dengan hati-hati, dan dilaksanakan dengan baik dapat
membuat perbedaan dramatis pada sebuah proyek multimedia.
Dari semua elemen multimedia, video adalah yang membutuhkan
performa memori dan penyimpanan komputer yang paling tinggi.
Karena alasan tersebut, masih banyak desainer multimedia yang
memilih meniadakan keberadaan video dalam proyeknya. Beberapa
teknologi multimedia dan usaha penelitian yang terpopuler dan paling
dicari saat ini adalah bagaimana memadatkan video digital menjadi
aliran informasi yang kecil dan mudah dikelola.
5. Animasi
Menurut Vaughan (2011), Animasi adalah tindakan membuat
sesuatu menjadi hidup. Dengan animasi, serangkaian gambar diubah
secara perlahan dan sangat cepat, satu sesudah yang lain sehingga
12
tampak berpadu kedalam ilusi visual gerak. Efek visual seperi wipe,
fade, zoom, dan dissolve merupakan bentuk animasi sederhana.
Sebelum video seperti QuickTime dan AVI video menjadi umum,
animasi adalah sumber utama aksi dinamis dalam presentasi
multimedia.
2.2 E-Learning
Para ahli mempunyai pandangan yang berbeda-beda terhadap pengertian
E-Learning. Menurut E. Hartley (Hartley, 2001), E-Learning merupakan suatu
jenis belajar mengajar yang memungkinkan tersampaikannya bahan ajar ke siswa
dengan menggunakan media internet, Intranet atau media jaringan komputer lain.
Menurut LearnFrame.com dalam Glossary of e-Learning Terms (Glossary,
2001), E-Learning adalah sistem pendidikan yang menggunakan aplikasi
elektronik untuk mendukung belajar mengajar dengan media internet, jaringan
komputer, maupun komputer standalone.
Matthew Comerchero dalam E-Learning Concepts and Techniques
[Bloomsburg, 2006], E-learning adalah sarana pendidikan yang mencakup
motivasi diri sendiri, komunikasi, efisiensi, dan teknologi. Karena ada
keterbatasan dalam interaksi sosial, siswa harus menjaga diri mereka tetap
termotivasi. E-learning efisien karena mengeliminasi jarak dan arus pulang-pergi.
Jarak dieliminasi karena isi dari e-learning didesain dengan media yang dapat
diakses dari terminal komputer yang memiliki peralatan yang sesuai dan sarana
teknologi lainnya yang dapat mengakses jaringan atau Internet.
2.2.1. Keuntungan e-learning
Keuntungan menggunakan e-Learning diantaranya sebagai berikut
(Wahono, 2005):
1. Fleksibel karena siswa dapat belajar kapan saja, di mana saja, dan
dengan tipe pembelajaran yang berbeda-beda.
2. Menghemat waktu proses belajar mengajar
3. Mengurangi biaya perjalanan
4. Menghemat biaya pendidikan secara keseluruhan
5. Menjangkau wilayah geografis yang lebih luas
13
2.2.2 Kelemahan E-Learning
Kelemahan menggunakan e-learning diantaranya sebagai berikut
(Rosenberg, 2006):
1. Karena e-learning menggunakan teknologi informasi, tidak semua
orang terutama orang yang masih awam dapat menggunakannya
dengan baik.
2. Membuat e-learning yang interaktif dan sesuai dengan keinginan
pengguna membutuhkan programming yang sulit, sehingga
pembuatannya cukup lama.
3. E-learning membutuhkan infrastruktur yang baik sehingga
membutuhkan biaya awal yang cukup tinggi.
4. Tidak semua orang mau menggunakan e-learning sebagai media
belajar
2.3. Android
Android awalnya diciptakan oleh Andy Rubin sebagai sistem operasi
untuk ponsel telepon, sekitar awal abad kedua puluh satu ini. Android adalah
sistem operasi yang didasarkan pada versi modifikasi dari Linux. Pada tahun 2005
Google membeli Android dan mengambil alih pekerjaan development beserta tim
development mereka (Lee, Wei-Meng, 2011).
Google menginginkan Android menjadi open dan free, oleh karena itu,
sebagian besar kode Android dirilis dibawah open-source Apache License, yang
berarti semua orang yang ingin menggunakan Android dapat melakukannya
dengan cara men-download kode sumber Android.
Keuntungan mengambil Android adalah Android menawarkan pendekatan
ke pengembangan aplikasi. Para pengembang hanya perlu mengembangkan untuk
Android dan aplikasi-aplikasi tersebut akan dapat dijalankan pada bermacam-
macam perangkat yang berbeda selama perangkat tersebut menggunakan Android.
2.3.1 Versi – Versi Android
Android telah melakukan beberapa update sejak hari pertama
meraka rilis. Tabel 2.1 dibawah menunjukkan versi-versi Android yang
telah dirilis oleh Google.
14
Tabel 2.1 Tabel Versi – Versi Android yang Telah dirilis
Versi Kode Tanggal Rilis
1.0 - 23 September 2008
1.1 - 9 Februari 2009
1.5 Cupcake 27 April 2009
1.6 Donut 15 September 2009
2.0 Éclair 26 Oktober 2009
2.2 Froyo 20 May 2010
2.3 GingerBread 6 Desember 2010
3.0 Honeycomb 22 Februari 2011
4.0 Ice Cream Sndwitch 19 Oktober 2011
4.1 Jelly Bean 27 Juni 2012
4.4 Kitkat 31 Oktober 2013
5.0 Lolipop 25 Juni 2014
2.3.2 Fitur dan Arsitektur Android
Android memiliki fitur – fitur. Fitur yang tersedia pada Android
adalah : (Hermawan S, Stephanus, 2011)
• Framework aplikasi : memungkinkan penggunaan dan pemindahan
dari komponen yang tersedia
• Dalvik virtual machine : virtual machine yang dioptimalkan untuk
perangkat mobile
• Grafik : grafik 2D dan grafik 3D yang didasarkan pada library
OpenGL
• SQLite : untuk penyimpanan data
• Mendukung media : audio,video,dan berbagai format gambar
(MPEG4,H.264,MP3,AAC,AMR,JPG,PNG,GIF)
• GSM,Bluetooth,EDGE,3G,and WiFi (tergantung hardware)
• Camera,Global Positioning System (GPS),compass,dan
accelerometer (tergantung hardware)
15
• Lingkungan pembangun yang kaya,termasuk emulator,peralatan
debugging,dan plugin untuk Eclipse IDE
Sistem operasi android dibangun berdasarkan kernel Linux dan memiliki
arsitektur sebagai berikut :
Gambar 2.2 Arsitektur Sistem Operasi Android ( Hermawan S, Stephanus, 2011.)
• Applications
Lapisan ini adalah lapisan aplikasi, serangkaian aplikasi akan
terdapat pada perangkat mobile . Aplikasi inti yang telah terdapat
dalam Android termasuk kalender, kontak, SMS, dan lain-lain.
Aplikasi – aplikasi ini ditulis dengan bahasa pemrograman Java
• Application Framework
Pengembang aplikasi memiliki akses penuh ke Android sama
dengan aplikasi inti yang telah tersedia. Pengembang dapat dengan
mudah mengakses informasi lokasi, mengatur alarm, menambah
pemberitahuan ke status bar dan lain sebagainya. Arsitektur
aplikasi ini dirancang untuk menyederhanakan penggunaan
kembali komponen, aplikasi apa pun dapat mempublikasikan
kemampuan dan aplikasi lain dapat menggunakan kemampuan
mereka sesuai batasan keamanan. Dasar dari aplikasi adalah
seperangkat seperangkat layanan dan sistem, yaitu berbagai view
16
yang digunakan untuk membangun UI, Content Provider yang
memungkinkan aplikasi berbagai data, Resource Manager
menyediakan akses bukan kode seperti grafik, string, dan layout ,
NotificationManager yang akan membuat aplikasi dapat
menampilkan tanda pada status bar dan Activity Manager yang
berguna mengatur daur hidup dari aplikasi.
• Libraries
Satu set libraries dalam bahasa C/C++ yang digunakan oleh
berbagai komponen pada sistem Android.
• Android Runtime
Satu set libraries inti yang menyediakan sebagian besar fungsi
yang tersedia di libraries inti dari bahasa pemrograman Java.
Setiap aplikasi akan berjalan sebagai proses sendiri pada Dalvik
Virtual Machine (VM).
• Linux Kernel
Android bergantung pada linux versi 2.6 untuk layanan sistem inti
seperti keamanan, manajemen memori, manajemen proses,
network stack dan model driver. Kernel juga bertindak sebagai
lapisan antara hardware dan seluruh software.
2.4. Android Studio
Android Studio adalah lingkungan pengembangan Android baru
berdasarkan IntelliJ IDEA. Mirip dengan Eclipse dengan ADT Plugin, Android
Studio menyediakan alat pengembang Android terintegrasi untuk pengembangan
dan debugging (http://developer.android.com/tools/studio/index.html). Di atas
kemampuan yang Anda harapkan dari IntelliJ, Android Studio menawarkan:
Berbasis Gradle membangun dukungan.
Refactoring android, spesifik dan perbaikan yang cepat.
Alat Lint untuk menangkap kinerja, kegunaan, kompatibilitas versi dan
masalah lainnya.
ProGuard dan aplikasi-penanda tanganan kemampuan.
17
Penyihir berbasis template untuk membuat desain Android umum dan
komponen.
Sebuah layout editor yang memungkinkan Anda untuk drag-and-drop
UI komponen, layout pratinjau pada beberapa konfigurasi layar, dan
banyak lagi.
2.5. Java
Menurut Abdul Kadir (2005), Java adalah bahasa pemprograman
serbaguna yang dapat digunakan untuk membuat suatu program. Sedangkan
Menurut Isak Rickyanto (2005), Java Merupakan teknologi dimana teknologi
tersebut mencakup java sebagai bahasa pemprograman yang memiliki sintaks dan
aturan pemprograman tersendiri, juga mencakup java sebagai platform dimana
teknologi ini memiliki virtual machine dan library yang diperlukan untuk menulis
dan menjalankan program yang ditulis dengan bahasa pemprograman java.
2.6. Android Software Development Kit (SDK)
Android SDK adalah tool API (Application Programming Interface) yang
diperlukan untuk mulai mengembangkan aplikasi pada platform Android
menggunakan bahasa pemrograman Java. Android merupakan subset perangkat
lunak untuk ponsel yang meliputi sistem operasi, middleware dan aplikasi kunci
yang release oleh Google. Saat ini di sediakan Android SDK (Software
Development Kit) sebagai alat bantu dan API untuk mulai mengembangkan
aplikasi pada platform Android menggunakan bahasa pemograman java (Nazrudin
Safaat 2011).
2.7. HTML (Hyper Text Markup Language)
HTML, HyperText MarkUp Language adalah bahasa utama untuk
membuat suatu halaman web. HTML memberikan struktur pada halaman web
seperti heading, paragraf, atau gambar. Oleh karena itu, bahasa ini dinamakan
markup, karena HTML hanya memberikan struktur suatu halaman web, bukan
membuat suatu program. (Hoew, Shay. 2014 )
Dokumen HTML mempunyai struktur yang diperlukan elemen
diantaranya : <!DOCTYPE html>, <html>, <head>, and <body>.
18
<!DOCTYPE html> menginformasikan tipe HTML yang digunakan
pada web browser dan diletakkan pada awal dokumen HTML. Setelah
<!DOCTYPE html>, terdapat elemen <html> yang menandakan awal
dokumen.
Di dalam elemen <html>, terdapat elemen <head> yang
mengidentifikasi bagian atas dokumen, termasuk metadata. Konten pada <head>
tidak ditampilkan pada halaman web.
Konten-konten yang terlihat pada halaman web tardapat pada elemen
<body>. Struktur HTML biasanya seperti berikut :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<h1>Hello World</h1>
<p>This is a web page.</p>
</body>
</html>
2.8. JSOUP
JSOUP adalah sebuah library java yang bekerja untuk dunia HTML.
Jsoup menyediakan API yang sangat nyaman untuk extracting dan manipulasi
data menggunakan DOM, CSS, dan Jquery (http://www.jsoup.org). Beberapa
fungsi JSOUP :
Mengikis dan mengurai HTML dari sebuah URL, file, atau String
Menemukan dan meng-extract data , menggunakan DOM traversal atau
css selector
Memanipulasi elemen HTML, attribut dan teks
Membersihkan konten user-submited terhadap sebuah white-list yang
aman, untuk mencegah serangan XSS attack
Hasil HTML rapi.
19
JSOUP juga merupakan library yang bersifat open source (gratis atau tidak
berbayar)
2.9. SQLiteDatabase
SQLiteDatabase merupakan interface yang ada pada sistem operasi
Android yang digunakan untuk membuat relational database. SQLite menyokong
implementasi dari SQL yang kaya untuk apapun yang dibutuhkan oleh aplikasi
mobile. Setiap aplikasi dapat memiliki databasenya sendiri dengan pengaturan
lengkap. (Hermawan S, Stephanus, 2011)
Dengan penggunaan SQLite, dapat dibuat database untuk aplikasi yang
digunakan untuk menyimpan dan mengatur data aplikasi terstruktur. Desain
database yang baik termasuk normalisasi cukup penting untuk mengurangi
redudancy.
2.10. Haji dan Umrah
2.10.1. Pengertian Haji
Haji adalah datang ke Baitullah dan tempat-tempat tertentu untuk
melaksanakan serangkaian ibadah pada waktu yang telah ditentukan,
dengan syarat-syarat yang telah ditetapkan. (Abdurrachman Rochimi,H.M,
2011)
Maksud tempat-tempat tertentu adalah Ka‟bah, Mas‟a (tempat sa‟i)
Arafah, Muzdalifah, dan Mina. Sedangkan waktu haji yang telah
ditentukan yaitu dimulai dari bulan Syawal sampai sepuluh hari pertama
bulan Dzulhijjah. Adapun yang dimaksud dengan syarat-syarat adalah
ketentuan-ketentuan yang menjadi dasar diwajibkannya haji bagi
seseorang.
Haji merupakan salah satu rukun islam yang lima dan syari‟at
islam paling agung. Haji wajib bagi setiap muslim yang mukallaf dan
mampu, satu kali sepanjang hayat, dan selebihnya sunnah. Orang yang
meengingkari kewajibannya adalah kafir berdasarkan nash dan ijma.
20
2.10.2. Rukun Haji
Rukun haji adalah kegiatan yang wajib dilaksanakan dalam ibadah
haji. Jika salah satunya ditinggalkan maka hajinya batal. Rukun-rukun itu
adalah: (Abdurrachman Rochimi,H.M, 2011)
1) Ihram yaitu berpakaian ihram dan niat ihram dan haji.
2) Wukuf di arafah pada tanggal 9 Dzulhijjah; yakni hadirnya
sesorang yang berihram untuk haji sesudah tergelincir matahari
yaitu pada hari ke-9 zulhijjah.
3) Thawaf atau thawaf ifadhoh
4) Sa‟i yaitu lari-lari kecil antara sofa dan marwah 7 kali.
5) Tahallul artinya mencukur atau mengunting rambut sedikitnya 3
helai
6) Tertib.
2.10.3. Wajib Haji
Wajib Haji adalah hal-hal yang harus dilakukan dalam ibadah haji.
Jika ditinggalkan maka wajib dengan Dam/fidyah. Hal-hal tersebut adalah:
(Abdurrachman Rochimi,H.M, 2011)
1) Ihram dari miqat zamani dan makani yang telah ditentukan
2) Bermalam di Muzdalifah sesudah wukuf di Arafah
3) Bermalam di Mina selama 2 atau 3 malam pada hari tasyrik
4) Melempar jumrah aqobah 7 kali dengan batu
5) Melempar jumrah ketiga-tiganya yaitu jumrah ula, wustho, dan
aqabah.
6) Meninggalkan segala yang diharamkan karena ihram
7) Thawaf Wada‟
2.10.4. Syarat Haji
Adapun Syarat sah haji adalah sebagai berikut : (Abdurrachman
Rochimi,H.M, 2011)
1. Islam
2. Berakal
3. Baligh
21
4. Ihram dari miqat makani
5. Memenuhi seluruh rukun haji
2.10.5. Pengertian Umrah
Secara bahasa, kata umrah bermakna ziarah (berkunjung, atau
mengunjungi). Adapun maknanya secara syar'i adalah berziarah ke
Baitullah dengan sengaja. (Abdurrachman Rochimi,H.M, 2011)
2.10.6. Rukun Umrah
Rukun Umrah adalah kegiatan yang wajib dilaksanakan dalam
ibadah umrah. Jika salah satunya ditinggalkan maka umrahnya batal.
Rukun-rukun itu adalah: (Abdurrachman Rochimi,H.M, 2011)
1) Ihram yaitu berpakaian ihram dan niat ihram dan haji.
2) Thawaf atau thawaf ifadhoh
3) Sa‟i yaitu lari-lari kecil antara sofa dan marwah 7 kali.
4) Tahallul artinya mencukur atau mengunting rambut sedikitnya 3
helai
5) Tertib.
2.10.7. Wajib Umrah
Wajib Umrah adalah hal-hal yang harus dilakukan dalam ibadah
umrah. Jika ditinggalkan maka wajib dengan Dam/fidyah. Hal-hal tersebut
adalah: (Abdurrachman Rochimi,H.M, 2011)
1) Ihram dari miqat zamani dan makani yang telah ditentukan
2) Bermalam di Muzdalifah sesudah wukuf di Arafah
3) Bermalam di Mina selama 2 atau 3 malam pada hari tasyrik
4) Melempar jumrah aqobah 7 kali dengan batu
5) Melempar jumrah ketiga-tiganya yaitu jumrah ula, wustho, dan
aqabah.
6) Meninggalkan segala yang diharamkan karena ihram
7) Thawaf Wada‟
2.10.8. Syarat Umrah
Adapun Syarat sah umrah adalah sebagai berikut : (Abdurrachman
Rochimi,H.M, 2011)
22
1. Islam
2. Berakal
3. Baligh
4. Ihram dari miqat makani
5. Memenuhi seluruh rukun haji
2.10.9. Macam-Macam Haji
Ada tiga macam haji yang disepakati oleh para ulama, yaitu :
(Sayyid Muhammad bin Alwi Al-Maliki, 2012)
1. Ifrad, yaitu mengatakan, “Saya niat haji dan ihram untuknya
karena Allah Ta‟ala. Setelah itu menghindari dari segala larangan
ihram, selalu mengucapkan talbiyah, mengingat Allah Ta‟ala
hingga saat tiba di Makkah, kemudian melakukan thawaf qudum,
melakukan sa’i haji, tetap dalam keadaan ihram sampai tiba di
Arafah dan singgah di Muzdalifah.
Setelah mabit yang wajib (bermalam di Muzdalidah), lalu singgah
di Mina, melempar jumrah „Aqabah, mencukur atau memotong
rambut, melaksanakan thawaf ifadhah hingga mengakhsa
dilakukan setelah atau sebelum haji, tetapi mendahulukan haji
daripada umrah dalam haji ifrad itu lebih utama. Adapun jika
hendak mendahulukan umrah daripada haji, ada cara haji tamattu‟.
2. Tamattu‟, dimulai dengan niat “Saya niat umrah dan ihram
untuknya karena Allah Ta‟ala”. Kemudian pergi ke Makkah seperti
haji ifrad, melaksanakan thawaf umrah, sa‟i antara shafa dan
marwah, mencukur atau memotong rambut, ber-tahallul untuk
umrah. Pada haji kedelapan bulan Dzulhijjah, baru ber-ihram
untuk haji dan melaksanakan sesuai amalannya secara sempurna.
Dalam keadaan ini, Jema‟ah haji wajib membayar dam, kambing
kurban.
3. Qiran, dimulai dengan niat, “Saya niat haji dan umrah, dan ihram
untuk keduanya karena Allah Ta‟ala”, atau ihram untuk umrah saja,
dan sebelum mulai melaksanakan segala amalannya, jema‟ah
23
memasukkan haji padanya, melakukannya seperti haji ifrad. Pada
haji model ini diwajibkan membayar dam qiran, sebagaimana
halnya damtamattu’.
2.11. Literatur Sejenis
Berikut ini adalah literatur sejenis yang penulis pakai dalam penelitian ini :
1. Judul : Perancangan dan Implementasi Mobile Aplication Pembelajaran
Haji dan Umrah Berbasis Multimedia, 2013
Penulis : Abdurahman
Abstrak :
Perkembangan teknologi menjadikan handphone sebagai alat multimedia
multifungsi dilengkapi dengan fitur-fitur yang canggih sehingga menjadi
lebih fungsional. Fitur flashlite dapat dijadikan media penyimpanan
informasi berbasis multimedia sebagai salah satu perkembangan fitur
handphone.
Tujuan dari penulisan skripsi ini yaitu merancang aplikasi mobile tentang
pembelajaran haji dan umrah untuk memudahkan calon jamaah dalam
mendapatkan metode atau tata cara pelaksanaan dalam persiapan
pelaksanaan ibadah haji dan umrah.
Dalam pembuatan skripsi ini penulis menggunakan dua metode yaitu
metode pengumpulan data yang meliputi studi pustaka, wawancara, dan
observasi juga metode pengembangan multimedia menurut Luther yang
terdiri dari enam tahap yaitu konsep, perancangan, pengumpulan bahan
material, pembuatan, testing dan distribusi.
Software yang digunakan dalam pembuatan aplikasi ini yaitu Adobe Flash
CS4, Adove Device Central CS4, Adobe Photoshop CS2 dan Adobe Audio
Audition 1.5. Output yang dihasilkan berupa aplikasi mobile pembelajaran
haji dan umrah dengan ukuran 1.5 MB yang menampilkan informasi haji
dan umrah, panduan, doa, dan istilah yang ada pada ibadah haji dan umrah.
Berdasarkan hasil penelitian dengan aplikasi ini para jamaah dapat lebih
mudah memperoleh informasi haji dan umrah dan dapat dijadikan sebagai
pemandu ibadah haji dan umrah
24
Kata Kunci : Informasi Haji dan Umrah, Mobile Application, Panduan
Haji dan Umrah, Flashlite, Multimedia
Tabel 2.2 Tabel Perbandingan Aplikasi 1
Hal yang
dibandingkan
Fitur pada penulis
(Abdurrahman)
Fitur pada penulis
sekarang
Penerapan
Aplikasi
Handphone Symbian
dengan Flashlite 2.1
Smartphone
Android 4.1 keatas
Konten
Multimedia
Teks, Gambar Teks, Gambar,
Suara, dan Video
Konten Haji Pengertian, Dasar Hukum
Sejarah Haji dan Umrah,
Pelaksanaan Haji dan
Umrah beserta Rute
pejalanannya, Doa-Doa
Haji Umrah dan Istilah-
Istilah
Istilah haji,
pengertian haji,
amalan-amalan haji,
peta-peta lokasi
haji, doa-doa haji,
pelaksanaan haji,
video haji, Rssfeed
tentang Haji, Lokasi
– lokasi haji, cek
keberangkatan haji
2. Judul : Aplikasi Simulator Manasik Haji Berbasis Mobile, 2012
Penulis : Yayan Supriatna
Abstrak :
Manasik pada dasarnya adalah memberikan pelajaran atau informasi
kepada calon jama‟ah haji mengenai tata cara melaksanakan ibadah haji di
tanah Suci. Namun, banyak di kalangan kaum muslim yang enggan
mendalami manasik haji, yang mengakibatkan mereka menjadi buta akan
hukum-hukum dan tata cara pelaksanaan ibadah haji. Maka tujuan dari
perancangan Aplikasi Simulator Manasik Haji Berbasis Mobile Android,
untuk mengetahui bagaimana Aplikasi Simulator Manasik Haji Berbasis
25
Mobile Android dan untuk melakukan implementasi dari Aplikasi
Simulator Manasik Haji Berbasis Mobile Android. Dari hasil penelitian ini
akan memberikan suatu Aplikasi Simulator Manasik Haji Pada Perangkat
Mobile Berbasis Android agar para calon jama‟ah haji bisa lebih mudah
dalam mempelajarinya.
Metode yang digunakan dalam pembuatan Aplikasi Simulator Manasik
Haji dan penyusun laporan skripsi ini adalah metode pengumpulan data
(Data Gathering), metode wawancara, studi kepustakaan, analisa sistem,
merancang dan mengimplementasi. Metode Pengembangan Sistem yang
digunakan oleh penulis dalam perancangan Sistem Informasi ini yaitu
menggunakan Model Prototyping, Prototyping merupakan salah satu
metode pengembangan perangkat lunak yang banyak digunakan. Dalam
menerapkan rancangan yang telah di buat, di butuhkan beberapa software
untuk membuat program aplikasi simulator manasik haji yaitu Java
Development Kid (JDK) 1.6 dan Java Runtime Environment (JRE),
Integrated Development Environment (IDE) Eclipse 3.4 atau 3.5, Android
Software Development Kit (Android SDK), Android Development Tools
(ADT).
Hasil yang ingin dicapai adalah suatu aplikasi simulator manasik haji
berbasis mobile yang dapat mempermudah jama‟ah haji dalam melakukan
proses haji. Seperti adanya doa-doa dan video simulasi manasik haji dalam
melakukan proses haji.
Kata kunci: Manasik haji, Mobile Android, Model Prototyping
Tabel 2.3 Tabel Perbandingan Aplikasi 2
Hal yang
dibandingkan
Fitur pada penulis (Yayan
Supriatna)
Fitur pada penulis
sekarang
Penerapan
Aplikasi
Smartphone Android 2.2
Keatas
Smartphone
Android 4.1 keatas
Konten
Multimedia
Teks, Gambar, Video Teks, Gambar,
Suara, dan Video
Konten Haji Video simulasi haji, Istilah haji,
26
Pedoman-pedoman haji,
persiapan sebelum haji.
pengertian haji,
amalan-amalan haji,
peta-peta lokasi
haji, doa-doa haji,
pelaksanaan haji,
Rssfeed tentang
Haji, Tempat-
tempat berziarah
haji
3. Judul : Analisis dan Perancangan Aplikasi Manasik Haji Menggunakan
Teknologi J2ME, 2012
Penulis : Robimadipa Yanriko
Abstrak :
In syar'i, Hajj means to travel to the shrine to deliberate certain practices
with the intention of worshiping Allah SWT. While other definitions,
according to the second meaning of the pilgrimage, is implementing the
five pillars of Islam as a Muslim Islamic improvements address.
For prospective pilgrims who had yet to perform the pilgrimage, of course,
not knowing how to implement a true pilgrimage With this in mind, it was
held the rituals of Hajj (pilgrimage ordinance).
In the middle of the development of information and communication
technology is so fast with these devices and mobile communication
technology has been a wave of Internet technology that enables a new
trend in mobile learning, or more commonly known as mobile
learning.Mobile learning is a learning model that refers to the use of
information technology devices (IT) and mobile phones, such as PDA, cell
phone, laptop and tablet PCs, in teaching and learning.Expected by the
rituals of Hajj mobile applications will facilitate the prospective pilgrims
can find procedures for proper pilgrimage.
Keywords: Applications, Mobile, Technology
27
Tabel 2.4 Tabel Perbandingan Aplikasi 3
Hal yang
dibandingkan
Fitur pada penulis terkait
(Robimadipa Yanriko)
Fitur pada penulis
sekarang
Penerapan
Aplikasi
Handphone Java
berteknologi J2ME
Smartphone
Android 4.1 keatas
Konten
Multimedia
Teks, Gambar dan Suara Teks, Gambar,
Suara, dan Video
Konten Haji Pencarian istilah-istilah
haji, informasi Haji,
informasi tentang Umrah,
Doa-Doa Haji, Jadwal
Ibadah Haji, Tempat-
Tempat Bersejarah, Tips
Ibadah Haji
Istilah haji,
pengertian haji,
amalan-amalan haji,
peta-peta lokasi
haji, doa-doa haji,
pelaksanaan haji,
Rssfeed tentang
Haji, Tempat-
tempat pelaksanaan
haji
2.12. Metode Pengembangan Penelitian RAD
2.12.1. Definisi RAD
Menurut Pressman (2012) Rapid Application Development (RAD)
adalah sebuah model proses perkembangan perangkat lunak sekuensial
linier yang menekankan siklus perkembangan yang sangat pendek. Model
RAD ini merupakan adaptasi “kecepatan tinggi” dari model sekuensial
linier di mana perkembangan cepat dicapai dengan menggunakan
pendekatan konstruksi berbasis komponen.
Menurut Kendall & Kendall (2010) ada tiga fase dalam model
Rapid Application Development (RAD) yang melibatkan penganalisis dan
pengguna dalam tahap penilaian, perancangan, dan penerapan. Hal penting
dari RAD adalah pengguna dilibatkan dalam setiap bagian upaya
28
pengembangan, dengan partisipasi mendalam dalam bagian perancangan
bisnis.
2.12.2. Tahapan-tahapan RAD
Menurut Kendall dan Kendall (2010) tahapan pengembangan
sistem dalam penelitian dengan menggunakan RAD, yaitu :
1. Tahap perencanaan syarat-syarat
Dalam fase ini, pengguna dan penganalisis bertemu untuk
mengidentifikasikan syarat-syarat informasi yang ditimbulkan
dari tujuan-tujuan aplikasi atau sistem serta untuk
mengidentifikasikan syarat-syarat informasi yang ditimbulkan
dari tujuan-tujuan tersebut. Fase ini memerlukan peran aktif
mendalam dari kedua kelompok tersebut, tidak hanya
menunjukkan proposal atau dokumen. Selain itu, juga
melibatkan pengguna dari beberapa level yang berada dalam
organisasi. Orientasi dalam fase ini ialah menyelesaikan
problem-problem perusahaan. Meskipun teknologi informasi
dan sistem bisa mengarahkan sebagian sistem yang diajukan,
fokusnya akan selalu tetap pada upaya pencapaian perusahaan.
2. Tahap desain workshop RAD
Fase ini adalah fase untuk merancang dan memperbaiki yang
bisa digambarkan sebagai workshop. Saat membayangkan
sebuah workshop, partisipasinya sangat intens, tidak pasif, dan
biasanya bertahap. Biasanya peta partisipan duduk mengitari
meja bulat atau di kursi-kursi yang diatur membentuk huruf U
dilengkapi meja sehingga masing-masing dapat melihat satu
sama lain.
Selama workshop desain RAD, pengguna merespon working
prototype yang ada dan penganalisis memperbaiki modul-
modul yang dirancang berdasarkan respons pengguna. Format
workshop sangat mengagumkan dan mampu memberi
dorongan, dan jika pengguna atau penganalisis yang
29
berpengalaman, tidak diragukan lagi bahwa usaha kreatif ini
dapat mendorong pengembang sampai pada tingkat
terakselerasi.
3. Tahap implementasi
Penganalisis bekerja dengan para pengguna secara intens
selama workshop untuk merancang aspek-aspek bisnis dan
non-teknis dari perusahaan. Segera sesudah aspek-aspek ini
disetujui dan sistem-sistem dibangun dan di-sharing, sistem-
sistem baru atau bagian dari sistem diuji coba dan
diperkenalkan kepada organisasi.
2.13. Pengujian Black-Box
Pengujian black-box berfokus pada persyaratan fungsional perangkat
lunak. Dengan demikian, pengujian black-box memungkinkan perekayasa
perangkat lunak mendapatkan serangkaian kondisi input yang sepenuhnya
menggunakan semua persyaratan fungsional untuk suatu program. Pengujian
black-box bukan merupakan alternative dari teknik white-box, tetapi merupakan
pendekatan komplementer yang kemungkinan besar mampu mengungkap kelas
kesalahan daripada metode white-box. (Pressman, 2010).
Gambar 2.3 Tahapan Rapid Application Development (RAD) ( Kendall & Kendall 2010)
30
Pengujian black-box berusaha menemukan kesalahan dalam kategori
sebagai berikut : (1) fungsi-fungsi yang tidak benar atau hilang (2) kesalahan
interface (3) kesalahan pada struktur data atau akses database eksternal, (4)
kesalahan kinerja dan performa, dan (5) kesalahan inisialisai dan terminasi.
Pengujian black-box cenderung diaplikasikan pada tahap akhir pengujian.
Hal itu karena pengujian black-box mengabaikan kontrol struktur, perhatian
black-box berfokus pada domain informasi.
2.14. Pengujian White-Box
Pengujian white box (glass box) adalah pengujian yang didasarkan pada
pengecekan terhadap detil perancangan, menggunakan struktur kontrol dari desain
program secara prosedural untuk membagi pengujian ke dalam beberapa kasus
pengujian. Penentuan kasus uji disesuaikan dengan struktur sistem, pengetahuan
mengenai program digunakan untuk mengidentifikasikan kasus uji tambahan.
Tujuan penggunaan white box untuk menguji semua statement program.
Penggunaan metode pengujian white box dilakukan untuk :
a. Memberikan jaminan bahwa semua jalur independen suatu modul
digunakan minimal satu kali
b. Menggunakan semua keputusan logis untuk semua kondisi true atau false
c. Mengeksekusi semua perulangan pada batasan nilai dan operasional pada
setiap kondisi.
d. Menggunakan struktur data internal untuk menjamin validitas jalur
keputusan.
2.14.1. Pengujian Basis Path
Pengujian basis path adalah pengujian white box yang diusulkan
pertama kali oleh Tom McCabe. Metode ini memungkinkan penguji dapat
mengukur kompleksitas logis dari desain prosedural dan menggunakannya
sebagai pedoman untuk menetapkan himpunan basis dari semua jalur
eksekusi.
a. Flowgraph (Notasi Diagram Alir)
Notasi yang digunakan untuk menggambarkan jalur eksekusi
adalah notasi diagram alir (atau grafik program), yang menggunakan
31
notasi lingkaran (simpul atau node) dan anak panah (link atau edge).
Notasi ini menggambarkan aliran control logika yang digunakan dalam
suatu bahasa pemrograman.
b. Independent Program Path
Jalur independen adalah jalur yang terdapat dalam program yang
mengintroduksi sedikitnya satu rangkaian pernyataan proses atau
kondisi baru.
c. Cyclomatic Complexity
Kompleksitas Siklomatis adalah metrik perangkat lunak yang
memberikan pengukuran kuantitatif terhadap kompleksitas logis suatu
program, nilai yang didapat akan menentukan jumlah jalur independen
dalam himpunan path, serta akan memberi nilai batas atas bagi jumlah
pengujian yang harus dilakukan, untuk memastikan bahwa semua
pernyataan telah dieksekusi sedikitnya satu kali.
Cyclomatic Complexity dapat dhitung dengan tiga cara :
1) Jumlah Region dari flowgraph sama dengan jumlah
Cyclomatic Complexity
2) Cyclomatic Complexity V(G) untuk flowgraph G dihitung
dengan rumus :
V(G) = E - N + 2
E = Jumlah edge
N = Jumlah node
3) Cyclomatic Complexity V(G) untuk flowgraph G juga dapat
dihitung dengan rumus :
V(G) = P + 1
P = jumlah simpul predikat, simpul Predikat adalah
penggambaran suatu node yang memiliki satu atau
lebih inputan, dan lebih dari satu output.
d. Melakukan Test Case
32
Metode uji coba basis path juga dapat diterapan pada perancangan
prosedural rinci atau program sumber. Langkah-langkah
pembuatan test case adalah sebagai berikut :
1) Menggunakan desain atau kode sebagai dasar dan dibuat
flowgraph-nya.
2) Menentukan cyclomatic complexity dari flowgraph yang
dibuat
3) Menentukan independent path dari flowgraph yang dibuat
4) Mambuat test case yang akan mengerjakan masing-masing
path pada basis set.
2.15. Unified Modeling Language. (UML)
Menurut A.S dan Shalahudin (2011) Unified Modeling Language (UML)
adalah sebuah standarisasi bahasa pemodelan untuk pembangunan perangkat
lunak yang dibangun dengan menggunakan teknik pemrograman berorientasi
objek. UML muncul karena adanya kebutuhan pemodelan visual untuk
menspesifikasikan, menggambarkan, membangun, dan dokumentasi dari sistem
perangkat lunak. UML merupakan bahasa visual untuk pemodelan dan
komunikasi mengenai sebuah sistem dengan menggunakan diagram dan teks-teks
pendukung.
UML terdiri dari 13 macam diagram yang dikelompokkan dalam 3
kategori, diantaranya :
Structure Diagrams yaitu kumpulan diagram yang digunakan untuk
menggambarkan suatu struktur statis dari sistem yang dimodelkan.
Behavior diagrams yaitu kumpulan diagram yang digunakan untuk
menggambarkan kelakuan sistem atau rangkaian perubahan yang terjadi
pada sebuah sistem.
Interaction diagrams yaitu kumpulan diagram yang digunakan untuk
menggambarkan interaksi sistem dengan sistem lain maupun interaksi
antarsubsistem pada suatu sistem.
33
2.16. Diagram Class
Diagram kelas atau class diagram menggambarkan struktur sistem dari
segi pendefinisian kelas-kelas yang akan dibuat untuk membangun sistem. kelas
memiliki 3 bagian utama yaitu attribute, operation, dan name. Kelas-kelas yang
ada pada struktur sistem harus dapat melakukan fungsi-fungsi sesuai dengan
kebutuhan sistem. Sususan struktur kelas ynag baik pada diagram kelas sebaiknya
memiliki jenis-jenis kelas berikut :
Kelas Main. Yaitu kelas yang memiliki fungsi awal dieksekusi ketika
sistem dijalankan.
Kelas Interface. Kelas yang mendefinisikan dan mengatur tampilan ke
pemakai. Biasanya juga disebut kelas boundaries.
Kelas yang diambil dari pendefinisian use case. Merupakan kelas yang
menangani fungsi-fungsi yang harus ada dan diambil dari pendefinisian
use case.
Kelas Entitas. Merupakan kelas yang digunakan untuk memegang atau
membungkus data menjadi sebuah kesatuan yang diambil maupun akan
disimpan ke basis data.
Berikut adalah simbol-simbol yang ada pada diagram kelas :
Tabel 2.5 Tabel Simbol pada Diagram Kelas
Simbol Deskripsi
Kelas
Nama_kelas
+atribut
+operasi()
Kelas pada struktur sistem
Antarmuka / interface
nama_interface
Sama dengan konsep interface dalam
pemograman berorientasi objek
Asosiasi / association
Relasi antar kelas dengan makna
umum, asosiasi biasanya juga disertai
dengan multiplicity
34
Asosiasi berarah / directed association
Relasi antar kelas dengan makna kelas
yang satu digunakan oleh kelas yang
lain, asosiasi biasanya juga disertai
dengan multiplicity
Generalisasi
Relasi antar kelas dengan makna
generalisasi-specialisasi (umum-
khusus)
Keberuntungan / dependency
Relasi antar kelas dengan makna
kebergantungan antar kelas
Agregasi / aggregation
Relasi antar kelas dengan makna
semua-bagian (whole-part)
2.17. Use Case Diagram
Use case atau diagram use case merupakan pemodelan untuk melakukan
sisstem informasi yang akan dibuat. Use Case mendepkrisikan sebuah interaksi
antara satu atau lebih aktor dengan sistem informasi yang akan dibuat. Secara
kasar, use case digunakan untuk mengetahui fungsi apa saja yang ada di dalam
sebuah sistem informasi dan siapa saja yang berhak menggunakan fungsi-fungsi
itu.
Berikut adalah simbol-simbol yang ada pada diagram use case :
Tabel 2.6 Tabel Simbol pada Diagram Use Case
Simbol Deskripsi
Use Case
Fungsionalitas yang disediakan sebagai unit-
unit yang saling bertukar pesan antar unit atau
aktor; biasanya dinyatakan dengan
menggunakan kata kerja diawal frase nama
use case
Aktor / actor
Orang, proses, atau sistem lain yang
berinteraksi dengan sistem informasi yang
akan dibuat di luar sistem informasi yang akan
nama_usecase
35
dibuat itu sendiri; jadi walaupun simbol dari
aktor adalah gambar orang, tapi aktor belum
tentu merupakan orang; biasanya dinyatakan
menggunakan kata benda di awal frase nama
aktor
Asosiasi / association
Komunikasi antara aktor dan use case yang
berpartisipasi pada use case atau use case
memiliki interaksi dengan aktor
Ekstensi / extend
<<extend>>
Relasi use case tambahan ke sebuah use case
dimana use case yang ditambahkan dapat
berdiri sendiri walau tanpa use case tambahan
itu; mirip dengan prinsip inheritance pada
pemograman berorientasi objek; biasanya use
case tambahan memiliki nama depan yang
sama dengan use case yang ditambahan
Generalisasi / generalization
Hubungan generalisasi dan spesialisasi
(umum-khusus) antara dua buah use case
dimana fungsi yang satu adalah fungsi yang
lebih umum dari lainnya.
Menggunakan / Include / uses
<<include>>
<<uses>>
Relasi use case tambahan ke sebuah use case
dimana use case yang ditambahkan
memerlukan use case ini untuk menjalankan
fungsinya atau sebagai syarat dijalankan use
case ini.
2.18. Activity Diagram
Diagram aktifitas atau activity diagram menggambarkan workflow atau
aktifitas dari sebuah sistem atau proses bisnis. Yang perlu diperhatikan disini
adalah bahwa diagram aktifitas menggambarkan aktifitas sistem bukan apa yang
dilakukan aktor, jadi aktifitas yang dilakukan oleh sistem.
36
Berikut adalah simbol-simbol yang ada pada diagram aktifitas :
Tabel 2.7 Tabel Simbol pada Diagram Aktifitas
Simbol Deskripsi
Status awal
Status awal aktifitas sistem, sebuah
diagram aktivitas memiliki sebuah
status awal
Aktifitas
Aktivitas yang dilakukan sistem,
aktivitas biasanya diawali dengan kata
kerja
Percabangan / decision
Asosiasi percabangan dimana jika ada
pilihan aktivitas lebih dari satu
Penggabungan / join
Asosiasi penggabungan dimana lebih
dari satu aktivitas digabungkan menjadi
satu
Status akhir
Status akhir yang dilakukan sistem,
sebuah diagram diaktifitas memiliki
sebuah status akhir.
Swimlane
Atau
Memisahkan organisasi bisnis yang
bertanggung jawab terhadap aktivitas
yang terjadi
37
2.19. Sequence Diagram
Diagram sekuen menggambarkan kelakuan objek pada use case dengan
mendeskripsikan waktu hidup objek dan message yang dikirimkan dan diterima
antarobjek. Oleh karena itu untuk menggambar diagram sekuen maka harus
diketahui objek-objek yang terlibat dalam sebuah use case beserta metode-metode
yag dimiliki kelas yang diinstansiasi menjadi objek itu.
Berikut adalah simbol-simbol yang ada pada diagram sekuen :
Tabel 2.8 Tabel Simbol pada Diagram Sekuen
Simbol Deskripsi
Aktor
Atau
Tanpa waktu aktif
Orang, proses, atau sistem lain yang
berinteraksi dengan sistem informasi
yang akan dibuat di luar sistem
informasi yang akan dibuat itu sendir
i; jadi walaupun simbol dari aktor
adalah gambar orang, tapi aktor belum
tentu merupakan orang; biasanya
dinyatakan menggunakan kata benda di
awal frase nama aktor
Garis hidup / lifeline
Menyatakan kehidupan suatu objek
nama_aktor
38
Objek
Menyatakan objek yang berinteraksi
Waktu aktif
Menyatakan objek dalam keadaan aktif
dan berinteraksi pesan
Pesan tipe create
<<create>>
Menyatakan suatu objek membuat
objek yang lain, arah panah mengarah
pada objek yang dibuat
Pesan tipe call
1: nama_metode()
Menyatakan suatu objek memanggil
operasi/metode yang ada pada objek
lain atau dirinya sendiri
Pesan tipe send
1:masukan
Menyatakan bahwa suatu objek
mengirimkan data/masukan/informasi
ke objek lainnya, arah panah mengarah
pada objek yang dikirimi
Pesan tipe return
1: keluaran
Menyatakan bahwa suatu objek yang
telah menjalankan suatu operasi atau
metode menghasilkan suatu kembalian
ke objek tertentu, arah panah mengarah
pada objek yang menerima kembalian
Pesan tipe destroy
<<destroy>>
Menyatakan suatu objek megakhiri
hidup objek yang lain, arah panah
mengarah pada objek yang diakhiri.
Sebaiknya jika ada create maka ada
destroy
Nama objek : nama kelas
39
BAB III
METODE PENELITIAN
3.1. Metode Pengumpulan Data
Dalam merancang dan membangun aplikasi pada penelitian ini, penulis
melakukan pengumpulan data dengan cara :
3.1.1. Studi Pustaka
Metode ini dilakukan dengan mengumpulkan, membaca dan
mempelajari buku-buku yang berkaitan dengan penelitian ini, yakni
tentang haji dan umrah. Salah satunya adalah buku yang diterbitkan oleh
Departememn Agama RI tentang pelaksanaan haji dan umrah. Penulis juga
mencari data melalui website-website yang berkaitan tentang penelitian ini
sebagai acuan untuk penelitian ini. Selengkapnya dapat dilihat pada daftar
pustaka.
Selain dari buku-buku, metode ini juga dilakukan dengan
mengumpulkan dan membaca jurnal maupun skripsi yang sejenis dan
berkaitan dengan penelitian penulis saat ini. Jurnal dan skripsi ini
dijadikan sebagai bahan acuan dan perbandingan penelitian penulis dengan
penelitian sebelumnya. Lebih lanjut dapat dilihat pada bab 1 subbab 1.1
dan bab 2 subbab 2.11.
3.1.2. Studi Lapangan
Pada metode ini penulis menggunakan salah satu jenis studi
lapangan yaitu kuisioner. Pada metode ini penulis menyebarkan kuisioner
untuk mengetahui permasalahan dan kesulitan pada saat mempelajari haji
dan umrah. Kuisioner ini juga bertujuan untuk mengetahui keinginan yang
diharapkan oleh calon pengguna aplikasi serta menganalisa kelayakan
aplikasi. Hasil kuisioner akan dijadikan sebagai sampel data.
40
Kuisioner ditujukan kepada 50 orang berusia 25-50 tahun yang
beragama Islam dan telah menggunakan smartphone berbasis android.
Lembar kuisioner dan hasil kuisioner dapat dilihat pada lampiran.
3.2. Metodologi Pengembangan Sistem
Metologi yang digunakan pada perancangan dan pembangunan aplikasi ini
adalah Metodologi Pengembangan Sistem Rapid Application Development (RAD).
Penulis menggunakan metode ini karena metode ini cocok untuk pengembangan
aplikasi yang akan dirancang oleh penulis dan menekankan kecepatan dalam
membuat aplikasi.
Menurut E. Kendall dan Julie E. Kendall (2010), pada model RAD ini
meliputi tahap-tahap berikut berikut:
3.2.1. Fase perencanaan syarat-syarat
Dalam fase ini, penulis melakukan hal sebagai berikut :
1. Mencari informasi tentang haji dan umrah
2. Mengidentifikasi tujuan-tujuan aplikasi
3. Menentukan fitur-fitur yang ada pada aplikasi yang akan dibangun
4. Kebutuhan hardware dan software untuk membangun aplikasi
3.2.2. Tahap Desain (Desain Workshop)
Pada fase ini penulis mendesain aplikasi yang akan dibangun yang
sesuai dengan tujuan penelitian dan masalah yang dihadapi. Fase
perancangan ini penulis bagi menjadi 3 tahap diantaranya :
a. Tahap Perancangan Proses.
Dalam merancang proses pada aplikasi, penulis menggunakan
diagram UML. Diagram pada UML yang digunakan oleh penulis
diantaranya adalah use case diagram, activity diagram, dan sequence
diagram.
1. Use Case
Use case mendepkrisikan sebuah interaksi antara satu atau
lebih aktor dengan sistem informasi yang akan dibuat. Penulis
menggunakan use case untuk mengetahui fungsi apa saja yang ada
41
di dalam sebuah sistem informasi dan siapa saja yang berhak
menggunakan fungsi-fungsi itu. Use case yang digunakan penulis
diantaranya adalah sebagai berikut :
Tabel 3.1. Tabel Use Case yang Digunakan dalam Penelitian
No Nama Use Case Aktor
1 Pengenalan Haji & Umrah Pengguna
2 Pengenalan Haji Pengguna
3 Detail Pengenalan Haji Pengguna
4 Pengenalan Umrah Pengguna
5 Detail Pengenalan Umrah Pengguna
6 Hikmah Haji & Umrah Pengguna
7 Detail Hikmah Haji & umrah Pengguna
8 Persiapan Haji Pengguna
9 Detail Persiapan Haji Pengguna
10 Pelaksanaan Haji Pengguna
11 Detail Pelaksanaan Haji Pengguna
12 Do‟a Haji & Umrah Pengguna
13 Detail Doa Haji & umrah Pengguna
14 Berita Haji Pengguna
15 Detail berita Pengguna
16 Detail Pengumuman Pengguna
17 Peta Lokasi Pengguna
18 Detail Peta Lokasi Pengguna
19 Video Haji Pengguna
20 Amalan Haji Pengguna
21 Detail Amalan Haji Pengguna
22 Istilah Haji Pengguna
42
23 Detail Istilah Haji Pengguna
24 Cek Keberangkatan Haji Pengguna
2. Activity diagram
Penulis menggunakan activity diagram untuk menggambarkan
workflow atau aktifitas dari sebuah sistem. Activity diagram yang
digunakan penulis diantaranya adalah sebagai berikut :
Tabel 3.2. Tabel Activity Diagram yang Digunakan dalam Penelitian
No Nama Use Case Aktor
1 Pengenalan Haji dan Umrah Pengguna
2 Pengenalan Haji Pengguna
3 Detail Pengenalan Haji Pengguna
4 Pengenalan Umrah Pengguna
5 Detail Pengenalan Umrah Pengguna
6 Hikmah Haji dan Umrah Pengguna
7 Detail Hikmah haji dan umrah Pengguna
8 Persiapan Haji Pengguna
9 Detail Persiapan Haji Pengguna
10 Pelaksanaan Haji Pengguna
11 Detail Pelaksanaan Haji Pengguna
12 Do‟a – Do‟a haji dan Umrah Pengguna
13 Detail Doa-doa haji dan umrah Pengguna
14 Berita Haji Pengguna
15 Detail berita Pengguna
16 Detail Pengumuman Pengguna
17 Peta Lokasi Pengguna
18 Detail Peta Lokasi Pengguna
19 Video Haji Pengguna
43
20 Amalan – Amalan Haji Pengguna
21 Detail Amalan Haji Pengguna
22 Istilah pada Haji Pengguna
23 Detail Istilah Haji Pengguna
24 Cek Keberangkatan Haji Pengguna
3. Diagram sequence
Penulis menggunakan Diagram sekuen untuk menggambarkan
kelakuan objek pada use case dengan mendeskripsikan waktu
hidup objek dan message yang dikirimkan dan diterima antarobjek
b. Tahap Perancangan Interface
Pada tahap ini, penulis merancang tampilan antar muka yang sesuai
dengan kebutuhan sehingga pengguna akan mudah menggunakan
aplikasi dan mendapatkan informasi secara mudah. Penulis
menggunakan situs http://www.google.com/design/spec/material-
design/introduction.html yang dibuat oleh Google sebagai acuan dan
pedoman untuk merancang interface pada aplikasi ini. Rancangan
interface yang penulis buat pada tahap ini antara lain:
1. Rancangan tampilan menu utama
2. Rancangan tampilan bahasan haji
3. Rancangan tampilan doa haji
4. Rancangan tampilan video haji
5. Rancangan tampilan list berita
6. Rancangan tampilan berita haji
7. Rancangan tampilan cek keberangkatan haji
c. Tahap Perancangan Database
Pada tahap ini, penulis merancang database yang akan digunakan
pada aplikasi yang sesuai dengan kebutuhan aplikasi. Database
dirancang dengan meggunakan SQLite. Tabel-tabel pada database yang
akan dibuat adalah:
1. Tabel konten
44
2. Tabel doa
3. Tabel istilah
4. Tabel lokasi
5. Tabel berita
d. Membangun sistem (Pengkodean)
Pada fase ini setiap desain yang diciptakan dalam fase sebelumnya
selanjutnya ditingkatkan dengan menggunakan perangkat-perangkat
lunak. Penulis menggunakan perangkat lunak diantaranya, Java
Development Kit (JDK), Android Studio IDE, dan Android Software
Development Kit (SDK). Apabila sistem yang dibangun telah cocok,
maka selanjutnya akan dilakukan implementasi dan pengujian.
3.2.3. Fase Implementasi/Pelaksanaan
Pada tahap ini, penulis melakukan tahap-tahap berikut :
1. Implementasi pada perangkat keras dan lunak
2. Implementasi antarmuka
3. Instalasi pada perangkat Android
4. Pengujian aplikasi dengan metode whitebox dan blackbox
3.3. Alur/Kerangka Berfikir
Alur/kerangka berfikir menggambarkan secara keseluruhan alur yang
digunakan dalam penyelesaian skripsi. Alur yang digunakan penulis adalah
sebagai berikut :
45
Start
Mengidentifikasi
Masalah
Studi Pustaka Studi Lapangan
Fase
Perancanaan
Syarat-syarat
Mencari informasi
Mengidentifikasi tujuan
Design
Workshop
Menentukan fitur
Kebutuhan HW
dan SW
Use Case
Diagram Case
Diagram
Sequence
Actifty Diagram
Fase
Implementasi
Implementasi pada
perangkat
Implementasi
antarmuka
Instalasi pada
perangkat android
Pengujian blackbox
Kesimpulan dan
Saran
End
Perancanan
proses
Perancangan
interface
Perancangan
database
Membangun
Sistem
Mendesain sistem
Pengkodean
Apakah
Sesuai?
Ya
Metodologi RAD
Menidentifikasi Syarat-
syarat informasi
Gambar 3.1 Alur Pemikiran Penelitian
46
BAB IV
PERANCANGAN DAN IMPLEMENTASI
Perancangan Aplikasi Pembelajaran Haji dan Umrah pada smartphone
dirancang berdasarkan metode RAD yang mempunyai 4 fase.
4.1. Tahap Perencanaan Syarat-Syarat
Pada tahap ini penulis melakukan identifikasi syarat –syarat informasi
yang diperlukan dan menentukan tujuan dari dibangunnya sistem. Hal-hal yang
dilakukan penulis diantaranya :
4.1.1. Mencari Informasi Tentang Haji dan Umrah
Pada tahap ini peneliti melakukan pencarian referensi berupa buku,
e-book, dan jurnal mengenai haji dan umrah yang dapat digunakan sebagai
informasi pada aplikasi.
4.1.2. Mengidentifikasi Tujuan –Tujuan Aplikasi
Dalam fase ini penulis menentukan tujuan dibangunnya aplikasi ini
agar sesuai dengan kebutuhan pengguna saat ini. Tujuan tersebut
diantaranya adalah:
1) Merancang suatu aplikasi yang berkaitan tentang haji dan umrah
yang praktis dan efektif
2) Memudahkan para kaum muslim dan calon jamaah haji maupun
umrah di Indonesia dalam mengakses dan mendapatkan informasi
tentang haji dan umrah
3) Memudahkan para kaum muslin dan calon jamaah haji untuk
mempelajari tata cara melaksanakan haji dengan baik dan benar
4.1.3. Menentukan Fitur-Fitur yang Akan Ada pada Aplikasi
Pada fase ini penulis menentukan fitur-fitur pada aplikasi yang
dibutuhkan agar sesuai dengan tujuan dari perancangan aplikasi ini. Fitur-
fitur yang berkaitan dengan penjelasan dan pelaksanaan haji dan umrah
47
diambil dari buku-buku studi tentang haji dan umrah. Sumber buku-buku
tersebut dapat dilihat pada daftar pustaka. Fitur-fitur keseluruhan yang
akan ada pada aplikasi diantaranya adalah :
a. Menampilkan penjelasan tentang haji dan umrah, diantaranya
pengertian, rukun, wajib, syarat sah haji dan umrah dan hikmah
dibalik melakukan hal-hal tersebut.
b. Menampilkan kumpulan do‟a- do‟a haji beserta dengan suara
dan terjemahannya agar lebih mudah dimengerti. Kumpulan
do‟a – do‟a tersebut diantaranya :
• Niat haji
o Haji tamattu‟
o Haji ifrad
o Haji qiran
• Niat umrah
• Do‟a setelah ihram
• Do‟a talbiyah
• Shalawat nabi
• Do‟a setelah shalawat
• Do’a masuk Makkah
• Do‟a masuk masjidil haram
• Do‟a melihat Ka‟bah
• Do‟a melintasi maqam Ibrahim AS
• Do‟a thawaf
o Do‟a pada putaran ke-1 sampai ke-7
o Do‟a diantara rukun yamani dan hajar aswad
• Do‟a waktu minum air zam-zam
• Do‟a sa‟i
o Do‟a ketika mendaki bukit Shafa
o Do‟a diatas bukit Shafa
o Do‟a perjalanan pertama sampai ketujuh diantara bukit
Shafa dan Marwah
48
o Do‟a diantara dua pilar/lampu hijau
o Do‟a ketika mendekati bukit Shawa atau Marwah
• Do‟a menggunting rambut
• Do‟a setelah menggunting rambut
• Do‟a wukuf
o Do‟a ketika berangkat ke Arafah
o Do‟a ketika masuk Arafah
o Do‟a wukuf
o Do‟a ketika sampai di Muzdalifah
o Do‟a ketika sampai di Mina
o Do‟a melontar jumrah
o Do‟a setelah melontar tiga jumrah
• Do‟a thawaf wada
o Do‟a thawaf wada
o Do‟a sesudah thawaf wada
• Do‟a berziarah
c. Menampilkan tata cara melaksanakan haji dan umrah. Untuk
haji, hanya menjelaskan tentang haji tamattu‟. Kegiatannya
diantara lain :
Pengertian Haji
tamattu’
Melaksanakan
ihram
Melaksanakan
thawaf
Melaksanakan sa‟i
Melaksanakan tahallul
Kegiatan sebelum
wukuf
Melaksanakan wukuf
d. Menampilkan persiapan – persiapan yang harus dilakukan
sebelum melaksanakan haji diantaranya:
Persiapan Mental dan Fisik
Persiapan Material dan Bekal
Kiat untuk menjadi Haji Mabrur
49
e. Menampilkan peta sekitar lokasi pelaksanaan haji, offline
maupun online. Lokasi tersebut diantaranya :
Makkah
Madinah
Masjidil Haram
Masjid Nabawi
Gua hira
Mina
Muzdalifah
Jeddah
Jabal Rahmah
Masjid Quba
f. Menampilkan istilah – istilah yang sering dipakai pada
pelaksanaan haji dan umrah.
g. Menampilkan berita terkini tentang haji dan umrah secara
online yang diambil dari
http://haji.kemenag.go.id/v2/publikasi/berita/ dengan
menggunakan JSOUP dan di-parsing data-datanya agar dapat
dilihat pada mobile device. Berita tersebut dapat ditampilkan
disimpan (bookmark) pada database agar dapat dibaca secara
offline.
h. Menampilkan pengumuman yang diumumkan Kementerian
Agama melalui situs
http://haji.kemenag.go.id/v2/publikasi/pengumuman.
i. Menampilkan video tata cara melaksanakan haji dan umrah
secara online. Video-video tersebut diantaranya :
Pengertian haji
Pelaksanaan haji
dan umrah
Kiat haji mabrur
Benda bawaan
Jemaah
Di pesawat
Niat umrah
Niat haji
Do‟a setelah ihram
Larangan pada ihram
Hikmah ihram
Thawaf
Tempat air zamzam
Sa‟i
Tahallul
Wukuf
Thawaf ifadhah
Thawaf wada
Hikmah haji
14 Dzulhijjah
50
j. Melakukan pengecekan tanggal keberangkatan haji yang
datanya diambil dari situs
http://haji.kemenag.go.id/v2/node/955358.
4.1.4. Kebutuhan Hardware dan Software
Dalam tahap ini peneliti mengidentifikasi kebutuhan prototype
aplikasi yang meliputi kelengkapan software dan hardware yang akan
digunakan.
1) Kelengkapan Software yang digunakan
a. Image Editor (Photoshop/Paint) untuk mengedit gambar
yang digunakan pada aplikasi
b. Android SDK (Software Development Kit) sebagai alat
bantu dan Application Programming Interface (API) dalam
mengembangkan aplikasi pada platform android.
c. Sublime text editor 2 sebagai text editor untuk membuat file
HTML
d. Android Studio 1.2.1 sebagai Integrated Development
Enviroment (IDE) untuk source code aplikasi Android.
e. SQLite Browser sebagai aplikasi membuat dan mengedit
database SQLite.
f. Sistem operasi Windows 7.
2) Kelengkapan Hardware yang digunakan
a. Notebook Toshiba Satelite Pro C640 dengan spesifikasi
sebagai berikut :
a. Processor Intel Core i3
b. Memory Ram 4GB
c. 320GB HDD
b. Smartphone Android.. Dalam hal ini penulis menggunakan
smartphone Android One, Nexian Journey One.
c. Kabel data untuk mentransfer file aplikasi dari PC ke
smartphone.
51
4.2. Tahap Perancangan (Design Workshop)
Pada fase perancangan pengguna merancang sistem yang akan dibuat agar
sesuai dengan tujuan pembuatan aplikasi. Hasil perancangan ini nantinya akan
dijadikan sebagai panduan untuk fase berikutnya. Gambaran umum perancangan
yang akan dibuat oleh penulis pada aplikasi pembelajaran haji dan umrah adalah
sebagai berikut
Gambar 4.01 Perancangan Sistem dari Aplikasi
Gambar di atas menggambarkan bahwa aplikasi ini menggunakan internet
service dan database SQLite. Internet service atau layanan internet digunakan
mengakses berita-berita terkini lalu menampilkannya ke smartphone. Selain itu
layanan internet juga digunakan untuk mengakses Google Map APIv2 untuk
menampilkan lokasi pengguna ataupun lokasi-lokasi yang berkaitan dengan haji
dan umrah. SQLite digunakan untuk menyimpan konten-konten aplikasi berupa
alamat-alamat file yang akan digunakan oleh aplikasi untuk ditampilan ke
pengguna. SQLite juga digunakan untuk menyimpan berita-berita yang didapat
dari internet.
4.2.1. Tahap Perancangan Proses
Pada tahap perancangan proses pada aplikasi, penulis
menggunakan diagram UML. Diagram pada UML yang digunakan oleh
penulis yang menurut penulis dibutuhkan untuk membangun aplikasi ini
diantaranya adalah use case diagram, activity diagram, dan sequence
diagram,
52
a. Use Case Diagram
Use Case mendepkrisikan sebuah interaksi antara satu atau lebih
aktor dengan sistem informasi yang akan dibuat. Penulis menggunakan
use case untuk mengetahui fungsi apa saja yang ada di dalam sebuah
sistem informasi dan siapa saja yang berhak menggunakan fungsi-
fungsi itu. Penjelasan Use Case yang digunakan penulis diantaranya
adalah seperti yang dijelaskan pada table 4.1 dan 4.2 berikut :
Table 4.1. Tabel Aktor pada Use Case
No Actor Deskripsi
1 Pengguna Orang yang melihat dan
menggunakan apikasi pembelajaran
haji dan umrah yang telah terpasang
pada smartphone android
Tabel 4.2. Tabel Diagram Use Case
No Nama Use
Case
Deskripsi
1 Pengenalan
Haji & Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat Menu
pengenalan Haji dan Umrah
2 Pengenalan
Haji
Use Case untuk menggambarkan
kegiatan untuk melihat menu
pengenalan haji yang terdiri dari
pengertian haji, rukun haji, syarat haji,
dan wajib haji.
3 Detail
Pengenalan
Haji
Use Case untuk menggambarkan
kegiatan untuk melihat penjelasan
detail tentang pengenalan haji yang
terdiri dari pengertian haji, rukun haji,
syarat haji, dan wajib haji.
4 Pengenalan
Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat menu
53
pengenalan Umrah yang terdiri dari
pengertian haji, hukum haji, syarat
haji, dan wajib haji.
5 Detail
Pengenalan
Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat penjelasan
detail tentang pengenalan umrah yang
terdiri dari pengertian umrah, rukun
umrah, syarat umrah, dan wajib
umrah.
6 Hikmah Haji
& Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat menu Hikmah
Haji & Umrah
7 Detail Hikmah
Haji & Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat penjelasan
detail tentang hikmah haji dan umrah
yang bagian-bagiannya dapat dilihat
pada Bab IV subbab 4.1.2
8 Persiapan Haji Use Case untuk menggambarkan
kegiatan untuk melihat menu
persiapan haji yang bagian-bagiannya
dapat dilihat pada Bab IV subbab 4.1.2
9 Detail
Persiapan Haji
Use Case untuk menggambarkan
kegiatan untuk melihat penjelasan
detail tentang persiapan haji yang
bagian-bagiannya dapat dilihat pada
Bab IV subbab 4.1.2
10 Pelaksanaan
Haji
Use Case untuk menggambarkan
kegiatan untuk melihat menu
Pelaksanaan Haji
11 Detail
Pelaksanaan
Haji
Use Case untuk menggambarkan
kegiatan untuk melihat detail tentang
pelaksanaan haji yang bagian-
54
bagiannya dapat dilihat pada Bab IV
subbab 4.1.2
12 Do‟a – Do‟a
Haji dan
Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat menu doa‟ –
do‟a
13 Detail doa-doa
haji dan umrah
Use Case untuk menggambarkan
kegiatan untuk melihat detail tentang
doa-doa haji dan umrah yang bagian-
bagiannya dapat dilihat pada Bab IV
subbab 4.1.2
14 Berita Haji
dan Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat menu berita
haji dan umrah
15 Detail Berita
Haji dan
Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat berita haji dan
umrah
16 Detail
Pengumuman
Haji dan
Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat pengumuman
haji dan umrah
17 Peta Haji dan
Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat peta lokasi haji
dan umrah yang bagian-bagiannya
dapat dilihat pada Bab IV subbab 4.1.2
18 Detail Peta
Lokasi
Use Case untuk menggambarkan
kegiatan untuk melihat detail tentang
doa-doa haji dan umrah yang bagian-
bagiannya dapat dilihat pada Bab IV
subbab 4.1.2
19 Video Haji Use Case untuk menggambarkan
kegiatan untuk melihat menu video
haji
55
20 Amalan-
amalan haji
dan umrah
Use Case untuk menggambarkan
kegiatan untuk melihat amalan amalan
haji dan umrah yang bagian-bagiannya
dapat dilihat pada bab IV sub bab
4.1.2
21 Detail amalan
haji
Use Case untuk menggambarkan
kegiatan untuk melihat detail tentang
amalan haji dan umrah yang bagian-
bagiannya dapat dilihat pada Bab IV
subbab 4.1.2
22 Istilah pada
Haji dan
Umrah
Use Case untuk menggambarkan
kegiatan untuk melihat menu istilah –
istilah haji
23 Detail istilah
haji dan umrah
Use Case untuk menggambarkan
kegiatan untuk melihat detail tentang
istilah haji dan umrah yang bagian-
bagiannya dapat dilihat pada Bab IV
subbab 4.1.2
24 Cek
Keberangkatan
Haji dan
Umrah
Use Case untuk menggambarkan
kegiatan untuk mengecek
keberangkatan haji
Dibawah ini adalah use case yang menggambarkan kegiatan aktor.
56
Gambar 4.02 Kegiatan Aktor dalam Use Case
57
Gambar diatas menjelaskan bahwa aktor yaitu pengguna dapat
melihat semua use case yang ada seperti pengenalan haji & umrah,
persiapan haji, pelaksanaan haji, do‟a haji, amalan haji, berita haji, peta
lokasi, video haji, istilah haji dan lain-lain.
Dibawah ini merupakan use case scenario yang menggambarkan
alur dari proses setiap use case yang ada.
Tabel 4.3. Use Case Scenario Pengenalan Haji & Umrah
Use Case Pengenalan Haji & Umrah
Use case ID 1
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
Menu pengenalan Haji dan Umrah
Pre-condition Pengguna menekan menu pengenalan haji
dan umrah
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pengenalan haji &
umrah
2. Menampilkan isi
menu pengenalan
haji dan umrah,
yaitu Haji dan
Umrah
Alternate course -
Conclution Pengguna dapat melihat is menu
pengenalan Haji dan Umrah yaitu Haji dan
Umrah
Post Condition Menu Haji dan Umrah tampil dilayar
pengguna
Tabel 4.4. Use Case Scenario Pengenalan Haji
Use Case Pengenalan Haji
Use case ID 2
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
Menu Haji
Pre-condition Pengguna menekan menu haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pengenalan haji &
umrah
2. Menampilkan isi
menu pengenalan
haji dan umrah,
yaitu Haji dan
Umrah
3.Pengguna
mengklik menu
Haji
4.Menampilkan isi
menu Haji
Alternate course -
58
Conclution Pengguna dapat melihat isi menu
Pengenalan Haji yaitu Pengertian, Hukum,
Rukun, Syarat, dan Wajib Haji
Post Condition Menu Haji tampil dilayar pengguna
Tabel 4.5 Use Case Scenario Detail Pengenalan Haji
Use Case Detail Pengenalan Haji
Use case ID 3
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada pengenalan
haji yang bagian-bagiannya dapat dilihat
pada bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada
pengenalan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pengenalan haji &
umrah
2. Menampilkan isi
menu pengenalan
haji dan umrah,
yaitu Haji dan
Umrah
3.Pengguna
mengklik menu
pengenalan Haji
4.Menampilkan isi
menu pengenalan
Haji
5.Pengguna
mengklik salah
satu menu-menu
pada pengenalan
haji
6.Menampilkan isi
menu yang dipilih
pada pengenalan
haji
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
menu yang dipilih pada pengenalan haji
Post Condition Detail menu pengenalan haji tampil
dilayar pengguna
Tabel 4.6. Use Case Scenario Pengenalan Umrah
Use Case Pengenalan Umrah
Use case ID 4
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu pengenalan mrah
Pre-condition Pengguna menekan menu Pengenalan haji
dan umrah
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pengenalan haji &
umrah
2. Menampilkan isi
menu pengenalan
haji dan umrah,
yaitu Haji dan
Umrah
59
3.Pengguna
mengklik menu
pengenalan mrah
4.Menampilkan isi
menu pengenalan
Umrah
Alternate course -
Conclution Pengguna dapat melihat isi menu
pengenalan umrah yaitu Pengertian,
Hukum, Rukun, Syarat, dan Wajib umrah
Post Condition Menu pengenalan umrah tampil dilayar
pengguna
Tabel 4.7. Use Case Scenario Detail Pengenalan Umrah
Use Case Detail Pengenalan Umrah
Use case ID 5
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada pengenalan
umrah yang bagian-bagiannya dapat
dilihat pada bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada
pengenalan umrah
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pengenalan haji &
umrah
2. Menampilkan isi
menu pengenalan
haji dan umrah,
yaitu Haji dan
Umrah
3.Pengguna
mengklik menu
pengenalan umrah
4.Menampilkan isi
menu pengenalan
umrah
5.Pengguna
mengklik salah
satu menu-menu
pada pengenalan
umrah
6.Menampilkan isi
menu yang dipilih
pada pengenalan
umrah
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
menu yang dipilih pada pengenalan umrah
Post Condition Detail menu pengenalan umrah tampil
dilayar pengguna
Tabel 4.8. Use Case Scenario Hikmah Haji & Umrah
Use Case Hikmah Haji dan Umrah
Use case ID 6
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu Hikmah haji dan umrah
Pre-condition Pengguna menekan menu Hikmah haji dan
Umrah
Course of event Actor Action System Response
60
1. Pengguna
mengklik menu
hikmah haji &
umrah
2. Menampilkan isi
menu hikmah haji
dan umrah
Alternate course -
Conclution Pengguna dapat melihat menu hikmah dan
umrah
Post Condition Menu hikmah haji dan umrah tampil
dilayar pengguna
Tabel 4.9. Use Case Scenario Detail Hikmah Haji & Umrah
Use Case Detail hikmah haji dan umrah
Use case ID 7
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada hikmah haji
dan umrah yang bagian-bagiannya dapat
dilihat pada bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada
hikmah haji dan umrah
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pengenalan haji &
umrah
2. Menampilkan isi
menu pengenalan
haji dan umrah
3.Pengguna
mengklik menu
hikmah haji dan
umrah
4.Menampilkan isi
menu hikmah haji
dan umrah
5.Pengguna
mengklik salah
satu menu-menu
pada hikmah haji
dan umrah
6.Menampilkan isi
menu yang dipilih
pada hikmah haji
dan umrah
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
menu yang dipilih pada hikmah haji dan
umrah
Post Condition Detail hikmah haji dan umrah tampil
dilayar pengguna
Tabel 4.10. Use Case Scenario Persiapan Haji
Use Case Persiapan Haji
Use case ID 8
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu persiapan haji
Pre-condition Pengguna menekan menu persiapan haji
Course of event Actor Action System Response
61
1. Pengguna
mengklik menu
persiapan haji
2. Menampilkan isi
menu persiapan haji
Alternate course -
Conclution Pengguna dapat melihat is menu persiapan
haji
Post Condition Menu persiapan haji tampil dilayar
pengguna
Tabel 4.11. Use Case Scenario Detail Persiapan Haji
Use Case Detail persiapan haji
Use case ID 9
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada persiapan haji
yang bagian-bagiannya dapat dilihat pada
bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada
persiapan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
persiapan haji
2. Menampilkan
menu pada
persiapan haji
3.Pengguna
mengklik salah
satu menu-menu
pada persiapan haji
4.Menampilkan isi
menu yang dipilih
pada persiapan haji
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
menu yang dipilih pada persiapan haji
Post Condition Detail menu persiapan haji tampil dilayar
pengguna
Tabel 4.12. Use Case Scenario Pelaksanaan Haji
Use Case Pelaksanaan haji
Use case ID 10
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu pelaksanaan haji
Pre-condition Pengguna menekan menu persiapan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pelaksanaan haji
2. Menampilkan isi
menu pelaksanaan
haji
Alternate course -
Conclution Pengguna dapat melihat is menu
pelaksanaan haji
62
Post Condition Menu pelaksanaan haji tampil dilayar
pengguna
Tabel 4.13. Use Case Scenario Detail Pelaksanaan Haji
Use Case Detail Pelaksanaan Haji
Use case ID 11
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada pelaksaaan
haji yang bagian-bagiannya dapat dilihat
pada bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada
pelaksanaan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
pelaksanaan haji
2. Menampilkan isi
menu pelaksanaan
haji
3. Pengguna
mengklik menu
yang ada pada
pelaksanaan haji
4.Menampilkan isi
menu yang dipilih
pada pelaksanaan
haji
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
menu yang dipilih pada pelaksanaan haji
Post Condition Detail menu pelaksanaan haji tampil
dilayar pengguna
Tabel 4.14. Use Case Scenario Doa Haji & Umrah
Use Case Doa haji dan umrah
Use case ID 12
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu doa haji dan umrah
Pre-condition Pengguna menekan menu doa haji dan
umrah
Course of event Actor Action System Response
1. Pengguna
mengklik menu
doa haji dan umrah
2. Menampilkan isi
menu doa haji dan
umrah
Alternate course -
Conclution Pengguna dapat melihat is menu doa haji
dan umrah
Post Condition Menu doa haji dan umrah tampil dilayar
pengguna
Tabel 4.15. Use Case Scenario Detail Doa-Doa Haji dan Umrah
Use Case Detail doa-doa haji dan umrah
Use case ID 13
Actor Pengguna
63
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada doa-doa haji
dan umrah yang bagian-bagiannya dapat
dilihat pada bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada doa
haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
doa haji dan umrah
2. Menampilkan isi
menu doa haji dan
umrah
5.Pengguna
mengklik salah
satu menu-menu
pada doa haji dan
umrah
4.Menampilkan isi
menu yang dipilih
pada doa haji dan
umrah
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
menu yang dipilih pada doa haji dan
umrah
Post Condition Detail menu doa haji dan umrah tampil
dilayar pengguna
Tabel 4.16. Use Case Scenario Berita Haji
Use Case Berita haji
Use case ID 14
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu berita haji
Pre-condition Pengguna menekan menu persiapan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
berita haji dan
memilih tab berita
2.Memparsing
halaman berita dari
internet
3. Menampilkan isi
berita haji dalam list
Alternate course -Jika tidak ada koneksi internet, maka
aplikasi tidak akan memparsing halaman
berita dari internet
Conclution Pengguna dapat melihat isi berita haji
Post Condition List berita haji tampil dilayar pengguna
Tabel 4.17. Use Case Scenario Detail Berita
Use Case Detail berita
Use case ID 15
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari list-list berita yang terdapat
pada berita haji
Pre-condition Pengguna menekan list pada berita haji
64
Course of event Actor Action System Response
1. Pengguna
mengklik menu
berita haji dan
memilih tab berita
2.Memparsing
halaman berita dari
internet
3. Menampilkan isi
berita haji dalam list
5.Pengguna
mengklik salah
satu list pada berita
haji
6.Menampilkan isi
berita yang dipilih
pada list berita haji
Alternate course -
Conclution Pengguna dapat melihat detail dari berita
yang dipilih pada berita haji
Post Condition Detail dari berita yang dipilih tampil
dilayar pengguna
Tabel 4.18. Use Case Scenario Detail Pengumuman
Use Case Detail pengumuman
Use case ID 16
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari list-list pengumuman yang
terdapat pada berita haji
Pre-condition Pengguna menekan list pada pengumuman
Course of event Actor Action System Response
1. Pengguna
mengklik menu
berita haji dan
memilih tab
pengumuman
2.Memparsing
halaman
pengumuman dari
internet
3. Menampilkan isi
berita haji dalam list
5.Pengguna
mengklik salah
satu list
pengumuman pada
berita haji
6.Menampilkan isi
berita yang dipilih
pada list
pengumuman
Alternate course -
Conclution Pengguna dapat melihat detail dari
pengumuman yang dipilih pada berita haji
Post Condition Detail dari pengumuman yang dipilih
tampil dilayar pengguna
Tabel 4.19. Use Case Scenario Peta Lokasi
Use Case Peta lokasi
Use case ID 17
Actor Pengguna
Description menggambarkan kegiatan untuk melihat
menu peta lokasi yang bagian-bagiannya
dapat dilihat pada bab IV 4.1.2
65
Pre-condition Pengguna menekan menu persiapan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
peta lokasi
2. Menampilkan isi
menu peta lokasi
Alternate course -
Conclution Pengguna dapat melihat is menu peta lokasi
Post Condition Menu meta lokasi tampil dilayar pengguna
Tabel 4.20. Use Case Scenario Detail Peta Lokasi
Use Case Detail peta lokasi
Use case ID 18
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada peta lokasi
beserta mapnya yang bagian-bagiannya
dapat dilihat pada bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada peta
lokasi
Course of event Actor Action System Response
1. Pengguna
mengklik menu
peta lokasi
2. Menampilkan isi
menu pada peta
lokasi
2. Pengguna
mengklik salah
satu menu-menu
pada peta lokasi
4.Menampilkan isi
menu yang dipilih
pada peta lokasi
5.mendapatkan
longitude dan
latitude sesuai
dengan yang dipilih
dan menampilkan
lokasi yang sesuai
Alternate course -
Conclution Pengguna dapat melihat detail dan peta
dari lokasi yang dipilih pada peta lokasi
Post Condition Detail peta lokasi dan petanya tampil
dilayar pengguna
Tabel 4.21. Use Case Scenario Video Haji
Use Case Video haji
Use case ID 19
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu video haji
Pre-condition Pengguna menekan menu persiapan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
2. Menampilkan isi
menu pada video
66
video haji
3. pengguna
memilih video yang
diinginkan
haji
4. menampilkan
video yang dipilih
Alternate course -
Conclution Pengguna dapat melihat menu video haji
Post Condition video haji yang dipilih tampil dilayar
pengguna
Tabel 4.22. Use Case Scenario Amalan Haji
Use Case Amalan haji
Use case ID 20
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu amalan haji
Pre-condition Pengguna menekan menu amalan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
amalan haji
2. Menampilkan isi
menu pada amalan
haji
Alternate course -
Conclution Pengguna dapat melihat is menu amalan
haji
Post Condition Menu amalan haji tampil dilayar pengguna
Tabel 4.23. Use Case Scenario Detail Amalan Haji
Use Case Detail amalan haji
Use case ID 21
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada amalan haji
yang bagian-bagiannya dapat dilihat pada
bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada
amalan haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
amalan haji &
umrah
2. Menampilkan
menu pada amalan
haji
3.Pengguna
mengklik menu
pada amalan haji
4.Menampilkan
menu pada amalan
Haji
5.Pengguna
mengklik salah
satu menu-menu
pada amalan haji
6.Menampilkan isi
menu yang dipilih
pada amalan haji
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
67
menu yang dipilih pada pengenalan haji
Post Condition Detail menu pengenalan haji tampil
dilayar pengguna
Tabel 4.24. Use Case Scenario Istilah Haji
Use Case Istilah haji
Use case ID 22
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
menu istilah haji
Pre-condition Pengguna menekan menu istilah haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
istilah haji
2. Menampilkan isi
menu istilah haji
Alternate course -
Conclution Pengguna dapat melihat is menu istillah
haji
Post Condition Menu istilah haji tampil dilayar pengguna
Tabel Use 4.25. Case Scenario Detail istilah Haji
Use Case Detail istilah haji
Use case ID 23
Actor Pengguna
Description menggambarkan kegitatan untuk melihat
detail dari menu-menu pada istilah
hajiyang bagian-bagiannya dapat dilihat
pada bab IV 4.1.2
Pre-condition Pengguna menekan menu-menu pada
istilah haji
Course of event Actor Action System Response
1. Pengguna
mengklik menu
istilah haji &
umrah
2. Menampilkan isi
menu istilah haji
dan umrah
5.Pengguna
mengklik salah
satu menu-menu
pada istilah haji
6.Menampilkan isi
menu yang dipilih
pada istilah haji
Alternate course -
Conclution Pengguna dapat melihat detail dari menu-
menu yang dipilih pada istilah haji
Post Condition Detail menu istilah haji tampil dilayar
pengguna
Tabel Use 4.25. Case Scenario Cek Keberangkatan Haji
Use Case Cek Kebarangkatan Haji
Use case ID 24
Actor Pengguna
68
Description menggambarkan kegitatan untuk melihat
jadwal keberankatan berdasarkan nomor
porsi
Pre-condition Pengguna menekan menu cek
keberangkatan
Course of event Actor Action System Response
1. Pengguna
mengklik menu
cek keberangkatan
2. Menampilkan
tampilan cek
keberankatan yg
berisi form nomor
porsi
5.Pengguna
mengisi form
nomor porsi
6.Menampilkan
jadwal keberankatan
sesuai nomor porsi
Alternate course -
Conclution Pengguna dapat melihat jadwal
keberangkatan haji berdasarkan nomor
porsi
Post Condition Cek keberangkatan tampil dilayar
pengguna
b. Activity Diagram
Activity diagram menggambarkan workflow atau aktifitas dari
sistem yang ada pada aplikasi pembelajaran haji dan umrah.
Activity diagram yang digunakan penulis diantaranya :
1. Activity diagram Pengenalan Haji & Umrah
Gambar 4.3 Activity Diagram Pengenalan Haji dan Umrah
Keterangan gambar : Dalam activity diagram diatas,
pengguna memilih menu pengenalan haji & umrah, kemudian
sistem akan menampilkan menu pada pengenalan haji &
umrah dalam bentuk list, yang kemudian akan tampil pada
layar perangkat milik si pengguna.
69
2. Activity Diagram Pengenalan Haji
Gambar 4.04 Activity Diagram Pengenalan Haji
Keterangan gambar : Dalam activity diagram pengenalan
haji, pengguna memilih menu berjudul pengenalan haji &
umrah, kemudian sistem akan menampilkan menu-menu pada
pengenalan haji & umrah dalam bentuk list, yang kemudian
akan tampil pada layar perangkat milik si pengguna. Setelah
list-list tersebut tampil, pengguna memilih salah satu dari list
menu tersebut, yaitu pengenalan haji. Kemudian sistem akan
menampilkan menu-menu dalam pengenalan haji dalam bentuk
list, yang kemudian akan tampil pada layar perangkat milik si
pengguna.
70
3. Activity Diagram Detail Pengenalan Haji
Gambar 4.05 Activity Diagram Detail Pengenalan Haji
Keterangan gambar : Dalam activity diagram pengenalan
haji, pengguna memilih menu berjudul pengenalan haji &
umrah, kemudian sistem akan menampilkan menu-menu pada
pengenalan haji & umrah dalam bentuk list, yang kemudian
akan tampil pada layar perangkat milik si pengguna. Setelah
list-list tersebut tampil, pengguna memilih salah satu dari list
menu tersebut, yaitu pengenalan haji. Kemudian sistem akan
menampilkan menu-menu diantaranya pengertian haji, hukum
haji, syarat haji, rukun haji, wajib haji dalam bentuk list, yang
kemudian akan tampil pada layar perangkat milik si pengguna.
Setelah list-list tersebut tampil, pengguna memilih salah satu
dari list menu tersebut, lalu sistem akan menampilkan detail
dari menu liat yang dipilih.
71
4. Activity Diagram Pengenalan Umrah
Gambar 4.06. Activity Diagram Pengenalan Umrah
Keterangan gambar : Dalam activity diagram pengenalan
umrah, pengguna memilih menu berjudul pengenalan haji &
umrah, kemudian sistem akan menampilkan menu-menu pada
pengenalan haji & umrah dalam bentuk list, yang kemudian
akan tampil pada layar perangkat milik si pengguna. Setelah
list-list tersebut tampil, pengguna memilih salah satu dari list
menu tersebut, yaitu pengenalan umrah. Kemudian sistem akan
menampilkan menu-menu diantaranya pengertian umrah,
hukum umrah, syarat umrah, rukun umrah, wajib umrah dalam
bentuk list, dalam bentuk list, yang kemudian akan tampil pada
layar perangkat milik si pengguna.
72
5. Activity Diagram Detail Pengenalan Umrah
Gambar 4.07 Activity Diagram Detail Pengenalan Umrah
Keterangan gambar : Dalam activity diagram pengenalan
umrah, pengguna memilih menu berjudul pengenalan haji &
umrah, kemudian sistem akan menampilkan menu-menu pada
pengenalan haji & umrah dalam bentuk list, yang kemudian
akan tampil pada layar perangkat milik si pengguna. Setelah
list-list tersebut tampil, pengguna memilih salah satu dari list
menu tersebut, yaitu pengenalan umrah. Kemudian sistem akan
menampilkan menu-menu diantaranya pengertian umrah,
hukum umrah, syarat umrah, rukun umrah, wajib umrah dalam
bentuk list yang kemudian akan tampil pada layar perangkat
milik si pengguna. Setelah list-list tersebut tampil, pengguna
memilih salah satu dari list menu tersebut, lalu sistem akan
menampilkan detail dari menu liat yang dipilih.
73
6. Activity Diagram Hikmah Haji dan Umrah
Gambar 4.08 Activity Diagram Hikmah Haji dan Umrah
Keterangan gambar : Dalam activity diagram pengenalan
umrah, pengguna memilih menu berjudul pengenalan haji &
umrah, kemudian sistem akan menampilkan menu-menu pada
pengenalan haji & umrah dalam bentuk list, yang kemudian
akan tampil pada layar perangkat milik si pengguna. Setelah
list-list tersebut tampil, pengguna memilih salah satu dari list
menu tersebut, yaitu hikmah haji dan umrah. Kemudian sistem
akan menampilkan menu-menu, dimana menu-menu tersebut
dapat dilihat pada bab IV subbab 4.1.2.
74
7. Activity Diagram Detail Hikmah Haji dan Umrah
Gambar 4.09 Activity Diagram Detail Hikmah Haji dan Umrah
Keterangan gambar : Dalam activity diagram pengenalan
umrah, pengguna memilih menu berjudul pengenalan haji &
umrah, kemudian sistem akan menampilkan menu-menu pada
pengenalan haji & umrah dalam bentuk list, yang kemudian
akan tampil pada layar perangkat milik si pengguna. Setelah
list-list tersebut tampil, pengguna memilih salah satu dari list
menu tersebut, yaitu hikmah haji dan umrah. Kemudian sistem
akan menampilkan menu-menu, dimana menu-menu tersebut
dapat dilihat pada bab IV subbab 4.1.2. Setelah list-list tersebut
tampil, pengguna memilih salah satu dari list menu tersebut,
lalu sistem akan menampilkan detail dari menu liat yang dipilih.
8. Activity Diagram Persiapan Haji
Gambar 4.10 Activity Diagram Persiapan Haji
75
Keterangan gambar : Dalam activity diagram diatas,
pengguna memilih menu persiapan haji, kemudian sistem akan
menampilkan menu pada persiapan haji dalam bentuk list,
yang kemudian akan tampil pada layar perangkat milik si
pengguna.
9. Activity Diagram Detail Persiapan Haji
Gambar 4.11 Activity Diagram Detail Persiapan Haji
Keterangan gambar : Dalam activity diagram detail
persiapan haji, pengguna memilih menu berjudul persiapan haji,
kemudian sistem akan menampilkan menu-menu pada
persiapan haji dalam bentuk list, rincian menu-menu tersebut
sesuai dengan yang telah disebutkan pada bab IV subbab 4.1.2.
Setelah list-list tersebut tampil, pengguna memilih salah satu
dari list menu tersebut, lalu sistem akan menampilkan detail
dari menu liat yang dipilih.
10. Activity Diagram Pelaksanaan Haji
Gambar 04.12 Activity Diagram Pelaksanaan Haji
76
Keterangan gambar : Dalam activity diagram diatas,
pengguna memilih menu pelaksanaan haji, kemudian sistem
akan menampilkan menu pada pelaksanaan haji dalam bentuk
list, yang kemudian akan tampil pada layar perangkat milik si
pengguna.
11. Activity diagram Detail Pelaksanaan Haji
Gambar 4.013 Activity Diagram Detail Pelaksanaan Haji
Keterangan gambar : Dalam activity diagram detail
pelaksanaan haji, pengguna memilih menu berjudul
pelaksanaan haji, kemudian sistem akan menampilkan menu-
menu pada pelaksanaan haji dalam bentuk list, rincian menu-
menu tersebut sesuai dengan yang telah disebutkan pada bab
IV subbab 4.1.2. Setelah list-list tersebut tampil, pengguna
memilih salah satu dari list menu tersebut, lalu sistem akan
menampilkan detail dari menu liat yang dipilih.
12. Activity Diagram Amalan Haji
Gambar 4.014 Activity Diagram Amalan Haji
77
Keterangan gambar : Dalam activity diagram diatas,
pengguna memilih menu amalan haji, kemudian sistem akan
menampilkan menu pada amalan haji dalam bentuk list, yang
kemudian akan tampil pada layar perangkat milik si pengguna.
13. Activity Diagram Detail Amalan Haji
Gambar 4.15. Activity Diagram Detail Amalan Haji
Keterangan gambar : Dalam activity diagram detail amalan
haji, pengguna memilih menu berjudul amalan haji, kemudian
sistem akan menampilkan menu-menu pada amalan haji dalam
bentuk list, rincian menu-menu tersebut sesuai dengan yang
telah disebutkan pada bab IV subbab 4.1.2. Setelah list-list
tersebut tampil, pengguna memilih salah satu dari list menu
tersebut, lalu sistem akan menampilkan detail dari menu liat
yang dipilih.
14. Activity Diagram Doa Haji
Gambar 04.16 Activity Diagram Doa Haji
Keterangan gambar : Dalam activity diagram diatas,
pengguna memilih menu doa haji, kemudian sistem akan
78
menampilkan menu pada doa haji dalam bentuk list, yang
kemudian akan tampil pada layar perangkat milik si pengguna.
15. Activity Diagram Detail Doa-Doa Haji
Gambar 4.017 Activity Diagram Detail Doa-Doa Haji
Keterangan gambar : Dalam activity diagram detail doa-doa
haji, pengguna memilih menu berjudul doa haji, kemudian
sistem akan menampilkan menu-menu pada doa haji dalam
bentuk list, rincian menu-menu tersebut sesuai dengan yang
telah disebutkan pada bab IV subbab 4.1.2. Setelah list-list
tersebut tampil, pengguna memilih salah satu dari list menu
tersebut, lalu sistem akan menampilkan detail dari menu liat
yang dipilih. Pengguna mempunyai pilihan untuk memutar
suara yang berisi bacaan doa. Apabila pengguna menekan
tombol play, maka sistem akan membuka file berformat *.mp3
pada memori dan memutar file tersebut.
79
16. Activity Diagram Berita Haji
Gambar 4.018 Activity Diagram Berita Haji
Keterangan gambar : Dalam activity diagram berita haji,
pengguna memilih menu berjudul berita haji, kemudian sistem
akan menampilkan dua buah tab, yaitu tab berita dan
pengumuman. Apabila pilihan ada pada berita tab, maka sistem
akan mengakses situs
http://www.haji.kemenag.go.id/v2/publikasi/berita/ dan
memparsing data-data pada situs tersebut. Setelah diparsing,
data-data tersebut akan ditampilkan dalam bentuk list pada
perangkat pengguna. Begitu pula jika tab yang dipilih adalah
tab pengumuman. maka sistem akan mengakses situs
http://www.haji.kemenag.go.id/v2/publikasi/pengumuman dan
memparsing data-data pada situs tersebut. Setelah diparsing,
data-data tersebut akan ditampilkan dalam bentuk list pada
perangkat pengguna
80
17. Activity Diagram Detail Berita Haji
Gambar 4.019 Activity Diagram Detail Berita Haji.
Keterangan gambar : Dalam activity diagram detail berita
haji, setelah sistem mem-parsing
http://www.haji.kemenag.go.id/v2/publikasi/berita/ dan
menampilkannya dalam bentuk list. Pengguna memilih salah
satu dari list tersebut kemudian akan membuka alamat situs
yang sesuai dengan berita yang dipilih dalam list dan mem-
parsing data-data pada situs tersebut. Setelah di-parsing, data-
data tersebut akan ditampilkan pada perangkat pengguna agar
dapat dibaca.
81
18. Activity Diagram Detail Pengumuman Haji
Gambar 4.020. Activity Diagram Detail Pengumuman Haji
Keterangan gambar : Dalam activity diagram detail
pengumuman haji, Setelah sistem mem-parsing situs
http://www.haji.kemenag.go.id/v2/publikasi/pengumuman dan
menampilkannya dalam bentuk list, pengguna memilih salah
satu dari list tersebut kemudian akan membuka alamat situs
yang sesuai dengan pengumuman yang dipilih dalam list.
Kemudian sistem akan mengecek apakah file berformat *.pdf
yang didapat pada alamat situs sudah ada dalam memori atau
tidak. Apabila sudah ada, maka sistem akan langsung membuka
file yang sesuai. Apabila belum ada, maka sistem akan
mengunduh file *.pdf tersebut dan menyimpannya pada
memori perangkat dan membukanya. Setelah membuka file
tersebut, isi file tersebut akan ditampilkan pada perangkat
pengguna.
82
19. Activity Diagram Peta Lokasi
Gambar 4.021 Activity Diagram Peta Lokasi
Keterangan gambar : Dalam activity diagram diatas,
pengguna memilih menu peta lokasi, kemudian sistem akan
menampilkan menu pada peta lokasi dalam bentuk list, rincian
menu-menu tersebut sesuai dengan yang telah disebutkan pada
bab IV subbab 4.1.2 yang kemudian akan tampil pada layar
perangkat milik si pengguna.
20. Activity Diagram Detail Peta Lokasi
Gambar 4.022 Activity Diagram Detail Peta Lokasi
Keterangan gambar : Dalam activity diagram detail peta
lokasi, pengguna memilih menu peta lokasi, kemudian aplikasi
akan menampilkan menu-menu didalamnya yang berupa lokasi
yang berkaitan dengan haji, rincian menu-menu tersebut sesuai
dengan yang telah disebutkan pada bab IV subbab 4.1.2.
83
pengguna memilih menu lokasi tersebut lalu aplikasi akan
menampilkan lokasi tersebut. Pengguna dapat memilih lokasi
kedua. Dengan memilih lokasi kedua maka aplikasi akan
menampilkan peta antara lokasi 1 dan lokasi 2 beserta jaraknya.
21. Activity Diagram Video Haji
Gambar 4.023. Activity Diagram Video Haji
Keterangan gambar : Dalam activity diagram Video haji,
pengguna memilih menu berjudul video haji, kemudian sistem
akan menampilkan menu-menu pada video haji dalam bentuk
list, rincian menu-menu tersebut sesuai dengan yang telah
disebutkan pada bab IV subbab 4.1.2. Setelah list-list tersebut
tampil, pengguna memilih salah satu dari list menu tersebut,
lalu sistem akan menampilkan video dari menu yang dipilih
pengguna.
22. Activity Diagram Istilah Haji
Gambar 04.024 Activity Diagram Istilah Haji
84
Keterangan gambar : Dalam activity diagram diatas,
pengguna memilih menu istilah haji, kemudian sistem akan
menampilkan menu pada istilah haji dalam bentuk list, rincian
menu-menu tersebut sesuai dengan yang telah disebutkan pada
bab IV subbab 4.1.2 yang kemudian akan tampil pada layar
perangkat milik si pengguna.
23. Activity Diagram Detail Istilah Haji
Gambar 4.025 Activity Detail Istilah Haji
Keterangan gambar : Dalam activity diagram detail istilah
haji, pengguna memilih menu berjudul istilah haji, kemudian
sistem akan menampilkan menu-menu pada istilah haji dalam
bentuk list, rincian menu-menu tersebut sesuai dengan yang
telah disebutkan pada bab IV subbab 4.1.2. Setelah list-list
tersebut tampil, pengguna memilih salah satu dari list menu
tersebut, lalu sistem akan menampilkan detail dari menu liat
yang dipilih.
85
24. Activity Diagram Cek Keberangkatan Haji
Gambar 4.026 Activity Cek Keberangkatan Haji
Dalam activity diagram cek keberangkatan haji, pengguna
memilih menu berjudul cek keberangkatan haji, kemudian
sistem akan menampilkan form untuk diisi. Pengguna mengisi
form tersebut dengan nomor porsi calon jamaah haji. Setelah
mengisi form tersebut, sistem akan mengakses dan mem-
parsing situs
http://haji.kemenag.go.id/v2/basisdata/xml/nomor_porsi untuk
mengecek keberadaan nomor porsi. Setelah proses selesai hasil
pencarian akan muncul pada perangkat pengguna.
c. Sequence Diagram
Diagram sekuen untuk menggambarkan kelakuan objek pada
use case dengan mendeskripsikan waktu hidup objek dan message
yang dikirimkan dan diterima antarobjek. Diagram sekuen yang
digunakan penulis diantaranya :
86
1. Sequence Diagram Pengenalan Haji dan Umrah, Persiapan
haji, Pelaksanaan Haji, Amalan Haji, dan Istilah Haji
Gambar 4.027 Sequence Diagram Pengenalan Haji dan Umrah, Persiapan
haji, Pelaksanaan Haji, Amalan Haji, dan Istilah Haji
Pada sequence diagram ini, Pengguna melihat penjelasan
dari haji dengan membuat sistem melakukan request ke
database dan sistem akan menampilkan data yang di-request
tersebut ke layar pengguna.
2. Sequence Diagram Doa
Gambar 4.028 Sequence Diagram Detail Doa Haji
87
Pada sequence diagram ini, Pengguna melihat doa haji
dengan membuat sistem melakukan request ke database dan
sistem akan menampilkan data yang di-request tersebut ke
layar pengguna. Pengguna dapat memutar suara doa dengan
membuat sistem melakukan request untuk memutar file suara
yang kemudian sistem akan memutar suara file tersebut agar
dapat didengar oleh pengguna.
3. Sequence Diagram Video
Gambar 04.29 Sequence Diagram Video Haji
Pada sequence diagram ini, Pengguna melihat video haji
dengan membuat sistem melakukan request ke alamat situs
video dan sistem akan menampilkan video yang di-request
tersebut ke layar pengguna.
4. Sequence Diagram Berita dan Pengumuman Haji
Gambar 4.030 Sequence Diagram Berita Haji dan Pengumuman Haji
88
Keterangan gambar : Dalam sequence diagram berita dan
pengumuman haji, pengguna melihat berita haji dengan
mengirim request ke sistem untuk mengakses alamat situs yang
dituju. Setelah itu sistem akan mem-parsing situs dengan
metode getMenuBerita() untuk dijadikan dalam bentuk list.
Setelah proses selesai list akan ditampilkan ke layar pengguna.
5. Sequence Diagram Cek Keberangkatan Haji
Gambar 4.031 Sequence Diagram Cek Keberangkatan
Keterangan gambar : Dalam sequence diagram cek
keberangkatan haji, pengguna masukan input pada form nomor
porsi dan mengirim request ke alamat situs dengan nomor porsi
tersebut. Nomor porsi akan diproses pada alamat situs. Setelah
proses selesai, hasil akan diambil dan dikirim kembali ke
perangkat pengguna agar hasil tersebut dapat ditampilkan di
layar pengguna.
4.2.2. Tahap Perancangan Interface
Pada tahap ini penulis merancang tampak muka aplikasi.
89
a. Rancangan Tampilan Menu Utama
Gambar 4.032. Rancangan Tampilan Menu Utama
Keterangan gambar : layar ini tampil pada saat aplikasi
diluncurkan. Antarmuka ini berisi menu-menu utama aplikasi
berbentuk Linear Layout. Pada setiap menu terdapat ikon dan
nama menu tersebut
b. Rancangan Tampilan Bahasan Haji
Gambar 4.033 Rancangan Tampilan Bahasan Haji
Keterangan gambar : Antarmuka ini tampil saat menu
pembahasan haji dibuka. Pada antarmuka ini terdapat
gambar(2), judul(3), dan isi pembahasan tersebut(4) yang dapat
di scroll.
1. Nama Aplikasi
2. Menu – menu aplikasi
1. Nama Aplikasi
2. Gambar bahasan terkait
3. Judul bahasan
4. Isi detail bahasan
90
c. Rancangan Tampilan Doa Haji
Gambar 4.034. Rancangan Tampilan Doa Haji
Keterangan gambar : Antarmuka ini tampil saat menu doa
dipilih. Pada antarmuka ini terdapat judul doa(1), tombol
play/pause (2), dan isi doa serta terjemahannya yang dapat di
scroll. Apabila tombol play ditekan, maka aplikasi akan
memutar doa yang dipilih. Format file suara untuk doa
berformat *.mp3
d. Rancangan Tampilan Video Haji
Gambar 4.035. Rancangan Tampilan Video Haji
Keterangan gambar : Antarmuka ini tampil saat menu video
dipilih. Pada antar muka ini terdapat judul video(1) dan video
player(2) yang memenuhi seluruh layar yang menggunakan
YouTubeAPI.
1. Judul doa
2. Tombol play/pause
3. Isi doa dan terjemahan
1. Nama
Aplikasi
2. Video
player
91
e. Rancangan Tampilan List Berita Haji
Gambar 4.036 Rancangan Tampilan List Berita Haji
Keterangan gambar : Antarmuka ini tampil saat menu berita
haji dipilih. Pada antarmuka ini terdapat judul menu(1) dan
menu Tabulator (2). Menu tabulator digunakan untuk
mengganti pilihan menu berita, pengumuman dan bookmark.
Pada setiap tabulator tersebut berisi list-list (3) yang sesuai
dengan menu terkait.
f. Rancangan Tampilan Berita Haji
Gambar 4.037 Rancangan Tampilan Berita Haji
1. Judul Menu
2. Tab (Berita, Pengumuman,
Bookmark)
3. List berita haji
1. Judul Menu
2. Gambar berita
3. Judul berita
4. Isi berita
92
Keterangan gambar : Antarmuka ini tampil saat memilih list
berita. Pada antarmuka ini terdapat gambar(2), judul(3), dan isi
berita tersebut(4) yang dapat di scroll.
g. Rancangan Tampilan Cek Keberangkatan
Gambar 4.038 Rancangan Tampilan Cek Keberangkatan
Keterangan gambar : Antarmuka ini tampil saat menu cek
keberangkatan dibuka. Pada antarmuka ini terdapat field input
untuk mengetikkan nomor porsi untuk pengecekan
keberangkatan. Setelah nomor porsi dicari, hasil akan
ditampilkan pada kolom yang tersedia (3).
4.2.3. Tahap Perancangan Database
Pada tahap ini penulis merancang database yang akan digunakan
pada aplikasi. Database menggunakan SQLite karena SQLite cocok untuk
perangkat android. Struktur database yang digunakan adalah :
a. Tabel Konten
Nama table : konten
Tujuan tabel : Untuk menyimpan alamat lokasi file yang akan
digunakan untuk membuka konten aplikasi.
Field Type Extra
ID TEXT PRIMARY_KEY
File TEXT
Image TEXT
1. Judul Menu
2. Input nomor
keberangkatan
3. Kolom hasil pencarian
93
Ket TEXT
Keterangan tabel:
Field ID menunjukkan ID dari setiap kolum
Field File menunjukkan alamat dari file yang akan
digunakan oleh aplikasi
Field Image menunjukkan alamat dari file gambar yang
akan digunakan oleh aplikasi
Field Ket meenunjukkan keterangan dari kolum tersebut
b. Tabel Doa
Nama tabel : doa
Tujuan tabel : Untuk menyimpan alamat lokasi file yang akan
digunakan untuk membuka konten aplikasi
Field Type Extra
ID TEXT PRIMARY_KEY
Drawable TEXT
Suara TEXT
Terjemah TEXT
Ket TEXT
Keterangan tabel:
Field ID menunjukkan ID dari setiap kolum
Field Drawable menunjukkan alamat dari file gambar
yang akan digunakan oleh aplikasi
Field suara menunjukkan alamat dari file audio yang
akan digunakan oleh aplikasi
Field Terjemah menunjukkan terjemahan dari doa yang
sesuai
Field Ket menunjukkan keterangan dari kolum tersebut
c. Tabel Berita
Nama tabel : berita
94
Tujuan tabel : Untuk menyimpan data-data berita yang
disimpan untuk dibaca secara offline.
Field Type Extra
Judul TEXT
Date TEXT
Detail TEXT
Link TEXT
Image TEXT
Keterangan tabel:
Field Judul menunjukkan judul dari berita yang
disimpan.
Field Date menunjukkan menunjukkan tanggal berita.
Field Detail menunjukkan menunjukkan isi berita
Field Link menunjukkan link url berita.
Field Image menunjukkan alamat gambar untuk banner
dari berita.
d. Tabel Istilah
Nama tabel : istilah
Tujuan tabel : Untuk menyimpan data-data tentang istilah –
istilah yang ada pada haji.
Field Type Extra
ID TEXT
Judul TEXT
Arti TEXT
Keterangan tabel:
Field ID menunjukkan id dari istilah yang disimpan.
Field Judul menunjukkan nama/judul dari istilah
tersebut.
Field Arti menunjukkan arti dari istilah yang dimaksud.
95
e. Tabel Lokasi
Nama tabel : lokasi
Tujuan tabel : Untuk menyimpan data-data lokasi haji.
Field Type Extra
ID TEXT
Tempat TEXT
Gambar TEXT
Penjelasan TEXT
Lat TEXT
Long TEXT
Keterangan tabel:
Field ID menunjukkan id dari lokasi yang disimpan.
Field Tempat menunjukkan nama tempat yang
dimaksud
Field Gambar menunjukkan alamat dari file gambar
yang sesuai dengan id dan nama tempat
Field Penjelasan menunjukkan penjelasan dari tempat
yang sesuai dengan id dan nama tempat
Field Lat menunjukkan posisi latitude dari tempat yang
sesuai dengan id dan nama tempat.
Field Long menunjukkan posisi longitude dari tempat
yang sesuai dengan id dan nama tempat
4.2.4. Membangun Sistem (Pengkodean)
Pada fase ini penulis melakukan pengkodean dengan menggunakan
program IDE Android Studio dan bahasa pemograman Java untuk
membuat aplikasi. Pembuatan aplikasi yang dilakukan penulis
diantaranya adalah sebagai berikut :
1. Membuat fitur penjelasan tentang haji dan umrah
Salah satu fungsi dari aplikasi ini adalah menjelaskan hal-hal yang
berkaitan tentang haji dnan tata cara pelaksanaannya. Oleh karena itu ,
fitur ini merupakan salah satu hal yang penting dalam aplikasi. Dalam
96
mendapatkan informasi mengenai haji dan umrah, penulis
mendapatkannya dari buku-buku mengenai haji diantaranya buku
„Tuntunan Manasik Haji dan Umrah‟ yang dikeluarkan oleh
Kementerian agama, buku „Segala hal tentang Haji dan Umrah‟
terbitan Erlangga, dan buku-buku lain yang lebih jelasnya dapat
ditemukan di bab daftar pustaka.
Dalam membuat fitur ini, penulis menggunakan file tipe HTML
untuk menampilkan informasi tentang haji dan umrah. File HTML
disimpan pada android_assets/konten.
Gambar 4.039 contoh file HTML yang digunakan oleh aplikasi
Setiap file tersebut mempunyai alamat lokasi tersendiri. Masing-
masing alamat file disimpan pada database SQLite pada tabel konten
seperti yang telah dijelaskan pada tahap perancangan.
Gambar 4.040 isi tabel konten pada database dilihat dengan SQLiteBrowser
Setiap alamat file diberi ID yang unik. Aplikasi menggunakan ID
unik tersebut untuk mendapatkan alamat file yang sesuai dengan
97
informasi haji yang dipilih. Alamat file digunakan untum memberi
tahu sistem lokasi file yang akan dibuka.
Setelah mendapatkan alamat file. File html tersebut akan
ditampilan dengan fitur WebView yang dimiliki android. Untuk
menampilkan file HTML dengan webview, penulis menggunakan
perintah sebagai berikut :
WebView.loadUrl(“alamat file”);
Selanjutnya untuk tampilan antarmuka, akan disesuaikan dengn
apa yang telah dirancang pada tahap sebelumnya.
Cara ini digunakan penulis dalam menu-menu :
Penjelasan Haji dan Umrah
Istilah haji
Amalan haji
Hikmah haji dan umrah
2. Membuat fitur doa
Fitur doa terdiri dari bacaan doa, file suara doa dan terjemahannya.
Dalam membuat fitur doa, penulis mendapatkan bacaan doa dan
terjemahannya dari buku „Tuntunan Manasik Haji dan Umrah‟ yang
dikeluarkan oleh Kementerian agama. Sementara untuk file suara,
pengguna mendapatkannya dari berbagai sumber di internet.
File bacaan doa disimpan pada lokasi android_resource/drawable,
sedangkan file suara disimpan pada lokasi android_resource/raw.
Sama halnya dengan fitur penjelasan tentang haji dan umrah.
Penulis membuat database untuk meyimpan data-data doa seperti nama
doa, alamat bacaan doa, alamat file suara doa, dan juga terjemahannya..
Setiap doa memiliki ID yang unik.
98
Gambar 4.041. Isi Tabel doa pada Database dilihat dengan SQLiteBrowser
Setiap menu doa akan memberikan ID unik yang kemudian
digunakan sistem untuk mencari doa yang memiliki ID yang sama.
Setelah menemukan ID yang sama, sistem akan menampilkan gambar
yang berada pada alamat yang sesuai dengan kolom „Drawable’ dan
memutar suara yang sesuai dengan kolom „Suara‟. Untuk memutar
suara penulis menggunakan perintah :
mediaPlayer = MediaPlayer.create
(getApplicationContext(), “Alamat_File_Suara”);
mediaPlayer.start();
dan untuk memberhentikan suara penulis menggunakan perintah :
mediaPlayer.pause();
Tampilan antarmuka akan sesuai dengan apa yang dirancang
sebelumnya.
3. Membuat fitur video
Pada fitur video, penulis menggunakan video tentang pelaksanaan
haji dari YouTube yang beralamat di
http://www.youtube.com/qTfALaE0vqY. Penulis juga menggunakan
library pemutar YouTube pada android, yaitu
YouTubeAndroidPlayerAPI.
Video yang digunakan penulis berdurasi total 1 jam 7 menit 43
detik (4063 detik). Video tersebut dibagi menjadi beberapa bagian
sesuai dengan tahapan pelaksanaan. bagian – bagian tersebut akan
99
menandakan waktu awal dimulainya video tersebut diantaranya
sebagai berikut :
Tabel 4.27. Tabel Waktu Mulai Video Haji
No Judul Menu Waktu Mulai
(MM:SS)
Waktu mulai
(ms)
1 Penjelasan Haji 0 0
2 Pelaksanaan haji
dan umrah
7:10 430000
3 Kiat Haji Mabrur 7:45 465000
4 Benda Bawaan
Jemaah haji
9:25 585000
5 Di pesawat 12:15 735000
6 Niat umrah 17:11 1031000
7 Niat Haji 17:34 1054000
8 Doa setelah ihram 17:58 1078000
9 Larangan pada
ihram
22:23 1343000
10 Hikmah ihram 23:57 1437000
11 Thawaf 28:21 1701000
12 Tempat air zamzam 36:06 2166000
13 Sa‟i 36:36 2196000
14 Tahalul 46:11 2771000
15 Wukuf 48:02 2882000
16 Thawaf ifadhah 63:26 3806000
17 Thawaf wada 64:10 3850000
18 Hikmah haji 64:51 3891000
19 Perjalanan pulang
haji
65:18 3918000
Setelah menentukan waktu mulai untuk setiap video, pada Activity
android digunakan perintah dari library YouTubeAndroidPlayerAPI,
yaitu :
100
youTubePlayer.loadVideo(ALAMAT_VIDEO, WAKTU_MULAI);
Alamat video merupakan alamat video YouTube dan waktu mulai
merupakan waktu mulai video yang sesuai dengan tabel diatas.
4. Membuat fitur berita tentang haji dan umrah
Dalam membuat fitur berita dan pengumuman, penulis mengambil
berita dari situs http://haji.kemenag.go.id/v2/publikasi/berita/
Gambar 4.042 Tampilan Situs Berita Haji tanggal 1 Mei 2015
(Sumber : http://haji.kemenag.go.id/v2/publikasi/berita/).
Penulis menggunakan JSOUP untuk mem-parsing data dari kedua
website tersebut. Dengan menggunakan JSOUP penulis dapat
mengambil bagian-bagian website yang diinginkan untuk ditampilkan
dalam perangkat android.
Untuk membuat fitur berita, penulis mengambil elemen div yang
memiliki class view-content (dapat dilihat pada gambar 4..43) yang
memiliki semua berita yang tampil pada halaman tersebut.. Pada
elemen <divclass=”view-content”> terdapat sub elemen div berkelas
views-row views-row* yang berisi setiap berita.
101
Gambar 4.043 Elemen-elemen pada situs
http://haji.kemenag.go.id/v2/publikasi/berita/
Penulis akan mengambil setiap bagian elemen yang memiliki class
views-row views-row* pada elemen view-content. Untuk melakukan
hal tersebut penulis menggunakan perintah
Elements main = document.select("div.view-content >
div.views-row.views-row*");
for (Element e : main){
Elements titleNews = e.select("div >
div.header.article-header h2 a");
Elements pubDateNews = e.select("div >
div.footer.submitted > span.time.pubdate > span");
Elements img = e.select("div > div[class=node-
content] > div[class=section field field-name-field-image
field-type-image field-label-hidden] > div[class=field-
items] > div[class=field-item odd]");
title = titleNews.text();
pubDate= pubDateNews.text();
link =
"http://haji.kemenag.go.id"+titleNews.attr("href");
image = img.attr("resource");
Perintah diatas menunjukkan bahwa aplikasi akan memilih elemen
yang memiliki class views-row.views-row* yang berada pada elemen
102
ber-class view-content. Pada setiap elemen ber-class views-row.views-
row*, aplikasi akan melakukan beberapa iterasi dan memilih bagian –
bagian berikut :
1) div.header.article-header h2 a = elemen berisi judul setiap
berita.
2) div.footer.submitted > span.time.pubdate > span = elemen
berisi tanggal berita itu di-publish.
3) div.node-content > div.section.field.field-name-field-image
field-type-image.field-label-hidden. > div.field-items >
div.field-item.odd = berisi alamat yang berisi gambar dari berita
terkait.
Setelah memilih elemen-elemen tersebut, aplikasi mengambil data-data
pada elemen tersebut dengan menggunakan perintah :
title = titleNews.text();
pubDate= pubDateNews.text();
link =
"http://haji.kemenag.go.id"+titleNews.attr("href");
image = img.attr("resource");
Keterangan gambar :
• titleNews.text() = mengambil teks yang ada pada elemen (1).
Jika berdasarkan gambar 4.43, Perintah ini akan menghasilkan
data “Masyarakat Dapat Pantau Pelunasan Haji Reguler” pada
iterasi pertama.
• pubDate.text() = mengambil teks yang ada pada elemen (2).
Jika berdasarkan gambar 4.43, Perintah ini akan menghasilkan
data “Sen, 01/06/2015 - 09:06” pada iterasi pertama.
• titleNews.attr(“href”) = mengambil nilai yang ada pada
attribute „href’ pada elemen (2). Jika berdasarkan gambar 4.43,
Perintah ini akan menghasilkan data “/v2/content/masyarakat-
dapat-pantau-pelunasan-haji-reguler” pada iterasi pertama.
• img.attr(“resource”) = mengambil nilai yang ada pada
attribute“resource” pada elemen (3). Jika berdasarkan gambar
4.43, Perintah ini akan menghasilkan data
103
http://haji.kemenag.go.id/v2/sites/default/files/styles/medium/p
ublic/field/image/Jemaah.jpg?itok=VfycXL_t” pada iterasi
pertama.
Setelah melakukan iterasi pertama, aplikasi akan melakukan iterasi
kedua dan seterusnya hingga elemen ber-class views-row.views-row*
pada elemen view-content selesai di-parsing semua datanya. Setelah
semua data di-parsing, data akan dikumpulkan dan ditampilkan dalam
bentuk list pada perangkat android dengan antarmuka sesuai dengan
rancangan pada tahap sebelumnya.
Untuk menampilkan detail berita yang dipilih dari list. Aplikasi
akan mengakses link yang terdapat pada list misal
http://haji.kemenag.go.id/v2/content/masyarakat-dapat-pantau-pelunasan-
haji-reguler.
Gambar 4.044 Tampilan Situs Berita Haji (Sumber :
http://www.haji.kemenag.go.id/v2/content/masyarakat-dapat-pantau-pelunasan-haji-
reguler).
104
Gambar 4.045 elemen-elemen pada situs berita haji (Sumber :
http://haji.kemenag.go.id/v2/content/masyarakat-dapat-pantau-pelunasan-haji-
reguler)
Alamat situs tersebut kemudian diparsing dengan menggunakan
JSOUP untuk diambil data-datanya. Untuk mengambil data-data
tersebut, penulis menggunakan perintah :
Element e = doc.select("div.node-content").first();
isi = e.html();
Keterangan perintah :
• doc.select(“div.node-content”).first() : perintah ini akan
memilih daerah elemen dengan class node-content yang ada
pada alamat situs.
• e.html() : perintah ini akan mengambil data pada daerah
tersebut dalam bentuk html.
Setelah mengambil data, data tersebut akan ditampilkan pada
perangkat android dengan antarmuka sesuai dengan rancangan pada
tahap sebelumnya.
5. Membuat Fitur Pengumuman Haji dan Umrah
Dalam membuat fitur berita dan pengumuman, penulis mengambil
berita dari situs http://haji.kemenag.go.id/v2/publikasi/pengumuman/.
105
Gambar 4.0.46 Tampilan Situs Pengumuman Haji tanggal 1 Mei 2015
(Sumber : http://haji.kemenag.go.id/v2/publikasi/pengumuman/).
Penulis menggunakan JSOUP untuk mem-parsing data dari kedua
website tersebut. Dengan menggunakan JSOUP penulis dapat
mengambil bagian-bagian website yang diinginkan untuk ditampilkan
dalam perangkat android.
Untuk membuat fitur berita, penulis mengambil elemen div yang
memiliki class view-content (dapat dilihat pada gambar 4.47) yang
memiliki semua berita yang tampil pada halaman tersebut.. Pada
elemen <divclass=”view-content”> terdapat sub elemen div berkelas
views-row views-row* yang berisi setiap berita.
Gambar 4.047 Elemen-Elemen pada Situs Berita Haji
106
Penulis akan mengambil setiap bagian elemen yang memiliki class
views-row views-row* pada elemen view-content. Untuk melakukan
hal tersebut penulis menggunakan perintah :
Elements main = document.select("div.view-content >
div.views-row.views-row*");
for (Element e : main) {
Elements titleNews = e.select("div.views-field.views-
field-title h2 a");
title = titleNews.text();
link = "http://haji.kemenag.go.id" +
titleNews.attr("href");
Perintah diatas menunjukkan bahwa aplikasi akan memilih elemen
yang memiliki class views-row.views-row* yang berada pada elemen
ber-class view-content. Pada setiap elemen ber-class views-row.views-
row*, aplikasi akan melakukan beberapa iterasi dan memilih bagian
elemen div.header.article-header h2 a yang berisi judul setiap berita.
Setelah memilih elemen tersebut, aplikasi mengambil data-data
pada elemen tersebut dengan menggunakan perintah :
title = titleNews.text();
link = "http://haji.kemenag.go.id"
+titleNews.attr("href");
Keterangan gambar :
• titleNews.text() = mengambil teks yang ada pada elemen (1).
Jika berdasarkan gambar 4.47, Perintah ini akan menghasilkan
data “Pelunasan Jemaah Haji Reguler Tahun 1436H/2015M”
pada iterasi pertama.
• titleNews.attr(“href”) = mengambil nilai yang ada pada
attribute „href’ pada elemen (2). Jika berdasarkan gambar 4.47,
Perintah ini akan menghasilkan data “/v2/content/pelunasan-
jemaah-haji-reguler-tahun-1436h2015m” pada iterasi pertama.
Setelah melakukan iterasi pertama, aplikasi akan melakukan iterasi
kedua dan seterusnya hingga elemen ber-class views-row.views-row*
pada elemen view-content selesai di-parsing semua datanya. Setelah
semua data di-parsing, data akan dikumpulkan dan ditampilkan dalam
107
bentuk list pada perangkat android dengan antarmuka sesuai dengan
rancangan pada tahap sebelumnya.
Untuk menampilkan detail pengumuman yang dipilih dari list.
Aplikasi akan mengakses link yang terdapat pada list misal
http://www.haji.kemenag.go.id/v2/content/pelunasan-jemaah-haji-
reguler-tahun-1436h2015m.
Gambar 4.048 Tampilan Situs Pengumuman Haji tanggal 1 Mei 2015 (Sumber :
http://www.haji.kemenag.go.id/v2/content/pelunasan-jemaah-haji-reguler-tahun-
1436h2015m)
Gambar 4.049 Elemen – Elemen ada situs Pengumuman Haji tanggal 1 Mei 2015
(Sumber : http://www.haji.kemenag.go.id/v2/content/pelunasan-jemaah-haji-reguler-
tahun-1436h2015m)
108
Alamat situs tersebut kemudian di-parsing dengan menggunakan
JSOUP untuk diambil data-datanya. Untuk mengambil data-data
tersebut, penulis menggunakan perintah :
Element e = doc.select("div.node-content >
div.section.field.field-name-field-filepengumuman.field-
type-file.field-label-hidden > div.field-items >
div.field-item.odd").first();
String src = e.attr("src");
urlFile = e.text();
File folder = new
File(Environment.getExternalStorageDirectory()+"/BelajarH
aji/pdf/");
folder.mkdirs();
isi =
Environment.getExternalStorageDirectory().getAbsolutePath
()+"/BelajarHaji/pdf/"+urlFile.substring(60);
Keterangan perintah :
• doc.select("div.node-content > div.section.field.field-name-
field-filepengumuman.field-type-file.field-label-hidden >
div.field-items > div.field-item.odd").first() = untuk memilih
elemen yang akan diambil. • e.attr("src") = mengambil nilai pada elemen diatas yang ber-
attribute src. Attribute ini berisi alamat file *pdf yang nantinya
akan di-download oleh aplikasi dan disimpan dalam folder
penyimpanan.
• urlFile = e.text() = mendapatkan nama file pdf.
• File(Environment.getExternalStorageDirectory()+"/BelajarHaj
i/pdf/");
folder.mkdirs();
Membuat folder “/BelajarHaji/pdf/”pada memori penyimpanan
utama perangkat android.
109
Setelah berhasil mendapatkan data-data tersebut. Maka aplikasi
akan membuka alamat pdf dan men-download file pdf tersebut.
Kemudian menyimpannya dalam penyimpanan utama perangkat
android. Setelah tersimpan, aplikasi akan membuka file pdf yang telah
ter-dowload dan menampilkannya pada perangkat android dengan
antarmuka yang sesuai dengan perancangan pada tahap sebelumnya.
6. Membuat Fitur Cek Keberangkatan Haji
Dalam membuat fitur cek keberangkatan haji, penulis mengambil
data dari situs http://haji.kemenag.go.id/v2/basisdata/xml/nomor_porsi.
Penulis menggunakan JSOUP untuk memparsing halaman tersebut dan
mendapatkan data-data yang dibutuhkan.
Gambar 4.050 Tampilan Situs Cek Keberangkatan Haji tanggal 1 Mei 2015
(Sumber :http://haji.kemenag.go.id/v2/basisdata/xml/2300098444)
Untuk memparsing data dengan JSOUP pada alamat situs tersebut,
penulis menggunakan perintah :
doc=Jsoup.connect("http://haji.kemenag.go.id/v2/basisdata
/xml/"+query).get()
Element e = doc.select("div.view-content > div.views-
row.views-row*").first();
if (e == null) {
isi = "Nomor Porsi " + query + " tidak ditemukan";
} else {
isi = e.html();
}
110
Keterangan perintah :
• Jsoup.connect("http://haji.kemenag.go.id/v2/basisdata/xml/"+q
uery).get() = aplikasi akan mencoba mengakses alamat
http://haji.kemenag.go.id/v2/basisdata/xml/query dengan query
merupakan masukan nomor porsi dari pengguna.
• doc.select("div.view-content > div.views-row.views-
row*").first(); = aplikasi akan memilih element ber-class
views-row.views-row* yang berada pada element ber-class
view-content.
• e.html() = mengambil nilai pada elemen diatas dalam bentuk
html.
Setelah mendapatkan semua data yang diperlukan, data akan
ditampilkan pada perangkat android dengan antarmuka yang sesuai
rancangan pada tahap sebelumnya.
4.3. Fase Pelaksanaan/Implementasi
Fase implementasi adalah fase dimana penulis mengimplementasikan
perancangan yang telah dibuat pada fase sebelumnya dengan menggunakan
program. Hal-hal yang telah dirancang sebelumnya disusun dan dibuat menjadi
bentuk aplikasi yang sesuai dengan tujuannya. Dalam mengimplementasikan
rancangan yang telah dibuat, dibutuhkan perangkat keras dan perangkat lunak
untuk mengkoding aplikasi maupun menguji aplikasi.
4.3.1. Implementasi pada Perangkat Keras dan Perangkat Lunak
Perangkat keras yang digunakan oleh penulis untuk membangun
aplikasi adalah sebagai berikut
1. Komputer
Model : Toshiba Satellite Pro C640
Processor : Processor Intel i3 2.53 GHz
OS : Windows 64bit
RAM : 4 GB
HHD : 320 GB
Layar : 14 Inchi
111
2. Device Android
a. Device 1
Model/OS : Android One/Lolipop 5.1.1
RAM/ROM : 1GB/8GB
Layar : 4.5 inc, dengan kedalaman 240dpi.
b. Device 2
Model/OS : Samsung Galaxy Mini 2/ Jelly Bean 4.2
RAM/ROM : 512MB/4GB
Layar : 3.3 inc, dengan kedalaman 160dpi.
Sedangkan Perangkat lunak yang dibutuhkan untuk mengimplementasikan
aplikasi adalah :
1. Android Studio 1.1.0 : IDE yang digunakan untuk memudahkan
penulis untuk membangun aplikasi, khususnya aplikasi android.
2. Photoshop/Inkscape/Paint : Image editor yang digunakan penulis
untuk membuat, mengedit gambar yang diperlukan untuk aplikasi.
3. Genymotion : Emulator android yang digunakan penulis untuk menguji
coba aplikasi
4. Android SDK : tool API (Application Programming Interface) yang
diperlukan untuk mulai mengembangkan aplikasi pada platform
Android menggunakan bahasa pemrograman Java.
5. SQLite Browser : tool database untuk membuat dan mengedit
database SQLite.
112
4.3.2. Implementasi Antar Muka
1. Tampilan menu utama
Gambar 4.051 Tampilan Menu Utama
Keterangan Gambar : Tampilan yang ditampilkan saat membuka
aplikasi. Tampilan ini berisi menu-menu utama dari aplikasi diantaranya
menu penjelasan haji, menu persiapan haji, menu pelaksanaan haji, menu
doa-doa haji, menu peta lokasi, menu berita haji, menu video haji, menu
amalan haji, menu istilah haji dan menu cek keberangkatan haji.
2. Tampilan bahasan haji
Gambar 4.052 Tampilan Bahasan Haji
Keterangan Gambar : Tampilan ini merupakan tampilan pembahasan
tentang haji. menu ini tampil saat menu penjelasan haji dan umrah, amalan
haji, persiapan haji, pelaksanaan haji dipilih. Tampilan bisa digeser keatas
113
dan kebawah untuk melihat konten yang ada dibawahnya dan digeser ke
kanan ke kiri untuk melihat topik penjelasan berikutnya.
3. Tampilan doa haji
Gambar 4.053 Tampilan Doa Haji
Keterangan Gambar : Tampilan ini merupakan tampilan saat menu doa
haji dipilih. Menu ini terdiri dari bacaan doa dan terjemahannya. Tombol
play/pause pada sisi kanan atas dapat ditekan untuk memutar suara yang
akan membacakan do‟a yang sesuai.
4. Tampilan video haji
Gambar 4.054 Tampilan Video Haji
Keterangan Gambar : Tampilan ini merupakan tampilan saat menu
video haji dipilih. Aplikasi akan membuka link video dan membuka video
player untuk memainkan video yang sesuai dengan pilihan.
114
5. Tampilan list berita haji
Gambar 4.055 Tampilan List Berita Haji
Keterangan gambar : Tampilan ini merupakan tampilan berita haji
yang ditampilkan dalam bentuk list. Berita diambil secara online dari situs
http://www.haji.kemenag.go.id/v2/publikasi/berita/ pada tanggal 22 Mei
2015.
6. Tampilan berita haji
Gambar 4.056 Tampilan Berita Haji
Keterangan gambar : Tampilan ini merupakan tampilan berita haji
yang telah dipilih pada berita sebelumnya.
115
7. Tampilan cek keberangkatan
Gambar 4.057 Tampilan Cek Keberangkatan Haji
Keterangan gambar : Tampilan ini merupakan tampilan untuk
mengecek keberangkatan haji. Terdapat form inputan untuk memasukkan
nomor porsi haji yang kemudian digunakan untuk diproses pada alamat
http://haji.kemenag.go.id/v2/basisdata/xml/nomor_porsi. Setelah diproses
akan ditampilkan nomor porsi yang dimasukkan, nama, kabupaten,
provinsi, kuota provinsi, posisi pada kuota provinsi, dan perkiraan
keberangkatan pemilik nomor porsi.
4.3.3. Instalasi Aplikasi pada Perangkat Android
Implementasi dilakukan pada handset android. Hal yang
dibutuhkan pada tahap ini adalah :
1. Smartphone android dengan sistem operasi 4.1 (Jelly Bean) ke atas,
dalam hal ini penulis menggunakan perangkat android Android
One, Nexian Journey One dengan sistem operasi 5.1 (Lolipop),
dengan prosesor Dual-core 1.3GHz dan Samsung Galaxy Mini 2
dengan sistem operasi 4.2( JellyBean), dengan prosesor 1.2GHz.
2. File aplikasi dalam bentuk .apk
3. Kabel data android untuk mentransfer file aplikasi dari pc ke
handset android.
Untuk menginstall aplikasi di perangkat android, penulis
menghubungkan kabel data android ke PC dan mentransfer file apk
116
aplikasi. Besar file apk aplikasi ini adalah sebesar 35 MB. Setelah di
transfer dilakukan proses instalasi seperti layaknya menginstall aplikasi
lainnya. Setelah penginstallan, besar ukuran aplikasi menjadi sebesar
kurang lebih 44 MB tergantung dari jenis device yang digunakan.
4.3.4. Pengujian Aplikasi
Pada tahap ini, penulis melakukan pengujian pada aplikasi agar
penulis dapat mengecek aplikasi sudah berjalan dengan benar. Pengujian
dilakukan dengan dua metode yaitu metode whitebox dan blackbox.
Pengujian metode whitebox dilakukan untuk mengecek bahwa
sistem telah bebas dari kesalahan logika. Pengujian ini dilakukan pada
bagian aplikasi yang memiliki logika yang lebih rumit seperti berita haji,
cek keberangkatan haji.
Pengujian blackbox dilakukan untuk memperlihatkan bahwa semua
fungsi aplikasi telah berfungsi secara keseluruhan. Pengujian ini dilakukan
pada seluruh use case yang ada pada aplikasi.
a. Pengujian dengan WhiteBox
Pengujian whitebox pada pengujian ini dilakukan dengan metode
Basic Path. Pengujian dilakukan pada bagian berita haji dan cek
keberangkatan haji.
1. Pengujian pada Berita Haji
Flowgraph pada berita haji sebagai berikut:
1 : Mulai
2 : mengecek apakah ada koneksi.
3 : memilih antara 3 pilihan tabulator
4 : Jika pilih berita haji, tampil list berita haji
5 : Jika pilih pengumuman haji, tampil list pengumuman haji
6 : Jika pilih bookmark, tampil list bookmark
7 : memilih salah satu list berita haji, dan menampilkan berita haji
terpilih
8 : memilih salah satu list pengumuman haji, dan mengecek apakah
file sudah ada atau belum.
9 : men-download file karna file belum ada
117
10 : menampilkan file pengumuman haji terpilih
11 : memilih salah satu list berita haji, dan menampilkan berita haji
terpilih
12 : Selesai
1
2
12
3
4 5 6
7
11
8
10
9
R1
R2
R3
R4
Gambar 058 Flowgraph Berita Haji
Perhitungan Cyclomatic Complexity dari Flowgraph di atas
memiliki Region = 4.
a. Menghitung Cyclomatic Complexity dari Edge dan Node :
V(G) = (E-N)+2
V(G) = (14-12)+2
V(G) = 4
b. Menghitung Cyclomatic Complexity C dari P :
V(G) = P + 1 = 3 + 1
V(G) = 4
c. Independent Path pada Flowgraph :
Path 1 = 1-2-3-4-7-12
Path 2 = 1-2-3-5-8-10-12
Path 3 = 1-2-3-5-8-9-10-12
Path 4 = 1-2-3-6-11-12
118
d. Pengujian Test Case :
Tabel 4.28 Tabel Pengujian Test Case pada Berita Haji
Path Kondisi Hal yang
diharapkan
Hasil Uji
1 Memilih tab berita
haji dan memilih
berita haji
Menampilkan
berita haji
Sesuai, Alur
terlewati
2 Memilih tab
pengumuman haji dan
memilih
pengumuman haji
namun file sudah ada
Muncul
pengumuman
haji
Sesuai, alur
terlewati
3 Memilih tab
pengumuman haji dan
memilih
pengumuman haji
namun file belum ada
Muncul hasil
dialog
download
(node 9)
Sesuai, alur
terlewati
119
4 Memilih tab
bookmark dan
memilih bookmark
Menampilkan
halaman
bookmark
Sesuai, Alur
terlewati
Berdasarkan tabel 4.28, hasil pengujian pada berita haji sesuai
dengan yang diharapkan dan semua alur pada flowgraph berhasil
dilewati. Hal ini menunjukkan bahwa sudah tidak ada kesalahan
logika pada berita haji.
2. Pengujian pada Cek Keberangkatan Haji
Flowgraph pada Cek Keberangkatan Haji adalah sebagai berikut:
1 : Mulai
2 : memasukkan nomor porsi pada form,
3 : apabila ada koneksi akan menampilkan hasil, apabila tidak maka
akan ada tampilan eror dan pilihan untuk coba lagi
4 : ada koneksi, apakah ada hasil
5 : memilih coba lagi.
6 : hasil tidak ditemukan
120
7 : hasil ditemukan
8 : selesai
2
3
4
5
76
8
1
R1
R2
R3
R4
Gambar 059 Flowgraph Cek Keberangkatan Haji
Perhitungan Cyclomatic Complexity dari Flowgraph di atas
memiliki Region = 7.
a. Menghitung Cyclomatic Complexity dari Edge dan Node :
V(G) = (E-N)+2
V(G) = (10-8)+2
V(G) = 4
b. Menghitung Cyclomatic Complexity C dari P :
V(G) = P + 1 = 3 + 1
V(G) = 4
c. Independent Path pada Flowgraph :
Path 1 = 1-2-3-4-6-8
Path 2 = 1-2-3-5-4-6-8
Path 3 = 1-2-3-4-7-8
Path 4 = 1-2-5-4-7-8
121
d. Pengujian Test Case
Tabel 4.29 Tabel Pengujian Test Case pada Cek Keberangkatan Haji
Path Kondisi Hal yang
diharapkan
Hasil Uji
1 Memasukkan nomor
porsi yang tidak ada
Muncul
tulisan bahwa
hasil yang
dicari tidak
ditemukan
Sesuai, Alur
terlewati
2 Koneksi habis dan
tidak mencoba lagi
Muncul
tulisan untuk
mencoba lagi
dan hasil tidak
muncul
Sesuai, alur
terlewati
3 Memasukkan nomer
porsi yang ada
Muncul hasil
nomer porsi
Sesuai, alur
terlewati
122
4 Koneksi habis dan
mencoba lagi
Muncul
tulisan untuk
mencoba lagi,
kemudian
hasil muncul.
Sesuai, Alur
terlewati
Berdasarkan tabel 4.28, hasil pengujian pada cek keberangkatan
haji sesuai dengan yang diharapkan dan semua alur pada flowgraph
berhasil dilewati. Hal ini menunjukkan bahwa sudah tidak ada
kesalahan logika pada cek keberangkatan haji.
b. Pengujian dengan Black Box
Pada tahap terakhir, penulis melakukan testing aplikasi dengan
menggunakan blackbox. Pengujian blackbox ini dilakukan untuk
memperlihatkan bahwa semua fungsi aplikasi telah berfungsi secara
keseluruhan. Pengujian dilakukan dengan perangkat android yang
bersistem operasi Lolipop.
123
Tabel. 4.30. Hasil Pengujian Aplikasi dengan Metode Blackbox
No Nama Use
Case
Kegiatan Hasil yang
diharapkan
Hasil
1 Pengenalan
Haji dan
Umrah
Memilih menu
pengenalan haji
dan umrah
Menampilkan
menu pengenalan
haji dan umrah
Sesuai
2 Pengenalan
Haji
Memilih menu
pengenalan haji
Menampilkan
menu pada
pengenalan haji
Sesuai
3 Detail
pengenalan haji
Memilih menu
pada pengenalan
haji
Menampilkan
detail dari menu
yang dipilih pada
pengenalan haji
Sesuai
4 Pengenalan
Umrah
Memilih menu
pengenalan
Menampilkan
menu pada
Sesuai
124
umrah pengenalan
umrah
5 Detail
Pengenalan
Umrah
Memilih menu
pada pengenalan
umrah
Menampilkan
detail dari menu
yang dipilih pada
pengenalan
umrah
Sesuai
6 Hikmah Haji
dan Umrah
Memilih menu
hikmah haji dan
umrah
Menampilkan
menu pada
hikmah haji dan
umrah
Sesuai
7 Detail hikmah
haji dan umrah
Memilih menu
pada hikmah haji
dan umrah
Menampilkan
detail dari menu
yang dipilih pada
hikmah haji dan
umrah
Sesuai
125
8 Persiapan Haji Memilih menu
persiapan haji
Menampilkan
menu pada
persiapan haji
Sesuai
9 Detail
persiapan haji
Memilih menu
pada persiapan
haji
Menampilkan
detail dari menu
yang dipilih pada
persiapan haji
Sesuai
10 Pelaksanaan
Haji
Memilih menu
pelaksanaan haji
Menampilkan
menu pada
pelaksanaan haji
Sesuai
126
11 Detail
Pelaksanaan
Haji
Memilih menu
pada
pelaksanakan haji
detail dari menu
yang dipilih pada
pelaksanaan haji
Sesuai
12 Do‟a – Do‟a
haji dan Umrah
Memilih menu
do‟a – do‟a haji
dan umrah
Menampilkan
menu pada do‟a
– do‟a haji dan
umrah
Sesuai
13 Detail doa haji
dan umrah
Memilih menu
pada doa-doa haji
dan umrah
Menampilkan
menu yang
dipilih pada doa-
doa haji dan
umrah
Sesuai
127
14 Berita Haji Memilih menu
berita haji
Menampilkan list
berita, list
pengumuman,
dan list berita
yang telah
disimpan dengan
tabulator
Sesuai
15 Detail Berita
Haji
Memilih tab
berita haji dan
salah satu berita
pada list
Menampilkan
berita haji yang
dipilih
Sesuai
16 Detail
Pengumuman
Haji
Memilih tab
pengumuman haji
dan salah satu
pengumuman
pada list
Menampilkan
pengumuman
haji yang dipilih
Sesuai
128
17 Peta Lokasi Memilih menu
peta lokasi
Menampilkan
menu pada peta
lokasi
Sesuai
18 Detail Peta
Lokasi
Memilih menu
pada peta lokasi
Menampilkan
detail dari peta
lokasi yang
dipilih beserta
mapnya.
Sesuai
19 Video Haji Memilih menu
video haji
Menampilkan
video tentang
haji yang dipilih
Sesuai
129
20 Amalan –
Amalan Haji
Memilih menu
amalan haji
Menampilkan
menu pada
amalan haji
Sesuai
21 Detail Amalan
Haji
Memilih menu
pada amalan haji
Menampilkan
detail dari menu
yang dipilih pada
amalan haji
Sesuai
22 Istilah pada
Haji
Memilih menu
istilah haji
Menampilkan
istilah-istilah
pada haji
Sesuai
130
d. Pengujian pada perangkat Android
Pada pengujian ini, penulis melakukan pengujian pada perangkat android
dengan versi sistem operasi yang berbeda. Pengujian dilakukan untuk melihat
kompabilitas aplikasi terhadap perangkat android. Pengujian dilakukan pada
android versi 4.1 (JellyBean) dan versi 5.1 (Lolipop).
23 Detail istilah
haji
Memilih istilah
haji
Menampilkan
pengertian istilah
yang dipilih
Sesuai
24 Cek
Keberangkatan
Haji
Memilih menu
cek
keberangkatan
Menampilkan
inputan untuk
memasukkan
nomor porsi dan
hasil
pencariannya
Sesuai
131
1. Hasil Pengujian pada Android versi 4.1
Gambar 4.060 Tampilan aplikasi pada android v.4.1.
Keterangan Gambar : gambar diatas merupakan aplikasi pada saat diluncurkan
pada android versi 4.1. gambar tersebut menunjukkan bahwa aplikasi dapat
diinstall pada perangkat tersebut dan dapat dijalankan
2. Hasil Pengujian pada Android versi 5.1
Gambar 4.061 Tampilan aplikasi pada android v.5.1
Keterangan Gambar : gambar diatas merupakan proses instalasi aplikasi pada
android versi 5.1. gambar tersebut menunjukkan bahwa aplikasi dapat
diinstall pada perangkat tersebut dan dapat dijalankan.
132
BAB V
PENUTUP
5.1. Kesimpulan
Berdasarkan pembahasan yang telah dijelaskan, kesimpulan yang dapat
penulis ambil dari penelitian ini adalah :
1) Aplikasi ini dibangun dengan Metode RAD dan menggunakan IDE
Android Studio 1.2.1 menggunakan bahasa pemograman java. Aplikasi
ini hanya dapat dijalankan pada smartphone android versi 4.1 ke atas.
2) Aplikasi ini dapat memudahkan para jamaah haji mendapatkan
informasi tentang Haji dan Umrah seperti berita, pengumuman, serta
jadwal keberangkatan jamaah. Aplikasi ini juga menjelaskan tata cara
melaksanakan haji dan umrah (Selengkapnya dapat dilihat pada tabel
4.28). Aplikasi ini merupakan aplikasi mobile, sehingga dapat dipakai
dimana saja dan kapan saja melalui smartphone berbasis android.
5.2. Saran
Aplikasi yang dibangun ini tentunya masih memiliki kekurangan, oleh
karena itu ada beberapa hal yang diharapkan dapat dikembangkan agar aplikasi
menjadi lebih baik, di antaranya :
1) Aplikasi agar dapat dijalankan pada platform lain, misalnya iOS,
Windows phone, dan Blackberry.
2) Terdapat sistem notifikasi berita secara real-time agar pengguna dapat
mengetahui berita secara langsung tanpa harus mengeceknya terlebih
dahulu.
3) Tambahan penjelasan tentang tata cara pelaksanaan haji yang lebih
lengkap dan fitur yang lebih lengkap seperi cara mendaftar haji,
pembayaran haji, dan lain-lain.
133
DAFTAR PUSTAKA
A.S, Rosa, Shalahuddin, M, 2011. Modul Pembelajaran Rekayasa Perangkat
Lunak (Terstruktur dan Berorientasi Objek). Bandung : Modula
Al-Maliki, Sayyid Muhammad bin Alwi, 2012. Labbaik Allahumma labbaik :
panduan lengkap menuju haji mabrur, Bandung : Pustaka Hidayah
Abdurrachman Rochimi, H.M. 2011. Segala tentang Haji & Umrah, Jakarta :
ERLANGGA
Binanto, Iwan, 2010, Multimedia Digital Dasar Teori + Pengembangannya.
Yogyakarta : ANDI
H, Nazrudin Safaat. 2012. ANDROID : Pemograman Aplikasi Mobile
Smartphone dan Tablet PC Berbasis Android. Bandung : Informatika
Hermawan S, Stephanus, 2011. Mudah Membuat Aplikasi Android. Yogyakarta :
ANDI
Hoew, Shay. 2014 . Learn to Code HTML & CSS Develop & Style Websites.
Collingwood : New Riders
Jackson, Wallace, 2011. Android Apps for Absolute Beginners. APRESS
JULIUS St, M., 2007. Panduan lengkap dan praktis haji tamattu'. Malang :
Bayumedia
Kementerian Agama RI. 2014. Tuntunan Manasik Haji dan Umrah. Direktorat
Jendal Penyelenggaraan Haji dan Umrah : Jakarta
Kendall, Kenneth E dan Julie E. Kendall, 2010, System Analysis and Design,
Pearson Education. New Jersey
Lee, Wei-Meng, 2011. Beginning Androidtm
Application Development.
Indianapolis : Wiley Publishing, Inc
Lloyd, Ian. 2011. Build Your Own Web Site The Right Way Using HTML & CSS
3rd
Edition. SitePoint.Ince
Multimedia, Satria, Apa itu Multimedia,
http://www.satriamultimedia.com/artikel_apa_itu_multimedia.html ,
diakses tanggal 28 November 2014
Roger S. Pressman, SoftwareEngineeringAPracticioner’sApproach;2010
134
Roger S. Pressman, 2010. Rekayasa Perangkat Lunak Pendekatan Praktisi (Buku
Satu). . Yogyakarta : ANDI
Vaughan, Tay, 2010. Multimedia Making it Work : Eight Edition.
135
LAMPIRAN
Kuisioner Penelitian
Nama :
Usia :
Berilah Tanda () pada pertanyaan di bawah ini
1. Apakah anda telah memahami tata cara manasik haji atau umrah yang
benar?
( ) Paham
( ) Belum Paham
2. Media apa yang anda jadikan sebagai media pengetahuan tentang manasik
Haji dan Umrah? (boleh lebih dari satu)
( ) Buku panduan
( ) Kaset/VCD
( ) Perangkat Mobile
( ) Yang lain, ………………………………
3. Dengan media saat ini, apakah sudah cukup efektif untuk para calon jama‟ah
haji supaya mengetahui tentang tata cata haji dan umrah?
( ) Sudah Cukup
( ) Kurang Cukup
( ) Tidak Cukup
4. Materi apa yang anda anggap paling sulit dalam mempelajari manasik Haji
dan Umrah?
( ) Rukun dan syarat Haji atau Umrah
( ) Rukun dan wajib haji atau umrah
( ) Sunnah-sunnah haji atau umrah
( ) Bacaan dan do‟a haji atau umrah
( ) Amalan – amalan haji atau umrah
5. Apakah yang menyebabkan anda merasa sulit dalam mempelajari manasik
haji dan umrah ?
( ) Terbatasnya waktu
( ) Buku panduan agak sulit dimengerti
136
( ) Cepat Bosan
6. Apakah anda setuju atau merasa perlu dibuat aplikasi pembelajaran haji dan
umrah yang dapat membantu dalam memperlajari dan mendapatkan
informasi tentang haji?
( ) Setuju
( ) Tidak Setuju
7. Fasilitas apa yang anda inginkan dalam aplikasi pembelajaran haji dan umrah
berbasis smartphone android? (Boleh memilih lebih dari satu)
( ) Penjelasan haji dan umrah
( ) urutan pelaksanaan haji dan umrah
( ) bacaan dan do‟a haji dan umrah
( ) Peta lokasi-lokasi haji dan umrah
( ) Berita haji dan umrah terkini (terupdate online)
( ) Video haji dan umrah
( ) lainnya, ……………………….
Hasil Kuisioner
1. Apakah anda telah memahami tata cara manasik haji atau umrah yang benar?
Jawaban Jumlah Jawaban Persentase
Belum Paham 30 60%
Paham 20 20%
Jumlah 50 100%
137
2. Media apa yang anda jadikan sebagai media pengetahuan tentang manasik Haji
dan Umrah? (boleh lebih dari satu)
Jawaban Jumlah Jawaban Persentase
Buku panduan 42 84%
Kaset 16 32%
Perangkat Mobile 6 12%
Lainnya 3 6%
3. Apakah sudah cukup efektif untuk para calon jama‟ah haji supaya mengetahui
tentang tata cata haji dan umrah?
Jawaban Jumlah Jawaban Persentase
Sudah 14 28%
Kurang 28 56%
Belum 8 16%
138
4. Materi apa yang anda anggap paling sulit dalam mempelajari manasik Haji dan
Umrah?
Jawaban Jumlah Jawaban Persentase
Rukun dan syarat Haji atau Umrah 16 32%
Rukun dan wajib haji atau umrah 9 18%
Sunnah-sunnah haji atau umrah 5 10%
Bacaan dan do‟a haji atau umrah 31 62%
Amalan haji atau umrah 13 26%
Yang lainnya 1 2%
5. Apakah yang menyebabkan anda merasa sulit dalam mempelajari manasik haji
dan umrah ?
Jawaban Jumlah Jawaban Persentase
139
Terbatasnya waktu 29 58 %
Buku panduan agak sulit dimengerti 14 28%
Cepat Bosan 2 4%
Yang lainnya, … 5 16 %
Jumlah 50 100%
6. Apakah anda setuju atau merasa perlu dibuat aplikasi pembelajaran haji dan
umrah yang efektif dengan perangkat smartphone android
Jawaban Jumlah Jawaban Persentase
Setuju 50 100%
Tidak Setuju 0 0%
Jumlah 50 100%
7. Fasilitas apa yang anda inginkan dalam aplikasi pembelajaran haji dan umrah
berbasis smartphone android? (Boleh memilih lebih dari satu)
140
Jawaban Jumlah Jawaban Persentase
Penjelasan haji dan umrah 28 56%
Urutan pelaksanaan haji dan umrah 22 44%
Bacaan dan do‟a haji dan umrah 21 42%
Peta lokasi-lokasi haji dan umrah 14 32%
Berita haji dan umrah terkini (terupdate online) 16 30%
Video haji dan umrah 15 28%
Yang lainnya, …. 1 2%
141
Source Code
CeKBerangkatActivity.java
public class CekBerangkatActivity extends ActionBarActivity {
Toolbar toolbar;
EditText editCari;
TextView hasilCari;
Button butCari;
String query;
InputMethodManager imm;
boolean koneksi;
ProgressDialog progressDialog = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
{
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS);
}
getWindow().requestFeature(Window.FEATURE_ACTION_BAR_OVERLAY);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_cek_berangkat);
toolbar = (Toolbar) findViewById(R.id.app_bar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setTitle("Cek Keberangkatan");
editCari = (EditText) findViewById(R.id.edit_cari);
hasilCari = (TextView) findViewById(R.id.hasil_cari);
imm = (InputMethodManager) getSystemService(
Context.INPUT_METHOD_SERVICE);
koneksi = true;
editCari.setOnEditorActionListener(new
TextView.OnEditorActionListener() {
@Override
public boolean onEditorAction(TextView v, int
actionId, KeyEvent event) {
if (actionId == EditorInfo.IME_ACTION_SEARCH) {
query = editCari.getText().toString();
ConnectivityManager check =
(ConnectivityManager)
getSystemService(CONNECTIVITY_SERVICE);
if (check != null) {
NetworkInfo[] info =
check.getAllNetworkInfo();
if (info != null)
for (int i = 0; i < info.length; i++)
if (info[i].getState() ==
NetworkInfo.State.CONNECTED) {
new
cariBerangkat().execute(query);
142
imm.hideSoftInputFromWindow(editCari.getWindowToken(), 0);
}
} else {
Toast.makeText(CekBerangkatActivity.this,
"not conencted to internet",
Toast.LENGTH_SHORT).show();
}
return true;
}
return false;
}
});
}
private class cariBerangkat extends AsyncTask<String, String,
String> {
@Override
protected void onPreExecute() {
super.onPreExecute();
if (progressDialog == null) {
progressDialog = new
ProgressDialog(CekBerangkatActivity.this);
progressDialog.setMessage("Mohon Tunggu....");
progressDialog.setIndeterminate(true);
progressDialog.setProgressStyle(ProgressDialog.STYLE_SPINNER);
progressDialog.setCancelable(false);
progressDialog.show();
}
}
@Override
protected String doInBackground(String... params) {
String isi = "";
String link =
"http://haji.kemenag.go.id/v2/basisdata/xml/" + query;
try {
URL url = new URL(link);
URLConnection conn = (URLConnection)
url.openConnection();
conn.setReadTimeout(10000);
conn.setConnectTimeout(15000);
conn.connect();
Log.e("URL : ", link);
Document doc;
doc =
Jsoup.connect("http://haji.kemenag.go.id/v2/basisdata/xml/" +
query).get();
// Get document (HTML page) title
Element e = doc.select("div.view-content >
div.views-row.views-row*").first();
if (e == null) {
isi = "Nomor Porsi " + query + " tidak
ditemukan";
} else {
isi = e.html();
143
koneksi = true;
}
Log.e("ISI : ", isi);
} catch (IOException e) {
e.printStackTrace();
koneksi = false;
}
return isi;
}
@Override
protected void onPostExecute(String s) {
super.onPostExecute(s);
progressDialog.dismiss();
progressDialog = null;
if (koneksi == false) {
cobaLagi();
} else {
Typeface sans =
Typeface.createFromAsset(getAssets(), "fonts/opensans.ttf");
hasilCari.setTypeface(sans);
hasilCari.setText(Html.fromHtml(s));
koneksi = true;
}
}
}
public void cobaLagi() {
SnackbarManager.show(
Snackbar.with(getApplicationContext()) // context
.text("Koneksi Habis") // text to display
.actionLabel("Coba lagi") // action button
label
.duration(Snackbar.SnackbarDuration.LENGTH
_INDEFINITE)
.actionListener(new ActionClickListener()
{
@Override
public void onActionClicked(Snackbar
snackbar) {
new cariBerangkat().execute();
koneksi = true;
SnackbarManager.dismiss();
}
}) // action button's ActionClickListener
, this); // activity where it is displayed
}
DoaActivity.java
public class DoaActivity extends ActionBarActivity {
public boolean MP = false;
Toolbar toolbar;
TextView textView;
144
ImageView imageView;
ImageView button;
MediaPlayer mediaPlayer;
TextView textTitle;
int size;
int current;
int menu1;
int menu2;
MyDatabaseAdapter dbAdapter;
Doa doa;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_doa2);
toolbar = (Toolbar) findViewById(R.id.app_bar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.abc_ic_clear
_mtrl_alpha);
getSupportActionBar().setTitle("");
Bundle b = getIntent().getExtras();
current = b.getInt("pos");
size = b.getInt("size");
menu1 = b.getInt("menu1");
menu2 = b.getInt("menu2");
textView = (TextView) findViewById(R.id.text_doa_a);
imageView = (ImageView) findViewById(R.id.image_doa_a);
button = (ImageView) findViewById(R.id.button_play_a);
textTitle = (TextView) findViewById(R.id.textTitle);
toolbar.setTitle(null);
dbAdapter = new
MyDatabaseAdapter(getApplicationContext());
try {
dbAdapter.open();
} catch (SQLException e) {
e.printStackTrace();
}
String query = "" + menu1 + "" + menu2 + "" + current;
Log.i("URL", query);
doa = dbAdapter.getDoa(query);
//IMAGE
String ImageUri = doa.getDrawable();
int ImageResource = getResources().getIdentifier(ImageUri,
"drawable", getPackageName());
imageView.setImageResource(ImageResource);
//TEXT
145
textView.setText(doa.getTerjemah());
textTitle.setText(doa.getKet());
mediaPlayer = new MediaPlayer();
MP = false;
button.setImageResource(R.drawable.ic_putar);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (mediaPlayer.isPlaying()) {
if (mediaPlayer != null) {
playerStop();
}
} else {
// Resume song
if (mediaPlayer != null) {
playerPlay();
}
}
}
});
}
@Override
public void onBackPressed() {
if (MP)
playerStop();
else
finish();
}
public void playerStop() {
mediaPlayer.pause();
MP = false;
button.setImageResource(R.drawable.ic_play_arrow_white_48dp);
}
public void playerPlay() {
try {
Uri mp3 = Uri.parse("android.resource://" +
getPackageName() + "/raw/" + doa.getSuara());
mediaPlayer =
MediaPlayer.create(getApplicationContext(), mp3);
mediaPlayer.start();
MP = true;
button.setImageResource(R.drawable.ic_pause_white_48dp);
} catch (Exception e) {
e.printStackTrace();
}
}
}
146
BeritaActivity.java
public class BeritaActivity extends ActionBarActivity {
Toolbar toolbar;
ViewPager viewPager;
BeritaPagerAdapter beritaPagerAdapter;
SlidingTabLayout slidingTabLayout;
CharSequence titles[] = {"Berita Haji", "Pengumuman Haji",
"Bookmark"};
int numTabs = 3;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_berita);
toolbar = (Toolbar)findViewById(R.id.app_bar);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle("Berita Haji");
beritaPagerAdapter = new
BeritaPagerAdapter(getSupportFragmentManager(), titles, numTabs);
viewPager = (ViewPager) findViewById(R.id.berita_pager);
viewPager.setAdapter(beritaPagerAdapter);
slidingTabLayout = (SlidingTabLayout)
findViewById(R.id.tabs);
slidingTabLayout.setDistributeEvenly(true);
slidingTabLayout.setViewPager(viewPager);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_berita, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
public class BeritaPagerAdapter extends FragmentPagerAdapter {
CharSequence titles[];
int NUMBER_OF_TABS;
147
public BeritaPagerAdapter(FragmentManager fm, CharSequence
mTitles[], int mNUMBER_OF_TABS) {
super(fm);
this.titles = mTitles;
this.NUMBER_OF_TABS = mNUMBER_OF_TABS;
}
@Override
public android.support.v4.app.Fragment getItem(int
position) {
String text = " ";
switch (position) {
case 0:
text =
"http://haji.kemenag.go.id/v2/publikasi/berita/?page=";
return BeritaFragment.getInstance(position, text);
case 1:
text =
"http://haji.kemenag.go.id/v2/publikasi/pengumuman";
return PengumumanFragment.getInstance(position,
text);
case 2:
text = "";
return BookmarkFragment.getInstance(position,
text);
}
return BeritaFragment.getInstance(position, text);
}
@Override
public CharSequence getPageTitle(int position) {
return titles[position];
}
@Override
public int getCount() {
return NUMBER_OF_TABS;
}
}
}
BeritaFragment.java
public class BeritaFragment extends Fragment implements
ClickListener {
private static final String ARG_PARAM1 = "param1";
private static final String URL_STRING = "param2";
// TODO: Rename and change types of parameters
private int mParam1;
private String mParam2;
148
boolean koneksi = true;
////////////////////////////////////////
RecyclerView recyclerView;
BeritaAdapter beritaAdapter;
List<MenuBerita> beritaList;
LinearLayoutManager mLayoutManager;
MenuBerita menuBerita;
Button button;
String title = "";
String pubDate = "";
String link = "";
String description = "";
String image = "";
int webpage = 0;
public static BeritaFragment getInstance(int param1, String
text) {
BeritaFragment fragment = new BeritaFragment();
Bundle args = new Bundle();
args.putInt(ARG_PARAM1, param1);
args.putString(URL_STRING, text);
fragment.setArguments(args);
return fragment;
}
public BeritaFragment() {
// Required empty public constructor
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup
container,
Bundle savedInstanceState) {
View layout = inflater.inflate(R.layout.fragment_berita,
container, false);
mParam1 = getArguments().getInt(ARG_PARAM1);
mParam2 = getArguments().getString(URL_STRING);
koneksi = true;
beritaList = new ArrayList<>();
recyclerView = (RecyclerView)
layout.findViewById(R.id.recycler_berita);
button = (Button) layout.findViewById(R.id.dummybut);
mLayoutManager = new LinearLayoutManager(getActivity());
recyclerView.setLayoutManager(mLayoutManager);
new parseBerita().execute();
149
beritaAdapter = new BeritaAdapter(getActivity(),
beritaList);
beritaAdapter.setOnClickListener(this);
recyclerView.setAdapter(beritaAdapter);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
webpage = webpage + 1;
new parseBerita().execute();
beritaList.add(menuBerita);
beritaAdapter.notifyDataSetChanged();
}
});
return layout;
}
@Override
public void itemClicked(View view, int position) {
ImageView newsImage = (ImageView)
view.findViewById(R.id.news_image);
ActivityOptionsCompat activityOptionsCompat =
ActivityOptionsCompat.makeSceneTransitionAnimation(getActivity(),
newsImage, "image_bar");
Intent i = new Intent(getActivity(),
BeritaDetailActivity.class);
i.putExtra("title", beritaList.get(position).getTitle());
i.putExtra("date", beritaList.get(position).getPubDate());
i.putExtra("link", beritaList.get(position).getLink());
i.putExtra("image", beritaList.get(position).getImage());
getActivity().startActivity(i,
activityOptionsCompat.toBundle());
}
public class parseBerita extends AsyncTask<String, Void,
List<MenuBerita>> {
@Override
protected List<MenuBerita> doInBackground(String...
params) {
String address = mParam2 + "" + webpage;
try {
URL url = new URL(address);
URLConnection conn = (URLConnection)
url.openConnection();
conn.setReadTimeout(10000);
conn.setConnectTimeout(15000);
conn.connect();
int count = 0;
Document document;
document = Jsoup.connect(address).get();
boolean done = false;
150
Elements main = document.select("div.view-content
> div.views-row.views-row*");
for (Element e : main) {
Elements titleNews = e.select("div >
div.header.article-header h2 a");
Elements pubDateNews = e.select("div >
div.footer.submitted > span.time.pubdate > span");
Elements desc = e.select("div >
div[class=node-content] > div[class=section field field-name-body
field-type-text-with-summary field-label-hidden] >
div[class=field-items] > div[class=field-item odd] > p");
Elements img = e.select("div > div[class=node-
content] > div[class=section field field-name-field-image field-
type-image field-label-hidden] > div[class=field-items] >
div[class=field-item odd]");
title = titleNews.text();
pubDate = pubDateNews.text();
description = desc.text().substring(0, 50) +
"(...)";
link = "http://haji.kemenag.go.id" +
titleNews.attr("href");
image = img.attr("resource");
menuBerita = new MenuBerita(title, link,
description, pubDate, image);
beritaList.add(menuBerita);
koneksi = true;
}
} catch (IOException e) {
Log.e("APP PARSER", "GA ADA YG NAMBAH");
koneksi = false;
}
return beritaList;
}
@Override
protected void onPostExecute(List<MenuBerita> result) {
if (koneksi == false) {
cobaLagi();
} else {
beritaAdapter.notifyDataSetChanged();
koneksi = true;
}
}
}
public void cobaLagi() {
final Dialog dialog = new Dialog(getActivity());
dialog.setContentView(R.layout.dialog_koneksi);
//
Button buttonOK = (Button)
dialog.findViewById(R.id.but_ok);
151
Button buttonCancel = (Button)
dialog.findViewById(R.id.but_cancel);
dialog.show();
buttonOK.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
new parseBerita().execute();
koneksi = true;
dialog.dismiss();
}
});
buttonCancel.setOnClickListener(new View.OnClickListener()
{
@Override
public void onClick(View v) {
koneksi = true;
dialog.dismiss();
}
});
}
}
DetailActivity.java
public class DetailActivity extends ActionBarActivity {
int size;
int current;
int menu1;
int menu2;
String title;
Toolbar toolbar;
ViewPager myPager;
DetailTextPagerAdapter adapter;
String file;
MyDatabaseAdapter dbAdapter;
Content content;
@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
}
@Override
protected void onCreate(Bundle savedInstanceState) {
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_detail_text_pager);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
152
Bundle b = getIntent().getExtras();
current = b.getInt("pos");
size = b.getInt("size");
menu1 = b.getInt("menu1");
menu2 = b.getInt("menu2");
title = b.getString("title");
adapter = new DetailTextPagerAdapter(this, size);
myPager = (ViewPager)
findViewById(R.id.detailTextViewPager);
myPager.setAdapter(adapter);
myPager.setCurrentItem(current);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if
it is present.
getMenuInflater().inflate(R.menu.menu_detail_text_pager,
menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so
long
// as you specify a parent activity in
AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_next) {
if (current <= size) {
current = current + 1;
myPager.setCurrentItem(current);
}
return true;
}
if (id == R.id.action_prev) {
if (0 <= current) {
current = current - 1;
myPager.setCurrentItem(current);
}
return true;
}
return super.onOptionsItemSelected(item);
}
public class DetailTextPagerAdapter extends PagerAdapter {
int size;
Activity activity;
View view;
TextView titleBar;
TextView subTitleBar;
153
WebView webView;
TextView detailTitle;
ImageView imageBar;
public DetailTextPagerAdapter(DetailActivity
detailTextPagerActivity, int noofsize) {
// TODO Auto-generated constructor stub
size = noofsize;
activity = detailTextPagerActivity;
}
@Override
public int getCount() {
return size;
}
@Override
public Object instantiateItem(View container, int
position) {
LayoutInflater inflater = (LayoutInflater)
activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
view = inflater.inflate(R.layout.detail_text_pager,
null);
// titleBar = (TextView) findViewById(R.id.title_bar);
// subTitleBar = (TextView)
findViewById(R.id.subtitle_bar);
detailTitle = (TextView)
view.findViewById(R.id.detail_title);
webView = (WebView)
view.findViewById(R.id.detail_webPager);
imageBar = (ImageView)
view.findViewById(R.id.card_view);
dbAdapter = new
MyDatabaseAdapter(getApplicationContext());
try {
dbAdapter.open();
} catch (SQLException e) {
e.printStackTrace();
}
String url = "" + menu1 + "" + menu2 + "" + position;
int pagenumberTxt = position + 1;
Content content = dbAdapter.getContent(url);
Log.i("URL", url);
// Toast.makeText(getApplicationContext(), "ID = "+url,
Toast.LENGTH_SHORT).show();
file = content.getFile();
getSupportActionBar().setTitle("");
// titleBar.setText(title);
//
subTitleBar.setText(content.getKet()+"("+pagenumberTxt+" of
"+size+")");
154
detailTitle.setText(content.getKet());
String ImageUri = content.getImage();
int ImageResource =
getResources().getIdentifier(ImageUri, "drawable",
getPackageName());
imageBar.setImageResource(ImageResource);
File filea = new File(file);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setAllowFileAccess(true);
webView.getSettings().setAllowContentAccess(true);
webView.getSettings().getAllowContentAccess();
webView.getSettings().getAllowFileAccess();
webView.getSettings().getJavaScriptEnabled();
webView.loadUrl(file);
((ViewPager) container).addView(view, 0);
dbAdapter.close();
return view;
}
@Override
public void destroyItem(View arg0, int arg1, Object arg2)
{
((ViewPager) arg0).removeView((View) arg2);
}
@Override
public boolean isViewFromObject(View view, Object object)
{
return view == ((View) object);
}
@Override
public Parcelable saveState() {
return null;
}
}
}
Recommended