BAB III ANALISIS DAN PERANCANGAN

Transkripsi

1 BAB III ANALISIS DAN PERANCANGAN Bab ini akan menjelaskan tentang analisis dan perancangan tentang fasilitas umum kota DKI Jakarta tahap pertama analisisi lanjut dengan perancangan aplikasi. 3.1 Analisis Sistem Tahapan analisis ini adalah tahapan awal dalam pembuatan aplikasi, pada tahap ini penulisan menganalisa kebutuhan-kebutuhan aplikasi. Analisis dilakukan pada data-data yang di butuhkan aplikasi, sehingga dapat diketahui spesifikasi kebutuhan apa saja yang di butuhkan untuk membangun aplikasi ini. Kota Jakarta yang luas ini banyak pusat-pusat perbelanjaan atau tempat-tempat yang bagus untuk di kunjungi atau tempat untuk sekedar kumpul-kumpul, masyarakat terkadang bingung mau kemana yang ingin daerah di tuju supaya dekat dari 1 tempat ketampat lainnya agar berdekatan. Berdasarkan permasalahan itu penulis mencoba membuat aplikasi ini, sebagai acuan atau arahan bagi masyarakan yang ingin mengujungi kota Jakarta ini. 3.2 Analisa Kebutuhan Dalam melakukan penelitian di butuhkan beberapa komponen yang mendukung terhadapan keberhasilan penelitian ini yaitu: 1. User disini adalah masyarakan yang ingin berkunjung ke jakarta dari satu tempat ketempat yang lain. 2. Tujuan disini untuk mempermudah masyarakat jakarta atau pun luar jakarta yang ingin berkunjung ke jakarta mengetahui tempat atau fasilitas umum yang ada di jakarta. Seperti dari tempat hotel untuk menginap agar dekat sama tempat wisata atau perbelanjaan yang berada di tempat yang sama. 23

2 24 3. Jenis aplikasi ini online digunakan untuk melihat peta dari googlemaps. Sebagian besar aplikasi ini menggunakan data offline. 4. Kebutuhan umum a. GPS ini untuk menampilkan user dan lokasi-lokasi yang dituju. b. Fitur untuk menunjukan lokasi dan memberi keterangan lokasi. 5. Perangkat Lunak (software) a. Sistem operasi Windows XP SP3. b. Software Eclipse. c. Software Rapid PHP. d. Android Emolator. 6. Perangkat Keras (hardware) a. Notebook pribadi. 3.3 Perancangan Sistem Aplikasi fasilitas umum kota Jakarta berbasis android di buat berdasarkan framework phonegap dan jquery mobile, sedangkan untuk bahasa pemrogramannya menggunakan HTML5 dan Eclipse sebagai aplikasi editor. Perancangan sistem merupakan tahap awal dari perancangan perangkat lunak. Perancangan ini di lakukan untuk mengetahui kondisi sistem umum. Perancangan sistem meliputi cara kerja sistem, use case diagram, activity diagram Cara Kerja Sistem Cara kerja aplikasi fasilitas umum kota Jakarta berbasis android adalah offline jadi tidak di butuhkan koneksi internet kecuali memakai googlemaps, karena semua bahan sudah tersimpan di dalam aplikasi. Aplikasi ini juga tidak membutuhkan database, karena tidak adanya sesuatu yang perlu di simpan ke dalam database.

3 Perancangan Struktur Navigasi Struktur navigasi adalah struktur atau alur dari suatu program yang merupakan rancangan hubungan (rantai kerja) dari beberapa area yang berbeda dan dapat membantu mengorganisasikan seluruh elemen pembuatan Website. Menentukan struktur navigasi merupakan hal yang sebaiknya dilakukan sebelum membuat suatu Website. Gambar 3.1 Struktur navigasi Perancangan Storyboard Storyboard adalah deskripsi masing-masing tampilan suatu kejadian dari movie yang dimainkan dengan menampilkan semua objek atau elemen multimedia serta komponen-komponen aplikasi yang akan dibuat. Stroryboad digunakan sebagai alat bantu pada tahapan perancangan multimedia. Satu kolom storyboard mewakili satu tampilan handphone.

4 26 Nama Halaman: Halaman Awal Gambar 3.2 Storyboard Halaman Awal 1. Header - Bagian ini tempat dari judul aplikasi. 2. Gambar - Kombinasi gambar dari semua wilayah di DKI Jakarta. 3. Profil - Menjelaskan tentang profil DKI Jakarta. 4. About - Biodata si pembuat aplikasi. 5. Exit - Aplikasi untuk keluar.

5 27 Gambar 3.3 Storyboard Jakarta Barat Nama Halaman: Jakarta Barat 1. Header Bagian ini nama wilayah dari Jakarta Barat. 2. Gambar Menampilkan icon Jakarta Barat. 3. Pendidikan Menampilkan pendidikan yang ada di Jakarta Barat. 4. Pariwisata Menampilkan pariwisata yang ada di Jakarta Barat. 5. Perhotelan - Menampilkan perhotelan yang ada di Jakarta Barat. 6. Perbelanjaan - Menampilkan perbelanjaan yang ada di Jakarta Barat.

6 28 Gambar 3.4 Storyboard Pendidikan Jakarta Barat Nama Halaman: Pendidikan 1. Header Bagian ini tempat pendidikan di Jakarta Barat. 2. Universitas Esa Unggul terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasan tentang universitas esa unggul. 3. Universitas Bina Nusantara - terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasan tentang universitas bina nusantara. 4. Universitas Mercu Buana - terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasan tentang universitas mercu buana. 5. Universitas Trisakti - terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasan tentang universitas trisakti. 6. Universitas Tarumanagara - terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasan tentang universitas tarumanagara.

7 29 Gambar 3.5 Storyboard Pariwisata Jakarta Barat Nama Halaman: Pariwisata 1. Header Bagian ini tempat Pariwisata di Jakarta Barat. 2. Museum Fatahillah terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasan tentang museum fatahillah. 3. Museum Wayang - terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasan tentang museum wayang. 4. Museum Seni Rupa dan Keramik terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasan tentang museum seni rupa dan keramik. 5. Museum Bank Indonesia terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasan tentang museum bank indonesia.

8 30 Gambar 3.6 Storyboard Perhotelan Jakarta Barat Nama Halaman: Perhotelan 1. Header bagian ini tempat perhotelan di Jakarta barat. 2. Hotel Mulia terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasan tentang hotel mulia. 3. Hotel Ciputra terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasan tentang hotel ciputra. 4. Hotel Pullman Jakarta terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasan tentang hotel Pullman jakarta. 5. Hotel Sheraton Bandara terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasan tentang hotel Sheraton bandara.

9 31 Gambar 3.7 Storyboard Perbelanjaan Jakarta Barat Nama Halaman: Perbelanjaan 1. Header bagian ini tempat perbelanjaan di Jakarta barat. 2. Rawa Belong terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang rawa belong. 3. Mall Ciputra terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang mall ciputra. 4. Mall Daan Mogot terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang mall daan mogot. 5. Mall Puri Indah terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang mall puri indah.

10 32 6. Mall Taman Anggrek terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang mall taman anggrek. 7. Slipi Jaya Plaza terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang slipi jaya plaza. Gambar 3.8 Storyboard pendidikan jakarta pusat Nama Halaman: Pendidikan 1. Header bagian ini tempat pendidikan jakarta pusat. 2. STIE YAI terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasaan tentang STIE YAI. 3. IKJ terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasaan tentang IKJ. 4. Universitas YARSI terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasaan tentang universitas yarsi.

11 33 5. Universitas Gunadarma terdapat header yang menampilkan nama pendidikan konten yang berisi penjelasaan tentang universitas gunadarma. Gambar 3.9 Storyboard pariwisata jakarta pusat Nama Halaman: Pariwisata 1. Header bagian ini tempat pariwisata jakarta pusat. 2. Museum Fatahillah terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasaan tentang museum fatahillah. 3. Museum Fatahillah terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasaan tentang museum fatahillah. 4. Museum Fatahillah terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasaan tentang museum fatahillah. 5. Museum Fatahillah terdapat header yang menampilkan nama pariwisata konten yang berisi penjelasaan tentang museum fatahillah.

12 34 Gambar 3.10 Storyboard pehotelan jakarta pusat Nama Halaman: Perhotelan 1. Header bagian ini tempat perhotelan jakarta pusat. 2. Hotel Mulia terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasaan tentang hotel mulia. 3. Shangri-la terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasan tentang hotel Shangri-la.

13 35 Gambar 3.11 Storyboard pebelanjaan jakarta pusat Nama Halaman: Perbelanjaan 1. Header bagian ini tempat perbelanjaan jakarta pusat.pasar Baru terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang pasar baru. 2. Pasar Senen terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang pasar senen. 3. Pasar Tanah Abang terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang pasar tanah abang. 4. ITC Cempaka Mas terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang ITC cempaka mas.

14 36 5. Mangga Dua Square terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang mangga dua square. Gambar 3.12 Storyboard pendidikan jakarta selatan Nama Halaman: Pendidikan 1. Header bagian ini tempat pendidikan jakarta selatan. 2. Universitas Budi Luhur terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang universitas budi luhur. 3. UHAMKA terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang uhamka.

15 37 4. PERBANAS terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang perbanas. 5. Universitas Muhammadiyah Jakarta terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang Universitas Muhammadiyah Jakarta. 6. Universitas Pancasila terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang universitas pancasila. 7. UNIKA Atma Jaya terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang unika atma jaya. 8. STIE YAI terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang stie yai. Gambar 3.13 Storyboard pariwisata jakarta selatan Nama Halaman: Pariwisata 1. Header bagian ini tempat pariwisata jakarta selatan.

16 38 2. Ragunan terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang ragunan. 3. Museum Satria Mandala terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang museum satria mandala. 4. Taman Anggrek Ragunan terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang taman anggrek ragunan. 5. Museum Layang-layang terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang museum layinglayang. Gambar 3.14 Storyboard perhotelan jakarta selatan

17 39 1. Nama Halaman: Perhotelan. 2. Header bagian ini tempat perhotelan jakarta selatan. 3. The Ritz-Carlton terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasaan tentang ritz-carlton. 4. Dharmawangsa terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasaan tentang dharmawangsa. 5. Amaris Tendean terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasaan tentang amaris tendean. 6. Atlet Century Park terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasaan tentang Atlet Century Park. 7. Aston Rasuna terdapat header yang menampilkan nama perhotelan konten yang berisi penjelasaan tentang aston rasuna. Gambar 3.15 Storyboard perbelanjaan jakarta selatan

18 40 Nama Halaman: Perbelanjaan 1. Header bagian ini tempat perbelanjaan jakarta selatan. 2. Plaza Blok-M terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang plaza blok-m. 3. Ciputra World terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang ciputra world. 4. Kuningan City terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang kuningan city. 5. Lippo Mall Kemang terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang lippo mall kemang. 6. Gandaria City terdapat header yang menampilkan nama perbelanjaan konten yang berisi penjelasaan tentang gandaria city Pengumpulan Bahan Pengumpulan bahan atau material berupa file-file teks, gambar, animasi dan tombol navigasi yang diproleh dengan cara membuat sendiri dan mengambil dari sumber lain seperti yang tertera pada table di bawah ini: Table 3.1 Pengumpulan Bahan No Nama Ukuran file Tipe file Sumber 1. Museum bank 300x168 JPEG en.wikipedia.org indonesia 2. Museum keramik 468x312 JPG Kompasiana.com 3. Logo museum 590x604 JPG museumku.wordpress.com wayang 4. Museum wayang 1568x900 JPG annisaamaliaapriliani.wordpress.com

19 41 Lanjut table Logo binus 640x480 Jpg socs.binus.ac.id 6. Esa unggul 176x116 jpg Esaunggul.ac.id 7. Mercu buana 200x200 jpg Mercubuana.ac.id 8. Trisakti 250x250 Jpg Trisakti.ac.id 9. Logo central park 340x114 Png Neonlite.co.id 10. Hotel ciputra 280x280 Jpg Agonda.com 11. Hotel pullman 1600x694 jpg Pullmanhotels.com 12. Hotel sheraton 104x112 Jpg Id.hotels.com 13 Logo TIM 1000x248 png Tamanismailmarzuki.co.id 14. Ismail marzuki 1280x583 Jpg Tamanismailmarzuki.co.id 15. gunadarma 606x600 Png Pena.gunadarma.ac.id 16. IKJ 303x166 Jpg Fftv.ikj.ac.id 17. Logo UBK 1799x1263 Png Id.wikipedia.org 18. Logo UKI 1720x529 png Id.wikipedia.org 19. Mall daan mogot 368x258 jpg Tengakarta.wordpress.com 20. Museumsumpah pemuda 336x152 jpg kebudayaan.kemdikbud.go.id 21. Logo senayan 633x145 jpg Senayancity.com city 22. Senayan city 500x346 jpg Australindo.com 25. Mangga dua 567x463 jpg Wwf.or.id 26. ITC Cempaka 316x316 png Sinarmasland.com Mas 27. Merlyn park 850x565 jpg Ptpime.com 28. Museum layanglayang 620x418 jpg jakarta.panduanwisata.id 29. Museum Satria 600x400 jpg Indonesiakaya.com Mandala

20 42 Lanjut table Logo universitas pancasila 2199 x 2134 jpeg kumpulan-logokampus.blogspot.com 31. Bentara Budaya Jakarta 500 x 276 jpg Jakarta.go.id 32. Logo Museum 300 x 169 jpg Id.wikipedia.org Bank Indonesia 33. Museum Bank 3504 x 2336 jpeg Id.wikipedia.org Indonesia 34. Museum Fatahillah 256 x 196 jpg Pusakaindonesia.org 35. Rawa Belong 715 x 250 jpg Jakarta.paduanwisata.id 36. Central Park 258 x 200 jpg Blog.urbanindo.com 37. Kampus yarsi 1600 x 1067 jpeg Fk.yarsi.ac.id 38. Setu Babakan 624 x 482 jpg Indonesiakaya.com 39. Logo hotel 150 x 150 png Id.wikipedia.org amaris 40. Hotel Amaris 1011 x 1600 jpg Booking.com 41. Logo Aston 268 x 77 jpg Fnetravel.com Rasuna 42. Aston Rasuna 750 x 721 jpg Astonrasuna.hargahotel.com 43. Logo hotel atlet 335 x 180 jpg Atletcentury.com 44. Hotel Atlet 560 x 398 jpg Atletcentury.com century 45. Logo Hotel 580 x 327 jpg Thepejatensuite.com Pejaten 46. Logo TMII 205 x 138 jpg Id.wikipedia.org

21 43 Lanjut table TMII 448 x 336 jpg Jakartatravel.com 48. Logo kampus Tantular 49. Logo Museum 305 x 469 jpg Perangko 50. Museum 1024 x 683 Jpg Indonesiakaya.com Perangko 51. Museum 320 x 213 jpg Id.wikipedia.org olahraga 52. Museum Pancasila Sakti 1024 x 683 jpg Jakartatravel.com 53. Logo Cibubur 567 x 463 jpg Wwf.or.id Junction 54. Cibubur Junction 930 x 330 jpg Lippomalls.com 55. Logo tamini 202 x 155 Jpg id.wikipedia.org square 56. Tamini square 930 x 330 jpg Lippomalls.com 57. Logo hotel Ibis 200 x 200 jpg Jobs.id 58. Hotel Ibis 367 x 450 jpg Citizendaily.net 59. Logo hotel 550 x 388 jpg Tripadvisor.com Santika TMII 69. Hotel santika 960 x 450 jpg Santika.com TMII 70. Logo Ancol 620 x 320 jpg Voiceofleader.com 71. Ancol 500 x 341 jpg 72. Lambing 914 x 209 jpg Museumbahari.org Museum Bahari 73. Museum Bahari 550 x 412 jpg Museumbahari.org

22 44 Lanjut table Logo UBM 1024 x 720 jpg Ubm.ac.id 75. UBM 700 x 200 jpg Ubm.ac.id 76. Taman Suaka 500 x 333 jpg Tundra.web.id Margasatwa Muara Angke 77. Logo MoI 1500 x 955 jpg Mallofindonesia.com 78. Mall of 300 x 199 jpg Mallofindonesia.com Indonesia 79. Logo Emporium 257 x 93 jpg Emporiumpluit.com Pluit 80. Emporium Pluit 672 x 448 jpg Seputarjakarta.net 81 Logo Sanno 480 x 300 jpg Sannohotel.com hotel 82. Sanno Hotel 570 x 340 jpg Sannohotel.com 83. Logo hotel whiz prime 300 x 150 jpg Whizprime.com 84. Hotel Whiz 1396 x 515 jpg Whizprime.com Prime 85. Logo hotel 750 x 769 jpg Ebookers.com Bestwestren Hariston 86. Hotel Bestwestren Hariston 480 x 360 jpg Ebookers.com