No title

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. 3.1.1

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 http://digilib.mercubuana.ac.id/

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):

3.2

•

Notebook

•

Smartphone Android

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 -6.2154989 LU dan nilai garis bujur 106.7348491 BT. Sedangkan lokasi user yang terdeteksi oleh GPS berada di garis lintang 6.2125965 LU dan garis bujur 106.7275393 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: 𝑥𝑥1 = Garis lintang posisi user

𝑥𝑥2 = Garis lintang posisi rumah kos 36 http://digilib.mercubuana.ac.id/

𝑦𝑦1 = Garis bujur posisi user

𝑦𝑦2 = Garis bujur posisi rumah kos

𝑑𝑑 = Nilai perhitungan Euclidean Distance

𝐷𝐷= Jarak antara posisi rumah kos dengan posisi user

Perhitungan untuk menentukan jarak Euclidean Distance: 𝑑𝑑 = �(𝑥𝑥1 − 𝑥𝑥2 )2 + (𝑦𝑦1 − 𝑦𝑦2 )2

𝑑𝑑 = �(−6.2125965 − (−6.2154989))2 + (106.7275393 − 106.7348491)2

𝑑𝑑 = �(0.0029024)2 + (−0.0073098)2

𝑑𝑑 = �(0.00000842392576) + (0.00005343317604) 𝑑𝑑 = √0.0000618571018

𝑑𝑑 = 0.0078649285947172

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

diperoleh dari hasil =

Keliling Nilai Garis Ekuador Bumi = Satu Lingkaran Bumi

40000 = 111,139 km 360

Berikut ini adalah perhitungan jarak Euclidean Distance dengan nilai jarak ekuador

bumi: D = d ∗ 111,139 km

D = 0.0078649285947172 ∗ 111,139 km = 0.875515986235324 km

Sehingga didapatkan jarak antara posisi user dengan posisi lokasi rumah kos = 0.875515986235324 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.


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. 3.4.1

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.


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

Melihat Peta

Aktor

User

Deskripsi

Menampilkan Marker Posisi user dan Marker Rumah kost terdekat dari posisi user dengan jarak

Skenario

 User memilih Maps (Peta) pada halaman awal  Pada aplikasi akan menampilkan marker titik lokasi dari user dan marker dari rumah kost terdekat

Kondisi awal

Sistem menampilkan halaman awal

Kondisi akhir

Sistem menampilkan map dengan marker titik lokasi dari user dan marker lokasi rumah kost terdekat


Tabel 3.2 Use Case Kost Nama

Mencari Rumah Kost

Aktor

User

Deskripsi

Memilih rumah kost dan menampilkan info rumah kost dengan rute menuju lokasi rumah kost dari posisi pengguna pada map

Skenario

 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

Kondisi awal


Kondisi akhir

Sistem menampilkan map dengan rute lokasi rumah kost yang dipilih

Tabel 3.3 Use Case Help Nama

Help (Bantuan)

Aktor

User

Deskripsi

Menampilkan informasi bantuan

Skenario

 User memilih Help (bantuan) pada halaman awal  Pada aplikasi akan menampilkan informasi bantuan

Kondisi awal


Kondisi akhir

Sistem menampilkan informasi help (bantuan)

Tabel 3.4 Use Case About Nama

About (tentang)

Aktor

User

Deskripsi

Menampilkan informasi penulis

Skenario

 User memilih About pada halaman awal  Pada aplikasi akan menampilkan informasi penulis

Kondisi awal


Kondisi akhir

Sistem menampilkan informasi penulis


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: 3.4.2.1 Diagram Activity Melihat Maps

Gambar 3.3 diagram activity lihat Map


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. 3.4.2.2 Diagram Activity Mencari Kost

Gambar 3.4 diagram activity mencari rumah kos 42 http://digilib.mercubuana.ac.id/

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. 3.4.2.3 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.


3.4.2.4 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.

3.4.3

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.


3.4.3.1 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. 3.4.3.2 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 http://digilib.mercubuana.ac.id/

rute. Sistem akan meminta koordinat GPS dan sistem akan menampilkan map rute serta informasi jalan menuju lokasi rumah kos yang dipilih dari posisi pengguna. 3.4.3.3 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. 3.4.3.4 Diagram Sequence Tentang

Gambar 3.10 Diagram Sequence Tentang


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

3.6

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

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.


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:


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


3.7.2

Perancangan Antar Muka Halaman Maps Rumah Kost

Gambar 3.13 Perancangan antar muka halaman maps rumah kos Keterangan: •

Nama Halaman: Maps

•


•

Peta: berisi peta virtual dan marker lokasi rumah kost terdekat dari user

•

Button maps: menampilkan peta rumah sakit terdekat

•

Button kembali: menampilkan halaman sebelumnya

•



3.7.3

Perancangan Antar Muka Halaman Cari Kos

Gambar 3.14 Perancangan antar muka halaman cari kos Keterangan: •

Nama Halaman: rumah kost

•


•

Textbox cari: memfilter listview rumah kost berdasarkan nama

•

Button listview rumah kost: menampilkan detail rumah kost

•


•

Footer: berisi button halaman menu


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

•


•

Gambar: tampil gambar rumah kos

•

Listview text: tampil detail informasi rumah kos

•

Button lihat rute: menampilkan rute menuju rumah kos

•


•



3.7.5

Perancangan Antar Muka Halaman Rute

Gambar 3.16 Perancangan antar muka halaman rute Keterangan: •

Nama Halaman: rumah kost

•


•

Peta: tampil peta rute menuju lokasi rumah kost

•

Informasi rute: tampil informasi jalan menuju lokasi rumah kost

•


•



3.7.6

Perancangan Antar Muka Halaman Bantuan (Help)

Gambar 3.17 Perancangan antar muka halaman bantuan (help)

Keterangan: •

Nama Halaman: bantuan (help)

•


•

Bantuan: menampilkan informasi bantuan dalam pemakaian aplikasi

•


•



3.7.7

Perancangan Antar Muka Halaman Tentang (About)

Gambar 3.18 Perancangan antar muka halaman tentang (About) Keterangan: •

Nama Halaman: About

•


•

Profil: menampilkan informasi profil penulis

•


•



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


No title

Recommend Documents