Aplikasi Panduan Haji dan Umrah
“ Tugas Pengganti UTS Interaksi manusia dan Komputer “
Disusun Oleh
Ketua
: Samsul Rijal
16.11.0387
Anggota : Muhammad Dwisyal Alfitra
16.11.0336
Uswatul Khasanah
14.11.7862
Muhammad Fathurahman A
16.11.0348
Apolos Ade Ardison
16.11.0356
JURUSAN INFORMATIKA
FAKULTAS TEKNIK KOMPUTER
UNIVERSITAS AMIKOM YOGYAKARTA
Daftar Isi
COVER ………. DAFTAR ISI ………. BAB 1 PENDAHULUAN ……… 1.1 Latar Belakang ……… 1.2 Rumusan Masalah ………... 1.3 Batasan Masalah ………. 1.3 Tujuan ………. 2.2 FUNGSI YANG DISEDIAKAN ……….. 2.2.1 FiturFungsional ……….. 2.2.2 Fitur Visual ………. 2.3 CARA PENGGUNAAN ………
2.3.1 Fitur Fungsional ……….. 2.3.2 Fitur Visual ……….. 2.4 KEUNGGULAN ……….
2.4.1 Fungsional ……… 2.4.1 Visual ………...
PENDAHULUAN
1.1 LATAR BELAKANG
Informasi tidak hanya di dapatkan di dalam buku, akan tetapi internet dan teknologi dapat juga memberikan informasi terutama dalam bidang Agama. Dalam bidang Agama, banyak sekali aturan dan sebagainya yang harus kita pelajari. Salah satunya tentang haji dan umrah. Ibadah dalam Agama Islam banyak macamnya. Haji dan Umroh adalah salah satunya. Haji merupakan rukun Islam yang ke lima setelah sahadat, sholat, zakat dan puasa.
Kita dapat memanfaatkan teknologi untuk memberikan alternatif lain kepada jamaah haji dan umrah, maka dibangunlah sebuah aplikasi panduan haji dan umrah yang membantu jamaah haji dan umrah dalam melaksanakan persiapan ibadah haji dan umrah.
Aplikasi Panduan Haji dan Umrah ini memberikan informasi tentang pelaksaan dalam haji dan umrah tersebut. Dari perkembangan teknologi yang semakin canggih, aplikasi ini memudahkan untuk user mengetahui informasi dengan smartphone yang user gunakan. Aplikasi ini membantu user untuk mengetahui tentang segala sesuatu yang berkaitan denga haji dan umroh beserta tata caranya.
Penulis bermaksud untuk membuat aplikasi Panduan Haji dan Umrah yang bisa
digunakan oleh siapa saja dan dimana pun pengguna berada. Dimana para pengguna dengan mudah menambah dan mengembangkan wawasan mengenai agama terutama haji dan umrah hanya dengan smartphone.
Berdasarkan latar belakang yang telah di uraikan di atas, penulis sangat tertarik untuk membuat
“Aplikasi Panduan Haji dan Umrah “.
1.2 RUMUSAN MASALAH
Berdasarkan latar belakang yang telah diuraikan diatas, maka rumusan masalah dalam pembuatan aplikasi ini adalah sebagai berikut:
a. Bagaimana membuat aplikasi berbasis mobile android mengenai tuntunan haji dan umroh?
b. Bagaimana membuat aplikasi yang dapat memberikan informasi tentang pelaksaan dalam haji dan umrah tersebut?
c. Apa saja fitur penunjang yang ada di dalam aplikasi sehingga sesuai dengan kebutuhan?
Dalam perancangan aplikasi ini terdapat beberapa batasan masalah. Hal ini dilakukan agar aplikasi dapat terfokus / sesuai kebutuhan. Batasan masalah tersebut sebagai berikut :
1. Aplikasi Panduan haji dan umroh ini berisikan tentang Tempat Ziarah, panduan haji, Panduan umrah, doa- doa, trevel.
1.4 TUJUAN
Tujuan membuat aplikasi Panduan Haji dan Umrah Dengan adanya aplikasi ini user dengan mudah :
1. Untuk memperkaya pengetahuan jamaah sebelum melaksanakan perjalana ibadah haji dan umrah,
2. Memudahkan umat muslim khususnya calon jamaah umroh untuk mendapatkan pengetahuan umroh melalui smartphone android kapan saja dan dimana saja.
3. Untuk dapat membantu serta memudahkan kaum muslimin yang akan atau sedang mealaksanakan haji dan umrah dan dapat memandu mereka saat menjalani manasik haji maupun umrah sesuai dengan apa-apa yang di contohkan rasulullah SAW.
BAB II PEMBAHASAN
(Gambar 1.1 Tampilan utama) Keterangan gambar 1.1
Tampilan utama aplikasi panduan haji dan umrah sebelum login Images : gambar icon dari aplikasi
Button login : untuk masuk/menampilkan halaman login
(Gambar 1.2 Halaman login) Keterangan gambar 1.2
Tampilan halaman login
Label : login
Images : icon aplikasi
Text input 1 : untuk mengimputkan email atau no.tlp Text input 2 : untuk menginputkan password
(Gambar 1.3 halaman registrasi/daftar) Keterangan gambar 1.3
Tampilan dari halaman daftar/registrasi
Label 1 : nama halaman Label 2 : nama
(Gambar 1.4 halaman beranda) Keterangan gambar 1.4
User :
Search :
(Gambar 1.5 Tampilan menu 1) Keterangan Gambar 1.5
Button 1 : pilihan pertama dalam menu tempat ziarah Button 2 : pilihan kedua dalam menu tempat ziarah
(Gambar 1.6 Tampilan menu ziarah) Keterangan :
(Gambar 1.7 Tampilan Menu 2) Keterangan :
Menu bars samping kiri atas = untuk kembali ke menu utama
User = Untuk menampilkan ke menu akun user
Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
Button 1 = Hanya sebagai Judul tidak bisa dieksekusi
(Gambar 1.8 Tampilan penjelasan isi menu ) Keterangan :
a. Bars menu = Untuk mengarahkan User ke menu Utama
b. Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
c. Button 10 = Untuk membawa / mengarahkan user ke menu sebelumnya atau back to past page
(Gambar 1.9 Tampilan penjelasan isi menu) Keterangan :
a. Bars menu = Untuk mengarahkan User ke menu Utama
b. Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
c. Button 12 = Untuk membawa / mengarahkan user ke menu sebelumnya atau back to past page
(Gambar 1.10 tampilan penjelasan isi menu) Keterangan :
a. Bars menu = Untuk mengarahkan User ke menu Utama
b. Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
c. Button 13 = Untuk membawa / mengarahkan user ke menu sebelumnya atau back to past page
(Gambar 1.11 Tampilan penjelasan isi menu) Keterangan :
a. Bars menu = Untuk mengarahkan User ke menu Utama
b. Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
c. Button 15 = Untuk membawa / mengarahkan user ke menu sebelumnya atau back to past page
(Gambar 1.12 tampilan penjelasan isi menu)
Keterangan :
a. Bars menu = Untuk mengarahkan User ke menu Utama
b. Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
c. Button 17 = Untuk membawa / mengarahkan user ke menu sebelumnya atau back to past page
(Gambar 1.13 tampilan penjelasan isi menu) Keterangan :
a. Bars menu = Untuk mengarahkan User ke menu Utama
b. Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
c. Button 19 = Untuk membawa / mengarahkan user ke menu sebelumnya atau back to past page
(Gambar 1.14 tampilan penjelasan isi menu) Keterangan :
a. Bars menu = Untuk mengarahkan User ke menu Utama
b. Search = Untuk memudahkan user mencari dengan kata yang mereka inginkan atau dengan kata lain pencarian berdasarkan kata
c. Button 21 = Untuk membawa / mengarahkan user ke menu sebelumnya atau back to past page
(Gambar 1.15 tampilan menu panduan umrah) Keterangan :
Button 1 : pilihan pertama dalam menu panduan umroh Button 2 : pilihan kedua dalam menu panduan umroh Button 3 : pilihan ketiga dalam menu panduan umroh Button 4 : pilihan keempat dalam menu panduan umroh
(Gambar 1.16 Tampilan penjelasan isi menu) Keterangan :
(Gambar 1. Tampilan menu travel) Keterangan :
Menu :teravel
(Gambar 1. Tampilan Menu informasi ) Keterangan ;
Menu : informasi
(Gambar 1. Bagian dari menu informasi) Keterangan :
Menu :bagian dari mesu informasi
2.1.3 Mock Up
(Gambar 2.1 Mock Up tampilan Utama)
(Gambar 2.3 mock up tampilan registrasi/daftar)
(Gambar 2.5 mock up tampilan menu ziarah)
(Gambar 2.7 mock up tampilan penjelasan menu tempat- tempat ziarah)
(Gambar 2.9 mockup pengertian ibadah haji)
(Gambar 2.11 mockup Keutamaan haji)
(Gambar 2.13 mockup Rukun Haji)
(Gambar 2.15 mockup Penutup dan lampiran)
(Gambar 2.17 mock up tampilan isi panduan umrah)
(Gambar 2.19 mockup doa ketika ihram)
(Gambar 2.21 mockup doa ketika sai)
(Gambar 2.23 mock up doa ketika mabit)
(Gambar 2.26 mock up menu trevel)
2.2 FUNGSI YANG DISEDIAKAN
2.2.1 Fitur fungsional
Mock up tampilan utama
a) Rectangle
: item ini digunakan untuk memberikan
warna background pada mockup
b) Images
: item ini berfungsi menampilkan file
gambar pada aplikasi, seperti untuk hiasan, logo, perlengkapan
data dsb. Sedangkan di menu yang saya buat item ini digunakan
untuk menampilkan logo aplikasi
c) Button login
: item ini digunakan untuk menampilkan
menu baru ya itu menu login
d) Button daftar
: item ini digunakan untuk menampilkan
menu daftar
e) Text area
: sebuah kolom yang dibuat sebagai
kontainer tulisan
Mock up menu login
a) Text area
: sebuah kolom yang dibuat sebagai
kontainer tulisan
b) Images
: item ini berfungsi menampilkan file
gambar pada aplikasi, seperti untuk hiasan, logo, perlengkapan
data dsb. Sedangkan di menu yang saya buat item ini digunakan
untuk menampilkan logo aplikasi
c) Text input email
: digunakan untuk menginputkan email
d) Text input password : text yang diinput tidak akan terlihat,akan
berupa bintang atau bulatan, hanya digunakan untuk inputan
yang sensitif
e) Button login
: item ini digunakan untuk menampilkan
menu utama pada aplikasi
Mock Up Menu Registrasi
a) Label
: berfungsi untuk memberikan informasi kepada
user mengenai apa yang harus di isi dalam sebuah text box,
contohnya Nama, no.tlp,email dan password
b) Text input/text box : sebagai from isian, untuk menginputkan
apa yang diperintahkan pada label
Mock Up Menu Utama
Disini saya membuat halaman awal dari aplikasi panduan haji dan umrah.dimana setiap user yang ingin menggunakan aplikasi ini wajib login atau daftar.
Deskripsi gambar 2.2
maka user mengisikan alamat email atau no.tlp dan password lalu mengklik button login.
Deskripsi gambar 2.3
Disini saya membuat halaman untuk daftar sebagai pengguna aplikasi panduan haji dan umrah. User mengisi nama user,no.tlp user,email user,kata sandi. Lalu user mengklik button daftar. Setelah mengklik button daftar maka user akan menuju halaman utama panduan haji dan umrah.
Deskripsi gambar 2.4
Setelah user selesai mendaftar maka akan muncul halaman utama panduan haji dan umrah. Dihalaman utama panduan haji dan umrah ada beberapa menu di tempat ziarah, panduan haji, panduan umrah,doa-doa,trevel dan informasi.
2.3.1 Fitur visual
