- PDF Free Download

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN Pada bagian ini penulis akan menjelaskan system analisis dan perancangan dalam membuat pembuatan aplikasi ini. Setelah semua kebutuhan selesai dianalisis, maka penulis akan melanjutkan ke tahap perancangan aplikasi. 3.1 Analisa Sistem Tahapan analisis merupakan tahapan yang paling awal dalam pembuatan sebuah perangkat lunak. Pada tahap ini, penulis akan menganalisa kebutuhankebutuhan aplikasi. Analisis dilakukan pada data-data yang dibutuhkan aplikasi, sehingga dapat diketahui spesifikasi kebutuhan apa saja yang dibutuhkan untuk membangun aplikasi ini Analisa Masalah Tempat tinggal merupakan kebutuhan pokok bagi setiap manusia. Banyaknya pekerja dan pelajar dari luar daerah membuat sebagian besar dari mereka memilih untuk menyewa tempat tinggal di sekitar area tempat kerja, sekolah atau universitas mereka. Dalam melakukan pencarian lokasi rumah kos, sampai saat ini masyarakat masih mengalami kesulitan dalam menemukan lokasi yang dicari. Kebanyakan pemilik kos hanya memberikan informasi dalam selembaran kertas yang disebar dan ditempel pada dinding-dinding guna memberitahukan rumah kos yang akan disewakan. Bahkan ada pemilik kos yang hanya menempelkan pada gang atau jalan menuju kos yang akan disewakan tanpa menyebarkannya lebih luas. Dalam menentukan rumah kos terdekat diperlukan metode pengukuran jarak menggunakan metode Euclidean distance. Untuk menghitung nilai jarak dari dua titik kordinat dapat digunakan perhitungan Euclidean distance. Bedasarkan permasalahan di atas, maka dibangun sistem yang dapat memberikan informasi secara efektif, cepat dan akurat. Agar solusi tersebut dapat dicapai maka sistem dibangun pada mobile android dengan menerapkan metode Euclidean distance sehingga dapat menentukan lokasi rumah kos terdekat melalui perhitungan jarak antara posisi pengguna dengan posisi lokasi rumah kos. 35

2 3.1.2 Analisa Kebutuhan Dalam perancangan aplikasi, dibutuhkan beberapa perangkat untuk mendukung keberhasilan pembuatan aplikasi, yaitu: 1) Perangkat Lunak (software): Sistem operasi Windows 10 Software Eclipse Framework PhoneGap Software XAMPP Control Panel Software Adobe Photoshop CC 2) Perangkat Keras (hardware): Notebook Smartphone Android 3.2 Perhitungan Jarak Euclidean Distance Untuk menghitung nilai jarak dari dua titik kordinat dapat digunakan perhitungan Euclidean Distance. Langkah pertama yang dilakukan yaitu mengetahui nilai dari garis lintang dan bujur posisi user, kemudian mengetahui nilai garis lintang dan garis bujur posisi lokasi rumah kos tersebut. Setelah nilai garis lintang dan garis bujur di dapatkan, kemudian nilai garis lintang dan garis bujur tersebut di implementasikan ke dalam perhitungan Euclidean Distance yang diambil dari persamaan rumus euclidean distance. Berikut ini adalah contoh kasus perhitungan bagaimana menghitung jarak posisi lokasi rumah kos dengan posisi user. Dimana posisi rumah kos berada di Jalan Raya Meruya Selatan No.111 Jakarta Barat (Depan BNI kampus Mercu Buana) dengan nilai garis lintang LU dan nilai garis bujur BT. Sedangkan lokasi user yang terdeteksi oleh GPS berada di garis lintang LU dan garis bujur BT. Berdasarkan kasus tersebut dapat diselesaikan menggunakan rumus Euclidean Distance, berikut ini proses perhitungan untuk menghitung jarak posisi lokasi rumah kos dengan posisi user. Diketahui: xx 1 = Garis lintang posisi user xx 2 = Garis lintang posisi rumah kos 36

3 yy 1 = Garis bujur posisi user yy 2 = Garis bujur posisi rumah kos dd = Nilai perhitungan Euclidean Distance DD= Jarak antara posisi rumah kos dengan posisi user Perhitungan untuk menentukan jarak Euclidean Distance: dd = (xx 1 xx 2 ) 2 + (yy 1 yy 2 ) 2 dd = ( ( )) 2 + ( ) 2 dd = ( ) 2 + ( ) 2 dd = ( ) + ( ) dd = dd = Setelah nilai perhitungan menentukan jarak Euclidean Distance di dapatkan, langkah selanjutnya yaitu mengalikan nilai jarak perhitungan Euclidean Distance dengan nilai jarak ekuador bumi yaitu 111,139 km, dimana nilai 111,139 km Keliling Nilai Garis Ekuador Bumi diperoleh dari hasil = = Satu Lingkaran Bumi = 111,139 km 360 Berikut ini adalah perhitungan jarak Euclidean Distance dengan nilai jarak ekuador bumi: D = d 111,139 km D = ,139 km = km Sehingga didapatkan jarak antara posisi user dengan posisi lokasi rumah kos = km. 3.3 Alur Kerja Sistem Dalam pencarian lokasi rumah kost berbasis android, aplikasi terhubung ke server untuk mendapatkan data rumah kost menggunakan database mysql. Proses pengambilan data dari web server dengan menggunakan parsing json. 37

4 Gambar 3.1 Proses Pengambilan Data 3.4 Perancangan Sistem Pada tahap ini, dalam pembuatan aplikasi mobile pencarian lokasi rumah kos berbasis android, dilakukan perancangan terhadap aplikasi ini menggunakan UML (Unified Modelling Language), yang terdiri dari perancangan diagram use case, perancangan diagram activity, dan perancangan diagram sequence Perancangan Diagram Use Case Diagram use case gambaran fungsionalitas dari suatu bangun sistem, agar pengguna atau user dari sistem yang kita buat dapat memahami dan mengerti mengenai bagaimana kegunaan sistem yang akan dibangun secara garis besar. Pada aplikasi mobile pencarian rumah kos, dapat diketahui bahwa aktor utamanya adalah user. Maka didapatkan satu diagram use case dan beberapa skenario yang memperlihatkan interaksi-interaksi diagram use case dengan aktor di dalam diagram use case. 38

5 Gambar 3.2 use case aplikasi Berikut ini adalah tabel penjelasan deskripsi dari use case diagram pada gambar 3.2 di atas, lihat tabel 3.1 sampai tabel 3.4 dibawah ini. Tabel 3.1 Use case Maps Nama Aktor Deskripsi Skenario Kondisi awal Kondisi akhir Melihat Peta User Menampilkan Marker Posisi user dan Marker Rumah kost terdekat dari posisi user dengan jarak User memilih Maps (Peta) pada halaman awal Pada aplikasi akan menampilkan marker titik lokasi dari user dan marker dari rumah kost terdekat Sistem menampilkan halaman awal Sistem menampilkan map dengan marker titik lokasi dari user dan marker lokasi rumah kost terdekat 39

6 Tabel 3.2 Use Case Kost Nama Aktor Deskripsi Skenario Kondisi awal Kondisi akhir Mencari Rumah Kost User Memilih rumah kost dan menampilkan info rumah kost dengan rute menuju lokasi rumah kost dari posisi pengguna pada map User memilih daftar rumah kost pada halaman awal User memilih rumah kost Pada aplikasi akan menampilkan info rumah kost User menekan tombol lihat rute Pada aplikasi akan menampilkan rute menuju lokasi rumah kost Sistem menampilkan halaman awal Sistem menampilkan map dengan rute lokasi rumah kost yang dipilih Tabel 3.3 Use Case Help Nama Aktor Deskripsi Skenario Kondisi awal Kondisi akhir Help (Bantuan) User Menampilkan informasi bantuan User memilih Help (bantuan) pada halaman awal Pada aplikasi akan menampilkan informasi bantuan Sistem menampilkan halaman awal Sistem menampilkan informasi help (bantuan) Tabel 3.4 Use Case About Nama Aktor Deskripsi Skenario Kondisi awal Kondisi akhir About (tentang) User Menampilkan informasi penulis User memilih About pada halaman awal Pada aplikasi akan menampilkan informasi penulis Sistem menampilkan halaman awal Sistem menampilkan informasi penulis 40

7 3.4.2 Perancangan Diagram Activity Diagram activity merupakan penggambaran berbagai aliran aktivitas dalam sistem yang dirancang, bagaimana awalan dari masing-masing aliran berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir. Diagram activity juga dapat menggambarkan proses paralel yang mungkin terjadi pada beberapa eksekusi. Di bawah ini diagram activity dari aplikasi mobile pencarian rumah kos berbasis android: Diagram Activity Melihat Maps Gambar 3.3 diagram activity lihat Map 41

8 Pada gambar diatas menjelaskan aktifitas untuk melihat peta. Alur kerja diawali saat user membuka aplikasi. Kemudian sistem akan menampilkan halaman menu dari aplikasi. User memilih lihat peta (Maps). Sistem akan meminta koordinat posisi perangkat mobile dengan GPS jika sukses sistem akan menampilkan map lokasi rumah kost terdekat dengan posisi user dan jika gagal sistem akan menampilkan dialog alert untuk kembali ke halaman menu Diagram Activity Mencari Kost Gambar 3.4 diagram activity mencari rumah kos 42

9 Pada gambar diatas menjelaskan aktifitas untuk memilih rumah kos. Alur kerja diawali saat user membuka aplikasi. Kemudian sistem akan menampilkan halaman menu dari aplikasi. User memilih mencari rumah kos. Sistem akan mengambil data json pada web server. Jika gagal sistem akan menampilkan dialog alert untuk kembali ke halaman menu. Jika sukses sistem akan menampilkan halaman daftar rumah kos. Kemudian user memilih rumah kos, sistem akan menampilkan informasi rumah kos yang dipilih. User menekan tombol lihat rute. Sistem akan meminta koordinat posisi perangkat mobile dengan GPS, jika gagal system akan menampilkan dialog alert untuk kembali ke halaman info rumah kost. Jika sukses sistem akan menampilkan map rute lokasi rumah kost yang dipilih dari posisi pengguna dan informasi jalan menuju lokasi rumah kost Diagram Activity Melihat Bantuan Gambar 3.5 diagram activity melihat bantuan (help) Pada gambar diatas menjelaskan aktifitas untuk melihat bantuan. Alur kerja diawali saat user membuka aplikasi. Kemudian sistem akan menampilkan halaman menu dari aplikasi. User memilih menu bantuan, sistem akan menampilkan informasi bantuan. 43

10 Diagram Activity Melihat Tentang Gambar 3.6 diagram activity halaman tentang (About) Pada gambar diatas menjelaskan aktifitas untuk melihat tentang. Alur kerja diawali saat user membuka aplikasi. Kemudian sistem akan menampilkan halaman menu dari aplikasi. User memilih menu tentang, sistem akan menampilkan profil tentang Perancangan Diagram Sequence Diagram sequence digunakan untuk mendeskripsikan pola komunikasi antar objek. Diagram sequence dapat juga digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang dilakukan sebagai respons dari sebuah event untuk menghasilkan output tertentu. Pada bahasan kali ini penulis mencoba membuat diagram squence, dengan cara ini sebagai langkah awal untuk merancang aplikasi ini. 44

11 Diagram Sequence Lihat Peta (Maps) Gambar 3.7 diagram sequence lihat peta (maps) Pada gambar diatas menjelaskan bagaimana user melihat peta. User masuk halaman menu dari aplikasi. User memilih lihat peta (maps). Sistem akan menampilkan map rumah kost terdekat dengan posisi user Diagram Sequence Memilih Rumah Kost Gambar 3.8 diagram sequence memilih rumah kos Pada gambar diatas menjelaskan bagaimana memilih rumah kos dan menampilkan map rute. User membuka aplikasi. Kemudian sistem akan menampilkan halaman menu dari aplikasi. User memilih cari rumah kos. Sistem akan mengambil data rumah kos dari web server. Kemudian sistem akan menampilkan halaman daftar rumah kos. Kemudian user memilih rumah kos, sistem akan menampilkan informasi rumah kos yang dipilih. User memilih lihat 45

12 rute. Sistem akan meminta koordinat GPS dan sistem akan menampilkan map rute serta informasi jalan menuju lokasi rumah kos yang dipilih dari posisi pengguna Diagram Sequence Bantuan (Help) Gambar 3.9 diagram sequence bantuan Pada gambar diatas menjelaskan bagaimana untuk melihat bantuan. Saat user membuka aplikasi. Kemudian sistem akan menampilkan halaman menu dari aplikasi. User memilih menu bantuan, sistem akan menampilkan informasi bantuan Diagram Sequence Tentang Gambar 3.10 Diagram Sequence Tentang 46

13 Pada gambar diatas menjelaskan bagaimana melihat tentang. Saat user membuka aplikasi. Kemudian sistem akan menampilkan halaman menu dari aplikasi. User memilih menu tentang (about), kemudian sistem akan menampilkan profil tentang. 3.5 Perancangan Basis Data Aplikasi mobile pencarian lokasi rumah kos berbasis android ini membutuhkan tabel untuk menyimpan data. 1. Tabel Kosan Tabel kosan terdiri dari beberapa tabel antara lain id, nama kost, alamat kost, telepon kost, harga, latitude, longitude, gambar, isi kost. Berikut tabel-tabel dari tabel kosan dapat dilihat dibawah ini: Tabel 3.5 Kosan Nama Field Type Keterangan Id Integer (11) Id kosan Nama_kost Varchar (50) Nama kosan Alamat_kost Varchar (150) Alamat kosan Telepon_kost Varchar (15) Telepon kosan Harga Varchar (15) Harga kosan Latitude Double (-) Latitude kosan Longitude Double (-) Longitude kosan Gambar Varchar (255) Gambar kosan Isi_kost Text (-) Fasilitas kosan 3.6 Perancangan Struktur Menu Perancangan struktur menu merupakan gambaran jalur pemakaian aplikasi. Perancangan struktur menu dari aplikasi ini dapat dilihat pada Gambar 3.11 berikut ini. 47

14 Gambar 3.11 Struktur Menu Aplikasi 3.7 Perancangan Antar Muka (Interface) Perancangan antar muka merupakan deskripsi dari masing-masing tampilan suatu kejadian dari aplikasi yang dimainkan dengan menampilkan semua objek atau elemen multimedia serta komponen-komponen aplikasi yang akan dibuat. Perancangan antar muka digunakan sebagai alat bantu pada tahapan perancangan. Satu per satu kolom yang ada pada perancangan antar muka merupakan bentuk sketsa yang mewakili satu tampilan dari dasar aplikasi. Adapun perancangan antar muka pada aplikasi ini adalah sebagai berikut: 48

15 3.7.1 Perancangan Antar Muka Halaman Menu Gambar 3.12 Perancangan antar muka halaman menu Keterangan: Nama Halaman: Menu Header: berisi nama halaman Gambar: gambar marker Button maps: menampilkan peta rumah kost Button daftar rumah kost: menampilkan listview rumah kost Button help: menampilkan informasi bantuan Button info: menampilkan profil tentang Button exit: keluar dari aplikasi Footer: berisi copyright 49

16 3.7.2 Perancangan Antar Muka Halaman Maps Rumah Kost Gambar 3.13 Perancangan antar muka halaman maps rumah kos Keterangan: Nama Halaman: Maps Header: berisi nama halaman Peta: berisi peta virtual dan marker lokasi rumah kost terdekat dari user Button maps: menampilkan peta rumah sakit terdekat Button kembali: menampilkan halaman sebelumnya Footer: berisi copyright 50

17 3.7.3 Perancangan Antar Muka Halaman Cari Kos Gambar 3.14 Perancangan antar muka halaman cari kos Keterangan: Nama Halaman: rumah kost Header: berisi nama halaman Textbox cari: memfilter listview rumah kost berdasarkan nama Button listview rumah kost: menampilkan detail rumah kost Button kembali: menampilkan halaman sebelumnya Footer: berisi button halaman menu 51

18 3.7.4 Perancangan Antar Muka Halaman Detail Rumah Kos Gambar 3.15 Perancangan antar muka halaman detail rumah kos Keterangan: Nama Halaman: rumah kos Header: berisi nama halaman Gambar: tampil gambar rumah kos Listview text: tampil detail informasi rumah kos Button lihat rute: menampilkan rute menuju rumah kos Button kembali: menampilkan halaman sebelumnya Footer: berisi copyright 52

19 3.7.5 Perancangan Antar Muka Halaman Rute Gambar 3.16 Perancangan antar muka halaman rute Keterangan: Nama Halaman: rumah kost Header: berisi nama halaman Peta: tampil peta rute menuju lokasi rumah kost Informasi rute: tampil informasi jalan menuju lokasi rumah kost Button kembali: menampilkan halaman sebelumnya Footer: berisi copyright 53

20 3.7.6 Perancangan Antar Muka Halaman Bantuan (Help) Gambar 3.17 Perancangan antar muka halaman bantuan (help) Keterangan: Nama Halaman: bantuan (help) Header: berisi nama halaman Bantuan: menampilkan informasi bantuan dalam pemakaian aplikasi Button kembali: menampilkan halaman sebelumnya Footer: berisi button halaman menu 54

21 3.7.7 Perancangan Antar Muka Halaman Tentang (About) Gambar 3.18 Perancangan antar muka halaman tentang (About) Keterangan: Nama Halaman: About Header: berisi nama halaman Profil: menampilkan informasi profil penulis Button kembali: menampilkan halaman sebelumnya Footer: berisi button halaman menu 55

22 3.8 Desain icon dan logo Nama nearplace singkatan dari nearby place yang memiliki arti secara harafiah adalah nearby terdekat dan place tempat jadi artinya adalah tempat tinggal terdekat. Icon aplikasi nearplace terinspirasi dari bentuk marker dari Google Map dan terlihat icon rumah dan juga icon seperti bentuk seseorang yang sedang beristirahat. Karena aplikasi nearplace menggabungkan kedua faktor diatas, posisi dan tempat tinggal. Berikut adalah icon dan logo aplikasi nearplace. Gambar 3.19 Logo dan Icon 56