BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM III.1. Analisis Masalah Tahap analisis sistem yang berjalan ini bertujuan untuk mencari informasi mengenai sistem yang lama guna mendapatkan bahan evaluasi untuk pengembangan pada sistem yang akan dirancang, evaluasi pada sistem yang lama ialah tidak adanya sistem informasi geografis lokasi cabang Chemical store khususnya di kota Medan sehingga konsumen kesulitan menemukan Chemical store dan penyebaran informasi mengenai Chemical store tidak efisien dan efektif dikarenakan penyebaran informasi hanya di dapatkan melalui berita iklan. Dengan adanya bahan evaluasi sistem yang lama, maka diharapkan agar pembangunan aplikasi yang baru akan dilakukan dapat terbentuk dengan lebih baik dari pada sistem sebelumnya. Adapun pemecahan masalah yang diusulkan oleh penulis adalah : 4. Merancang sistem informasi geografis yang dapat memberikan informasi titik lokasi Chemical store di kota medan. 5. Mempermudah dan mempercepat penyebaran informasi lokasi Chemical store di kota medan. 6. Merancang dan membangun sebuah sistem informasi geografis dengan mengimplementasikan Metode Equirectangular Approximation 35

36 III.2. Penerapan Metode Berdasarkan penelitian yang dilakukan oleh Sayed (2014 ; 57) Proyeksi Equirectangular Approximation atau sering disebut sebagai equidistant cylindrical projection, geographic projection, atau la carte parallélogrammatique projection, adalah proyeksi sederhana pada peta. Proyeksi peta menggunakan teknik ini diukur dari meridian peta terhadap garis tegak lurus secara vertikal dan dalam ruang yang konstan. Pada proyeksi ini, luas pada permukaan peta tidak selalu sama atau conformal yang disebabkan oleh distorsi atas bentuk bumi yang sebenarnya tidak benar-benar bulat. Proyeksi peta dan pengukuran jarak menggunakan formula ini digunakan sebagai standar proyeksi pada dataset global seperti Cartesia dan NASA World Wind karena keterhubungan antara piksel pada gambar peta dan posisi lokasi geografis bumi cukup sederhana. Pengukuran jarak menggunakan Equirectangular Approximation tepat digunakan jika perangkat komputer yang digunakan tidak memiliki performance yang memadai dan akurasi tidak terlalu penting serta jarak yang diukur masih dalam skala kecil, Teorema pitagoras dapat digunakan pada proyeksi Equirectangular Approximation menggunakan formula di bawah ini:...(1) Dimana: λ: titik koordinat longitudinal φ: titik koordinat latitude x: posisi horizontal pada peta

37 y: posisi vertikal pada peta d: jarak antara kedua posisi III.2.1. Studi Kasus Penerapan metode Equirectangular Approximation Koordinat Rute [ (3.58047,98.66111) (3.58059,98.66112) (3.58122,98.66115) (3.58168,98.66116) (3.58182,98.66116) ] k1=[3.58047,98.66111] k2=[3.58059,98.66112] k3=[3.58122,98.66115] k4=[3.58168,98.66116] k5=[3.58182,98.66116] [3.58182, 98.66116] //mencari jarak k1-k2 undefined k1 = [k1[0] * Math.PI / 180, k1[1] * Math.PI / 180] [0.06249099026888137, 1.7219612131723028] k2= [k2[0] * Math.PI / 180, k2[1] * Math.PI / 180] [0.06249308466398376, 1.7219613877052278] k3= [k3[0] * Math.PI / 180, k3[1] * Math.PI / 180] [0.06250408023827134, 1.7219619113040037] k4= [k4[0] * Math.PI / 180, k4[1] * Math.PI / 180] [0.0625121087528305, 1.7219620858369287] k5= [k5[0] * Math.PI / 180, k5[1] * Math.PI / 180] [0.0625145522137833, 1.7219620858369287] //mencari nilai x undefined x = (k2[1] - k1[1]) * Math.cos((k1[0] + k2[0])/2); 1.7419223812852083e-7 y = k2[0] - k1[0] 0.0000020943951023894014 R = 6371.009 6371.009 d = R * Math.sqrt (x*x+y*y) 0.013389481096398285 jarak_k1_k2=d 0.013389481096398285 //mencari jarak k2-k3 undefined x = (k3[1] - k2[1]) * Math.cos((k2[0] + k3[0])/2); 5.225765012433405e-7 y = k3[0] - k2[0] 0.000010995574287575582

38 R = 6371.009 6371.009 d = R * Math.sqrt (x*x+y*y) 0.07013197334530986 jarak_k2_k3 = d 0.07013197334530986 //mencari jarak k3-k4 undefined x = (k4[1] - k3[1]) * Math.cos((k3[0] + k4[0])/2); 1.7419206308733105e-7 y = k3[0] - k4[0] -0.000008028514559166311 R = 6371.009 6371.009 d = R * Math.sqrt (x*x+y*y) 0.05116177635533046 jarak_k3_k4 = d 0.05116177635533046 //mencari jarak k4-k5 undefined x = (k5[1] - k4[1]) * Math.cos((k4[0] + k5[0])/2); 0 y = k5[0] - k4[0] 0.000002443460952794574 R = 6371.009 6371.009 d = R * Math.sqrt (x*x+y*y) 0.015567311721402806 jarak_k4_k5 = d 0.015567311721402806 jarak_total = jarak_k1_k2 + jarak_k2_k3 + jarak_k3_k4 + jarak_k4_k5 0.15025054251844142 III.3. Desain Sistem Baru Desain sistem pada penelitian ini dibagi menjadi dua desain, yaitu desain sistem secara global untuk penggambaran model sistem secara garis besar dan desain sistem secara detail untuk membantu dalam pembuatan sistem.

39 III.3.1. Desain Sistem Secara Global Desain sistem secara global menggunakan bahasa pemodelan UML yang terdiri dari Usecase Diagram, Class Diagram, Activity Diagram dan Sequence Diagram. III.3.1.1.Usecase Diagram Secara garis besar, bisnis proses sistem yang akan dirancang digambarkan dengan usecase diagram yang terdapat pada Gambar III.1 : Sistem Informasi Tracking Jalur Rute Lokasi Chemical Store Di Kota Medan Beranda Peta Toko Testimonial admin Artikel <include> User Tentang <extends> Mengolah data toko <include> Laporan data toko Masuk <extends> <extends> Mengolah data Koordinat Keluar Gambar III.1. Usecase Diagram Sistem

40 Keterangan : a. Admin melakukan login untuk melakukan pengolahan data yang meliputi data koordinat dan data lokasi Chemical store. b. Data lokasi Chemical store yang telah dikelola berelasi ke form tampilan peta lokasi Chemical store yang dapat dilihat oleh user website, user juga dapat mengirim komentar dengan mengisi data testimoni. III.3.1.2. Class Diagram Rancangan kelas-kelas yang akan digunakan pada sistem yang akan dirancang dapat dilihat pada gambar III.2 : admin Id_User : int (11) Username : varchar (12) Password : varchar (12) Nama : varchar (25) koordinat Kode_koordinat : (11) Nama_Area : text Koordinat : text Keterangan : text Toko Kode_toko : int (5) Nama_toko : varchar (25) Telepon : varchar (12) Alamat : text testimonial Id_testimonial : int (11) Nama_pengirim : varchar (25) Email : varchar (25) Testimonial : text Gambar : longtext Keterangan : text Koordinat : text Gambar III.2. Class Diagram Sistem

41 III.3.1.3. Activity Diagram Bisnis proses yang telah digambarkan pada usecase diagram diatas dijabarkan dengan activity diagram : 1. Activity Diagram Beranda Serangkaian kerja melihat beranda dapat terlihat seperti pada gambar III.3 berikut: Beranda admin Sistem Buka sistem geografis Beranda Informasi pada beranda Phase Gambar III.3. Activity Diagram Beranda Keterangan : a. User membuka sistem geografis. b. Saat membuka sistem, maka user akan langsung berada di beranda dan dapat melihat informasi yang terdapat pada beranda.

42 2. Activity Diagram Peta Toko berikut: Serangkaian kerja melihat peta dapat terlihat seperti pada gambar III.4 Beranda admin Sistem Beranda Klik Form Peta lokasi tampilan Peta Cari Data Ketik kata kunci Enter data Informasi Lokasi lokasi Phase Gambar III.4. Activity Diagram Peta Toko Keterangan : a. Aktifitas untuk melihat peta, user mengklik form peta lokasi Chemical store.

43 b. Pada form peta chemical store, user mencari data lokasi dengan mengetik kata kunci kemudian mengenter data untuk melihat informasi lokasi Chemical store. 3. Activity Diagram Data Testimoni Serangkaian kerja melakukan pengolahan data testimoni dapat terlihat seperti pada gambar III.5 berikut : Beranda admin Sistem Form Testimoni Isi data Kirim Data tidak reset ya Gambar III.5. Activity Diagram Data Testimoni

44 Keterangan : a. Aktifitas untuk mengisi data di testimoni, user mengklik form testimoni kemudian mengisi data. b. Setelah data telah diisi maka user mengklik kirim data untuk mengirim data dan mengklik reset untuk menghapus data. 4. Activity Diagram Login Admin Serangkaian kerja melakukan login admin dapat terlihat seperti pada gambar III.6 berikut : Login Sistem Admin Sistem Memasukkan Username Memasukkan Password Valid invalid Menampilkan Pesan Error Aktifkan Menu Administrator Phase Gambar III.6. Activity Diagram Login Keterangan : a. Aktifitas untuk masuk kedalam sistem terlebih dahulu admin mengklik form login.

45 b. Kemudian admin mengisi name dan password lalu mengklik login. 5. Activity Diagram Data Lokasi Toko Serangkaian kerja melakukan pengolahan data lokasi Toko dapat terlihat seperti pada gambar III.7 berikut : Olah Data Toko Admin Sistem baru Form Lokasi Toko Isi data tidak batal Simpan data ya ya Edit tidak hapus ya tidak Phase Gambar III.7. Activity Diagram Data Lokasi Chemical store Keterangan : a. Aktifitas untuk mengisi data lokasi Chemical store, admin mengklik form lokasi Chemical store. b. Pada form lokasi Chemical store, admin dapat memperbaharui informasi dengan menambah data informasi lokasi Chemical store.

46 6. Activity Diagram Data Koordinat Serangkaian kerja melakukan pengolahan data koordinat dapat terlihat seperti pada gambar III.8 berikut : Olah Data Koordinat Admin Sistem baru Form Koordinat Isi data tidak batal Simpan data ya ya Edit tidak hapus ya tidak Phase Gambar III.8. Activity Diagram Data Koordinat Keterangan : a. Aktifitas untuk mengisi data koordinat, admin mengklik form koordinat. b. Pada form koordinat, admin dapat memperbaharui informasi dengan menambah data informasi koordinat.

47 7. Activity Diagram Logout berikut : Serangkaian kerja melakukan logout dapat terlihat seperti pada gambar III.9 Olah Logout Admin Sistem Memilih aksi pada form Menu Klik Form logout Disable menu admin Enable menu login Form user Phase Gambar III.9. Activity Diagram Logout Keterangan : a. Admin menekan button logout untuk keluar dari halaman admin, kemudian sistem mendisable menu admin dan mengenable menu login. III.3.1.4. Sequence Diagram Rangkaian kegiatan pada setiap terjadi event sistem digambarkan pada sequence diagram berikut :

48 1. Sequence Diagram Beranda berikut: Serangkaian kerja melihat beranda dapat terlihat seperti pada gambar III.10 Pengguna Beranda Membuka sistem () Menu () Gambar III.10. Sequence Diagram Beranda 2. Sequence Diagram Peta berikut: Serangkaian kerja melihat peta dapat terlihat seperti pada gambar III.11

49 Pengguna Tampilkan Menu () Menu Utama Menu Peta Toko Menu () click Menu Peta () Koneksi database () Gambar III.11. Sequence Diagram Peta 2 3. Sequence Diagram Data Testimoni Serangkaian kerja melakukan pengolahan data testimoni dapat terlihat seperti pada gambar III.12 berikut :

50 User Menu Utama Menu Data Testimoni Proses Tabel testimoni Tampilkan Menu () Menu () click Menu Testimoni () Perbaharui data () Koneksi database () Hapus data () Koneksi database () Tutup Menu () Gambar III.12. Sequence Diagram Data Testimoni 4. Sequence Diagram Login Admin Serangkaian kerja melakukan login admin dapat terlihat seperti pada gambar III.13 berikut :

51 Admin Menu Utama Menu Login Proses Login Tabel admin Menu Admin Tampilkan Menu () Menu () click Menu login Isi nama dan password () Koneksi database () Sesuai () Tidak Sesuai () Gambar III.13. Sequence Diagram Login 5. Sequence Diagram Data Lokasi Chemical store Serangkaian kerja melakukan pengolahan data lokasi Chemical store dapat terlihat seperti pada gambar III.14 berikut :

52 Admin Main menu menu Data lokasi Proses Tabel Toko Tampilkan Fom () Menu () click menu Lokasi lokasi () Perbaharui data () Koneksi database () Hapus data () Koneksi database () Tutup menu () Gambar III.14. Sequence Diagram Data Lokasi Chemical store 6. Sequence Diagram Data Koordinat Serangkaian kerja melakukan pengolahan data koordinat dapat terlihat seperti pada gambar III.15 berikut :

53 Administrator Website Main Menu Menu Data koordinat Proses Tabel koordinat Tampilkan Fom () Menu () click Menu koordinat () Perbaharui data () Koneksi database () Hapus data () Koneksi database () Tutup Menu () Gambar III.15. Sequence Diagram Data Koordinat 7. Sequence Diagram Logout berikut : Serangkaian kerja melakukan logout dapat terlihat seperti pada gambar III.16 Menu Tombolkeluar aksisistem() tombolkeluar.tidakaktif() tombolmasuk.aktif() menuloket.tidakaktif() menudatamarka.tidakaktif() menuolahartikel.tidakaktif() menuprofiladministrator.tidakaktif() Gambar III.16. Sequence Diagram Logout

54 III.4.Desain Basis Data Desain basis data terdiri dari tahap merancang melakukan normalisasi tabel dan merancang struktur tabel III.4.1. Normalisasi Data Salah satu topik yang cukup kompleks dalam dunia manajemen database adalah proses untuk menormalisasi tabel-tabel dalam database relasional. Menghindari kemungkinan kehilangan data secara tidak disengaja/tidak diketahui. Alasan utama dari normalisasi database minimal sampai dengan bentuk normal ketiga adalah menghilangkan kemungkinan adanya insertion anomalies, deletion anomalies, dan update anomalies. Tipe-tipe kesalahan tersebut sangat mungkin terjadi pada database yang tidak normal. 1. Bentuk tidak normal Bentuk ini merupakan kumpulan data yang akan direkam, tidak ada keharusan mengikuti format tertentu, dapat saja tidak lengkap dan terduplikasi. Data dikumpulkan apa adanya sesuai keadaanya. Tabel III.1. Tabel Tidak Normal Kode Nama Lokasi Kode Jalan Informasi 1 Brataco Chemical J002 Distributor Bahan kimia 2 UD Lautan Kimia J007 2. Bentuk normal tahap pertama (1 Normal Form) Sebuah tabel disebut 1NF jika : - Tidak ada baris yang duplikat dalam tabel tersebut. - Masing-masing cell bernilai tunggal

55 Catatan : Permintaan yang menyatakan tidak ada baris yang duplikat dalam sebuah tabel berarti tabel tersebut memiliki sebuah kunci, meskipun kunci tersebut dibuat dari kombinasi lebih dari satu kolom atau bahkan kunci tersebut merupakan kombinasi dari semua kolom. Tabel III.2. Tabel Normal 1NF Kode Nama Lokasi Kode Jalan Informasi 1 Bratanco Chemical J002 Distributor Bahan kimia 2 UD Lautan Kimia J007 Distributor Bahan kimia 3. Bentuk normal tahap kedua (2 nd normal form) Bentuk normal kedua (2NF) terpenuhi jika pada sebuah tabel semua atribut yang tidak termasuk dalam primary key memiliki ketergantungan fungsional pada primary key secara utuh. Tabel III.3. Tabel Normal 2NF Kode_Jalan Nama_Jalan Koordinat J001 Jl. Krakatau 3.58957,98.67419 J002 Jalan Brigjen Katamso 3.58125,98.68261 J003 Putri Hijau 3.59567,98.67569 J004 Sisingamangaraja 3.58227,98.68468 J005 Ir. H. Juanda 3.5753,98.67007 J006 Diponegoro 3.57529,98.67193 J007 Jend. Sudirman 3.57726,98.6668 J008 Balaikota 3.58875,98.67827 J009 Guru Patimpus 3.59335,98.66892

56 III.4.2. Desain Tabel Setelah melakukan tahap normalisasi, maka tahap selanjutnya yang dikerjakan yaitu merancang struktur tabel pada basis data sistem yang akan dibuat, berikut ini merupakan rancangan struktur tabel tersebut: 1. Struktur Tabel Admin Tabel admin digunakan untuk menyimpan data Id_User, Username, Password, Nama, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.4 di bawah ini: Nama Database Nama Tabel Tabel III.4 Rancangan Tabel Admin dianti_toko admin No Nama Field Tipe Data Boleh Kosong Kunci 1. Id_User int(11) Tidak Primary Key 2. Username varchar(12) Tidak Unique 3. Password varchar(12) Tidak - 4. Nama varchar(25) Tidak - 2. Struktur Tabel Koordinat Tabel koordinat digunakan untuk menyimpan data Kode_Koordinat, Nama_Area, Koordinat, Keterangan, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.5 di bawah ini:

57 Nama Database Nama Tabel Tabel III.5 Rancangan Tabel Koordinat dianti_toko koordinat No Nama Field Tipe Data Boleh Kosong Kunci 1. Kode_Koordinat int(11) Tidak Primary Key 2. Nama_Area text Tidak - 3. Koordinat text Tidak - 4. Keterangan text Tidak - 3. Struktur Tabel Testimonial Tabel testimonial digunakan untuk menyimpan data ID_Testimonial, Nama_Pengirim, Email, Testimonial, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.6 di bawah ini: Nama Database Nama Tabel Tabel III.6 Rancangan Tabel Testimonial dianti_toko testimonial No Nama Field Tipe Data Boleh Kosong Kunci 1. ID_Testimonial int(11) Tidak Primary Key 2. Nama_Pengirim varchar(25) Tidak - 3. Email varchar(25) Tidak - 4. Testimonial text Tidak - 4. Struktur Tabel Toko Tabel toko digunakan untuk menyimpan data Kode_Toko, Nama_Toko, Telepon, Alamat, Gambar, Keterangan, Koordinat, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.7 di bawah ini:

58 Nama Database Nama Tabel Tabel III.7 Rancangan Tabel Toko dianti_toko toko No Nama Field Tipe Data Boleh Kosong Kunci 1. Kode_Toko int(5) Tidak Primary Key 2. Nama_Toko varchar(25) Tidak Unique 3. Telepon varchar(12) Tidak - 4. Alamat text Tidak - 5. Gambar longtext Tidak - 6. Keterangan text Tidak - 7. Koordinat text Tidak - III.5. Desain User Interface Tahap perancangan berikutnya yaitu desain sistem secara detail yang meliputi desain output sistem, desain input sistem, dan desain database. a. Desain Output Desain output yang akan dirancang pada sistem dapat dilihat pada gambar berikut : 1. Desain Form Peta Desain Form untuk melihat peta dapat terlihat seperti pada gambar III.20 berikut:

59 Chemical Store Beranda Peta Toko Testimoni Artikel Masuk Tentang cari Tampilan Peta Sistem Informasi Geografis Toko Hak Cipta 2016 - All Right Reserved Design By Dianti Irawati Gambar III.20. Desain Form Peta 2. Desain Form Laporan Lokasi Desain Form untuk melihat laporan lokasi dapat terlihat seperti pada gambar III.21 berikut:

60 Gambar III.21. Desain Form Peta b. Desain Input Desain input yang akan dirancang pada sistem dapat dilihat pada gambar berikut : 1. Desain Form Data Testimoni Desain Form untuk melakukan pengolahan data testimoni dapat terlihat seperti pada gambar III.22 berikut :

61 Chemical Store Beranda Peta Toko Testimoni Masuk Tentang Testimonial Nama Anda : Email Anda : Testimonial : Kirim Reset Sistem Informasi Geografis Toko Hak Cipta 2016 - All Right Reserved Design By Dianti Irawati Gambar III.22. Desain Form Data Testimoni 3. Desain Form Login Admin Desain Form untuk melakukan login admin dapat terlihat seperti pada gambar III.23 berikut : Chemical Store Beranda Peta Toko Testimoni Masuk Tentang LOG IN Username Password Login Sistem Informasi Geografis Toko Hak Cipta 2016 - All Right Reserved Design By Dianti Irawati Gambar III.23. Desain Form Login

62 4. Desain Form Data Lokasi Chemical store Desain Form untuk melakukan pengolahan data lokasi chemical store dapat terlihat seperti pada gambar III.24 berikut : Chemical Store Beranda Peta Toko Testimoni Data Toko Data Koordinat Laporan Testimonial Keluar Tentang Data Toko Nama : Nama Toko Telepon Koordinat Kata Kunci : Cari Data Alamat : Gambar : Gambar Keterangan : Simpan Reset Sistem Informasi Geografis Toko Hak Cipta 2016 - All Right Reserved Design By Dianti Irawati Gambar III.24. Desain Form Data Lokasi Chemical store 5. Desain Form Data Koordinat Desain Form untuk melakukan pengolahan data koordinat dapat terlihat seperti pada gambar III.25 berikut : Chemical Store Beranda Peta Toko Testimoni Data Toko Data Koordinat Laporan Testimonial Keluar Tentang Data Koordinat Nama Area : Nama Toko Telepon Koordinat Kata Kunci : Cari Data Lat Lng Keterangan : Simpan Reset Sistem Informasi Geografis Toko Hak Cipta 2016 - All Right Reserved Design By Dianti Irawati Gambar III.25. Desain Form Data Koordinat