RUTE TERPENDEK LAYANAN ANTAR KONSUMEN PADA
RESTORAN WARALABA
SKRIPSI
Disusun Oleh :
APRILIA KUSUMAH ANGGA RANI
0734010282
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNOLOGI INDUSTRI
UNIVERSITAS PEMBANGUNAN NASIONAL "VETERAN"
JAWA TIMUR
RUTE TERPENDEK LAYANAN ANTAR KONSUMEN PADA
RESTORAN WARALABA
SKRIPSI
Diajukan Untuk Memenuhi Sebagai Persyaratan
Dalam Memperoleh Gelar Sarjana Komputer
Program Studi Teknik Informatika
Disusun Oleh :
APRILIA KUSUMAH ANGGA RANI
0734010282
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNOLOGI INDUSTRI
UNIVERSITAS PEMBANGUNAN NASIONAL "VETERAN"
IMPLEMENTASI GOOGLE MAP API PADA APLIKASI PENENTU RUTE
TERPENDEK LAYANAN ANTAR KONSUMEN PADA RESTORAN
WARALABA
Disusun Oleh :
APRILIA KUSUMAH ANGGA RANI
0734010282
Telah disetujui mengikuti Ujian Negara Lisan
Gelombang VI Tahun Akademik 2011/2012
Menyetujui,
NIP/NPT. 19650731 199203 2 001
SKRIPSI
Mengetahui,
Kepala Program Studi Teknik Informatika
Fakultas Teknologi Industri
Universitas Pembangunan Nasional “Veteran” Jawa Timur
Alhamdulillah, Penulis bersyukur kepada Allah SWT atas semua Rahmat, Berkah, dan
Ridho-Nya yang telah diberikan kepada penulis sehingga dapat menyelesaikan Skripsi ini
dengan baik.
Dalam menyelesaikan Skripsi ini, penulis berpegang pada teori serta bimbingan dari para
dosen pembimbing Skripsi, dan berbagai pihak yang banyak membantu hingga terselesaikannya
Skripsi ini. Skripsi merupakan salah satu syarat bagi mahasiswa untuk menyelesaikan program
studi Sarjana Strata Satu (S1) di Jurusan Teknik Informatika Fakultas Teknologi Industri
Universitas Pembangunan Nasional “Veteran” Jawa Timur.
Terwujudnya Skripsi ini adalah berkat usaha, kerja keras serta dukungan dari berbagai pihak.
Dan tanpa menghilangkan rasa hormat, penulis mengucapkan banyak terima kasih kepada
pihak-pihak yang telah membantu penulis antara lain:
1. Tuhan YME yang selalu memberikan kesehatan, rezeki, kemudahan, dan kasih-Nya yang
besar baik bagi penulis sendiri maupun orang – orang di sekitar penulis.
2. Bapak Sutiyono, selaku Dekan Fakultas Teknik Industri Universitas Pembangunan
Nasional "Veteran" Jatim.
3. Bapak Basuki Rahmat,S.Si, MT., selaku Dosen Pembimbing I Skrpsi. yang telah
membimbing, memberikan arahan, dan nasehat serta banyak meluangkan waktu untuk
memberikan bimbingan dan membagi ilmu saya ucapkan terima kasih banyak.
5. Dr. Ir. Ni Ketut Sari, MT, selaku Dosen Pembimbing II Skripsi yang telah membimbing,
memberikan arahan, dan nasehat saya ucapkan terima kasih banyak.
6. Orang tua tercinta dan adikku tersayang, yang telah memberikan dorongan baik moril
maupun materiil sehingga laporan skripsi ini dapat penulis selesaikan.
7. Kepada patner saya Bayu Aditya Kurniawan, terima kasih banyak telah membantu dan
menemani saya serta memberikan semangat kepada saya dalam menyelesaikan skripsi
saya ini.
8. Kepada Keluarga besar saya yang telah memberikan semangat dan do’a kepada saya
sehinggga laporan skripsi ini dapat saya selesaikan.
9. Kepada teman-teman saya Widya, Rina, Nanda, Vera, Ellisa, Aan, Mbak Yusnita, Siska,
dan Novita senantiasa mengajari, membantu dan memberikan dukungan kepada saya,
saya ucapkan banyak terima kasih.
10. Kepada semua teman-teman saya yang tidak dapat saya sebutkan satu-peratu khususnya
warga Teknik Informatika UPN Veteran Jawa Timur terima kasih banyak untuk
semangat dan bantuannya.
11. Kepada teman-teman kerja saya khususnya mbak Wulan dan mbak Sinta yang telah
memberikan semangat kepada saya untuk menyelesaikan skripsi ini.
Surabaya, 29 Maret 2012
ABSTRAK. ... .i
KATA PENGANTAR ... ii
DAFTAR ISI ...v
DAFTAR GAMBAR ... viii
DAFTAR TABEL ………...xi
BAB I PENDAHULUAN ...1
1.1 Latar Belakang ...1
1.2 Perumusan Masalah ...2
1.3 Batasan Masalah ...2
1.4 Tujuan ...3
1.5 Manfaat ...3
1.6 Sistem Penulisan ...3
BAB II KAJIAN PUSTAKA ...5
2.1 Pemasaran ...5
2.2 Konsep dan Sistem ...7
2.3 Konsep Dasar Sistem Informasi ...10
2.3.1 Komponen Sistem Informasi ...10
2.6 Database dengan MySQL ...21
2.7 Editor Dreamweaver ...23
2.8 Cascading Style Sheet (CSS) ...24
2.9 Google Maps API ...25
2.10 Konsep Pengembangan Sistem ...27
2.11 Konsep Perancangan Sistem...28
2.12 Pengajuan Perangkat Lunak ...28
BAB III ANALISA PERMASALAHAN ...29
3.1 Desain Penelitian ...29
3.2 Alat Penelitian ...32
3.3 Diagram Alir Sistem ...32
3.4 Perancangan Sistem ...34
3.4.1 Tujuan Perancangan Sistem ...34
3.4.2 Perancangan Database ...35
3.4.2.1 Tabel Cabang ...35
3.4.2.2 Tabel Detail Pemesanan ...35
3.4.2.6 Tabel Users ...38
3.4.3 Perancangan Antar Muka ...38
BAB IV IMPLEMENTASI DAN PENGAJUAN APLIKASI ...43
4.1 Implementasi Program ...43
4.1.1 Implementasi Database MySQL...43
4.1.2 Implementasi Script Login ...45
4.1.3 Implementasi Script Hitung Jarak ...46
4.1.4 Implementasi Script Cari Lokasi ...51
4.2 Implementasi Antar Muka ...52
4.3 Pengajuan Sistem ...56
4.3.1 Pangajuan PopUp Informasi Menu ...56
4.3.2 Pangajuan Pencarian Cabang Terdekat Berdasarkan Pencarian Rute Tempuh ...57
4.3.3 Pengajuan Pencarian Rute Tempuh Berdasarkan lokasi Pelanggan...60
4.3.3 Pengajuan Pada Menu Pesanan ...61
BAB V PENUTUP ...70
5.1 Kesimpulan ...70
Gambar 2.1 Tampilan program Helo Word pada Browser Chrome ...17
Gambar 2.2 Cara Kerja PHP ...18
Gambar 2.3 Tampilan Output Program Berbasis Obyek ...20
Gambar 3.1 Desain Penelitian ...31
Gambar 3.2 Diagram Alir Sistem ...33
Gambar 3.3 Halaman Home ...38
Gambar 3.4 Halaman Menu ...39
Gambar 3.5 Halaman Pemesanan ...39
Gambar 3.6 Halaman Pemesanan Bagian II ...39
Gambar 3.7 Halaman Peta ...40
Gambar 3.8 Halaman Daftar Cabang ...40
Gambar 3.9 Halaman Login Admin ...40
Gambar 3.10 Halaman Pesanan ( menu admin ) ...41
Gambar 3.11 Halaman Makanan ( menu admin ) ...41
Gambar 3.12 Halaman Cabang ( menu admin ) ...42
Gambar 4.1 Implementasi Tabel Cabang ...43
Gambar 4.2 Implementasi Tabel Detail_Pemesanan ...43
Gambar 4.6 Implementasi Tabel Users ...45
Gambar 4.7 Halaman Home ( Beranda ) ...52
Gambar 4.8 Halaman Daftar Menu ...52
Gambar 4.9 Halaman Pemesanan ...53
Gambar 4.10 Halaman Peta ...53
Gambar 4.11 Halaman Cabang ...54
Gambar 4.12 Halaman Login Admin ...54
Gambar 4.13 Halaman Pesanan ( menu admin ) ...55
Gambar 4.14 Halaman Makanan ( menu admin ) ...55
Gambar 4.15 Halaman cabang ( menu admin ) ...56
Gambar 4.16 PopUp Informasi Menu Nasi Goreng ...56
Gambar 4.17 Pencarian Cabang terdekat Berdasarkan Lokasi Pemesan ...57
Gambar 4.18 Form. Isian Data Pemesan ...58
Gambar 4.19 Form Isian Data Pemesan Dalam Keadaan Terisi ...58
Gambar 4.20 Form Isian Data Pemesanan Makanan Dalam Keadaan Terisi ...59
Dari Mayjen Sungkono Menuju Wonokromo dengan pilihan Jenis
Kendaraan Mobil ...60
Gambar 4.24 Tampilan Informasi Detail Rute Tempuh dan Jarak Serta Waktu ...61
Gambar 4.25 Tampilan Pada Menu Pemesanan ...62
Gambar 4.26 Tampilan Peta Beserta Simbol ...62
Gambar 4.27 Tampilan Pada Pemilihan Cabang Terdekat Dengan Mengetikkan alamat Yang dituju ...63
Gambar 4.28 Tampilan Keseluruhan Dari Pencarian Cabang Terdekat ...64
Gambar 4.29 Tampilan Pada Peta Dari Pencarian Rute Terpendek ...64
Gambar 4.30 Tampilan Dari Pencarian Rute Terpendek Dengan Menampilkan Cabang Terpendek ...65
Gambar 4.31 Tampilan Pada Data Pemesan ...66
Gambar 4.32 Tampilan Pada Detail Pemesan ...66
Gambar 4.33 Tampilan Pada Data Tambah Pesanan ...67
Gambar 4.34 Tampilan Pada Data Pemesanan ...68
Gambar 4.35 Tampilan Pada Edit Pemesan ...68
Tabel 3.1 Struktur Tabel Cabang ...35
Tabel 3.2 Struktur Tabel Detail Pesanan ...35
Tabel 3.3 Struktur Tabel Menu ...36
Tabel 3.4 Struktur Tabel Pemesanan ...36
Tabel 3.5 Struktur Tabel Peta ...37
Pembimbing II : Dr. Ir. Ni Ketut Sari, MT
Penyusun : Aprilia Kusumah Angga Rani
ABSTRAK
Salah satu kendala yang dihadapi dalam layanan pesanan antar adalah
dengan menentukan rute atau jalur yang akan dilewati untuk sampai di tempat
pelanggan, khususnya untuk restoran yang memberikan jasa delivery order kepada
pelanggannya. Pada aplikasi ini juga dapat menentukan cabang terdekat dari
restoran yang akan melayani pesanan si pelanggan. Dengan membuat aplikasi
pemilihan rute terpendek dengan memanfaatkan google API untuk memilih rute
terpendek dan cabang terdekat sesuai dengan alamat pemesan.
Pada aplikasi ini dilengkapi dengan google map API untuk menentukan rute
terpendek yang berguna bagi user dan pelanggan. Pelanggan yang ingin mengetahui
cabang mana yang terdekat dengan lokasi rumahnya dapat menghubungi salah satu
cabang untuk mencari informasi. Aplikasi ini juga dilengkapi dengan menu pesanan
untuk mencatat pesanan si pelanggan.
1.1. Latar Belakang
Teknologi Informasi adalah suatu teknologi yang digunakan untuk
mengolah data, termasuk memproses, mendapatkan, menyusun, menyimpan,
memanipulasi data dalam berbagai cara untuk menghasilkan informasi yang
berkualitas, yaitu informasi yang relevan, akurat dan tepat waktu, yang digunakan
untuk keperluan pribadi, bisnis, dan pemerintahan dan merupakan informasi yang
strategis untuk pengambilan keputusan. Teknologi ini menggunakan seperangkat
komputer untuk mengolah data, sistem jaringan untuk menghubungkan satu
komputer dengan komputer yang lainnya sesuai dengan kebutuhan, dan teknologi
telekomunikasi digunakan agar data dapat disebar dan diakses secara global.
Teknologi Informasi, meliputi segala hal yang berkaitan dengan proses,
penggunaan sebagai alat bantu, manipulasi, dan pengelolaan informasi. Salah satu
bidang yang banyak mendapatkan manfaat dari perkembangan teknologi
informasi adalah bidang usaha restoran yang mengutamakan layanan untuk
menjamin kepuasan pelanggan.
Salah satu cara untuk meningkatkan layanan agar kepuasaan pelanggan
meningkat dapat melayani pesanan dalam waktu singkat, terutama pesanan antar.
Salah satu kendala yang dihadapi dalam layanan pesanan antar adalah dengan
menentukan rute atau jalur yang akan dilewati untuk sampai di tempat pelanggan
dalam waktu singkat, khususnya untuk restoran yang memiliki cabang lebih dari
Berdasarkan pada uraian tersebut diatas, pada tugas akhir ini penulis
ingin membuat aplikasi pemilihan rute terpendek dengan memanfaatkan google
API untuk memilih rute terpendek dan cabang terdekat sesuai dengan alamat
pemesan.
1.2. Perumusan Masalah
Berdasarkan latar belakang diatas, maka perumusan masalah yang
dipergunakan dalam tugas akhir ini adalah :
1. Bagaimana membuat aplikasi untuk menentukan rute atau jalur yang ditempuh
dan memilih cabang terdekat untuk melayani pesanan antar yang diterima dari
pelanggan ?
2. Bagaimana memanfaatkan Google API untuk membuat aplikasi penentuan
rute terpendek ?
1.3. Batasan Masalah
Adapun batasan masalah yang dipergunakan dalam tugas akhir ini agar
pembahasan tidak menyimpang dari tujuan adalah :
1. Aplikasi yang dibangun menggunakan bahasa pemrograman PHP dan
database MySQL
2. Aplikasi yang dibangun hanya mencatat data pesanan dan menampilkan rute
tertentu yang telah terbaca dan ditandai di google map.
3. Aplikasi ini dapat dijalankan di semua browser yang sudah terinstall flash
player.
1.4. Tujuan
Tujuan dari pembuatan tugas akhir ini adalah :
1. Mengetahui berbagai google API command yang dapat dipergunakan untuk
membangun aplikasi berbasis web
2. Membuat aplikasi yang dapat menampilkan rute terpendek dengan
memanfaatkan google API.
1.5. Manfaat
Manfaat yang dapat diperoleh dari pembuatan aplikasi tugas akhir kali ini
adalah memudahkan pengguna (dalam hal ini pengelola restoran) untuk
mengetahui cabang terdekat yang dipilih berdasarkan lokasi pemesanan pelanggan
serta mengetahu jarak dan waktu yang akan ditempuh.
1.6. Sistematika Penulisan
Sistematika penulisan tugas akhir ini disusun untuk memberikan gambaran
umum tentang penelitian yang dijalankan. Sistematika penulisan tugas akhir ini
adalah sebagai berikut :
BAB I PENDAHULUAN
Bab ini berisi latar belakang masalah, identifikasi masalah, maksud
dan tujuan yang ingin dicapai, batasan masalah, manfaat penelitian
dan sistematika penulisan.
Membahas berbagai konsep dasar dan teori-teori yang berkaitan
dengan topik masalah yang diambil dalam tugas akhir ini.
BAB III ANALISIS DAN PERANCANGAN SISTEM
Berisi tentang metodologi penelitian yang diterapkan dalam
memperoleh dan mengumpulkan data serta membahas mengenai
perancangan sistem.
BAB IV IMPLEMENTASI DAN PENGUJIAN APLIKASI
Membahas mengenai pengimplementasian aplikasi yang telah
dibuat ke perangkat yang akan digunakan dan pengujian terhadap
hasil implementasi serta hasil pengujiannya.
BAB V PENUTUP
Berisi kesimpulan dan saran yang sudah diperoleh dari hasil
2.1. Pemasaran
Tull dan Kahle (1990) menyatakan bahwa pemasaran berperan penting
bagi sebuah perusahaan (organisasi bisnis) dalam menciptakan hubungan atau link
antara perusahaan dan pasar yang dilayaninya. Sebagaimana dikemukakan oleh
Peter F. Drucker, bapak manajemen moderen, bahwa alasan utama dari eksistensi
suatu perusahaan adalah menciptakan proses pertukaran barang dan jasa yang
saling memuaskan antara perusahaan dan konsumen yang ada di pasar yang
dilayani perusahaan (Kotler, 1997). Dari proses pertukaran demikian akan
diperoleh pendapatan (revenue) yang, pada gilirannya, akan diperoleh laba (profit)
(Kotler, 1997). Sementara itu, perhatian utama dari manajemen pemasaran adalah
bagaimana menciptakan hubungan yang harmonis antara konsumen dan produsen
dalam bentuk pertukaran baik barang maupun jasa yang saling menguntungkan
antara kedua belah pihak (Tull dan Kahle, 1990; Kotler, 1997).
Dengan demikian, adalah tidak keliru bila kita katakan bahwa setiap
organisasi bisnis dalam merealisasikan tujuannya perlu didukung oleh manajemen
pemasaran yang memadai. Badan usaha yang bergerak di bidang jasa dan/atau
produk yang berkaitan dengan restoran, termasuk di dalamnya.
Banyak kalangan yang berpemahaman bahwa pemasaran (marketing)
tidak ada bedanya dengan penjualan (selling). Untuk mengetahui bahwa antara
keduanya berbeda, kita perlu untuk terlebih dahulu melihat definisi atau batasan
Secara sederhana, pemasaran didefinisikan sebagai seperangkat kegiatan
yang hasilnya adalah: (i) membuat tersedianya produk (barang atau jasa) yang
dapat memuaskan konsumen dan (ii) memberikan keuntungan kepada perusahaan
yang menawarkan produk tersebut (Joscon Network, 2002). Definisi yang lebih,
katakanlah, formal tentang pemasaran dikemukakan Kotler, pakar manajemen
pemasaran tersohor, yaitu bahwa : “… pemasaran adalah suatu proses sosial dan
manajerial di mana baik individu maupun kelompok yang terlibat dalam proses
tersebut memperoleh apa (produk atau jasa) yang mereka butuhkan dan inginkan
dengan cara menciptakan, menawarkan, dan mempertukarkan produk atau jasa
yang bernilai dengan pihak lain” (Kotler, 1997).
Sementara manajemen pemasaran didefinisikan oleh American
Marketing Association (AMA) sebagai: “…manajemen pemasaran adalah proses
perencanaan dan pelaksanaan pemikiran, penetapan harga, promosi, serta
penyaluran gagasan, barang, dan jasa untuk menciptakan pertukaran yang
memuaskan tujuan baik individu maupun organisasi” (Kotler, 1997; Joscon
Network, 2002).
Apa pun definisinya, kegiatan pemasaran bermuara pada dua kondisi
yang menguntungkan baik bagi pihak perusahaan (produsen) maupun pelanggan,
yakni : (i) pelanggan dapat memperoleh produk (barang atau jasa) yang mereka
butuhkan; dan (ii) produsen memperoleh keuntungan yang diperoleh secara sehat
yang memungkinkan produsen untuk bisa mempertahakan keberlangsungan
usahanya dalam rangka memenuhi kebutuhan pelanggan di masa datang (Joscon
Networks, 2002). Dengan perkataan lain, dapat dikatakan bahwa fokus utama
persis apa yang pelanggan butuhkan. Tentu saja pemasaran yang berorientasi pada
pelanggan ini (costumer-oriented marketing) harus dibarengi dengan tujuan
perusahaan untuk mempertahankan volume penjualan yang menguntungkan
dalam rangka mempertahankan bisnisnya.
Secara lebih rinci, Joscon Network (2002), menyebutkan bahwa
pemasaran melibatkan kegiatan-kegiatan berikut :
a. Mencari tahu produk atau jasa apa yang diinginkan pelanggan;
b. Memproduksi produk atau jasa yang memiliki karakteristik dan kualitas yang
sesuai dengan yang diinginkan pelanggan;
c. Menentukan harga produk atau jasa secara tepat;
d. Mempromosikan produk atau jasa yang ditawarkan (mengemukakan secara
verbal mengapa pelanggan perlu membeli produk atau jasa tersebut); dan
e. Menjual dan mengantarkan produk atau jasa ke tangan pelanggan.
Dari rincian kegiatan di atas, jelas bahwa penjualan (selling) merupakan
bagian dari kegiatan pemasaran. Antara keduanya mempunyai pengertian yang
berbeda. Lebih jauh dari itu, ternyata pemasaran melibatkan pelbagai kegiatan
yang terintegrasi dari mulai penelusuran keinginan (calon) pelanggan hingga
pengantaran produk ke tangan pelanggan.
2.2. Konsep Dasar Sistem
Pengertian suatu sistem adalah “suatu jaringan kerja dari
prosedur-prosedur yang saling berhubungan, berkumpul bersama-sama untuk melakukan
suatu kegiatan atau untuk menyelesaikan suatu sasaran tertentu”
menghasilkan sesuatu yang lebih bermanfaat, ada yang menyebutkan mencapai
suatu tujuan dan ada yang menyebutkan untuk mencapai sasaran. Jadi dapat
disimpulkan bahwa pengertian sistem adalah kumpulan dari berbagai macam
elemen yang berbeda namun mempunyai tujuan yang sama untuk mencapai
sasaran.
Suatu sistem memiliki karakteristik atau sifat-sifat tertentu, yaitu
memiliki komponen-komponen (components), batas sistem (boundary),
lingkungan luar sistem (environment), penghubung (interprest), masukan (input),
keluaran (output), pengolah (process) dan sasaran (objective) dan tujuan (goal).
a. Komponen Sistem (System Components)
Komponen sistem atau elemen-elemen sistem dapat berupa suatu sub sistem
atau bagian-bagian dari sistem. Setiap sistem baik besar maupun kecil, selalu
mengandung komponen-komponen atau subsistem-subsistem. Setiap
subsistem mempunyai sifat-sifat dari sistem untuk menjalankan suatu fungsi
tertentu dan mempengaruhi proses sistem secara keseluruhan. Suatu sistem
dapat mempunyai suatu yang lebih besar yang disebut supra system.
b. Batas Sistem (System Boundary)
Batas sistem merupakan daerah-daerah yang membatasi antara satu sistem
dengan sistem lainnya dengan lingkungan luarnya. Batas sistem ini
memungkinkan suatu sistem dipandang sebagai satu kesatuan. Batas suatu
sistem menujukkan ruang lingkup (scope) dari sistem tersebut.
c. Lingkungan Luar Sistem (System Environment)
Lingkungan luar sistem dari suatu sistem adalah apapun di luar batas dari
menguntungkan dan dapat pula merugikan sistem tersebut. Lingkungan luar
yang menguntungkan merupakan energi dari sistem yang harus dijaga dan
dipelihara. Sedangkan yang merugikan harus ditahan dan dikendalikan,
karena akan mengganggu kelangsungan hidup sistem.
d. Penghubung Sistem (System Interprest)
Penghubung sistem merupakan media penghubung antara satu sub sistem
dengan subsistem yang lainnya. Melalui penghubung ini memungkinkan
sumber-sumber daya mengalir dari satu subsistem ke subsistem yang lainnya.
Dengan penghubung akan terjadi interaksi antar subsistem, sehingga
membentuk satu kesatuan.
e. Masukan Sistem (System Input)
Masukan adalah suatu energi yang dimasukkan ke dalam sistem. Masukan
dapat berupa masukan perawatan (maintenance input) dan masukan sinyal
(signal input). Maintenance input adalah energi yang dimasukkan supaya
sistem tersebut dapat beroperasi. Contoh maintenance input di dalam sistem
komputer adalah program, yang digunakan untuk mengoperasikan komputer.
Sedangkan signal input adalah energi yang diproses untuk mendapatkan
keluaran. Contoh signal input di dalam sistem komputer adalah data, yang
dapat diolah menjadi Informasi.
f. Keluaran Sistem (System Output)
Keluaran (Output) merupakan hasil dari energi yang diolah dan
diklasifikasikan menjadi keluaran yang berguna.
g. Pengolah Sistem (System Process)
sendiri sebagai pengolahnya, yang bertugas untuk merubah masukan menjadi
keluaran.
h. Sasaran Sistem (System Objective)
Suatu sistem pasti memiliki tujuan (goal) atau sasaran (objective). Suatu
operasi sistem akan berguna dan berhasil apabila mencapai sasaran atau
tujuannya. Sasaran sistem sangat menentukan masukan yang dibutuhkan
sistem dan keluaran yang akan dihasilkan sistem.
(Sumber : Jogiyanto, HM. (2005), Analisis dan Desain Sistem Informasi:
Pendekatan Terstruktur Teori dan Praktek Aplikasi Bisnis, Andi, Yogyakarta.)
2.3. Konsep Dasar Sistem Informasi
Sistem Informasi adalah “suatu jaringan dari beberapa elemen-elemen
yang saling berhubungan serta membentuk satu kesatuan untuk menyediakan
informasi yang dibutuhkan oleh organisasi untuk beroperasi dengan cara yang
sukses, serta memberi sinyal kepada manajemen dan yang lain terhadap kejadian
internal dan eksternal yang penting dan menyediakan suatu dasar informasi untuk
pengambilan keputusan” (Wahyono,2004)
2.3.1. Komponen Sistem Informasi
Dalam membangun suatu sistem Informasi diperlukan penggabungan
elemen-elemen pendukung tersebut antara lain :
a. Software, merupakan suatu program komputer, struktur data, dan
dokumen-dokumen yang saling berhubungan yang digunakan dalam metode logika dan
b. Hardware, merupakan perangkat elektronik yang memiliki kemampuan untuk
melakukan proses komputerisasi.
c. Brainware, adalah pengguna dan operator perangkat keras atau perangkat
lunak.
d. Data, berupa salinan-salinan manual dan deskripsi informasi yang
menggambarkan operasi sistem.
2.3.2. Tujuan Sistem Informasi
Sistem Informasi memiliki beberapa tujuan, yaitu:
1. Integrasi sistem
a. Menghubungkan sistem individu/kelompok
b. Pengkolektifan data dan penyambungan secara otomatis
c. Peningkatan koordinasi dan pencapaian sinergi
2. Efisiensi pengelolaan
a. Penggunaan basis data dalam upaya kesamaan pengadministrasian data
b. Pengelolaan data berkaitan dengan karakteristik Informasi
c. Penggunaan dan pengambilan Informasi
3. Dukungan keputusan untuk manajemen
a. Melengkapi Informasi guna kebutuhan proses pengambilan kebutuhan
b. Akuisisi Informasi eksternal melalui jaringan komunikasi
c. Ekstraksi dari Informasi internal yang terpadu.
(Sumber : Teguh Wahyono, 2004, “Sistem Informasi (konsep dasar, analisis,
2.4. Peramban Web
Peramban web (web browser) adalah perangkat lunak yang berfungsi
menampilkan dan melakukan interaksi dengan dokumen-dokumen yang
disediakan oleh server web . Peramban web adalah jenis perantara pengguna yang
paling sering digunakan. Wide web sendiri adalah kumpulan jaringan berisi
dokumen dan tersambung satu dengan yang lain, yang dikenal sebagai World
Wide Web.
Peramban web pertama pertama bernama WorldWideWeb berbasis teks,
seperti halnya Lynx yang populer hingga sekarang, karena memang sistem dengan
antarmuka grafis belum umum digunakan pada saat itu. Baru setelah sistem
berbasis grafis mulai banyak digunakan, seorang mahasiswa bernama Marc
Andressen di University of Illinois di Urbana-Champaign, Amerika Serikat,
membuat sebuah peramban web berbasis grafis pertama yang berjalan di atas
sistem operasi Windows dan UNIX (berbasis Motif). Peramban web tersebut
dinamai Mosaic.
Selanjutnya, setelah lulus dari universitas, Marc ditawari oleh Jim Clarc,
salah seorang petinggi Silicon Graphics Incorporated (SGI), untuk membuat
perusahaan dengan nama Mosaic Communication, yang kemudian berubah
menjadi Netscape Communication. Marc membuat sebuah peramban web populer
pertama yang digunakan oleh umum, yang disebut dengan Netscape Navigator.
Pada saat pengembangannya, Navigator memiliki nama kode Mozilla. Navigator
merupakan peramban web komersial, akan tetapi seiring dengan waktu akhirnya
Navigator pun menjadi dapat diperoleh secara gratis. Sementara itu, peramban
kepada NCSA (National Computing for Supercomputer Application). Karena
NCSA tidak memiliki izin untuk mengomersialkan produk Mosaic, NCSA
akhirnya menjual Mosaic kepada Spyglass, yang akhirnya membuat Mosaic
menjadi peramban web komersial.
Microsoft, yang terlambat turun di pasar peramban web, pun membeli
lisensi Mosaic dari Spyglass, sehingga pada akhirnya merilis produk peramban
web-nya, yang disebut sebagai Internet Explorer. Dengan dirilisnya Internet
Explorer, muncullah perang besar antara peramban web populer, yakni antara
Netscape Navigator, dan Microsoft Internet Explorer.
Peramban web bisa dibedakan lewat fitur-fitur yang mereka dukung.
Peramban modern dan halaman web biasanya menggunakan banyak fitur dan
teknik yang tidak ada pada masa-masa awal web. Disebabkan adanya perang
peramban web, fitur-fitur Web dan perambanh web semakin cepat dikembangkan.
Berikut daftar beberapa elemen dan fitur-fitur tersebut:
§ ActiveX
§ Autocompletion (Pengisian otomatis) URL dan formulir data
§ Markah buku untuk mengikuti lokasi yang sering diakses
§ Cascading Style Sheets (CSS)
§ Kuki yang membolehkan sebuah website untuk mengetahui seorang pengguna
lama
§ Tembolok web - Halaman web "disimpan" dalam memori ketika kita
membukanya agar dapat diakses lagi walaupun sedang offline
§ Pemuatan gambar menggunakan format gambar yang sudah terkenal
seperti GIF, PNG, JPEG, SVG
§ Flash
§ Favicon
§ Font, ukuran, warna
§ Formulir untuk mengirimkan informasi
§ Frame dan IFrames
§ Gambar
§ Integrasi dengan aplikasi desktop lainnya
§ Offline browsing (perambanan luring) terhadap isi web yang sudah
ditembolok terlebih dahulu
§ Java applet
§ JavaScript untuk isi yang lebih dinamis
§ Pengaturan pengunduhan
§ Penyaringan iklan (Ad filtering)
§ Plug-in
§ Sejarah kunjungan ke halaman-halaman web terakhir
"Small-Screen Rendering" ("penampilan pada Layar-Kecil")
dari Opera adalah suatu cara memformat ulang halaman web agar dapat masuk ke
dalam layar yang kecil, misalnya dalam sebuah ponsel, sekaligus operasi gulung
(scroll) horisontal tidak diperlukan lagi.
2.5. Bahasa Pemrograman PHP
PHP (Hypertext Preprocessor) adalah bahasa skrip yang dapat
ditanamkan atau disisipkan ke dalam HTML. PHP banyak dipakai untuk
memrogram situs web dinamis. PHP dapat digunakan untuk membangun sebuah
CMS (Contet Management System).
Pada awalnya PHP merupakan kependekan dari Personal Home Page
(Situs personal). PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995.
Pada waktu itu PHP masih bernama Form Interpreted (FI), yang wujudnya berupa
sekumpulan skrip yang digunakan untuk mengolah data formulir dari web.
Selanjutnya Rasmus merilis kode sumber tersebut untuk umum dan
menamakannya PHP/FI. Dengan perilisan kode sumber ini menjadi sumber
terbuka, maka banyak pemrogram yang tertarik untuk ikut mengembangkan PHP.
Pada November 1997, dirilis PHP/FI 2.0. Pada rilis ini, interpreter PHP
sudah diimplementasikan dalam program C. Dalam rilis ini disertakan juga
modul-modul ekstensi yang meningkatkan kemampuan PHP/FI secara signifikan.
Pada tahun 1997, sebuah perusahaan bernama Zend menulis ulang
interpreter PHP menjadi lebih bersih, lebih baik, dan lebih cepat. Kemudian pada
meresmikan rilis tersebut sebagai PHP 3.0 dan singkatan PHP diubah menjadi
akronim berulang PHP: Hypertext Preprocessing.
Pada pertengahan tahun 1999, Zend merilis interpreter PHP baru dan rilis
tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah versi PHP yang paling banyak
dipakai pada awal abad ke-21. Versi ini banyak dipakai disebabkan
kemampuannya untuk membangun aplikasi web kompleks tetapi tetap memiliki
kecepatan dan stabilitas yang tinggi.
Pada Juni 2004, Zend merilis PHP 5.0. Dalam versi ini, inti dari
interpreter PHP mengalami perubahan besar. Versi ini juga memasukkan model
pemrograman berorientasi objek ke dalam PHP untuk menjawab perkembangan
bahasa pemrograman ke arah paradigma berorientasi objek.
Beberapa kelebihan PHP dari bahasa pemrograman web, antara lain:
a. Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan
sebuah kompilasi dalam penggunaanya.
b. Web Server yang mendukung PHP dapat ditemukan dimana - mana dari mulai
apache, IIS, Lighttpd, hingga Xitami dengan konfigurasi yang relatif mudah.
c. Dalam sisi pengembangan lebih mudah, karena banyaknya milis - milis dan
developer yang siap membantu dalam pengembangan.
d. Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling mudah
karena memiliki referensi yang banyak.
e. PHP adalah bahasa open source yang dapat digunakan di berbagai mesin
(Linux, Unix, Macintosh, Windows) dan dapat dijalankan secara runtime
PHP memiliki 8 (delapan) tipe data yaitu : Integer. Double, Boolean,
String, Object, Array, Null, Nill dan Resource. Setiap tipe data tersebut
mempunyai karakteristik dan kegunaan masing-masing sesuai kebutuhan. Berikut
ini adalah contoh membuat program sederhana menggunakan PHP beserta
tampilan output yang dapat dilihat menggunakan browser :
Gambar 2.1. Tampilan Program Helo World Pada Browser Chrome
PHP dikatakan sebagai sebuah server-side embedded script language
artinya sintaks-sintaks dan perintah yang kita berikan akan sepenuhnya dijalankan
oleh server tetapi disertakan pada halaman HTML biasa. Aplikasi-aplikasi yang
dibangun oleh PHP pada umumnya akan memberikan hasil pada web browser,
tetapi prosesnya secara keseluruhan dijalankan di server.
Pada prinsipnya server akan bekerja apabila ada permintaan dari client.
Dalam hal ini client menggunakan kode-kode PHP untuk mengirimkan
permintaan ke server (dapat dilihat pada gambar dibawah). Ketika menggunakan
PHP sebagai server-side embedded script language maka server akan melakukan
hal-hal sebagai berikut :
a. Membaca permintaan dari client/browser
b. Mencari halaman/page di server
<?php
c. Melakukan instruksi yang diberikan oleh PHP untuk melakukan modifikasi
pada halaman/page
d. Mengirim kembali halaman tersebut kepada client melalui internet atau
intranet.
Agar mendapatkan gambaran yang lebih jelas tentang cara kerja PHP
seperti yang telah diuraikan diatas, dapat memperhatikan gambar dibawah ini :
Gambar 2.2. Cara Kerja PHP
PHP juga telah mendukung pemrograman berorientasi obyek yang
dimulai sejak PHP 4. Dengan lahirnya PHP 5, fitur-fitur pemrograman
berorientasi obyek semakin mantap dan cepat. Dengan PHP 5, script yang
menggunakan konsep object oriented akan lebih cepat dan lebih efisien.
Pemrograman berorientasi obyek atau object oriented programming
(OOP) merupakan suatu pendekatan pemrograman yang menggunakan obyek dan
yang banyak dipakai adalah JAVA dan C++. PHP, khususnya PHP 5 sudah
mendukung konsep OOP, tetapi tidak mendukung konsep multiple inheritance dan
polymorfisme.
Berikut ini adalah contoh script PHP yang menerapkan konsep
pemrograman berorientasi obyek :
<?php
class Person {
public $firstName; public $lastName;
public function __construct($firstName, $lastName = '') { $this->firstName = $firstName;
$this->lastName = $lastName; }
public function greet() {
return "Hello, my name is " . $this->firstName . " " . $this->lastName . ".";
}
public static function staticGreet($firstName, $lastName) {
$he = new Person('John', 'Smith'); $she = new Person('Sally', 'Davis'); $other = new Person('Joe');
echo $he->greet(); // prints "Hello, my name is John Smith."
Dan output dari script diatas adalah
Gambar 2.3. Tampilan output pogram berbasis obyek
Kode sumber PHP dikompilasi on-the-fly ke format internal yang dapat
dieksekusi oleh PHP engine. Untuk mempercepat waktu eksekusi halaman, maka
PHP tidak perlu mengkompilasi kode sumber PHP setiap kali Web adalah diakses,
script PHP juga dapat digunakan dalam format executable menggunakan compiler
PHP.
Pengoptimalan kode bertujuan untuk meningkatkan kinerja kode
dikompilasi dengan mengurangi ukurannya, penggabungan instruksi berlebihan
dan membuat perubahan lain yang dapat mengurangi waktu eksekusi. Dengan
PHP, sering ada peluang untuk optimasi kode. Sebuah contoh dari optimasi kode
ekstensi PHP eAccelerator.
Pendekatan lain untuk mengurangi overhead kompilasi untuk server PHP
menggunakan opcode cache. Cache opcode bekerja dengan caching bentuk
echo $she->greet(); // prints "Hello, my name is Sally Davis."
echo '<br />';
echo $other->greet(); // prints "Hello, my name is Joe ." echo '<br />';
echo Person::staticGreet('Jane', 'Doe'); // prints "Hello, my name is Jane Doe."
overhead parsing dan mengkompilasi kode setiap kali script berjalan. Sebuah
opcode cache, APC, akan dibangun menjadi sebuah peluncuran PHP dimulai
dengan PHP 5.4.
Opcode caching dan optimasi kode dapat dikombinasikan untuk efisiensi
terbaik, karena modifikasi yang tidak bergantung satu sama lain (mereka terjadi
dalam tahap yang berbeda dari kompilasi)
Bahasa PHP pada awalnya diimplementasikan sebagai interpreter.
Beberapa kompiler telah dikembangkan yang memisahkan PHP dari bahasa
interpreter. Keuntungan kompilasi termasuk kecepatan eksekusi lebih baik,
analisis statis, dan interoperabilitas ditingkatkan dengan kode yang ditulis dalam
bahasa lain termasuk Phalanger, yang mengkompilasi PHP ke CIL byte-code, dan
HipHop, yang dikembangkan di Facebook dan sekarang tersedia sebagai. open
source, yang mengubah Script PHP ke C++, kemudian mengkompilasinya,
sehingga mengurangi beban server hingga 50%.
2.6. Database Dengan MySQL
MySQL adalah sistem manajemen database relasional (RDBMS) paling
banyak dipergunakan di dunia. MySQL berjalan sebagai server menyediakan
multi-user akses ke sejumlah database. Nama MySQL diberikan oleh Michael
Widenius. Ungkapan SQL singkatan dari Structured Query Language
(http://dev.mysql.com/doc/refman/5.1/en/what-is-mysql.html, diakses 18 Januari
2012 jam 18.20 WIB).
Proyek pembangunan MySQL telah membuat kode sumbernya tersedia
eksklusif. MySQL dimiliki dan disponsori oleh sebuah perusahaan nirlaba
tunggal, perusahaan Swedia MySQL AB, kini dimiliki oleh Oracle Corporation.
Proyek sumber bebas perangkat lunak terbuka yang memerlukan sistem
dengan fitur lengkap manajemen database sering menggunakan MySQL. Untuk
penggunaan komersial, edisi membayar beberapa yang tersedia, dan menawarkan
fungsionalitas tambahan. Aplikasi yang menggunakan database MySQL meliputi:
TYPO3, Joomla, Wordpress, phpBB, Drupal dan lainnya dibangun di atas
tumpukan perangkat lunak LAMP. MySQL juga digunakan dalam banyak profil
tinggi, skala besar produk World Wide Web, termasuk Wikipedia, Google
(meskipun tidak untuk pencarian), Facebook dan Twitter
(http://www.sun.com/aboutsun/pr/2008-02/sunflash.20080226.1.xml, diakses
pada 18 Januari 2012 jam 18.30 WIB).
Pada April 2009, MySQL mengeluarkan MySQL 5.1 yang ditawarkan
dalam dua varian yang berbeda: open source MySQL Community Server dan
Enterprise Server komersial (http://www.mysql.com/products/which-edition.html
diakses pada 18 Januari 2012 jam 18.50 WIB). Mereka memiliki basis kode yang
secara umum sama dan mencakup beberapa fitur berikut :
a. Sebuah subset yang luas dari ANSI SQL 99 sebagai ekstensi
b. Dukungan Cross-platform
c. Terdapat stored procedure, Trigger dan Cursors
d. Views yang updateable
e. informasi skema dan Strict mode
f. X / Open XA merupakan dukungan terhadap transaksi pemrosesan
g. Independent storage engines (MyISAM untuk kecepatan membaca, InnoDB
untuk transaksi dan integritas referensial, MySQL Arsip untuk menyimpan
data historis dalam ruang kecil)
h. Transaksi dengan InnoDB, dan mesin Cluster penyimpanan; savepoint dengan
InnoDB
i. Dukungan SSL dan Query caching
j. Hot backup (melalui mysqlhotcopy) dalam kondisi tertentu
Para pengembang merilis versi bulanan MySQL Server. Sumber dapat
diperoleh dari situs web MySQL atau dari repositori Bazaar MySQL, keduanya
berada di bawah lisensi GPL.
2.7. Editor Dreamweaver
Dreamweaver adalah sebuah software HTML editor profesional yang
digunakan untuk mendesain secara visual dan mengelola situs web maupun
halaman web. Bilamana kita menyukai untuk berurusan dengan kode-kode
HTML secara manual atau lebih menyukai bekerja dengan lingkungan secara
visual dalam melakukan editing, Dreamweaver membuatnya menjadi lebih
mudah dengan menyediakan tools yang sangat berguna dalam peningkatan
kemampuan dan pengalaman kita dalam mendesain web.
Dreamweaver 8 dalam hal ini digunakan untuk web desain.
Dreamweaver 8 mengikutsertakan banyak tools untuk kode-kode dalam halaman
web beserta fasilitas-fasilitasnya, antara lain : Referensi HTML, CSS dan
inspector) yang mengizinkan kita mengedit kode Javascript, XML, dan dokumen
teks lain secara langsung dalam Dreamweaver.</p>
<p style="text-align: justify;">Teknologi Dreamweaver Roundtrip
HTML mampu mengimpor dokumen HTML tanpa perlu memformat ulang kode
tersebut dan kita dapat menggunakan Dreamweaver pula untuk membersihkan
dan memformat ulang HTML bila kita menginginkannya. Selain itu
Dreamweaver juga dilengkapi kemampuan manajemen situs, yang memudahkan
kita mengelola keseluruhan elemen yang ada dalam situs. Kita juga dapat
melakukan evaluasi situs dengan melakukan pengecekan broken link,
kompatibilitas browser, maupun perkiraan waktu download halaman web.
2.8. Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS) merupakan salah satu bahasa pemrograman
web untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan
lebih terstruktur dan seragam (Riyanto, 2005).
Sama halnya styles dalam aplikasi pengolahan kata seperti Microsoft
Word yang dapat mengatur beberapa style, misalnya heading, subbab, bodytext,
footer, images, dan style lainnya untuk dapat digunakan bersama-sama dalam
beberapa berkas (file). Pada umumnya CSS dipakai untuk memformat tampilan
halaman web yang dibuat dengan bahasa HTML dan XHTML (Riyanto, 2005).
CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks,
warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over,
spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan
tampilan dokumen. Dengan adanya CSS memungkinkan kita untuk menampilkan
halaman yang sama dengan format yang berbeda (Juju, 2008).
2.9. Google Maps API
Google Maps adalah layanan gratis yang diberikan oleh Google dan
sangat popular. Google Maps adalah suatu peta dunia yang dapat kita gunakan
untuk melihat suatu daerah. Dengan kata lain, Google Maps merupakan suatu peta
yang dapat dilihat dengan menggunakan suatu browser. Kita dapat menambahkan
fitur Google Maps dalam web yang telah kita buat atau pada blog kita yang
berbayar maupun gratis sekalipun dengan Google Maps API. Google Maps API
adalah suatu library yang berbentuk JavaScript
Cara membuat Google Maps untuk ditampilkan pada suatu web atau blog
sangat mudah hanya dengan membutuhkan pengetahuan mengenai HTML serta
JavaScript, serta koneksi Internet yang sangat stabil. Dengan menggunakan
Google Maps API, kita dapat menghemat waktu dan biaya untuk membangun
aplikasi peta digital yang handal, sehingga kita dapat fokus hanya pada data-data
yang akan ditampilkan. Dengan kata lain, kita hanya membuat suatu data
sedangkan peta yang akan ditampilkan adalah milik Google sehingga kita tidak
dipusingkan dengan mambuat peta suatu lokasi, bahkan dunia.
Dalam pembutan program Google Map API menggunakan urutan
sebagai berikut : memasukkan Maps API JavaScript ke dalam HTML kita,
membuat element div dengan nama map_canvas untuk menampilkan peta,
membuat beberapa objek literal untuk menyimpan property-properti pada peta,
tag body HTML dengan event onload, pada Google Maps API terdapat 4 jenis
pilihan model peta yang disediakan oleh Google, diantaranya adalah:
a. ROADMAP, untuk menampilkan peta biasa 2 dimensi
b. SATELLITE, untuk menampilkan foto satelit
c. TERRAIN, untuk menunjukkan relief fisik permukaan bumi dan
menunjukkan seberapa tingginya suatu lokasi, contohnya akan menunjukkan
gunung dan sungai
d. HYBRID, akan menunjukkan foto satelit yang diatasnya tergambar pula apa
yang tampil pada ROADMAP (jalan dan nama kota)
Berikut ini adalah contoh penggunaan Google API untuk membatasi hasil
pencarian pada situs tertentu :
var webSearch = new google.search.WebSearch(); webSearch.setSiteRestriction('ac.id');
searchControl.addSearcher(webSearch);
searchControl.draw(document.getElementById("content")); searchControl.execute('multimedia');
}
2.10. Konsep Pengembangan Sistem
Pengembangan sistem (System development) dapat berarti menyusun
suatu sistem yang baru untuk menggantikan sistem yang lama secara keseluruhan
atau memperbaiki sistem yang telah ada. Sistem yang lama perlu diperbaiki atau
diganti disebabkan karena beberapa hal (Taufiq, 2002), yaitu sebagai berikut :
1. Adanya permasalahan-permasalahan (Problems) yang timbul di sistem yang
lama. Permasalahan yang timbul dapat berupa : ketidakberesan pada sistem
yang lama dan menyebabkan sistem yang lama tidak dapat beroperasi sesuai
dengan yang diharapkan, pertumbuhan organisasi yang menyebabkan harus
disusunnya sistem yang baru.
2. Untuk meraih kesempatan-kesempatan (Opportunisties)
3. Adanya instruksi-instruksi (Directives)
Karena adanya permasalahan, kesempatan dan instruksi, maka sistem
yang baru perlu dikembangkan untuk memecahkan permasalahan-permasalahan
yang timbul, meraih kesempatan-kesempatan yang ada atau memenuhi
instruksi-instruksi yang diberikan.
Dengan telah dikembangkannya sistem yang baru, maka diharapkan akan
terjadi peningkatan-peningkatan di sistem yang baru. Peningkatan ini
berhubungan dengan kemudahan sistem itu sendiri, diantaranya :
1. Performance (Kinerja), Kinerja dapat diukur dari Throughput dan Response
Time. Throughput adalah jumlah dari pekerjaan yang dapat dilakukan suatu
saat tertentu. Response Time adalah rata-rata waktu yang tertunda diantara dua
2. Information (Informasi), peningkatan terhadap kualitas informasi yang
disajikan.
3. Economy (Ekonomis), peningkatan terhadap manfaat-manfaat atau
keuntungan-keuntungan dan penurunan biaya yang terjadi.
4. Control (Pengendalian), peningkatan terhadap pengendalian untuk mendeteksi
dan memperbaiki kesalahan-kesalahan.
5. Efficiency (Efisisensi), peningkatan terhadap efisiensi operasi.
6. Service (Pelayanan), peningkatan terhadap pelayanan yang diberikan oleh
sistem.
2.11. Konsep Perancangan Sistem
Perancangan sistem secara umum (Taufiq, 2002) adalah suatu tahap
dimana di dalamnya terdapat identifikasi komponen-komponen sistem Informasi
yang akan dirancang secara rinci yang bertujuan untuk memberikan gambaran
kepada pengguna atau user mengenai sistem yang baru. Sedangkan desain sistem
secara terinci dimaksudkan untuk pembuat program komputer dan ahli teknik
lainnya yang akan mengimplementasikan sistem.
2.12. Pengujian Perangkat Lunak
Pentingnya pengujian perangkat lunak dan implikasinya yang mengacu
pada kualitas perangkat lunak tidak dapat terlalu ditekankan seperti yang
dikatakan “Pengembangan sistem perangkat lunak melibatkan sederatan aktivitas
produksi dimana peluang terjadinya kesalahan manusia sangat besar. Kesalahan
tidak sempurna, dan dalam desain dan tahap pengembangan selanjutnya….
Karena ketidakmampuan manusia untuk melakukan dan berkomunikasi dengan
sempurna maka pengembangan perangkat lunak diiringi dengan aktivitas
jaminan kualitas.”
Pengujian perangkat lunak adalah elemen kritis dari jaminan kualitas perangkat
lunak dan mempresentasikan kajian pokok dari spesifikasi, desain, dan
pengkodean.
(Sumber : http://ciptawahyudi.web.id/RPL/II/3.PengujianPerangkatLunak.pdf,
3.1. Desain Penelitian
Dalam melakukan penelitian salah satu hal yang penting ialah membuat
desain penelitian. Desain penelitian bagaikan sebuah peta jalan bagi peneliti yang
menuntun serta menentukan arah berlangsungnya proses penelitian secara benar
dan tepat sesuai dengan tujuan yang telah ditetapkan. Tanpa desain yang benar
seorang peneliti tidak akan dapat melakukan penelitian dengan baik karena yang
bersangkutan tidak mempunyai pedoman arah yang jelas. Sehingga dapat
dikatakan desain penelitian adalah tahapan atau gambaran yang akan dilakukan
peneliti dalam melakukan penelitian. Tahapan-tahapan desain penelitian yang
peneliti lakukan diantaranya adalah :
a. Mengumpulkan data yang diperlukan berupa textbook, paper dan referensi
lainnya yang membahas pemanfaatan Google Map.
b. Mempersiapkan alat dan bahan penelitian berupa komputer dan tools berupa
bahasa pemrograman PHP
c. Setelah disiapkan alat dan bahan penelitian, dibangun perangkat lunak dengan
metode Rapid Application Developemnt (RAD).
d. Hasil dari pembangunan perangkat lunak adalah aplikasi yang mampu
menentukan arah dan jarak tempuh untuk layanan pesan antar, serta membuat
dokumentasi hasil penelitian
Gambar dibawah ini merupakan gambar desain penelitian dari tahapan-tahapan
Gambar 3.1. Desain Penelitian Studi Literatur :
Mengumpulkan data yang diperlukan
berupa textbook, paper dan referensi
lainnya yang membahas pemanfaatan
Google Map
Mempersiapkan alat dan bahan
penelitian berupa komputer dan tools
berupa bahasa pemrograman PHP.
Membangun perangkat lunak dengan
metode Rapid Application
Developemnt (RAD).
Pengujian perangkat lunak dan
3.2. Alat Penelitian
Untuk membuat perangkat lunak, pada penelitian ini digunakan alat penelitian
berupa perangkat keras dan perangkat lunak sebagai berikut :
1. Perangkat keras yang digunakan adalah :
a. Processor Intel Mulitcore 2.4 GHz
b. Memori 1 GB
c. Harddisk minimal ruang kosong 40 GB
d. Monitor beresolusi 1280 pixels
e. Mouse dan keyboard standart
2. Perangkat lunak yang digunakan adalah sebagai berikut :
a. Sistem operasi: Microsoft Windows 7
b. Bahasa pemrograman PHP
c. Database Management System (DBMS): MySQL
d. Microsoft Office Profesional 2010
3.3. Diagram Alir Sistem
Penelitian ini membutuhkan beberapa tahap pengerjaan dimulai dari
pengumpulan referensi google map, eksplorasi peta jalan surabaya, pemahaman
bahasa pemrograman PHP, merancang perangkat lunak pemesanan dan layanan
antar serta jarak tempuh yang harus dilalui berdasarkan lokasi pelanggan.
Agar lebih dapat memahami urutan proses yang terjadi dalam aplikasi
tugas akhir ini berikut disajikan diagram alir sistem seperti yang tampak pada
Gambar 3.2. Diagram Alir Sistem START
Proses menampilkan cabang terdekat untuk melayani pesanan
Proses menampilkan cabang terdekat untuk melayani pesanan antar
Pilih Menu Admin ?
END
Operasi penambahan, penyuntingan, penghapusan dan view detail basis data setiap menu
Ya
Tidak
3.4. Perancangan Sistem
Perancangan sistem adalah suatu proses yang menggambarkan
bagaimana suatu sistem dibangun untuk memenuhi kebutuhan pada fase analisis.
Adapun tahapan yang dilakukan dalam perancangan sistem ini membahas
mengenai tujuan perancangan sistem, perancangan database dan perancangan
antar muka.
3.4.1. Tujuan Perancangan Sistem
Perancangan sistem merupakan tindak lanjut dari tahap analisa.
Perancangan sistem bertujuan untuk memberikan gambaran sistem yang akan
dibuat. Dengan kata lain perancangan sistem didefinisikan sebagai penggambaran
atau pembuatan sketsa dari beberapa elemen yang terpisah kedalam satu kesatuan
yang utuh dan berfungsi. Selain itu juga perancangan bertujuan untuk lebih
mengarahkan sistem yang terinci, yaitu pembuatan perancangan yang jelas dan
lengkap yang nantinya akan digunakan untuk pembuatan simulasi. Aplikasi
kompresi ini dibuat dengan sederhana, sehingga diharapkan user dapat dengan
mudah menggunakan aplikasi kompresi ini.
Manfaat lain yang didapat dari perancangan sistem adalah apabila dalam
proses implementasi terjadi hambatan, dapat dilakukan perancangan ulang sistem
secara lebih mudah dengan demikian pengembang dapat menghemat waktu dan
mereview kembali kelemahan dari desain sistem yang lama.
Maka dari uraian tersebut dapat disimpulkan bahwa perancangan sistem
memegang peranan cukup penting selama proses pembuatan perangkat lunak
3.4.2. Perancangan Database
Perancangan database digunakan untuk menunjukkan struktur database
berupa tabel-tabel yang dipergunakan dalam aplikasi tugas akhir ini. Berikut ini
adalah struktur tabel yang dipergunakan :
3.4.2.1. Tabel Cabang
Tabel cabang dipergunakan untuk menyimpan data cabang restoran
secara lengkap termasuk lokasi geografisnya (berupa nilai longitude dan latitude).
Berikut ini adalah struktur tabel cabang :
Tabel 3.1. Struktur Tabel Cabang
No Nama Field Tipe Keterangan
1 Id Numerik Primary Key
2 Nama_Cabang Varchar(50)
3 Alamat Varchar(100)
4 Longitude Varchar(50)
5 Latitude Varchar(50)
6 Telp Varchar(20)
3.4.2.2. Tabel Detail Pemesanan
Tabel detail pemesanan dipergunakan untuk menyimpan data detail
pemesanan yang dilakukan oleh customer, yang terkadang perlu customisasi.
Berikut ini adalah struktur tabel cabang :
Tabel 3.2. Struktur Tabel Detail Pesanan
No Nama Field Tipe Keterangan
2 Id_Makanan Numerik Primary Key
3 Jumlah Numerik
4 Id Numerik No urut pesanan
3.4.2.3. Tabel Menu
Tabel menu dipergunakan untuk menyimpan data menu yang dapat
dipesan oleh customer. Berikut ini adalah struktur tabel menu :
Tabel 3.3. Struktur Tabel Menu
No Nama Field Tipe Keterangan
1 Id_Makanan Numerik Primary Key
2 Nama_Makanan Varchar(50)
3 Harga Varchar(20)
4 Deskripsi Varchar(100)
5 Path_gambar Varchar(50)
6 Jenis Varchar(20)
3.4.2.4. Tabel Pemesanan
Tabel menu pemesanan dipergunakan untuk menyimpan data pesanan
yang dilakukan oleh customer. Berikut ini adalah struktur tabel pemesanan :
Tabel 3.4. Struktur Tabel Pemesanan
No Nama Field Tipe Keterangan
1 Id Numerik Primary Key
3 Alamat Varchar(20)
4 Telp Varchar(20)
5 Longitude Varchar(50)
6 Latitude Varchar(50)
7 Cabang_pelayan Numerik
8 Jarak Numerik
3.4.2.5. Tabel Peta
Tabel peta dipergunakan untuk menyimpan data peta lokasi tujuan
pengantaran berdasarkan pesanan customer. Berikut ini adalah struktur tabel Peta:
Tabel 3.5. Struktur Tabel Peta
No Nama Field Tipe Keterangan
1 Id Numerik Primary Key
2 Kota Enumerasi
3 Makanan Enumerasi
4 Code Enumerasi
5 Total_Harga Numerik
6 JumlahPesan Numerik
7 Alamat Varchar(45)
8 Unit_id Numerik
9 Latitude Varchar(50)
10 Longitude Varchar(50)
Keterangan :
Makanan = Enum (Mie Ayam, Pangsit Mie, Cap Jay, Bakso)
Code = Enum (Menu1, Menu2, Menu3, Menu4)
3.4.2.6. Tabel Users
Tabel users dipergunakan untuk menyimpan data user yang
mempergunakan aplikasi ini. Berikut ini adalah struktur tabel users :
Tabel 3.6. Struktur Tabel Users
No Nama Field Tipe Keterangan
1 Id Numerik Primary Key
2 Username Varchar (40)
3 Password Varchar (34)
4 Name Varchar (50)
3.4.3. Perancangan Antar Muka
Perancangan antarmuka dibutuhkan untuk mewakili keadaan sebenarnya
dari aplikasi yang akan dibangun. Berikut akan disajikan perancangan antarmuka
dari aplikasi yang akan dibangun :
Gam bar berbagai menu yang t ersedia
Gambar 3.4. Halaman Menu
Gambar 3.5. Halaman Pemesanan
Home M enu Pem esanan Pet a Cabang Adm in
Gam bar Nam a M akanan Harga Deskripsi Jenis
Home M enu Pemesanan Pet a Cabang Adm in
Gam bar Google M ap
M asukkan Alam at
Hasilnya
...
Cari Cabang Terdekat
Lanjut kan
Gambar 3.7. Halaman Peta
Gambar 3.8. Halaman Daftar Cabang
Gambar 3.9. Halaman Login Admin
Home M enu Pem esanan Peta Cabang Adm in
Gam bar Google M ap
Pet unjuk Arah Dan Lokasi Pilih Cabang
Alam at Tujuan
Jenis Kendaraan
Tam pilkan
Home M enu Pem esanan Pet a Cabang Adm in
Cabang Alam at Telp Longit ude Lat it ude
Home M enu Pem esanan Pet a Cabang Admin
User Login
UserName
Password
Gambar 3.10. Halaman Pesanan (Menu Admin)
Gambar 3.11. Halaman Makanan (Menu Admin)
NoTrans Nam a Pem esan Alam at Telp Cabang Pelayan Jarak(km ) Det ail Pesanan Kelola
Pesanan M akanan Cabang Logout (Adm in)
Gam bar Nam a M akanan Harga Deskripsi Jenis Kelola
Gambar 3.12. Halaman Cabang (Menu Admin)
Nam a Cabang Alam at Telp Longit ude Lait ude Kelola
4.1. Implementasi Program
Setelah melakukan analisa dan perancangan sistem, langkah berikutnya
adalah melakukan implementasi hasil analisa dan perancangan ke dalam bentuk
program aplikasi. Berikut ini adalah implementasinya :
4.1.1. Implementasi Database MySQL
Pembuatan database beserta tabel-tabel yang diperlukan dengan
menggunakan fasilitas yang sudah tersedia dalam lingkungan phpmyadmin.
Berikut ini adalah hasil implementasi pembuatan tabel-tabel dalam tugas akhir ini,
yaitu :
Gambar 4.1. Implementasi Tabel Cabang
Gambar 4.3. Implementasi Tabel Menu
Gambar 4.4. Implementasi Tabel Pemesanan
Gambar 4.6. Implementasi Tabel Users
4.1.2. Implementasi Script Login
<?php
if($u_submit){
if(empty($u_username)) echo alert("Masukkan username");
else if (empty($u_passwd)) echo alert("Masukkan password");
else{ $sql = "select id,username,name from users where username='$u_username' and echo alert("Invalid username or password"); } } }
?>
4.1.3. Implementasi Script Hitung Jarak
<input type="text" class="in1" name="u_username" value="<?php echo $u_username; ?>" /><br/>
Password<br/>
<input type="password" class="in1" name="u_passwd" value="" /><br/>
<input type="submit" class="btn1" name="u_submit" value="Login" /><br/>
</form>
</div> <br><br><br><br><br>
<style>
#adp-placemark img, .adp-placemark img { display:none; }
#adp-placemark { font-weight: bold;
padding: 10px 10px 10px 30px;
background: white url(img/letter_u.png) no-repeat left center; }
.adp-placemark { font-weight: bold;
padding: 10px 10px 10px 30px;
background: white url(img/restaurant.png) no-repeat left center; }
</style>
<script type="text/javascript"> var rendererOptions = {
draggable: true,
suppressInfoWindows: true, suppressMarkers:true
};
var infoWindow = new google.maps.InfoWindow; var NamaCabang;
var directionsDisplay = new
var directionsService = new google.maps.DirectionsService(); var directionsResponse;
var setCenterPeta = new google.maps.LatLng(-7.29845,112.724519);
mapTypeId: google.maps.MapTypeId.ROADMAP, center:setCenterPeta
};
map = new
google.maps.Map(document.getElementById("map"), myOptions);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById("mapin fo"));
downloadUrl("gmap_outxml.php", function(data) { var xml = data.responseXML;
var markers =
for (var i = 0; i < markers.length; i++) {
function bindInfoWindow(marker, map, infoWindow, html) { google.maps.event.addListener(marker, 'click', function() { infoWindow.setContent(html);
infoWindow.open(map, marker); }); }
function downloadUrl(url, callback) { var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest;
request.onreadystatechange = function() { if (request.readyState == 4) {
request.open('GET', url, true); request.send(null); }
function doNothing() {}
function makeDirectionMarker( position, icon, title ) { new google.maps.Marker({
position: position, map: map, icon: icon, title: title }) }; function getSelectedTravelMode() {
travelModeInput = document.getElementById("travel-mode-input");
var value =
travelModeInput.options[travelModeInput.selectedIndex].va lue; value = value.toUpperCase();
if (value == 'DRIVING') {
value = google.maps.DirectionsTravelMode.DRIVING; } else if (value == 'BICYCLING') {
value = google.maps.DirectionsTravelMode.BICYCLING; } else if (value == 'WALKING') {
value = google.maps.DirectionsTravelMode.WALKING; } else {
alert('Unsupported travel mode.');
value = google.maps.DirectionsTravelMode.DRIVING; } return value; }
function calcRoute() {
var start = document.getElementById("u_address").value; var end = document.getElementById("u_cabang").value; var provideAlternates =
document.getElementById("provide_alternates");
if (!provideAlternates) provideAlternates = false; else if (provideAlternates.checked) provideAltenates = provideAlternates.checked;
var request = { origin: start, destination: end, travelMode:
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) { directionsResponse = response;
directionsDisplay.setDirections(response); var leg = response.routes[ 0 ].legs[ 0 ]; server error. Silakan coba lagi.');
} else if (status == 'REQUEST_DENIED') {
function computeTotalDistance(result) { var total = 0;
var myroute = result.routes[0];
for (i = 0; i < myroute.legs.length; i++) { total += myroute.legs[i].distance.value; } total = total / 1000.
4.1.4. Implementasi Script Cari Lokasi
<td>Pilih Cabang :</td> <td> ?>"><?php echo $data_show['nama_cabang'] ?></option> <?php }} ?>
<td><input size="17" type="text" id="u_address" name="u_address"/><br>
<small>format: alamat[koma]kota<br>Contoh: kenjeran 122,surabaya</small>
</td> </tr>
<tr> <td>Kendaraan :</td> <td>
<div id='wselect' >
<select onchange="calcRoute();" id="travel-mode-input">
<option value="DRIVING" selected="selected">Mobil</option>
<option value="BICYCLING">Bersepeda</option> <option value="WALKING">Jalan Kaki</option> </select>
4.2. Implementasi Antar Muka
Berikut ini adalah implementasi antar muka dalam bentuk halaman web
site, dimulai dari halaman home (beranda), halaman menu, halaman pemesanan,
halaman peta, halaman cabang, dan halaman admin.
Gambar 4.7. Halaman Home (Beranda)
Gambar 4.9. Halaman Pemesanan
Gambar 4.11. Halaman Cabang
Gambar 4.13. Halaman Pesanan (Menu Admin)
Gambar 4.15. Halaman Cabang (Menu Admin)
4.3. Pengujian Sistem
Pengujian sistem merupakan proses selannjutnya setelah implementasi
perangkat lunak selesai dilakukan. Pengujian sistem yang dilakukan adalah
pengujian fungsional. Berikut ini merupakan pengujian sistem yang dilakukan.
4.3.1. Pengujian PopUp Informasi Menu
Pada pengujian ini akan dilakukan klik pada halaman daftar menu,
kemudian jika user melakukan klik pada salah satu gambar akan memunculkan
popup menu berupa status informasi gambar menu yang diklik tersebut.
Dari hasil pengujian popup informasi menu, sistem berhasil
menampilkan jendela popup, sehingga dapat dikatan fungsi popup berhasil dengan
baik pada pengujian ini.
4.3.2. Pengujian Pencarian Cabang Terdekat Berdasarkan Lokasi Pelanggan
Pada pengujian ini akan dilakukan klik pada halaman pemesanan,
kemudian jika user diminta memasukkan lokasi pelanggan, dan selanjutnya sistem
akan menampilkan lokasi cabang terdekat. Setelah itu user dapat menekan tombol
lanjutkan pemesanan. Perhatikan gambar-gambar berikut ini :
Gambar 4.18. Form Isian Data Pemesan
Gambar 4.20. Form Isian Data Pemesanan Makanan Dalam Keadaan Terisi
Gambar 4.21. Form Isian Data Pemesanan Makanan Dalam Keadaan Terisi
Dan Sudah Tersimpan Dalam Database
4.3.3. Pengujian Pencarian Rute Tempuh Berdasarkan Lokasi Pelanggan
Pada pengujian ini, user melakukan klik pada menu peta dan diminta
mengisikan alamat cabang restoran sebagai lokasi tujuan dari lokasi
keberangkatan pelanggan serta memilih jenis kendaraan yang dinaiki untuk
menuju lokasi. Berikut ini adalah gambar 4.18, yang menunjukkan rute dari jalan
mayjend Sungkono menuju jalan Wonokromo jika jenis kendaraan adalah mobil.
Gambar 4.23. Tampilan Informasi Rute Tempuh Dan Jarak Serta Waktu Yang
Dibutuhkan Dari Mayjend Sungkono Menuju Wonokromo Dengan Pilihan Jenis
Gambar 4.24. Tampilan Informasi Detail Rute Tempuh Dan Jarak Serta Waktu
Berdasarkan hasil pengujian pada menu peta, sistem berhasil
menampilkan rute yang harus ditempuh oleh pelangga jika ingin menuju lokasi
cabang resto tertentu diserta jark dan waktu yang dibutuhkan.
4.3.4. Pengujian Pada Menu Pemesanan
Pada pengujian menu pemesanan ini terdapat beberapa langkah yang harus
dilakukan oleh user. Yang pertama langkah yang harus dilakukan untuk membuka
menu pemesanan ini adalah dengan mengklik tombol Pemesanan pada toolbar
Gambar 4.25. Tampilan Pada Menu Pemesanan
Setelah klik tombol pemesanan pada tampilan home akan muncul tampilan
peta seperti gambar di atas. Tampilan peta di atas dilengkapi dengan symbol yang
berguna untuk memudahkan user untuk mengetahui titik-titik cabang pada peta di
atas. Untuk lebih jelasnya saya akan menampilkan peta beserta symbol pada
titik-titik cabang.
