perancangan sistem informasi trayek angkutan umum kota bogor

advertisement
PERANCANGAN SISTEM INFORMASI
TRAYEK ANGKUTAN UMUM KOTA BOGOR
BERBASIS WEB
Dhimas Annang Banumasetya [10104469]
Jurusan Sistem Informasi, Fakultas Ilmu Komputer
Universitas Gunadarma
[email protected]
Oktober 2008
Abstrak
Kota Bogor adalah salah satu kota di Jawa Barat yang mempunyai angkutan
umum dengan populasi yang sangat padat. Permasalahan yang perlu diperhatikan
dalam transportasi angkutan umum di kota Bogor itu adalah kebingungan
masyarakat dalam mencari jalur yang dilalui angkutan umum karena kurangnya
informasi mengenai trayek angkutan umum yang begitu banyak di kota Bogor,
khususnya bagi masyarakat yang berkunjung ke kota Bogor.
Karena pentingnya perencanaan rute/trayek dalam transportasi maka
kebutuhan akan informasi mengenai trayek angkutan umum di kota Bogor
merupakan kebutuhan yang sangat penting, salah satu caranya adalah dengan
dibuatnya sistem informasi trayek angkutan umum kota Bogor berbasis web.
Pada penulisan ini, telah dibuat suatu sistem berbasis web yang dapat
digunakan untuk memperoleh informasi dan visualisasi peta trayek angkutan umum
Kota Bogor. Adapun langkah-langkahnya antara lain pengumpulan data, pemodelan
sistem, pembuatan struktur navigasi, pembuatan rancangan tampilan website,
pembuatan peta, dan pengujian sistem. Prototipe dengan fasilitas utama
perencanaan perjalanan yang berfungsi untuk memudahkan pengguna sistem dalam
penentuan rute perjalanan menggunakan angkutan umum, disajikan dalam skripsi
ini.
Kata kunci : Peta, Sistem Informasi, Website, Trayek, Angkutan Umum, Bogor
1.
Pendahuluan
1.1 Latar Belakang Masalah
Transportasi merupakan salah
satu unsur yang terpenting di dalam
perekonomian, karena transportasi
sangat erat kaitannya dengan aktifitas
masyarakat khususnya masyarakat di
perkotaan. Tanpa adanya transportasi
maka
aktifitas
atau
kegiatan
masyarakat
menjadi
terganggu.
Angkutan umum adalah salah satu
jenis sarana transportasi yang paling
banyak digunakan oleh masyarakat
sehari - hari, karena biaya yang relatif
murah dan terjangkau oleh sebagian
besar kalangan masyarakat.
Kota Bogor adalah salah satu
kota di Jawa Barat yang mempunyai
angkutan umum dengan populasi yang
sangat padat. Permasalahan yang perlu
diperhatikan
dalam
transportasi
angkutan umum di kota Bogor itu
adalah kebingungan masyarakat dalam
mencari jalur yang dilalui angkutan
umum karena kurangnya informasi
mengenai trayek angkutan umum yang
begitu banyak di kota Bogor,
khususnya bagi masyarakat yang
berkunjung ke kota Bogor.
Karena
pentingnya
perencanaan
rute/trayek
dalam
transportasi maka kebutuhan akan
informasi mengenai trayek angkutan
umum di kota Bogor merupakan
kebutuhan yang sangat penting, salah
satu caranya adalah dengan dibuatnya
suatu sistem trayek bagi angkutan
umum di kota Bogor berbasis web.
1.2 Batasan Masalah
Pada penulisan ini, dilakukan
pembatasan masalah pada pembuatan
sistem informasi trayek angkutan
umum kota Bogor berbasis web yang
mencakup perencanaan perjalanan,
informasi rute angkutan umum, dan
visualisasi peta trayek angkutan umum
dengan tahapan pembuatan yang
meliputi
pengumpulan
data,
pemodelan sistem, pembuatan struktur
navigasi,
pembuatan
rancangan
tampilan
website,
perancangan
database, pembuatan peta, dan
pengujian sistem
1.3 Tujuan Penulisan
Tujuan penelitian ini adalah
untuk membangun suatu sistem
informasi trayek angkutan umum kota
Bogor berbasis web yang memiliki
fitur perencanaan perjalanan dan
visualisasi peta trayek dengan
menggunakan perangkat lunak PHP
dan MapServer.
1.4 Metode Penelitian
Studi
lapangan
dilakukan
dengan mewawancarai pihak DLLAJ
kota Bogor untuk mengumpulkan data
mengenai rute – rute angkutan umum
kota Bogor. Setelah pengumpulan data
lalu dilakukan perancangan dan
pembuatan sistem yang meliputi
pemodelan
sistem
dengan
menggunakan
UML,
pembuatan
database, perancangan dan pembuatan
input dan output, serta pengujian.
Semua data yang telah dikumpulkan
diolah dan dimasukkan ke dalam
program
untuk
nantinya
akan
dilakukan pengujian sistem..
2.
Landasan Teori
2.1 Sistem
Sistem berasal dari bahasa
Latin (systēma) dan bahasa Yunani
(sustēma) adalah suatu kesatuan yang
terdiri komponen atau elemen yang
dihubungkan
bersama
untuk
memudahkan aliran informasi, materi
atau energi. Istilah ini sering
dipergunakan untuk menggambarkan
suatu set entitas yang berinteraksi, di
mana suatu model matematika
seringkali bisa dibuat.
Sistem
juga
merupakan
kesatuan bagian-bagian yang saling
berhubungan yang berada dalam suatu
wilayah serta memiliki item-item
penggerak, contoh umum misalnya
seperti negara. Negara merupakan
suatu kumpulan dari beberapa elemen
kesatuan lain seperti provinsi yang
saling
berhubungan
sehingga
membentuk suatu negara dimana yang
berperan sebagai penggeraknya yaitu
rakyat yang berada dinegara tersebut.
Kata "sistem" banyak sekali digunakan
dalam percakapan sehari-hari, dalam
forum diskusi maupun dokumen
ilmiah. Kata ini digunakan untuk
banyak hal, dan pada banyak bidang
pula, sehingga maknanya menjadi
beragam. Dalam pengertian yang
paling umum, sebuah sistem adalah
sekumpulan benda yang memiliki
hubungan di antara mereka
2.2 Informasi
Informasi
adalah
hasil
pemrosesan,
manipulasi
dan
pengorganisasian/penataan
dari
sekelompok data yang mempunyai
nilai pengetahuan (knowledge) bagi
penggunanya. Namun demikian istilah
ini memiliki banyak arti bergantung
pada konteksnya, dan secara umum
berhubungan erat dengan konsep
seperti arti, pengetahuan, negentropy,
komunikasi, kebenaran, representasi,
dan rangsangan mental.
Banyak orang menggunakan
istilah "era informasi", "masyarakat
informasi," dan teknologi informasi,
dalam bidang ilmu informasi dan ilmu
komputer yang sering disorot, namun
kata "informasi" sering dipakai tanpa
pertimbangan yang cermat mengenai
berbagai arti yang dimilikinya.
2.3 Sistem Informasi
Sistem
informasi
adalah
sekumpulan komponen pembentuk
sistem yang mempunyai keterkaitan
antara
satu
komponen
dengan
komponen lainnya yang bertujuan
menghasilkan suatu informasi dalam
suatu bidang tertentu. Dalam sistem
informasi diperlukannya klasifikasi
alur informasi, hal ini disebabkan
keanekaragaman kebutuhan akan suatu
informasi oleh pengguna informasi.
Kriteria dari sistem informasi antara
lain, fleksibel, efektif dan efisien.
Sistem informasi dapat pula
didefinisikan sebagai suatu sistem di
dalam
suatu
organisasi
yang
merupakan kombinasi dari orangorang, fasilitas, teknologi, media
prosedur-prosedur dan pengendalian
yang ditujukan untuk mendapatkan
jalur komunikasi penting, memproses
tipe transaksi rutin tertentu, memberi
sinyal kepada manajemen dan yang
lainnya terhadap kejadian-kejadian
internal dan eksternal yang penting
dan
menyediakan
suatu
dasar
informasi
untuk
pengambilan
keputusan.
Informasi dalam suatu lingkungan
sistem informasi harus mempunyai
persyaratan umum sebagai berikut :
 arus diketahui oleh penerima
sebagai referensi yang tepat.
 Harus sesuai dengan kebutuhan
yang ada dalam proses
pembuatan / pengambilan
keputusan.
 Harus
mempunyai
nilai
surprise, yaitu hal yang sudah
diketahui hendaknya jangan
diberikan.
 Harus dapat menuntun pemakai
untuk membuat keputusan.
Suatu keputusan tidak selalu
menuntut adanya tindakan.
Sistem informasi harus mempunyai
beberapa sifat seperti :
 Pemrosesan informasi yang
efektif. Hal ini berhubungan
dengan pengujian terhadap data
yang
masuk,
pemakaian
perangkat keras dan perangkat
lunak yang sesuai.
 Manajemen informasi yang
efektif. Dengan kata lain,
operasi manajemen, keamanan
dan keutuhan data yang ada
harus diperhatikan.
 Keluwesan. Sistem informasi
hendaknya cukup luwes untuk
menangani
suatu
macam
operasi.
Kepuasan pemakai. Hal yang paling
penting adalah pemakai mengetahui
dan puas terhadap sistem informasi.
2.4 Situs Web/Website
Sebuah situs web / website
adalah sebutan bagi sekelompok
halaman web (web page), yang
umumnya merupakan bagian dari
suatu nama domain (domain name)
atau subdomain di World Wide Web
(WWW) di Internet. WWW terdiri dari
seluruh situs web yang tersedia kepada
publik. Halaman-halaman sebuah situs
web diakses dari sebuah URL yang
menjadi "akar" (root), yang disebut
homepage (halaman induk; sering
diterjemahkan menjadi "beranda",
"halaman muka"), dan biasanya
disimpan dalam server yang sama.
Tidak semua situs web dapat diakses
dengan gratis. Beberapa situs web
memerlukan pembayaran agar dapat
menjadi pelanggan, misalnya situssitus yang menampilkan pornografi,
situs-situs berita, layanan surat
elektronik (e-mail), dan lain-lain.
Halaman-halaman dari website
akan bisa diakses melalui sebuah URL
yang biasa disebut Homepage. URL
ini mengatur halaman-halaman situs
untuk
menjadi
sebuah
hirarki,
meskipun, hyperlink-hyperlink yang
ada di halaman tersebut mengatur para
pembaca dan memberitahu mereka
sususan keseluruhan dan bagaimana
arus informasi ini berjalan.
Beberapa
website
membutuhkan
subskripsi
(data
masukan) agar para user bisa
mengakses sebagian atau keseluruhan
isi website tersebut. Contohnya, ada
beberapa situs-situs bisnis, situs-situs
e-mail gratisan, yang membutuhkan
subkripsi agar kita bisa mengakses
situs tersebut.
Sebuah website bisa berupa
hasil kerja dari perorangan atau
individu,
atau
menunjukkan
kepemilikan dari sebuah organisasi,
perusahaan, dan biasanya website itu
menujukkan beberapa topik khusus,
atau kepentingan tertentu. Sebuah
website bisa berisi hyperlink yang
menghubungkan ke website lain, jadi,
kadangkala perbedaan antara website
yang
dibuat
oleh
individu
perseorangan dengan website yang
dibuat oleh organisasi bisnis bisa saja
tidak kentara.
Website ditulis, atau secara
dinamik di konversi menjadi HTML
dan diakses melalui sebuah program
software yang biasa disebut dengan
web browser, yang dikenal juga
dengan HTTP Client. Halaman web
dapat dilihat atau diakses melalui
jaringan komputer dan internet,
perangkatnya bisa saja berupa
Personal Computer, Laptop Computer,
PDA ataupun Cellphone.
Sebuah website dibuat didalam
sebuah sistem komputer yang dikenal
dengan Web Server, juga disebut
HTTP Server, dan pengertian ini juga
bisa menunjuk pada software yang
dipakai untuk menjalankan sistem ini,
yang kemudian menerima lalu
mengirimkan halaman-halaman yang
diperlukan untuk merespon permintaan
dari user. Apache adalah bahasa
program/software
yang
biasa
digunakan didalam sebuah webserver,
kemudian setelah itu adalah Microsoft
Internet Information Server (IIS).
Sebuah Website statik, adalah
salah satu bentuk website yang isi
didalam website tersebut tidak
dimaksudkan untuk di-update secara
berkala, dan biasanya di-maintain
secara manual oleh beberapa orang
yang menggunakan software editor.
Ada 3 tipe kategori software editor
yang biasa dipakai untuk tujuan
maintaining ini, mereka adalah :
- Elemen 1 Text Editor. Contohnya
adalah Notepad atau TextEdit, dimana
HTML diubah didalam program editor
tersebut.
- Elemen 2 WYSIWYG editor.
Contohnya Microsoft Frontpage dan
Macromedia Dreamweaver, dimana
situs di edit menggunakan GUI
(Graphical User Interface) dan format
HTML ini secara otomatis di generate
oleh editor ini.
- Elemen 3 Editor yang sudah
memiliki
template,
contohnya
Rapidweaver dan iWeb, dimana, editor
ini membolehkan user untuk membuat
dan
meng-update
website-nya
langsung ke web server secara cepat,
tanpa harus mengetahui apapun
tentang HTML. Mereka dapat memilih
template yang sesuai dengan keinginan
mereka, menambah gambar atau
obyek, mengisinya dengan tulisan, dan
dengan sekejap mereka sudah dapat
membuat website tanpa harus melihat
sama sekali kode-kode HTML.
Sebuah website dynamic adalah
website yang secara berkala, informasi
didalamnya berubah, atau website ini
bisa berhubungan dengan user dengan
berbagai macam cara atau metode
(HTTP
cookies
atau
Variabel
Database, sejarah kunjungan, variabel
sesi dan lain-lain) bisa juga dengan
cara interaksi langsung menggunakan
form dan pergerakan mouse. Ketika
web server menerima permintaan dari
user untuk memberikan halaman
tertentu, maka halaman tersebut akan
secara otomatis diambil dari media
penyimpanan sebagai respon dari
permintaan yang diminta oleh user.
Sebuah situs dapat menampilkan
dialog yang sedang berlangsung
diantara
dua
user,
memantau
perubahan situasi, atau menyediakan
informasi yang berkaitan dengan sang
user.
Ada banyak jenis sistem
software yang dapat dipakai untuk
meng-generate Dynamic Web System
dan
Situs
Dynamic,
beberapa
diantaranya
adalah
ColdFusion
(CFM), Active Server Pages (ASP),
Java Server Pages (JSP) dan PHP,
bahasa program yang mampu untuk
meng-generate Dynamic Web System
dan Situs Dinamis. Situs juga bisa
termasuk didalamnya berisi informasi
yang diambil dari satu atau lebih
database atau bisa juga menggunakan
teknologi berbasis XML, contohnya
adalah RSS. Isi situs yang statis juga
secara periodik di-generate, atau,
apabila ada keadaan dimana dia butuh
untuk dikembalikan kepada keadaan
semula, maka dia akan di-generate, hal
ini untuk menghindari kinerjanya
supaya tetap terjaga.
Seperti yang tertulis di atas, di
luar sana ada beberapa perbedaan
dalam penulisan dari terminologi
website. Walaupun ¨Website¨ sudah
secara umum dipakai, namun untuk
Associated Press Stylebook, Reuters,
Microsoft, academia, dan kamuskamus yang ada, penulisan yang
mereka
pakai
adalah
dengan
menggunakan 2 kata, yaitu Web site.
Hal ini karena ¨Web¨ bukanlah
terminilogi umum, namun ia adalah
kependekan dari World Wide Web.
2.5 Pengertian Internet
Banyak sebutan yang diberikan
oleh para pengguna tentang pengertian
dari Internet antara lain cyber, e-world,
dunia maya dan sebagainya. Namun
semua itu hanyalah istilah dan
sebenarnya tidak ada definisi khusus
mengenai Internet, atau kepanjangan
dari kata Internet.
Sebagai gambaran umum,
Internet
adalah
suatu
jaringan
komputer global yang terbentuk dari
jaringan – jaringan lokal dan regional,
dan memungkinkan komunikasi data
antar komputer – komputer yang
terhubung ke jaringan tersebut dengan
menggunakan jaringan komunikasi
yang ada di seluruh dunia. Selain itu
Internet dapat juga diartikan sebagai
seluruh manusia yang secara aktif
berpartisipasi
sehingga
membuat
Internet
menjadi
sumber
daya
informasi yang sangat berharga.
2.6 Web Browser
Dikenal juga dengan istilah
browser, atau peselancar, atau internet
browser. Adalah suatu program
komputer yang menyediakan fasilitas
untuk membaca halaman web di suatu
komputer. Dua program web browser
yang cukup populer saat ini adalah
Microsoft Internet Explorer, Mozilla
Firefox dan Netscape Navigator.
Program browser pertama adalah
Mosaic, yang merupakan suatu text
browser, yang sekarang web browser
telah berkembang ke dalam bentuk
multimedia.
2.7 UML
Unified Modeling Language
(UML) adalah bahasa spesifikasi
standar untuk mendokumentasikan,
menspesifikasikan, dan membangun
sistem perangkat lunak. UML tidak
berdasarkan
pada
bahasa
pemrograman
tertentu.
Standar
spesifikasi UML dijadikan standar
defacto
oleh
OMG
(Object
Management Group) pada tahun
1997.UML
yang
berorientasikan
object mempunyai beberapa notasi
standar.
Spesifikasi ini menjadi populer
dan standar karena sebelum adanya
UML, telah ada berbagai macam
spesifikasi yang berbeda. Hal ini
menyulitkan
komunikasi
antar
pengembang perangkat lunak. Untuk
itu beberapa pengembang spesifikasi
yang sangat berpengaruh berkumpul
untuk membuat standar baru. UML
dirintis oleh Grady Booch, James
Rumbaugh pada tahun 1994 dan
kemudian Ivar Jacobson.
UML mendeskripsikan OOP
(Object
Oriented
Programming)
dengan beberapa diagram, diantaranya:
Diagram struktur:
– Diagram kelas.
– Diagram obyek.
– Diagram komponen.
– Diagram deployment.
Diagram perilaku:
– Diagram use-case.
– Diagram urutan/sekuen.
– Diagram kolaborasi.
– Diagram statechart.
– Diagram aktivitas.
“bagaimana”.
Sebuah
merepresentasikan sebuah
antara aktor dengan sistem.
use-case
interaksi
2.7.1.2 Diagram Aktifitas
Diagram ini menggambarkan
berbagai alir aktivitas dalam sistem
yang sedang dirancang, bagaimana
masing-masing alir berawal, decision
yang mungkin terjadi, dan bagaimana
mereka berakhir. Diagram aktivitas
juga dapat menggambarkan proses
paralel yang mungkin terjadi pada
beberapa eksekusi.
2.7.1 Penjelasan Diagram
2.7.1.3 Diagram Sekuen
Diagram
sekuen
menggambarkan interaksi antar objek
di dalam dan di sekitar sistem
(termasuk pengguna, display, dan
sebagainya) berupa message yang
digambarkan terhadap waktu. Diagram
ini terdiri dari dimensi vertikal (waktu)
dan dimensi horizontal (objek-objek
yang terkait).
Diagram sekuen biasa digunakan
untuk menggambarkan skenario atau
rangkaian
langkah-langkah
yang
dilakukan sebagai respon dari sebuah
event untuk menghasilkan output
tertentu. Diawali dari apa yang mentrigger aktivitas tersebut, proses dan
perubahan apa saja yang terjadi secara
internal dan output apa yang
dihasilkan.
2.7.1.1 Diagram Use-Case
Diagram
use-case
menggambarkan fungsionalitas yang
diharapkan dari sebuah sistem. Yang
ditekankan dalam hal ini adalah “apa”
yang diperbuat sistem, dan bukan
2.8 Struktur Navigasi
Struktur
navigasi
adalah
struktur alur cerita dari sebuah
program.
Sebelum
menyatukan
elemen-elemen yang digunakan dalam
aplikasi multimedia, sebaiknya kita
mendefinisikan obyek-obyek dan
merancang tampilan. Agar semua
obyek yang termasuk di dalam aplikasi
tersebut tidak mengalami kerancuan
informasi, dengan kata lain semua
tampilan harus dapat memberikan
informasi yang bulat dan utuh,
sehingga
dapat
tercapai
suatu
pembentukan aplikasi multimedia.
Dalam pembuatan aplikasi multimedia
ada empat macam struktur navigasi
yang biasa digunakan. Yaitu struktur
navigasi Linier, Hirarki, Non Linier
dan stuktur navigasi Komposit
(campuran).
2.8.1 Navigasi Linier
Struktur navigasi linier (satu
alur) merupakan struktur yang hanya
mempunyai satu rangkaian cerita yang
berurut. Struktur ini menampilkan satu
demi satu tampilan layar secara
berurut menurut urutannya. Dalam
struktur ini tidak diperkenankan
adanya percabangan.
Gambar 2.2 Navigasi Hierarki
2.8.3 Navigasi Non Linier
Struktur
navigasi
ini
merupakan
pengembangan
dari
struktur navigasi linier. Pada struktur
ini dimungkinkan adanya percabangan.
Percabangan yang dibuat pada struktur
non linier ini berbeda dengan
percabangan pada struktur hirarki,
karena tiap-tiap tampilan mempunyai
kedudukan yang sama, yaitu tidak
adanya menu utama dan halaman
pendukung.
Gambar 2.3 Navigasi Non Linier
Gambar 2.1 Navigasi Linier
2.8.2 Navigasi Hirarki
Struktur
navigasi
hirarki
(bercabang), merupakan suatu struktur
yang mengandalkan percabangan
untuk data atau gambar pada layar
dengan criteria tertentu. Tampilan
pada menu utama disebut master page.
Menu utama ini memiliki percabangan
yang dinamakan halaman pendukung
(slave page).
2.8.4 Navigasi Komposit
Navigasi komposit (campuran)
merupakan gabungan dari ketiga
struktur sebelumnya, yaitu struktur
navigasi linier, struktur navigasi
hirarki dan struktur navigasi non linier.
Struktur navigasi ini disebut juga
dengan struktur navigasi bebas. Jika
suatu
tampilan
memerlukan
percabangan, maka dapat dibuat
percabangan. Bila dalam percabangan
tersebut terdapat suatu tampilan yang
sama kedudukannya, maka dapat
dibuat suatu struktur linier dalam
percabangan tersebut.
membuat sebuah HTML biasa, hanya
saja ditambahkan dengan kode-kode
program yang diapit dalam tanda
<?....?>. Tipe data dasar pada PHP
antara lain: Integer (bilangan bulat),
Bilangan floating point, Boolean, Null,
String, Array, Object, Resource.
Gambar 2.4 Navigasi Komposit
2.9 PHP
PHP dikenal sebagai sebuah
bahasa scripting yang menyatu dengan
tag-tag HTML, dieksekusi di server,
dan digunakan untuk membuat
halaman Web yang dinamis seperti
halnya Active Server Pages (ASP) atau
Java Server Pages (JSP). PHP
merupakan script untuk script
pemrograman
web
server-side.
Dengan menggunakan PHP maka
maintenance dari suatu situs web
menjadi lebih mudah. Proses update
data
dapat
dilakukan
dengan
menggunakan aplikasi yang dibuat
dengan menggunakan script PHP. PHP
atau FI merupakan nama awal dari
PHP. PHP-Personal Home Page, FI
adalah Form Interface. Dibuat pertama
kali oleh Rasmus Lerdoff. PHP
awalnya merupakan program CGI
yang dikhususkan untuk menerima
input melalui form yang ditampilkan
dalam web browser. PHP secara resmi
merupakan
kependekkan
dari
PHP:Hypertext
Preprocessor,
merupakan bahasa script server-side
yang
disisipkan
pada
HTML(embedded script). Konsep PHP
sangat sederhana, bahkan lebih
sederhana dari CGI. Sehingga dalam
membuat dokumen PHP, cukup
Permintaan
HTTP
Gambar 2.5 Skema PHP
2.9.1 Skrip PHP
Kode program PHP menyatu
dengan tag-tag HTML dalam satu file.
File yang berisi tag HTML dan kode
PHP ini diberi ekstensi php atau
ekstensi lainnya yang ditetapkan pada
Apache atau Web Server. Berikut ini
adalah contoh sederhana dari struktur
program PHP :
//contoh.php
<html>
<head>
<title>Program
PHP</title>
</head>
<body>
<?
echo"Mari
belajar
bersama";
?>
</body>
</html>
Maka outputnya :
PHP
Gambar 2.6 Tampilan Kode PHP Pada
Browser
2.10
Database
Suatu database didefinisikan
sebagai kumpulan data yang disatukan
dalam suatu organisasi, sehingga dapat
memenuhi kebutuhan organisasi. Pada
database yang terdesain dengan baik,
data redundant dapat dieliminasi dan
penyimpanan
data
yang
tidak
konsisten dapat diperkecil.
2.10.1 Menggunakan Database
World
Wide
Web
pada
dasarnya adalah sebuah wadah untuk
saling bertukar informasi. Jika
memiliki informasi dan ingin agar
orang lain di seluruh dunia juga
mengetahui informasi tersebut, dapat
dibuat sebuah situs di Internet. Jika
jumlah informasinya banyak, maka
perlu
pengorganisasian
agar
pengunjung situs dapat mencari
informasi dengan mudah. Untuk
keperluan itulah dibutuhkan sebuah
aplikasi database pada situs yang
akan dibuat. Secara umum akses ke
database melalui tiga tahapan, yaitu :
performansi query dari databasenya
yang sangat cepat dan jarang
bermasalah. Saat ini, MySQL telah
tersedia juga dalam lingkungan
Windows, MySQL di lingkungan
Windows diletakan pada direktori
c:\mysql\bin adalah direktori yang
berisi daftar modul executable dari
MySQL.
Untuk mengaktifkan MySQL
di lingkungan Windows maka harus
dijalankan server MySQL. Bahasa
yang digunakan pada database yaitu :
1. DDL ( Data Definition
Language) yaitu : create table,
alter table, dan drop table.
2. DML ( Data Manipulation
Language ) yaitu : select,
insert, update, delete.
2.11.1 Membuat Database
Untuk masuk ke dalam
program MySQL pada prompt, dapat
dijalankan perintah berikut ini:
C:\> MYSQL (Enter)
Kemudian akan masuk kedalam
MySQL seperti tampilan dibawah ini:
1. Koneksi ke database
2. Query permintaan data
3. Pemutusan koneksi
2.11
MySQL
MySQL merupakan aplikasi
database yang termasuk paling
populer dalam lingkungan Linux,
kepopuleran ini ditunjang karena
Gambar 2.7 Tampilan MySQL
Cara untuk membuat sebuah
database baru adalah dengan perintah:
create database namadatabase;
Perintah untuk membuat tabel baru
adalah:
create table nama_tabel
(
struktur
);
2.11.2 Menghubungkan PHP dan
MySQL
Agar script PHP yang kita buat
dapat berhubungan dengan database
dari MySQL dapat menggunakan
fungsi berikut ini:
membuat Peta Digital menjadi lebih
mudah dan interaktif. Interaktif peta
disini diartikan bahwa pengguna dapat
dengan mudah melihat dan mengubah
tampilan peta seperti zoom, rotate, dan
menampilkan
informasi
(seperti
menampilkan info jalan) dan analisis (
seperti menentukan rute perjalanan)
pada permukaan geografi. Diagram
berikut menggambarkan bagaimana
user berinteraksi dengan peta interaktif
berbasis MapServer.
File utama.php:
<?php
function open_connection()
{
$host=”localhost”;
$username=”root”;
$password=””;
$databasename=”privatdb”;
$link=mysql_connect($host,$u
sername,$password)
or
die
("Database tidak dapat
dihubungkan!");
mysql_select_db($databasenam
e,$link);
return $link;
}
?>
Isi dari variabel $host, $username,
$password dan $databasename dapat
disesuaikan sesuai dengan setting pada
MySQL server yang ada.
2.12
MapServer
MapServer adalah aplikasi
Open Source yang memungkinkan
sebuah data peta diakses melalui web.
Teknologi
ini
pertama
kali
dikembangkan
oleh
Universitas
Minesotta Amerika Serikat. Hadirnya
MapServer menjadikan pekerjaan
Gambar 2.8 Diagram Peta Digital
Berinteraksi Dengan User
[Sumber Gambar : Denny Charter. Cara
Kerja MapServer. Mei 2008]
2.12.1 Bagaimana
Bekerja
MapServer
MapServer bekerja secara
berdampingan dengan aplikasi web
server. Web Server menerima request
peta melalui MapServer. MapServer
meng-generate request terhadap peta
dan mengirimkannya ke web server
seperti pada gambar berikut.
melakukan request/perminataan maka
CGI akan mengakses file peta,
menggambarkan
informasi
yang
didapat dari sumber data dan kembali
menampilkannya pada peta.
Gambar 2.9 Diagram Operasi Standar Pada
MapServer
[Sumber Gambar : Denny Charter. Cara Kerja
MapServer. Mei 2008]
Gambar 2.10 Komponen Utama MapServer
Fungsi utama dari MapServer
adalah melakukan pembacaan data dari
banyak sumber dan menempatkannya
kedalam layer-layer secara bersamaan
menjadi file graphic. Salah satu
layernya bisa saja berupa gambar
satelit. Setiap layer saling overlay satu
dengan lainnya dan ditampilkan
kedalam web browser.
2.12.2 Komponen-komponen Utama
Mapserver
menghasilkan
keluaran
berupa
file
graphic
berdasarkan masukan yang diberikan
oleh user. Komponen kuncinya adalah
MapServer executable yang terdiri dari
CGI program, file peta, sumber data
dan output gambar. Seperti pada
gambar dibawah ini semua komponen
bekerja bersama-sama, setelah user
[Sumber Gambar : Denny Charter. Cara
Kerja MapServer. Mei 2008]
2.12.3 Mapserver Executable
Secara sederhana MapServer
menjalankan executable applikasi CGI
pada web server yang secara teknis
merupakan proses stateless berbasis
pada HTTP. Stateless adalah sebuah
proses permintaan yang dilanjutkan
dengan stop running. Aplikasi CGI
menerima permintaan dari web server,
kemudian proses dilakukan dan
mengembalikan respon atau data ke
web server. CGI bekerja sangat
sederhana tidak diperlukan sebuah
pemrograman
untuk
dapat
menggunakannya.
Kita
tinggal
melakukan edit berdasarkan text base,
konfigurasi runtime file, membuat
halaman web, dan menempatkannya
bekerja pada web server. MapServer
CGI executable bekerja sebagai
perantara antara file peta dengan
program web server yang meminta
peta. Permintaan di lewatkan dalam
bentuk CGI parameter dari web server
menuju MapServer. Gambar yang di
buat oleh MapServer selanjutnya
memberikan feed back ke web server
dan selanjutnya menuju user melalui
web browser.
2.12.4 MapServer Map File
MapServer seperti sebuah
mesin yang membutuhkan bahan bakar
untuk dapat bekerja dan membutuhkan
system pengiriman (delivery system)
bahan bakar untuk mencapai mesin .
Program MapServer perlu mengetahui
layer peta yang akan digambar,
bagaimana menggambarkannya, dan
dimana lokasi sumber datanya. Data
merupakan bahan bakarnya dan file
peta atau .map.file merupakan system
pengirimannya (delivery system). File
Peta adalah text konfigurasi yang
terdiri dari list setting yang digunakan
untuk menggambar dan berinteraksi
dengan peta. Informasi yang termuat
didalamnya adalah layer data apa yang
akan
digambar,
dimana
fokus
geografis petanya, system proyeksi
yang digunakan, format apa yang akan
digunakan
untuk
menampilkan
gambar, dan cara menentukan legenda
dan skala pada peta.
Contoh script dasar pemetaan dengan
satu layer.
MAP
SIZE 600 300
EXTENT -180 -90 180 90
LAYER
NAME countries
TYPE POLYGON
STATUS DEFAULT
DATA countries.shp
CLASS
OUTLINECOLOR 100 100 100
END
END
END
Ketika request atau permintaan
dating dari aplikasi MapServer maka
request tersebut mesti menyebutkan
sepesifikasi file peta yang diinginkan.
Kemudian
MapServer
membuat
petanya berdasarkan pada setting pada
file peta yang diberikan tadi. [7]
2.12.5 PHP/Mapscript
PHP/Mapscript memungkinkan
kita untuk melakukan akses terhadap
Mapscript
API
(Application
Programing Interface) dari lingkungan
PHP, dengan menggunakan berbagai
kelas (class) PHP.
Untuk menguji PHP/Mapscript,
digunakan skrip berikut :
<?php
?>
Echo ms_getVersion();
2.12.5.1 OOP Pada PHP/Mapscript
Modul PHP/Mapscript disusun
menggunakan
pendekatan
pemrograman
berorientasi
objek
(Object Oriented Programming, atau
biasa
disingkat
OOP).
Untuk
melakukan koneksi berupa penampilan
peta pada PHP/Mapserver, digunakan
skrip berikut :
<?
$oMap
=
ms_newMapObj(“…/map/latihan01.m
ap”);
$oImg = $oMap ->draw( );
$url
=
$0Img
>saveWebImage(MS_PG, 0, 0, -1);
?>
<img src =<?php echo $url ?> >
</img>
Fungsi
ms_newMapObj
digunakan untuk menginisiasi objek
MapObj, dengan parameter file *.map
yakni file latihan01.map (“…”
merupakan
direktori
tempat
menginstal MapServer). Kembalian
fungsi ini disimpan pada variabel
$oMap. Fungsi draw digunakan
sebagai method untuk menghasilkan
objek
ImageObj
dan
fungsi
saveWebImage
digunakan
untuk
menyimpan gambar dari objek
ImageObj ke file temporer.
2.13 Apache HTTP Server
Server HTTP Apache atau
Server Web/WWW Apache adalah
server web yang dapat dijalankan di
banyak sistem operasi (Unix, BSD,
Linux, Microsoft Windows dan Novell
Netware serta platform lainnya) yang
berguna
untuk
melayani
dan
memfungsikan situs web. Protokol
yang digunakan untuk melayani
fasilitas web/www ini mengunakan
HTTP.
Apache memiliki fitur-fitur
canggih seperti pesan kesalahan yang
dapat dikonfigur, autentikasi berbasis
basis data dan lain-lain. Apache juga
didukung oleh sejumlah antarmuka
pengguna berbasis grafik (GUI) yang
memungkinkan penanganan server
menjadi mudah.
Apache merupakan perangkat
lunak sumber terbuka dikembangkan
oleh komunitas terbuka yang terdiri
dari
pengembang-pengembang
dibawah naungan Apache Software
Foundation.
3.
Perancangan dan Pembuatan
3.1
Pendahuluan
Angkutan umum merupakan
salah satu media transportasi yang
digunakan masyarakat secara bersamasama dengan membayar tarif sesuai
dengan ketentuan yang berlaku. Dalam
penelitian ini, telah didapatkan data
trayek angkutan umum kota Bogor
berupa informasi trayek beserta
tarifnya.
Setelah seluruh data diperoleh,
maka langkah selanjutnya adalah
melakukan
perancangan
untuk
pembuatan sistem informasi berbasis
web yang lebih rincinya akan
dijelaskan
pada
pembahasan
selanjutnya.
3.2
Data
Trayek
Angkutan
Umum
Pengumpulan data dilakukan
melalui wawancara kepada pihak
DLLAJ
kota
Bogor.
Setelah
melakukan pengumpulan data maka
hasil yang diperoleh yaitu data tentang
nama – nama jalan yang dilalui oleh
angkutan umum , nomor trayek
angkutan umum, serta tarif angkutan
umum. Tahap selanjutnya yaitu
mengolah data – data tersebut untuk
dikelompokkan ke dalam sebuah tabel.
Setelah mengelompokkan data – data
tersebut maka langkah selanjutnya
adalah menentukan hubungan data –
data
yang bersangkutan untuk
digunakan pada saat perancangan dan
pembuatan sistem.
Perancangan Sistem
Untuk membuat sebuah sistem
berbasis web yang stabil, handal, dan
dapat dipergunakan dengan baik maka
dibuat perancangan sistem tersebut
terlebih dahulu. Perancangan sistem
ini dibuat menggunakan UML, adapun
urutan perancangan untuk diagramdiagram tersebut adalah :
m em buka website
m em ilih m enu website
user
m elakukan perencanaan tray ek
<<include>>
m em peroleh inform asi
<<include>>
m elihat peta tray ek
<<include>>
3.3
peta tray ek
adm in
login
<<include>>
m engelola data
Gambar 3.2 Diagram Use Case
3.3.2 Diagram Aktifitas
user
3.3.1 Diagram Use-case
Dalam sistem ini tedapat dua
aktor yang terlibat yaitu user dan
admin, seperti terlihat pada Gambar
3.1 di bawah ini :
membuka website
aplikasi
menampilkan halaman utama
menampilkan menu website
memilih menu website
menampilkan halaman menu website
melakukan perencanaan trayek
pemrosesan inputan perencanaan
memperoleh informasi
user
admin
melihat peta trayek
validasi peta
peta trayek
Gambar 3.1 Aktor
Adapun diagram use-case
dalam sistem ini adalah seperti pada
gambar berikut ini :
Gambar 3.3 Diagram Aktifitas User
halaman menu website
halaman utama
halaman perencanaan
halaman lihat peta
halaman hasil lihat peta
: user
1 : membuka web()
2 : pilih menu website()
admin
3 : tampilkan menu website()
aplikasi
4 : lakukan perencanaan()
5 : tampilkan halaman perencanaan()
login
menampilkan halaman pengolahan data
6 : tampilkan link lihat peta()
7 : tampilkan halaman link lihat peta()
menampilkan form - form inputan data
input data
8 : klik link lihat peta()
pemrosesan inputan data
9 : validasi peta()
10 : tampilkan hasil peta()
memperoleh informasi berupa view data
Gambar 3.4 Diagram Aktifitas Admin
3.3.3 Diagram Sekuen
Diagram
ini
menjelaskan
urutan – urutan aktifitas yang
dilakukan user dan admin dalam
menjalankan sistem, mulai dari
aktifitas awal membuka halaman
website
hingga
aktifitas
akhir
mendapatkan visualisasi peta.
Untuk dimensi secara vertical
merupakan urutan waktu yang terjadi
dalam sistem, sedangkan untuk
dimensi horizontal menjelaskan objek
– objek terkait yang dipilih user dalam
menjalankan sistem.
Gambar 3.5 Diagram Sekuen User
halaman login
halamanpenginputandata
halamanviewdata
halamanutama website
: admin
1 : membuka website melakukanlogin()
2 : tampilkanloginform()
3 : kliklogout()
4 : memasukkandata - data()
6: kliklogout()
5 : tampilkanforminputan()
7 : klikviewdata()
8 : tampilkanviewdata berupa tabel()
9 : tampilkanhalamanutama website()
Gambar 3.6 Diagram Sekuen Admin
3.4
Perancangan Website
3.4.1 Perancangan
Struktur
Navigasi
Pembuatan struktur navigasi
digunakan untuk mempermudah para
pengunjung website ini dalam hal
pencarian informasi. Dalam sistem ini
terdiri dari dua buah navigasi yaitu
untuk user dan admin seperti terlihat
pada Gambar 3.7 dan Gambar 3.8
berikut :
struktur navigasi admin. Untuk
mengetahui hubungan keterkaitan
keseluruhan antar menu dan link yang
ada dapat dilihat pada Gambar 3.7 dan
Gambar 3.8 di atas.
Gambar 3.7 Struktur Navigasi User
3.4.2 Perancangan
Tampilan
Website
Setelah
selesai
dengan
penggambaran
navigasi,
maka
berikutnya adalah bagian perancangan
tampilan. Perancangan tampilan ini
digunakan untuk memberi kemudahan
dalam pembuatan sistem yang akan
dijelaskan
pada
pembahasan
berikutnya.
3.4.2.1
Perancangan Tampilan
Halaman Utama
Gambar 3.8 Struktur Navigasi User
Bentuk navigasi yang dipakai
adalah navigasi campuran, karena user
atau admin dapat melakukan semua
aktifitas yang diinginkan dalam satu
halaman web. Pada struktur navigasi
user diatas dapat dijelaskan bahwa
user pertama kali akan masuk ke
halaman Home, dimana pada halaman
tersebut merupakan halaman utama
website. Pada halaman tersebut
terdapat menu dan link yang
menghubungkan ke halaman atau
bagian – bagian yang dituju dari link
tersebut, diantaranya About Us, Info,
dan Planner yang lebih rincinya akan
dijelaskan
pada
pembahasan
selanjutnya, begitu pula dengan
Gambar 3.9 Rancangan Halaman Utama
3.4.2.2 Perancangan
About Us
Halaman
Gambar 3.10 Rancangan Halaman About Us
3.4.2.3 Perancangan Halaman Info
Gambar 3.12 Rancangan Halaman Peta
3.4.2.5
Perancangan
Login Admin
Halaman
Gambar 3.11 Rancangan Halaman Info
3.4.2.4 Perancangan Halaman Peta
Halaman peta adalah sebuah
halaman website yang akan muncul
apabila user menekan button proses
dengan ketentuan opsi yang benar dan
akan ditampilkan melalui sebuah Link
“Lihat Peta” untuk menuju ke halaman
peta. Link ini tidak akan muncul
apabila
user
salah
melakukan
penginputan opsi pada journey
planner.
Gambar 3.13 Rancangan Halaman Login
Admin
Halaman ini akan muncul
apabila admin ingin melakukan
pengolahan data
terhadap sistem sesuai dengan data
yang diperoleh.
3.4.2.6
Perancangan
Inputan Data
Halaman
HALAMAN INPUTAN
Input trayek View trayek Logout
INPUT TRAYEK
INPUT NAMA JALAN
Tempat Awal
input1
Kode Jalan
Tempat Akhir
input2
Nama Jalan
Angkot
input3
Keterangan
input4
Tarif
Map
input7
kode harus diisi sebanyak 3 karakter
input8
Simpan
input5
input6
Browse
Simpan
Reset
Gambar 3.14 Rancangan Halaman Input Data
Gambar 3.15 Rancangan Halaman View Data
3.4.2.8 Perancangan Halaman Edit
Trayek
Halaman ini adalah halaman
yang
digunakan
admin
untuk
memasukkan data – data nama jalan
beserta trayek angkutan umumnya,
serta biaya sesuai dengan data asli
yang didapatkan dari DLLAJ kota
Bogor.
3.4.2.7 Perancangan Halaman View
Data
Halaman ini digunakan untuk
melihat data apa saja yang ada pada
website berdasarkan inputan yang
dilakukan oleh admin pada halaman
inputan, yang disajikan berupa tabel –
tabel. Halaman View juga bisa
digunakan untuk mengubah atau
menghapus data yang dinginkan.
Gambar 3.16 Rancangan Halaman Edit
Trayek
3.4.2.9 Perancangan Halaman Edit
Nama Jalan
Gambar 3.17 Rancangan Halaman Edit Nama
Jalan
3.5
Perancangan Database
Proses perancangan database
dimulai dengan melakukan identifikasi
semua kebutuhan pengguna yang
berhubungan dengan basis datanya
serta pengumpulan dari semua data
dan informasi yang diperlukan.
Pada
tahap
selanjutnya
dilakukan
pemahaman-pemahaman
mengenai data-data atau masukanmasukan yang berasal dari pengguna
untuk mengidentifikasikan semua
kemungkinan entitas yang terdapat
pada bagian dunia nyata yang
dimodelkan yang bersangkutan yang
kemudian disajikan dalam model ER
(entity relationship).
Langkah awal pada proses ini
adalah dengan menetapkan aturanaturan
yang
digunakan
dalam
mendefinisikan hubungan-hubungan
antara entitas yang satu dengan entitas
yang lain, kemudian dari tahap
tersebut dapat dibuat diagram ER-nya.
Hubungan antara entitas dalam
sistem ini yaitu :
 Admin memiliki beberapa tipe
admin
dengan
memiliki
password dan hak akses yang
berbeda untuk masing – masing
admin.
 Setiap nama jalan (nm_jln)
terdiri dari sebuah trayek sesuai
dengan nama jalan masing masing.
 Setiap trayek terdiri dari
beberapa nama jalan.
Untuk mendukung pembuatan
aplikasi web database, maka perlu
adanya pembuatan database. Dalam
pembuatan database ini digunakan
DBMS (DataBase Manajemen System)
MySQL server. Database yang dibuat
merupakan database yang akan
digunakan
oleh
website
untuk
menyimpan data dan mengambil data.
Web server telah menyediakan
fasilitas untuk membuat database
secara
otomatis
tanpa
harus
menuliskan syntax-syntax program
MySQL.
Adapun
langkah-langkah
pembuatannya adalah sebagai berikut:
1. Mengaktifkan web server yang
terdapat pada komputer lokal.
2. Membuka web browser dan
menuliskan alamat url berupa
http://localhost/phpmyadmin,
maka akan muncul tampilan
web server yang terdapat pada
komputer lokal.
Gambar 3.19 Tampilan PhpMyAdmin
3. Menuliskan nama database
yang akan dibuat pada kotak
“create new database”, lalu
menekan button “Create”
4. Setelah
membuat
nama
database, langkah selanjutnya
adalah membuat tabel dalam
database
dengan
cara
menuliskan nama tabel pada
halaman “create new table”
pada
database
“<nama
database>”
kemudian
menuliskan jumlah field yang
digunakan dalam tabel tersebut.
Dalam hal ini dibuat sebuah
database dengan nama “peta”
dan menciptakan tiga buah
tabel dengan nama masing –
masing tabel yaitu “admin”,
“nm_jln” dan “trayek” .
Setelah selesai, lalu menekan
button “Go”
Selanjutnya akan muncul tampilan
untuk memasukkan nama field, jenis
dan ukuran panjang / nilai masing –
masing data.
Pembuatan Peta
Tampilan peta trayek angkutan
umum kota Bogor dibuat dengan
menggunakan
script
MapServer,
mengingat script map Server yang
cukup panjang maka untuk bagian
script secara lengkap akan ditampilkan
pada lampiran bagian Listing Program
dan untuk hasil output program secara
keseluruhan akan ditampilkan pada
lampiran bagian Daftar Gambar.
Untuk bagian ini hanya akan
ditampilkan penggalan script dan hasil
output desain yang didapat sesuai dari
script MapServer yang dibuat dengan
mengambil satu buah sampel peta
trayek. MapServer menggunakan file
berkesktensi *.Map sebagai file
konfigurasi peta. File ini akan berisi
komponen tampilan peta seperti
definisi layer, definisi proyeksi peta,
pengaturan legenda, skala dan
sebagainya.
Berikut
adalah
sampel
penggalan script dan hasil output peta
pada trayek angkutan umum 03 untuk
trayek “Br.Siang – Terminal Bubulak”
:
Gambar 3.20 Penggalan Script MapServer
Penjelasan Gambar 3.20 :
- Untuk pembuatan peta ini
menggunakan tiga data trayek,
diantaranya rute.shp, nama
jalan.shp, dan angkot 03.shp
yang dideklarasikan pada skrip
“DATA”.
- Pewarnaan
pada
peta
ditunjukkan
pada
skrip
“COLOR”
untuk
warna
background peta dan skrip
“OUTLINECOLOR”
untuk
pewarnaan garis peta.
- Jenis huruf yang digunakan
ditunjukkan
oleh
skrip
“FONT” dimana pada peta ini
menggunakan
jenis
huruf
“fritqat–italic”
dan
untuk
ukuran hurufnya ditnjukkan
oleh skrip “SIZE”.
Hasil Output:
– masing trayek yang didapat dari file
ber-ekstensi *.shp.
3.7
Pembuatan Website
Tampilan
website
trayek
angkutan umum kota Bogor dibuat
dengan menggunakan script PHP,
mengingat script PHP yang sangat
panjang maka untuk bagian script akan
ditampilkan pada bagian Listing
Program. Untuk bagian ini hanya akan
ditampilkan hasil output desain yang
didapat sesuai dari script PHP yang
dibuat.
Tampilan
website
dibuat
dengan sesederhana mungkin dan
dengan sistem yang relatif mudah agar
tidak
terjadi
kesulitan
dalam
penggunaannya. Pemilihan warna,
ukuran font (huruf), dan tata letak
layout
website
dibuat
dengan
pemilihan warna yang “ringan”,
menarik dan layout serta fasilitas yang
relevan untuk memberi kemudahan
dan kenyamanan bagi pengguna
sistem.
3.7.1 Tampilan Halaman Utama /
Home
Gambar 3.21 Peta Trayek 03
Untuk proses pembuatan peta
trayek
yang
lainnya
masih
menggunakan script MapServer yang
sama, yang membedakan hanyalah
data trayek angkutan umum yang
disesuaikan dengan nama data masing
Gambar 3.22 Tampilan Halaman Utama
Halaman Utama / Home adalah
sebuah halaman induk website dimana
pengguna sistem dapat melakukan
semua aktifitasnya dalam satu halaman
saja, mulai dari melihat profil website,
melakukan perencanaan perjalanan,
mendapatkan informasi seputar trayek,
dan menuju ke link – link terkait dari
website ini sesuai dengan navigasi
yang ada. Untuk penjelasan script
dalam pembuatan tampilan ini akan
ditampilkan pada Listing Program
bagian *)Halaman Utama.
3.7.2 Tampilan Halaman About Us
Gambar 3.24 Tampilan Halaman Info
Halaman Info akan muncul
apabila pengguna sistem menekan
menu link “Info” pada website.
Halaman ini berisi informasi –
informasi mengenai trayek angkutan
umum beserta nama – nama jalan yang
dilalui angkutan umum di kota Bogor.
Untuk penjelasan script dalam
pembuatan
tampilan
ini
akan
ditampilkan pada Listing Program
bagian *)Halaman Info.
Gambar 3.23 Tampilan Halaman About Us
Halaman About Us adalah
sebuah halaman website yang akan
muncul apabila pengguna sistem
menekan menu link “About Us” pada
website. Halaman ini berisi profil
website dan cara penggunaan fasilitas
yang ada pada website. Untuk
penjelasan script dalam pembuatan
tampilan ini akan ditampilkan pada
Listing Program bagian *)Halaman
About Us.
3.7.3 Tampilan Halaman Info
3.7.4 Tampilan Halaman Peta
Gambar 3.25 Tampilan Halaman Peta
Pengguna sistem akan menuju
ke halaman peta ketika pengguna
sistem menekan link yang muncul, hal
ini bisa terjadi apabila proses
perencanaan perjalanan dilakukan
dengan benar . Pengguna sistem dapat
kembali ke halaman utama jika
menekan link “Kembali” yang terletak
di bawah visualisasi peta. Untuk
penjelasan script dalam pembuatan
tampilan ini akan ditampilkan pada
Listing Program bagian *)Halaman
Peta.
3.7.5
Tampilan
Admin
Halaman
Login
3.7.6 Tampilan Halaman Inputan
Data
Gambar 3.27 Tampilan Halaman Inputan
Data
Halaman ini digunakan untuk
mengiput data – data yang ada. Untuk
penjelasan script dalam pembuatan
tampilan ini akan ditampilkan pada
Listing Program bagian *)Halaman
Inputan Data.
3.7.7
Tampilan
Data
Halaman
View
Gambar 3.26 Tampilan Halaman Login Admin
Untuk dapat mengolah data
pada sistem ini, hanya dapat dilakukan
oleh admin yang sudah terdaftar pada
database. Halaman ini digunakan
sebagai portal untuk masuk ke
halaman penginputan data. Untuk
penjelasan script dalam pembuatan
tampilan ini akan ditampilkan pada
Listing Program bagian *)Halaman
Login Admin.
Gambar 3.28 Tampilan Halaman View Data
Untuk melihat data apa
saja yang ada pada database yang
sudah diinput sebelumnya pada
halaman inputan, digunakan “Halaman
View Data”. Untuk penjelasan script
dalam pembuatan tampilan ini akan
ditampilkan pada Listing Program
bagian *)Halaman View Data.
3.7.8
Tampilan
Trayek
Halaman
3.7.9
Tampilan Halaman
Nama Jalan
Edit
Edit
Gambar 3.30 Tampilan Halaman Edit Nama
Jalan
Gambar 3.29 Tampilan Halaman Edit Trayek
Halaman ini digunakan untuk
mengubah (edit) isi data trayek dan
ketentuan – ketentuannya berdasarkan
penginputan yang sudah dilakukan
sebelumnya pada database melalui
halaman inputan. Untuk penjelasan
script dalam pembuatan tampilan ini
akan ditampilkan pada Listing
Program bagian *)Halaman Edit
Trayek.
Halaman ini digunakan untuk
mengubah (edit) isi data nama – nama
jalan di kota Bogor berdasarkan
penginputan yang sudah dilakukan
sebelumnya pada database melalui
halaman inputan. Untuk penjelasan
script dalam pembuatan tampilan ini
akan ditampilkan pada Listing
Program bagian *)Halaman Edit
Nama Jalan.
4. Pengujian
4.1
Pendahuluan
Setelah
perancangan
dan
pembuatan sistem berbasis web ini
selesai
dilakukan,
maka
tahap
selanjutnya
adalah
dilakukannya
pengujian sistem. Pengujian sistem ini
dilakukan melalui server lokal /
komputer
personal
dan
belum
dilakukan melelui internet karena
belum melewati tahap upload sehingga
belum diketahui apakah sistem ini
dapat berjalan dengan semestinya jika
diakses oleh banyak user melalui
internet.
Pengujian sistem ini dilakukan
melalui beberapa web browser
diantaranya Internet Explorer, Mozilla
Firefox,
dan
Opera.
Untuk
menjalankan program modul ini
sebelumnya diaktifkan server yang
digunakan. Bermacam-macam server
dapat digunakan antara lain Apache,
Xitami,
PWS
dan
sebagainya.
Penggunaan server hanya dapat
digunakan salah satu. Dalam pengujian
ini digunakan server Apache untuk
melihat apakah sistem dapat berjalan
dengan baik.
4.2
Spesifikasi
Perangkat
Yang
Digunakan
Untuk dapat menjalankan
sistem ini dibutuhkan spesifikasi
perangkat keras (hardware) dan
perangkat lunak (software) sebagai
berikut :
a. Hardware
 Processor Pentium 3 or Higher
 RAM 256 Mb or Higher
 VGA Card 32.0 Mb or Higher
b. Software
 Sistem Operasi :
Microsoft
Windows 98 / 2000 / XP / Vista
 Desain Web
: PHP
 Database
:
 Desain Peta
:
 Perancangan
:
Microsoft Visio
 Word Processing
:
Word 2003
 Teknologi Server
:
 Browser
:
Internet Explorer, Opera
MYSQL
MapServer
Star UML,
Microsoft Office
Apache
Mozilla Firefox,
4.3
Pengujian Sistem
Pengujian pada browser dapat
dilakukan dengan cara mengetikkan
http://localhost/trayek/home. Berikut
adalah langkah – langkah yang
dilakukan pengguna sistem untuk
menjalankan sistem ini :
1. User menekan tombol Start
pada taskbar.
2. Kemudian
memilih
web
browser pada menu All
Program | , dalam hal ini user
menggunakan
beberapa
browser diantaranya Mozilla
Firefox, Internet Explorer,
dan
Opera
untuk
membandingan
kehandalan
masing – masing browser
terhadap sistem.
3. Selanjutnya akan muncul
beberapa web browser tersebut
berupa halaman kosong seperti
diperlihatkan pada gambar di
bawah ini :
Gambar 4.1 Tampilan Awal
Mozilla Firefox
Gambar 4.2 Tampilan Awal
Internet Explorer
Gambar 4.4 Pengujian Halaman
Utama Menggunakan Mozilla
Firefox
Gambar 4.3 Tampilan Awal
Opera
4. User
mengetikkan
‘http://localhost/trayek/home.p
hp’ pada browser kosong dan
menekan enter untuk masuk ke
halaman utama website yang
hasilnya masing – masing
dapat dilihat pada beberapa
gambar di bawah ini:
Gambar 4.5 Pengujian Halaman
Utama Menggunakan Internet
Explorer
Gambar 4.6 Pengujian Halaman
Utama Menggunakan Opera
5. Setelah user masuk ke halaman
utama website maka user dapat
langsung memanfaatkan fasilitas
– fasilitas yang ada terutama
fasilitas journey planner yang
merupakan salah satu fasilitas
utama dari website ini.
6. Melalui fasilitas journey planner
ini, user dapat menentukan nama
– nama jalan yang diinginkan
melalui opsi “Dari : “ dan opsi
“Menuju : “ , dalam pengujian
ini pengguna sistem melakukan
perencanaan
perjalanannya
(jorney planner) dari “Jl. Ahmad
Yani” menuju ke “Bantarjati”.
Setelah opsi – opsi ditentukan,
selanjutnya pengguna sistem
menekan button “Proses” yang
hasilnya dapat dilihat pada
beberapa gambar berikut ini :
Gambar 4.8 Pengujian Journey Planner
Menggunakan Internet Explorer
Gambar 4.9 Pengujian Journey Planner
Menggunakan Opera
7. Setelah button “Proses” ditekan,
Gambar 4.7 Pengujian Journey Planner
Menggunakan Mozilla Firefox
maka akan tampil hasil output
fasilitas journey planner berupa
informasi
mengenai
trayek
angkutan
umum
yang
diinginkan. Pada pengujian ini,
user ingin mengetahui trayek apa
yang digunakan jika ingin
melakukan perjalanan dari “Jl.
Ahmad Yani” menuju ke
“Bantarjati”. Hasil informasi
yang diperoleh adalah user akan
menggunakan trayek angkutan
umum bernomor trayek 07 yang
digunakan dari “Jl. Ahmad
Yani”, kemudian transit atau
ganti angkutan umum bernomor
trayek 08 di “Jl. Jend.
Sudirman”, kemudian turun atau
dengan kata lain perjalanan
berakhir di “Bantarjati”.
8. User mendapatkan informasi
sesuai dengan apa yang
diinginkan.
Selain
sebuah
informasi trayek, pengguna
sistem
juga
mendapatkan
sebuah link bertuliskan “Lihat
Peta” yang apabila ditekan akan
membawa user menuju ke
halaman peta dari trayek
angkutan
umum
yang
bersangkutan. Untuk tampilan
masing – masing peta dapat
dilihat pada beberapa gambar di
bawah ini :
Gambar 4.11 Pengujian Output
Peta Menggunakan Internet
Explorer
Gambar 4.12 Pengujian Output
Peta Menggunakan Opera
9. Ketiga
Gambar 4.10 Pengujian Output
Peta Menggunakan Mozilla
Firefox
gambar
di
atas
merupakan hasil output dari
journey
planner
yang
dilakukan sebelumnya pada
halaman utama website. Pada
peta tersebut terlihat sketsa
jalan – jalan raya di kota Bogor
yang dilalui oleh angkutan
umum, untuk jalan raya yang
ditandai
warna
merah
menandakan
bahwa
jalan
tersebut dilalui oleh angkutan
umum bernomor trayek 07,
sedangkan
warna
biru
menandakan
bahwa
jalan
tersebut dilalui oleh angkutan
umum bernomor trayek 08.
Untuk keterangan lebih detail
bisa dilihat pada “Legenda”.
Halaman
peta
ini
juga
memiliki beberapa tools yang
digunakan untuk memperbesar
atau mengecilkan skala peta
dan mengubah posisi peta
sesuai dengan yang diinginkan.
10. Pada halaman peta juga
terdapat sebuah link yang
apabila ditekan akan membawa
user menuju ke halaman utama
website.
11. Selain menggunakan fasilitas
journey planner, user juga bisa
mendapatkan informasi seputar
trayek angkutan umum melalui
menu “Info”. Melalui menu
ini, user dapat mengetahui
trayek apa saja yang melalui
jalan – jalan utama di kota
Bogor secara keseluruhan,
termasuk tarif angkutan umum
sesuai dengan ketentuan yang
berlaku. Tampilan halaman
“Info” dapat dilihat pada
gambar dibawah ini :
Gambar 4.13 Pengujian
Halaman Info Menggunakan
Mozilla Firefox
Gambar 4.14 Pengujian
Halaman Info Menggunakan
Internet Explorer
Gambar 4.15 Pengujian
Halaman Info Menggunakan
Opera
12. Sedangkan menu “About
Us” digunakan untuk
mengetahui profil dari
website itu sendiri dan cara
penggunaan website, seperti
terlihat pada ketiga gambar
di bawah ini :
Gambar 4.16 Pengujian
Halaman About Us
Menggunakan Mozilla
Firefox
Gambar 4.17 Pengujian
Halaman About Us
Menggunakan Internet Explorer
Gambar 4.18 Pengujian
Halaman About Us
Menggunakan Opera
13. Untuk melakukan pengolahan
data pada sistem, diperlukan
sebuah aplikasi manajemen
data
untuk
administrator
sistem. Admin mengetikkan
http://localhost/trayek/admin
pada web browser untuk dapat
menuju ke halaman login
admin dan menginput nama
admin dan password sesuai
dengan identitas admin yang
sudah terdaftar pada database
sebelum
akan
melakukan
pengolahan data pada sistem,
yang tampilannya dapat dilihat
pada gambar berikut :
Gambar 4.19 Pengujian
Halaman Login Admin
Menggunakan Mozilla Firefox
Gambar 4.20 Pengujian
Halaman Login Admin
Menggunakan Internet Explorer
Gambar 4.21 Pengujian
Halaman Login Admin
Menggunakan Opera
14.
Setelah admin melakukan
login lalu menekan “enter”
atau menekan button “LOGIN”
pada form login admin dan
akan menuju ke halaman
inputan data yang hasilnya
dapat dilihat pada gambar di
bawah ini :
Gambar 4.23 Pengujian Input
Data Menggunakan Internet
Explorer
Gambar 4.24 Pengujian Input
Data Menggunakan Opera
15. Admin dapat melihat data apa
saja yang sudah diinput
dengan menekan menu “View
trayek” yang terletak di
sebelah kanan atas halaman
website,
untuk
hasilnya
masing – masing dapat dilihat
pada gambar berikut ini :
Gambar 4.22 Pengujian Input
Data Menggunakan Mozilla
Firefox
Gambar 4.25 Pengujian View
Data Menggunakan Mozilla
Firefox
Gambar 4.26 Pengujian View
Data Menggunakan Internet
Explorer
Gambar 4.27 Pengujian
View
Data
Menggunakan Opera
Gambar 4.28 Pengujian Edit
Trayek Menggunakan Mozilla
Firefox
Gambar 4.29 Pengujian Edit
Trayek Menggunakan Internet
Explorer
16. Melalui halaman view, admin
dapat mengubah (edit) data
yang telah diinput sebelumnya
dengan cara menekan menu “
Edit trayek” yang terletak di
sebelah masing – masing tabel
database, untuk tampilannya
masing – masing dapat dilihat
pada gambar di bawah ini :
Gambar 4.30 Pengujian Edit
Trayek Menggunakan Opera
diantaranya adalah link menuju
ke “Website Pemerintah Kota
Bogor”, “Website Departemen
Perhubungan RI”, “WEB GIS
Kota Bogor”, dan “Website
ISP (Internet Service Provider)
Kota Bogor / Bonet (Bogor
Internet)”.
4.4
Gambar 4.31 Pengujian Edit
Nama Jalan Menggunakan
Mozilla Firefox
Gambar 4.32 Pengujian Edit
Nama Jalan Menggunakan
Internet Explorer
Gambar 4.33 Pengujian Edit
Nama Jalan Menggunakan
Opera
17. Website ini juga memiliki
Related Links atau link – link
terkait
yang
dapat
dimanfaatkan oleh pengguna
sistem yang membutuhan,
Evaluasi
Setelah
pengujian
sistem
dilakukan
dengan
menggunakan
beberapa browser , tahap selanjutnya
adalah melakukan evaluasi. Dalam
pengujian sistem menggunakan ketiga
browser di atas, tidak ditemukan
kendala atau masalah – masalah yang
mengakibatkan
sistem
menjadi
terganggu. Perbedaan yang terlihat
hanyalah pada waktu respon masing –
masing browser yang memiliki
perbedaan dalam hal kecepatan waktu
pengaksesan sistem.
Dalam
pengujian
ini
didapatkan sebuah kesimpulan bahwa
web browser yang paling handal untuk
digunakan oleh sistem ini adalah
Mozilla Firefox, hal ini dapat
dibuktikan oleh waktu respon browser
yang relatif lebih cepat dan
keamananannya
berupa
blocker
(digunakan untuk mencegah serangan
– serangan web luar) sehingga
membuat fungsi sistem menjadi lebih
optimal dibandingkan dengan browser
Internet Explorer dan Opera.
5.
5.1
Penutup
Kesimpulan
Dalam penulisan ini telah
dibuat Sistem Informasi Trayek
Angkutan Umum Kota Bogor Berbasis
Web, dimana melalui sistem ini
pengguna sistem diberi kemudahan
dalam merencanakan perjalanannya
sesuai dengan trayek angkutan umum
yang diinginkan kapanpun dan
dimanapun pengguna sistem berada,
selama memiliki koneksi ke internet.
Dalam Hal ini pengguna sistem juga
bisa memperoleh berita atau informasi
seputar trayek angkutan umum secara
up to date. Kekurangan dari sistem ini
adalah visualisasi peta trayek yang
masih
sangat
sederhana
dan
perhitungan akurasi resolusi peta yang
kurang tepat dalam pembuatan sistem
sehingga terkadang mengakibatkan
tampilan output peta menjadi “pecah”.
Kekurangan lainnya adalah kurangnya
animasi dan audio yang digunakan
agar pengguna sistem dapat lebih
tertarik dan merasa tidak bosan untuk
menggunakan sistem.
ketika pengguna menekan tombol
menu atau link halaman website, dan
sebagainya. Namun perlu diperhatikan
penyesuaian spesifikasi hardware dan
software yang digunakan ketika akan
mengembangkan sistem agar tidak
terjadi gangguan – gangguan yang
mengakibatkan sistem menjadi tidak
stabil.
5.2
Saran
Sangat diharapkan kepada
siapa saja yang menggunakan sistem
ini untuk dapat mengembangkan dan
menyempurnakannya agar lebih baik
lagi. Terutama dari visualisasi peta dan
resolusi peta serta penambahan
fasilitas berupa penambahan suara –
suara dan animasi yang digunakan
agar para pengguna lebih tertarik
untuk menggunakan sistem ini.
Misalnya visualisasi peta yang dibuat
secara
3D
(tiga
dimensi),
menambahkan animasi trayek berupa
angkutan umum yang berjalan
melewati jalan raya, suara – suara
kendaraan yang muncul ketika
pengguna menekan tombol proses atau
suara – suara menarik yang muncul
Daftar Pustaka
[1]
Jogiyanto Hartono, Pengenalan
Komputer,
Dasar
Ilmu
Komputer,
Pemrograman,
Sistem
Informasi
dan
Intelegensi Buatan, ANDI,
Yogyakarta, 1999.
[2]
Jack Febrian, Menggunakan
Internet, Informatika Bandung,
Bandung, 2007.
[3]
http://uml.org [8 September 2008]
[4]
Jack Febrian, Kamus Komputer
dan Teknologi Informasi ,
Informatika
Bandung,
Bandung, 2004.
[5]
Abdul
Kadir,
Dasar
Pemrograman WEB Dinamis
Menggunakan PHP, Andi
Yogyakarta, Yogyakarta, 2002.
[6]
Bimo Sunarfrihantono, PHP
dan MySQL Untuk Web, Andi
Yogyakarta, Yogyakarta, 2002.
[7]
Denny Charter, Cara Kerja
MapServer, Mei 2008.
[8]
Ruslan Nuryadin, Panduan
Menggunakan MapServer,
Informatika Bandung,
Bandung, 2005.
[9]
http://httpd.apache.org/
[10]
David
Sugianto,
Hapsoro
Renaldy
N.,
Muhammad
Farhan Sjaugi, Langkah Demi
Langkah Membangun Website
dengan
PHP,
Datakom,
Jakarta, 2005.
[8 September 2008]
Download