artikel_10104469.pdf

PERANCANGAN SISTEM INFORMASITRAYEK ANGKUTAN UMUM KOTA BOGOR

BERBASIS WEB

Dhimas Annang Banumasetya [10104469]Jurusan Sistem Informasi, Fakultas Ilmu Komputer

Universitas [email protected]

Oktober 2008

Abstrak

Kota Bogor adalah salah satu kota di Jawa Barat yang mempunyai angkutanumum dengan populasi yang sangat padat. Permasalahan yang perlu diperhatikandalam transportasi angkutan umum di kota Bogor itu adalah kebingunganmasyarakat dalam mencari jalur yang dilalui angkutan umum karena kurangnyainformasi 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 makakebutuhan akan informasi mengenai trayek angkutan umum di kota Bogormerupakan kebutuhan yang sangat penting, salah satu caranya adalah dengandibuatnya sistem informasi trayek angkutan umum kota Bogor berbasis web.

Pada penulisan ini, telah dibuat suatu sistem berbasis web yang dapatdigunakan untuk memperoleh informasi dan visualisasi peta trayek angkutan umumKota Bogor. Adapun langkah-langkahnya antara lain pengumpulan data, pemodelansistem, pembuatan struktur navigasi, pembuatan rancangan tampilan website,pembuatan peta, dan pengujian sistem. Prototipe dengan fasilitas utamaperencanaan perjalanan yang berfungsi untuk memudahkan pengguna sistem dalampenentuan rute perjalanan menggunakan angkutan umum, disajikan dalam skripsiini.Kata kunci : Peta, Sistem Informasi, Website, Trayek, Angkutan Umum, Bogor

1. Pendahuluan

1.1 Latar Belakang MasalahTransportasi merupakan salah

satu unsur yang terpenting di dalamperekonomian, karena transportasisangat erat kaitannya dengan aktifitas

masyarakat khususnya masyarakat diperkotaan. Tanpa adanya transportasimaka aktifitas atau kegiatanmasyarakat menjadi terganggu.Angkutan umum adalah salah satujenis sarana transportasi yang palingbanyak digunakan oleh masyarakat

mailto:[email protected]

sehari - hari, karena biaya yang relatifmurah dan terjangkau oleh sebagianbesar kalangan masyarakat.

Kota Bogor adalah salah satukota di Jawa Barat yang mempunyaiangkutan umum dengan populasi yangsangat padat. Permasalahan yang perludiperhatikan dalam transportasiangkutan umum di kota Bogor ituadalah kebingungan masyarakat dalammencari jalur yang dilalui angkutanumum karena kurangnya informasimengenai trayek angkutan umum yangbegitu banyak di kota Bogor,khususnya bagi masyarakat yangberkunjung ke kota Bogor.

Karena pentingnyaperencanaan rute/trayek dalamtransportasi maka kebutuhan akaninformasi mengenai trayek angkutanumum di kota Bogor merupakankebutuhan yang sangat penting, salahsatu caranya adalah dengan dibuatnyasuatu sistem trayek bagi angkutanumum di kota Bogor berbasis web.

1.2 Batasan MasalahPada penulisan ini, dilakukan

pembatasan masalah pada pembuatansistem informasi trayek angkutanumum kota Bogor berbasis web yangmencakup perencanaan perjalanan,informasi rute angkutan umum, danvisualisasi peta trayek angkutan umumdengan tahapan pembuatan yangmeliputi pengumpulan data,pemodelan sistem, pembuatan strukturnavigasi, pembuatan rancangantampilan website, perancangandatabase, pembuatan peta, danpengujian sistem

1.3 Tujuan PenulisanTujuan penelitian ini adalah

untuk membangun suatu sisteminformasi trayek angkutan umum kotaBogor berbasis web yang memilikifitur perencanaan perjalanan danvisualisasi peta trayek denganmenggunakan perangkat lunak PHPdan MapServer.

1.4 Metode PenelitianStudi lapangan dilakukan

dengan mewawancarai pihak DLLAJkota Bogor untuk mengumpulkan datamengenai rute – rute angkutan umumkota Bogor. Setelah pengumpulan datalalu dilakukan perancangan danpembuatan sistem yang meliputipemodelan sistem denganmenggunakan UML, pembuatandatabase, perancangan dan pembuataninput dan output, serta pengujian.Semua data yang telah dikumpulkandiolah dan dimasukkan ke dalamprogram untuk nantinya akandilakukan pengujian sistem..

2. Landasan Teori

2.1 SistemSistem berasal dari bahasa

Latin (systēma) dan bahasa Yunani(sustēma) adalah suatu kesatuan yangterdiri komponen atau elemen yangdihubungkan bersama untukmemudahkan aliran informasi, materiatau energi. Istilah ini seringdipergunakan untuk menggambarkansuatu set entitas yang berinteraksi, dimana suatu model matematikaseringkali bisa dibuat.

Sistem juga merupakankesatuan bagian-bagian yang salingberhubungan yang berada dalam suatuwilayah serta memiliki item-itempenggerak, contoh umum misalnyaseperti negara. Negara merupakansuatu kumpulan dari beberapa elemenkesatuan lain seperti provinsi yangsaling berhubungan sehinggamembentuk suatu negara dimana yangberperan sebagai penggeraknya yaiturakyat yang berada dinegara tersebut.Kata "sistem" banyak sekali digunakandalam percakapan sehari-hari, dalamforum diskusi maupun dokumenilmiah. Kata ini digunakan untukbanyak hal, dan pada banyak bidangpula, sehingga maknanya menjadiberagam. Dalam pengertian yangpaling umum, sebuah sistem adalahsekumpulan benda yang memilikihubungan di antara mereka

2.2 InformasiInformasi adalah hasil

pemrosesan, manipulasi danpengorganisasian/penataan darisekelompok data yang mempunyainilai pengetahuan (knowledge) bagipenggunanya. Namun demikian istilahini memiliki banyak arti bergantungpada konteksnya, dan secara umumberhubungan erat dengan konsepseperti arti, pengetahuan, negentropy,komunikasi, kebenaran, representasi,dan rangsangan mental.

Banyak orang menggunakanistilah "era informasi", "masyarakatinformasi," dan teknologi informasi,dalam bidang ilmu informasi dan ilmukomputer yang sering disorot, namunkata "informasi" sering dipakai tanpa

pertimbangan yang cermat mengenaiberbagai arti yang dimilikinya.

2.3 Sistem InformasiSistem informasi adalah

sekumpulan komponen pembentuksistem yang mempunyai keterkaitanantara satu komponen dengankomponen lainnya yang bertujuanmenghasilkan suatu informasi dalamsuatu bidang tertentu. Dalam sisteminformasi diperlukannya klasifikasialur informasi, hal ini disebabkankeanekaragaman kebutuhan akan suatuinformasi oleh pengguna informasi.Kriteria dari sistem informasi antaralain, fleksibel, efektif dan efisien.

Sistem informasi dapat puladidefinisikan sebagai suatu sistem didalam suatu organisasi yangmerupakan kombinasi dari orang-orang, fasilitas, teknologi, mediaprosedur-prosedur dan pengendalianyang ditujukan untuk mendapatkanjalur komunikasi penting, memprosestipe transaksi rutin tertentu, memberisinyal kepada manajemen dan yanglainnya terhadap kejadian-kejadianinternal dan eksternal yang pentingdan menyediakan suatu dasarinformasi untuk pengambilankeputusan.

Informasi dalam suatu lingkungansistem informasi harus mempunyaipersyaratan umum sebagai berikut :

arus diketahui oleh penerimasebagai referensi yang tepat.

Harus sesuai dengan kebutuhanyang ada dalam prosespembuatan / pengambilankeputusan.

Harus mempunyai nilaisurprise, yaitu hal yang sudahdiketahui hendaknya jangandiberikan.

Harus dapat menuntun pemakaiuntuk membuat keputusan.Suatu keputusan tidak selalumenuntut adanya tindakan.

Sistem informasi harus mempunyaibeberapa sifat seperti :

Pemrosesan informasi yangefektif. Hal ini berhubungandengan pengujian terhadap datayang masuk, pemakaianperangkat keras dan perangkatlunak yang sesuai.

Manajemen informasi yangefektif. Dengan kata lain,operasi manajemen, keamanandan keutuhan data yang adaharus diperhatikan.

Keluwesan. Sistem informasihendaknya cukup luwes untukmenangani suatu macamoperasi.

Kepuasan pemakai. Hal yang palingpenting adalah pemakai mengetahuidan puas terhadap sistem informasi.

2.4 Situs Web/WebsiteSebuah situs web / website

adalah sebutan bagi sekelompokhalaman web (web page), yangumumnya merupakan bagian darisuatu nama domain (domain name)atau subdomain di World Wide Web(WWW) di Internet. WWW terdiri dariseluruh situs web yang tersedia kepadapublik. Halaman-halaman sebuah situsweb diakses dari sebuah URL yangmenjadi "akar" (root), yang disebuthomepage (halaman induk; sering

diterjemahkan menjadi "beranda","halaman muka"), dan biasanyadisimpan dalam server yang sama.Tidak semua situs web dapat diaksesdengan gratis. Beberapa situs webmemerlukan pembayaran agar dapatmenjadi pelanggan, misalnya situs-situs yang menampilkan pornografi,situs-situs berita, layanan suratelektronik (e-mail), dan lain-lain.

Halaman-halaman dari websiteakan bisa diakses melalui sebuah URLyang biasa disebut Homepage. URLini mengatur halaman-halaman situsuntuk menjadi sebuah hirarki,meskipun, hyperlink-hyperlink yangada di halaman tersebut mengatur parapembaca dan memberitahu merekasususan keseluruhan dan bagaimanaarus informasi ini berjalan.

Beberapa websitemembutuhkan subskripsi (datamasukan) agar para user bisamengakses sebagian atau keseluruhanisi website tersebut. Contohnya, adabeberapa situs-situs bisnis, situs-situse-mail gratisan, yang membutuhkansubkripsi agar kita bisa mengaksessitus tersebut.

Sebuah website bisa berupahasil kerja dari perorangan atauindividu, atau menunjukkankepemilikan dari sebuah organisasi,perusahaan, dan biasanya website itumenujukkan beberapa topik khusus,atau kepentingan tertentu. Sebuahwebsite bisa berisi hyperlink yangmenghubungkan ke website lain, jadi,kadangkala perbedaan antara websiteyang dibuat oleh individuperseorangan dengan website yang

dibuat oleh organisasi bisnis bisa sajatidak kentara.

Website ditulis, atau secaradinamik di konversi menjadi HTMLdan diakses melalui sebuah programsoftware yang biasa disebut denganweb browser, yang dikenal jugadengan HTTP Client. Halaman webdapat dilihat atau diakses melaluijaringan komputer dan internet,perangkatnya bisa saja berupaPersonal Computer, Laptop Computer,PDA ataupun Cellphone.

Sebuah website dibuat didalamsebuah sistem komputer yang dikenaldengan Web Server, juga disebutHTTP Server, dan pengertian ini jugabisa menunjuk pada software yangdipakai untuk menjalankan sistem ini,yang kemudian menerima lalumengirimkan halaman-halaman yangdiperlukan untuk merespon permintaandari user. Apache adalah bahasaprogram/software yang biasadigunakan didalam sebuah webserver,kemudian setelah itu adalah MicrosoftInternet Information Server (IIS).

Sebuah Website statik, adalahsalah satu bentuk website yang isididalam website tersebut tidakdimaksudkan untuk di-update secaraberkala, dan biasanya di-maintainsecara manual oleh beberapa orangyang menggunakan software editor.Ada 3 tipe kategori software editoryang biasa dipakai untuk tujuanmaintaining ini, mereka adalah :- Elemen 1 Text Editor. Contohnyaadalah Notepad atau TextEdit, dimanaHTML diubah didalam program editortersebut.

- Elemen 2 WYSIWYG editor.Contohnya Microsoft Frontpage danMacromedia Dreamweaver, dimanasitus di edit menggunakan GUI(Graphical User Interface) dan formatHTML ini secara otomatis di generateoleh editor ini.- Elemen 3 Editor yang sudahmemiliki template, contohnyaRapidweaver dan iWeb, dimana, editorini membolehkan user untuk membuatdan meng-update website-nyalangsung ke web server secara cepat,tanpa harus mengetahui apapuntentang HTML. Mereka dapat memilihtemplate yang sesuai dengan keinginanmereka, menambah gambar atauobyek, mengisinya dengan tulisan, dandengan sekejap mereka sudah dapatmembuat website tanpa harus melihatsama sekali kode-kode HTML.

Sebuah website dynamic adalahwebsite yang secara berkala, informasididalamnya berubah, atau website inibisa berhubungan dengan user denganberbagai macam cara atau metode(HTTP cookies atau VariabelDatabase, sejarah kunjungan, variabelsesi dan lain-lain) bisa juga dengancara interaksi langsung menggunakanform dan pergerakan mouse. Ketikaweb server menerima permintaan dariuser untuk memberikan halamantertentu, maka halaman tersebut akansecara otomatis diambil dari mediapenyimpanan sebagai respon daripermintaan yang diminta oleh user.Sebuah situs dapat menampilkandialog yang sedang berlangsungdiantara dua user, memantauperubahan situasi, atau menyediakan

informasi yang berkaitan dengan sanguser.

Ada banyak jenis sistemsoftware yang dapat dipakai untukmeng-generate Dynamic Web Systemdan Situs Dynamic, beberapadiantaranya adalah ColdFusion(CFM), Active Server Pages (ASP),Java Server Pages (JSP) dan PHP,bahasa program yang mampu untukmeng-generate Dynamic Web Systemdan Situs Dinamis. Situs juga bisatermasuk didalamnya berisi informasiyang diambil dari satu atau lebihdatabase atau bisa juga menggunakanteknologi berbasis XML, contohnyaadalah RSS. Isi situs yang statis jugasecara periodik di-generate, atau,apabila ada keadaan dimana dia butuhuntuk dikembalikan kepada keadaansemula, maka dia akan di-generate, halini untuk menghindari kinerjanyasupaya tetap terjaga.

Seperti yang tertulis di atas, diluar sana ada beberapa perbedaandalam penulisan dari terminologiwebsite. Walaupun ¨Website¨ sudahsecara umum dipakai, namun untukAssociated Press Stylebook, Reuters,Microsoft, academia, dan kamus-kamus yang ada, penulisan yangmereka pakai adalah denganmenggunakan 2 kata, yaitu Web site.Hal ini karena ¨Web¨ bukanlahterminilogi umum, namun ia adalahkependekan dari World Wide Web.

2.5 Pengertian InternetBanyak sebutan yang diberikan

oleh para pengguna tentang pengertiandari Internet antara lain cyber, e-world,dunia maya dan sebagainya. Namun

semua itu hanyalah istilah dansebenarnya tidak ada definisi khususmengenai Internet, atau kepanjangandari kata Internet.

Sebagai gambaran umum,Internet adalah suatu jaringankomputer global yang terbentuk darijaringan – jaringan lokal dan regional,dan memungkinkan komunikasi dataantar komputer – komputer yangterhubung ke jaringan tersebut denganmenggunakan jaringan komunikasiyang ada di seluruh dunia. Selain ituInternet dapat juga diartikan sebagaiseluruh manusia yang secara aktifberpartisipasi sehingga membuatInternet menjadi sumber dayainformasi yang sangat berharga.

2.6 Web BrowserDikenal juga dengan istilah

browser, atau peselancar, atau internetbrowser. Adalah suatu programkomputer yang menyediakan fasilitasuntuk membaca halaman web di suatukomputer. Dua program web browseryang cukup populer saat ini adalahMicrosoft Internet Explorer, MozillaFirefox dan Netscape Navigator.Program browser pertama adalahMosaic, yang merupakan suatu textbrowser, yang sekarang web browsertelah berkembang ke dalam bentukmultimedia.

2.7 UMLUnified Modeling Language

(UML) adalah bahasa spesifikasistandar untuk mendokumentasikan,menspesifikasikan, dan membangunsistem perangkat lunak. UML tidakberdasarkan pada bahasa

pemrograman tertentu. Standarspesifikasi UML dijadikan standardefacto oleh OMG (ObjectManagement Group) pada tahun1997.UML yang berorientasikanobject mempunyai beberapa notasistandar.

Spesifikasi ini menjadi populerdan standar karena sebelum adanyaUML, telah ada berbagai macamspesifikasi yang berbeda. Hal inimenyulitkan komunikasi antarpengembang perangkat lunak. Untukitu beberapa pengembang spesifikasiyang sangat berpengaruh berkumpuluntuk membuat standar baru. UMLdirintis oleh Grady Booch, JamesRumbaugh pada tahun 1994 dankemudian 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.

2.7.1 Penjelasan Diagram

2.7.1.1 Diagram Use-CaseDiagram use-case

menggambarkan fungsionalitas yangdiharapkan dari sebuah sistem. Yangditekankan dalam hal ini adalah “apa”yang diperbuat sistem, dan bukan

“bagaimana”. Sebuah use-casemerepresentasikan sebuah interaksiantara aktor dengan sistem.

2.7.1.2 Diagram AktifitasDiagram ini menggambarkan

berbagai alir aktivitas dalam sistemyang sedang dirancang, bagaimanamasing-masing alir berawal, decisionyang mungkin terjadi, dan bagaimanamereka berakhir. Diagram aktivitasjuga dapat menggambarkan prosesparalel yang mungkin terjadi padabeberapa eksekusi.

2.7.1.3 Diagram SekuenDiagram sekuen

menggambarkan interaksi antar objekdi dalam dan di sekitar sistem(termasuk pengguna, display, dansebagainya) berupa message yangdigambarkan terhadap waktu. Diagramini terdiri dari dimensi vertikal (waktu)dan dimensi horizontal (objek-objekyang terkait).

Diagram sekuen biasa digunakanuntuk menggambarkan skenario ataurangkaian langkah-langkah yangdilakukan sebagai respon dari sebuahevent untuk menghasilkan outputtertentu. Diawali dari apa yang men-trigger aktivitas tersebut, proses danperubahan apa saja yang terjadi secarainternal dan output apa yangdihasilkan.

2.8 Struktur NavigasiStruktur navigasi adalah

struktur alur cerita dari sebuahprogram. Sebelum menyatukanelemen-elemen yang digunakan dalamaplikasi multimedia, sebaiknya kita

mendefinisikan obyek-obyek danmerancang tampilan. Agar semuaobyek yang termasuk di dalam aplikasitersebut tidak mengalami kerancuaninformasi, dengan kata lain semuatampilan harus dapat memberikaninformasi yang bulat dan utuh,sehingga dapat tercapai suatupembentukan aplikasi multimedia.Dalam pembuatan aplikasi multimediaada empat macam struktur navigasiyang biasa digunakan. Yaitu strukturnavigasi Linier, Hirarki, Non Linierdan stuktur navigasi Komposit(campuran).

2.8.1 Navigasi LinierStruktur navigasi linier (satu

alur) merupakan struktur yang hanyamempunyai satu rangkaian cerita yangberurut. Struktur ini menampilkan satudemi satu tampilan layar secaraberurut menurut urutannya. Dalamstruktur ini tidak diperkenankanadanya percabangan.

Gambar 2.1 Navigasi Linier

2.8.2 Navigasi HirarkiStruktur navigasi hirarki

(bercabang), merupakan suatu strukturyang mengandalkan percabanganuntuk data atau gambar pada layardengan criteria tertentu. Tampilanpada menu utama disebut master page.Menu utama ini memiliki percabanganyang dinamakan halaman pendukung(slave page).

Gambar 2.2 Navigasi Hierarki

2.8.3 Navigasi Non LinierStruktur navigasi ini

merupakan pengembangan daristruktur navigasi linier. Pada strukturini dimungkinkan adanya percabangan.Percabangan yang dibuat pada strukturnon linier ini berbeda denganpercabangan pada struktur hirarki,karena tiap-tiap tampilan mempunyaikedudukan yang sama, yaitu tidakadanya menu utama dan halamanpendukung.

Gambar 2.3 Navigasi Non Linier

2.8.4 Navigasi KompositNavigasi komposit (campuran)

merupakan gabungan dari ketigastruktur sebelumnya, yaitu strukturnavigasi linier, struktur navigasihirarki dan struktur navigasi non linier.Struktur navigasi ini disebut jugadengan struktur navigasi bebas. Jikasuatu tampilan memerlukanpercabangan, maka dapat dibuatpercabangan. Bila dalam percabangantersebut terdapat suatu tampilan yangsama kedudukannya, maka dapat

dibuat suatu struktur linier dalampercabangan tersebut.

Gambar 2.4 Navigasi Komposit

2.9 PHPPHP dikenal sebagai sebuah

bahasa scripting yang menyatu dengantag-tag HTML, dieksekusi di server,dan digunakan untuk membuathalaman Web yang dinamis sepertihalnya Active Server Pages (ASP) atauJava Server Pages (JSP). PHPmerupakan script untuk scriptpemrograman web server-side.Dengan menggunakan PHP makamaintenance dari suatu situs webmenjadi lebih mudah. Proses updatedata dapat dilakukan denganmenggunakan aplikasi yang dibuatdengan menggunakan script PHP. PHPatau FI merupakan nama awal dariPHP. PHP-Personal Home Page, FIadalah Form Interface. Dibuat pertamakali oleh Rasmus Lerdoff. PHPawalnya merupakan program CGIyang dikhususkan untuk menerimainput melalui form yang ditampilkandalam web browser. PHP secara resmimerupakan kependekkan dariPHP:Hypertext Preprocessor,merupakan bahasa script server-sideyang disisipkan padaHTML(embedded script). Konsep PHPsangat sederhana, bahkan lebihsederhana dari CGI. Sehingga dalammembuat dokumen PHP, cukup

membuat sebuah HTML biasa, hanyasaja ditambahkan dengan kode-kodeprogram yang diapit dalam tanda<?....?>. Tipe data dasar pada PHPantara lain: Integer (bilangan bulat),Bilangan floating point, Boolean, Null,String, Array, Object, Resource.

Gambar 2.5 Skema PHP

2.9.1 Skrip PHPKode program PHP menyatu

dengan tag-tag HTML dalam satu file.File yang berisi tag HTML dan kodePHP ini diberi ekstensi php atauekstensi lainnya yang ditetapkan padaApache atau Web Server. Berikut iniadalah contoh sederhana dari strukturprogram PHP :

//contoh.php<html><head><title>Program

PHP</title></head><body><?echo"Mari belajar PHP

bersama";?></body></html>

Maka outputnya :

Permintaan

HTTP

Gambar 2.6 Tampilan Kode PHP PadaBrowser

2.10 DatabaseSuatu database didefinisikan

sebagai kumpulan data yang disatukandalam suatu organisasi, sehingga dapatmemenuhi kebutuhan organisasi. Padadatabase yang terdesain dengan baik,data redundant dapat dieliminasi danpenyimpanan data yang tidakkonsisten dapat diperkecil.

2.10.1 Menggunakan DatabaseWorld Wide Web pada

dasarnya adalah sebuah wadah untuksaling bertukar informasi. Jikamemiliki informasi dan ingin agarorang lain di seluruh dunia jugamengetahui informasi tersebut, dapatdibuat sebuah situs di Internet. Jikajumlah informasinya banyak, makaperlu pengorganisasian agarpengunjung situs dapat mencariinformasi dengan mudah. Untukkeperluan itulah dibutuhkan sebuahaplikasi database pada situs yangakan dibuat. Secara umum akses kedatabase melalui tiga tahapan, yaitu :

1. Koneksi ke database2. Query permintaan data3. Pemutusan koneksi

2.11 MySQLMySQL merupakan aplikasi

database yang termasuk palingpopuler dalam lingkungan Linux,kepopuleran ini ditunjang karena

performansi query dari databasenyayang sangat cepat dan jarangbermasalah. Saat ini, MySQL telahtersedia juga dalam lingkunganWindows, MySQL di lingkunganWindows diletakan pada direktoric:\mysql\bin adalah direktori yangberisi daftar modul executable dariMySQL.

Untuk mengaktifkan MySQLdi lingkungan Windows maka harusdijalankan server MySQL. Bahasayang digunakan pada database yaitu :

1. DDL ( Data DefinitionLanguage) yaitu : create table,alter table, dan drop table.

2. DML ( Data ManipulationLanguage ) yaitu : select,insert, update, delete.

2.11.1 Membuat DatabaseUntuk masuk ke dalam

program MySQL pada prompt, dapatdijalankan perintah berikut ini:

C:\> MYSQL (Enter)Kemudian akan masuk kedalamMySQL seperti tampilan dibawah ini:

Gambar 2.7 Tampilan MySQL

Cara untuk membuat sebuahdatabase baru adalah dengan perintah:create database namadatabase;

Perintah untuk membuat tabel baruadalah:

create table nama_tabel(struktur);

2.11.2 Menghubungkan PHP danMySQL

Agar script PHP yang kita buatdapat berhubungan dengan databasedari MySQL dapat menggunakanfungsi berikut ini:

File utama.php:<?phpfunction open_connection(){$host=”localhost”;$username=”root”;$password=””;$databasename=”privatdb”;$link=mysql_connect($host,$username,$password) or die("Database tidak dapatdihubungkan!");mysql_select_db($databasename,$link);return $link;}?>

Isi dari variabel $host, $username,$password dan $databasename dapatdisesuaikan sesuai dengan setting padaMySQL server yang ada.

2.12 MapServerMapServer adalah aplikasi

Open Source yang memungkinkansebuah data peta diakses melalui web.Teknologi ini pertama kalidikembangkan oleh UniversitasMinesotta Amerika Serikat. HadirnyaMapServer menjadikan pekerjaan

membuat Peta Digital menjadi lebihmudah dan interaktif. Interaktif petadisini diartikan bahwa pengguna dapatdengan mudah melihat dan mengubahtampilan peta seperti zoom, rotate, danmenampilkan informasi (sepertimenampilkan info jalan) dan analisis (seperti menentukan rute perjalanan)pada permukaan geografi. Diagramberikut menggambarkan bagaimanauser berinteraksi dengan peta interaktifberbasis MapServer.

Gambar 2.8 Diagram Peta DigitalBerinteraksi Dengan User

[Sumber Gambar : Denny Charter. CaraKerja MapServer. Mei 2008]

2.12.1 Bagaimana MapServerBekerja

MapServer bekerja secaraberdampingan dengan aplikasi webserver. Web Server menerima requestpeta melalui MapServer. MapServermeng-generate request terhadap petadan mengirimkannya ke web serverseperti pada gambar berikut.

Gambar 2.9 Diagram Operasi Standar PadaMapServer

[Sumber Gambar : Denny Charter. Cara KerjaMapServer. Mei 2008]

Fungsi utama dari MapServeradalah melakukan pembacaan data daribanyak sumber dan menempatkannyakedalam layer-layer secara bersamaanmenjadi file graphic. Salah satulayernya bisa saja berupa gambarsatelit. Setiap layer saling overlay satudengan lainnya dan ditampilkankedalam web browser.

2.12.2 Komponen-komponen Utama

Mapserver menghasilkankeluaran berupa file graphicberdasarkan masukan yang diberikanoleh user. Komponen kuncinya adalahMapServer executable yang terdiri dariCGI program, file peta, sumber datadan output gambar. Seperti padagambar dibawah ini semua komponenbekerja bersama-sama, setelah user

melakukan request/perminataan makaCGI akan mengakses file peta,menggambarkan informasi yangdidapat dari sumber data dan kembalimenampilkannya pada peta.

Gambar 2.10 Komponen Utama MapServer

[Sumber Gambar : Denny Charter. CaraKerja MapServer. Mei 2008]

2.12.3 Mapserver Executable

Secara sederhana MapServermenjalankan executable applikasi CGIpada web server yang secara teknismerupakan proses stateless berbasispada HTTP. Stateless adalah sebuahproses permintaan yang dilanjutkandengan stop running. Aplikasi CGImenerima permintaan dari web server,kemudian proses dilakukan danmengembalikan respon atau data keweb server. CGI bekerja sangatsederhana tidak diperlukan sebuahpemrograman untuk dapatmenggunakannya. Kita tinggalmelakukan edit berdasarkan text base,konfigurasi runtime file, membuat

halaman web, dan menempatkannyabekerja pada web server. MapServerCGI executable bekerja sebagaiperantara antara file peta denganprogram web server yang memintapeta. Permintaan di lewatkan dalambentuk CGI parameter dari web servermenuju MapServer. Gambar yang dibuat oleh MapServer selanjutnyamemberikan feed back ke web serverdan selanjutnya menuju user melaluiweb browser.

2.12.4 MapServer Map File

MapServer seperti sebuahmesin yang membutuhkan bahan bakaruntuk dapat bekerja dan membutuhkansystem pengiriman (delivery system)bahan bakar untuk mencapai mesin .Program MapServer perlu mengetahuilayer peta yang akan digambar,bagaimana menggambarkannya, dandimana lokasi sumber datanya. Datamerupakan bahan bakarnya dan filepeta atau .map.file merupakan systempengirimannya (delivery system). FilePeta adalah text konfigurasi yangterdiri dari list setting yang digunakanuntuk menggambar dan berinteraksidengan peta. Informasi yang termuatdidalamnya adalah layer data apa yangakan digambar, dimana fokusgeografis petanya, system proyeksiyang digunakan, format apa yang akandigunakan untuk menampilkangambar, dan cara menentukan legendadan skala pada peta.

Contoh script dasar pemetaan dengansatu layer.

MAPSIZE 600 300EXTENT -180 -90 180 90LAYERNAME countriesTYPE POLYGONSTATUS DEFAULTDATA countries.shpCLASSOUTLINECOLOR 100 100 100ENDENDEND

Ketika request atau permintaandating dari aplikasi MapServer makarequest tersebut mesti menyebutkansepesifikasi file peta yang diinginkan.Kemudian MapServer membuatpetanya berdasarkan pada setting padafile peta yang diberikan tadi. [7]

2.12.5 PHP/MapscriptPHP/Mapscript memungkinkan

kita untuk melakukan akses terhadapMapscript API (ApplicationPrograming Interface) dari lingkunganPHP, dengan menggunakan berbagaikelas (class) PHP.

Untuk menguji PHP/Mapscript,digunakan skrip berikut :<?php

Echo ms_getVersion();?>

2.12.5.1 OOP Pada PHP/MapscriptModul PHP/Mapscript disusun

menggunakan pendekatanpemrograman berorientasi objek(Object Oriented Programming, ataubiasa disingkat OOP). Untukmelakukan koneksi berupa penampilan

peta pada PHP/Mapserver, digunakanskrip berikut :

<?$oMap =ms_newMapObj(“…/map/latihan01.map”);$oImg = $oMap ->draw( );$url = $0Img ->saveWebImage(MS_PG, 0, 0, -1);?><img src =<?php echo $url ?> ></img>

Fungsi ms_newMapObjdigunakan untuk menginisiasi objekMapObj, dengan parameter file *.mapyakni file latihan01.map (“…”merupakan direktori tempatmenginstal MapServer). Kembalianfungsi ini disimpan pada variabel$oMap. Fungsi draw digunakansebagai method untuk menghasilkanobjek ImageObj dan fungsisaveWebImage digunakan untukmenyimpan gambar dari objekImageObj ke file temporer.

2.13 Apache HTTP ServerServer HTTP Apache atau

Server Web/WWW Apache adalahserver web yang dapat dijalankan dibanyak sistem operasi (Unix, BSD,Linux, Microsoft Windows dan NovellNetware serta platform lainnya) yangberguna untuk melayani danmemfungsikan situs web. Protokolyang digunakan untuk melayanifasilitas web/www ini mengunakanHTTP.

Apache memiliki fitur-fiturcanggih seperti pesan kesalahan yangdapat dikonfigur, autentikasi berbasis

basis data dan lain-lain. Apache jugadidukung oleh sejumlah antarmukapengguna berbasis grafik (GUI) yangmemungkinkan penanganan servermenjadi mudah.

Apache merupakan perangkatlunak sumber terbuka dikembangkanoleh komunitas terbuka yang terdiridari pengembang-pengembangdibawah naungan Apache SoftwareFoundation.

3. Perancangan dan Pembuatan

3.1 PendahuluanAngkutan umum merupakan

salah satu media transportasi yangdigunakan masyarakat secara bersama-sama dengan membayar tarif sesuaidengan ketentuan yang berlaku. Dalampenelitian ini, telah didapatkan datatrayek angkutan umum kota Bogorberupa informasi trayek besertatarifnya.

Setelah seluruh data diperoleh,maka langkah selanjutnya adalahmelakukan perancangan untukpembuatan sistem informasi berbasisweb yang lebih rincinya akandijelaskan pada pembahasanselanjutnya.

3.2 Data Trayek AngkutanUmumPengumpulan data dilakukan

melalui wawancara kepada pihakDLLAJ kota Bogor. Setelahmelakukan pengumpulan data makahasil yang diperoleh yaitu data tentangnama – nama jalan yang dilalui olehangkutan umum , nomor trayekangkutan umum, serta tarif angkutan

umum. Tahap selanjutnya yaitumengolah data – data tersebut untukdikelompokkan ke dalam sebuah tabel.Setelah mengelompokkan data – datatersebut maka langkah selanjutnyaadalah menentukan hubungan data –data yang bersangkutan untukdigunakan pada saat perancangan danpembuatan sistem.

3.3 Perancangan SistemUntuk membuat sebuah sistem

berbasis web yang stabil, handal, dandapat dipergunakan dengan baik makadibuat perancangan sistem tersebutterlebih dahulu. Perancangan sistemini dibuat menggunakan UML, adapunurutan perancangan untuk diagram-diagram tersebut adalah :

3.3.1 Diagram Use-caseDalam sistem ini tedapat dua

aktor yang terlibat yaitu user danadmin, seperti terlihat pada Gambar3.1 di bawah ini :

user admin

Gambar 3.1 Aktor

Adapun diagram use-casedalam sistem ini adalah seperti padagambar berikut ini :

user

membuka website

memilih menu website

melakukan perencanaan trayek

memperoleh informasi

<<include>>

melihat peta trayek

<<include>>

peta trayek

<<include>>

admin

login

mengelola data

<<include>>

Gambar 3.2 Diagram Use Case

3.3.2 Diagram Aktifitas

user aplikasi

membuka website menampilkan halaman utama

menampilkan menu website

memilih menu website

menampilkan halaman menu website

melakukan perencanaan trayek

memperoleh informasi

melihat peta trayek

peta trayek

pemrosesan inputan perencanaan

validasi peta

Gambar 3.3 Diagram Aktifitas User

admin aplikasi

login menampilkan halaman pengolahan data

menampilkan form - form inputan data

input data

pemrosesan inputan data

memperoleh informasi berupa view data

Gambar 3.4 Diagram Aktifitas Admin

3.3.3 Diagram SekuenDiagram ini menjelaskan

urutan – urutan aktifitas yangdilakukan user dan admin dalammenjalankan sistem, mulai dariaktifitas awal membuka halamanwebsite hingga aktifitas akhirmendapatkan visualisasi peta.

Untuk dimensi secara verticalmerupakan urutan waktu yang terjadidalam sistem, sedangkan untukdimensi horizontal menjelaskan objek– objek terkait yang dipilih user dalammenjalankan sistem.

: user

halaman utama halaman menu website halaman perencanaan halaman lihat peta halaman hasil lihat peta

1 : membuka web()

2 : pilih menu website()

3 : tampilkan menu website()

4 : lakukan perencanaan()

5 : tampilkan halaman perencanaan()

6 : tampilkan link lihat peta()

7 : tampilkan halaman link lihat peta()

8 : klik link lihat peta()9 : validasi peta()

10 : tampilkan hasil peta()

Gambar 3.5 Diagram Sekuen User

: admin

halaman login halaman penginputan data halaman view data halaman utama website

1 : membuka website melakukan login()

2 : tampilkan login form()3 : klik logout()

4 : memasukkan data - data()

5 : tampilkan form inputan()

6 : klik logout()

7 : klik view data()

8 : tampilkan view data berupa tabel()

9 : tampilkan halaman utama website()

Gambar 3.6 Diagram Sekuen Admin

3.4 Perancangan Website3.4.1 Perancangan Struktur

NavigasiPembuatan struktur navigasi

digunakan untuk mempermudah parapengunjung website ini dalam halpencarian informasi. Dalam sistem initerdiri dari dua buah navigasi yaituuntuk user dan admin seperti terlihatpada Gambar 3.7 dan Gambar 3.8berikut :

Gambar 3.7 Struktur Navigasi User

Gambar 3.8 Struktur Navigasi User

Bentuk navigasi yang dipakaiadalah navigasi campuran, karena useratau admin dapat melakukan semuaaktifitas yang diinginkan dalam satuhalaman web. Pada struktur navigasiuser diatas dapat dijelaskan bahwauser pertama kali akan masuk kehalaman Home, dimana pada halamantersebut merupakan halaman utamawebsite. Pada halaman tersebutterdapat menu dan link yangmenghubungkan ke halaman ataubagian – bagian yang dituju dari linktersebut, diantaranya About Us, Info,dan Planner yang lebih rincinya akandijelaskan pada pembahasanselanjutnya, begitu pula dengan

struktur navigasi admin. Untukmengetahui hubungan keterkaitankeseluruhan antar menu dan link yangada dapat dilihat pada Gambar 3.7 danGambar 3.8 di atas.

3.4.2 Perancangan TampilanWebsiteSetelah selesai dengan

penggambaran navigasi, makaberikutnya adalah bagian perancangantampilan. Perancangan tampilan inidigunakan untuk memberi kemudahandalam pembuatan sistem yang akandijelaskan pada pembahasanberikutnya.

3.4.2.1 Perancangan TampilanHalaman Utama

Gambar 3.9 Rancangan Halaman Utama

3.4.2.2 Perancangan HalamanAbout Us

Gambar 3.10 Rancangan Halaman About Us

3.4.2.3 Perancangan Halaman Info

Gambar 3.11 Rancangan Halaman Info

3.4.2.4 Perancangan Halaman PetaHalaman peta adalah sebuah

halaman website yang akan munculapabila user menekan button prosesdengan ketentuan opsi yang benar danakan ditampilkan melalui sebuah Link“Lihat Peta” untuk menuju ke halamanpeta. Link ini tidak akan munculapabila user salah melakukanpenginputan opsi pada journeyplanner.

Gambar 3.12 Rancangan Halaman Peta

3.4.2.5 Perancangan HalamanLogin Admin

Gambar 3.13 Rancangan Halaman LoginAdmin

Halaman ini akan munculapabila admin ingin melakukanpengolahan dataterhadap sistem sesuai dengan datayang diperoleh.

3.4.2.6 Perancangan HalamanInputan Data

HALAMAN INPUTAN

Input trayek LogoutView trayek

INPUT TRAYEK INPUT NAMA JALAN

input1

Browseinput6

input5

input4

input2

input3

Map

Tarif

Keterangan

Angkot

Tempat Akhir

Tempat Awal

ResetSimpan

input8Nama Jalan

Simpan

Kode Jalan input7 kode harus diisi sebanyak 3 karakter

Gambar 3.14 Rancangan Halaman Input Data

Halaman ini adalah halamanyang digunakan admin untukmemasukkan data – data nama jalanbeserta trayek angkutan umumnya,serta biaya sesuai dengan data asliyang didapatkan dari DLLAJ kotaBogor.

3.4.2.7 Perancangan Halaman ViewData

Halaman ini digunakan untukmelihat data apa saja yang ada padawebsite berdasarkan inputan yangdilakukan oleh admin pada halamaninputan, yang disajikan berupa tabel –tabel. Halaman View juga bisadigunakan untuk mengubah ataumenghapus data yang dinginkan.

Gambar 3.15 Rancangan Halaman View Data

3.4.2.8 Perancangan Halaman EditTrayek

Gambar 3.16 Rancangan Halaman EditTrayek

3.4.2.9 Perancangan Halaman EditNama Jalan

Gambar 3.17 Rancangan Halaman Edit NamaJalan

3.5 Perancangan DatabaseProses perancangan database

dimulai dengan melakukan identifikasisemua kebutuhan pengguna yangberhubungan dengan basis datanyaserta pengumpulan dari semua datadan informasi yang diperlukan.

Pada tahap selanjutnyadilakukan pemahaman-pemahamanmengenai data-data atau masukan-masukan yang berasal dari penggunauntuk mengidentifikasikan semuakemungkinan entitas yang terdapatpada bagian dunia nyata yangdimodelkan yang bersangkutan yangkemudian disajikan dalam model ER(entity relationship).

Langkah awal pada proses iniadalah dengan menetapkan aturan-aturan yang digunakan dalammendefinisikan hubungan-hubunganantara entitas yang satu dengan entitasyang lain, kemudian dari tahaptersebut dapat dibuat diagram ER-nya.

Hubungan antara entitas dalamsistem ini yaitu :

Admin memiliki beberapa tipeadmin dengan memilikipassword dan hak akses yangberbeda untuk masing – masingadmin.

Setiap nama jalan (nm_jln)terdiri dari sebuah trayek sesuaidengan nama jalan masing -masing.

Setiap trayek terdiri daribeberapa nama jalan.

Untuk mendukung pembuatanaplikasi web database, maka perluadanya pembuatan database. Dalampembuatan database ini digunakanDBMS (DataBase Manajemen System)MySQL server. Database yang dibuatmerupakan database yang akandigunakan oleh website untukmenyimpan data dan mengambil data.

Web server telah menyediakanfasilitas untuk membuat databasesecara otomatis tanpa harusmenuliskan syntax-syntax programMySQL.

Adapun langkah-langkahpembuatannya adalah sebagai berikut:

1. Mengaktifkan web server yangterdapat pada komputer lokal.

2. Membuka web browser danmenuliskan alamat url berupahttp://localhost/phpmyadmin,maka akan muncul tampilanweb server yang terdapat padakomputer lokal.

http://localhost/phpmyadmin

Gambar 3.19 Tampilan PhpMyAdmin

3. Menuliskan nama databaseyang akan dibuat pada kotak“create new database”, lalumenekan button “Create”

4. Setelah membuat namadatabase, langkah selanjutnyaadalah membuat tabel dalamdatabase dengan caramenuliskan nama tabel padahalaman “create new table”pada database “<namadatabase>” kemudianmenuliskan jumlah field yangdigunakan dalam tabel tersebut.Dalam hal ini dibuat sebuahdatabase dengan nama “peta”dan menciptakan tiga buahtabel dengan nama masing –masing tabel yaitu “admin”,“nm_jln” dan “trayek” .Setelah selesai, lalu menekanbutton “Go”

Selanjutnya akan muncul tampilanuntuk memasukkan nama field, jenisdan ukuran panjang / nilai masing –masing data.

Pembuatan PetaTampilan peta trayek angkutan

umum kota Bogor dibuat dengan

menggunakan script MapServer,mengingat script map Server yangcukup panjang maka untuk bagianscript secara lengkap akan ditampilkanpada lampiran bagian Listing Programdan untuk hasil output program secarakeseluruhan akan ditampilkan padalampiran bagian Daftar Gambar.Untuk bagian ini hanya akanditampilkan penggalan script dan hasiloutput desain yang didapat sesuai dariscript MapServer yang dibuat denganmengambil satu buah sampel petatrayek. MapServer menggunakan fileberkesktensi *.Map sebagai filekonfigurasi peta. File ini akan berisikomponen tampilan peta sepertidefinisi layer, definisi proyeksi peta,pengaturan legenda, skala dansebagainya.

Berikut adalah sampelpenggalan script dan hasil output petapada trayek angkutan umum 03 untuktrayek “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, namajalan.shp, dan angkot 03.shpyang dideklarasikan pada skrip“DATA”.

- Pewarnaan pada petaditunjukkan pada skrip“COLOR” untuk warnabackground peta dan skrip“OUTLINECOLOR” untukpewarnaan garis peta.

- Jenis huruf yang digunakanditunjukkan oleh skrip“FONT” dimana pada peta inimenggunakan jenis huruf“fritqat–italic” dan untukukuran hurufnya ditnjukkanoleh skrip “SIZE”.

Hasil Output:

Gambar 3.21 Peta Trayek 03

Untuk proses pembuatan petatrayek yang lainnya masihmenggunakan script MapServer yangsama, yang membedakan hanyalahdata trayek angkutan umum yangdisesuaikan dengan nama data masing

– masing trayek yang didapat dari fileber-ekstensi *.shp.

3.7 Pembuatan WebsiteTampilan website trayek

angkutan umum kota Bogor dibuatdengan menggunakan script PHP,mengingat script PHP yang sangatpanjang maka untuk bagian script akanditampilkan pada bagian ListingProgram. Untuk bagian ini hanya akanditampilkan hasil output desain yangdidapat sesuai dari script PHP yangdibuat.

Tampilan website dibuatdengan sesederhana mungkin dandengan sistem yang relatif mudah agartidak terjadi kesulitan dalampenggunaannya. Pemilihan warna,ukuran font (huruf), dan tata letaklayout website dibuat denganpemilihan warna yang “ringan”,menarik dan layout serta fasilitas yangrelevan untuk memberi kemudahandan kenyamanan bagi penggunasistem.

3.7.1 Tampilan Halaman Utama /Home

Gambar 3.22 Tampilan Halaman Utama

Halaman Utama / Home adalahsebuah halaman induk website dimanapengguna sistem dapat melakukansemua aktifitasnya dalam satu halamansaja, mulai dari melihat profil website,melakukan perencanaan perjalanan,mendapatkan informasi seputar trayek,dan menuju ke link – link terkait dariwebsite ini sesuai dengan navigasiyang ada. Untuk penjelasan scriptdalam pembuatan tampilan ini akanditampilkan pada Listing Programbagian *)Halaman Utama.

3.7.2 Tampilan Halaman About Us

Gambar 3.23 Tampilan Halaman About Us

Halaman About Us adalahsebuah halaman website yang akanmuncul apabila pengguna sistemmenekan menu link “About Us” padawebsite. Halaman ini berisi profilwebsite dan cara penggunaan fasilitasyang ada pada website. Untukpenjelasan script dalam pembuatantampilan ini akan ditampilkan padaListing Program bagian *)HalamanAbout Us.

3.7.3 Tampilan Halaman Info

Gambar 3.24 Tampilan Halaman Info

Halaman Info akan munculapabila pengguna sistem menekanmenu link “Info” pada website.Halaman ini berisi informasi –informasi mengenai trayek angkutanumum beserta nama – nama jalan yangdilalui angkutan umum di kota Bogor.Untuk penjelasan script dalampembuatan tampilan ini akanditampilkan pada Listing Programbagian *)Halaman Info.

3.7.4 Tampilan Halaman Peta

Gambar 3.25 Tampilan Halaman Peta

Pengguna sistem akan menujuke halaman peta ketika penggunasistem menekan link yang muncul, halini bisa terjadi apabila prosesperencanaan perjalanan dilakukandengan benar . Pengguna sistem dapatkembali ke halaman utama jikamenekan link “Kembali” yang terletakdi bawah visualisasi peta. Untukpenjelasan script dalam pembuatantampilan ini akan ditampilkan padaListing Program bagian *)HalamanPeta.

3.7.5 Tampilan Halaman LoginAdmin

Gambar 3.26 Tampilan Halaman Login Admin

Untuk dapat mengolah datapada sistem ini, hanya dapat dilakukanoleh admin yang sudah terdaftar padadatabase. Halaman ini digunakansebagai portal untuk masuk kehalaman penginputan data. Untukpenjelasan script dalam pembuatantampilan ini akan ditampilkan padaListing Program bagian *)HalamanLogin Admin.

3.7.6 Tampilan Halaman InputanData

Gambar 3.27 Tampilan Halaman InputanData

Halaman ini digunakan untukmengiput data – data yang ada. Untukpenjelasan script dalam pembuatantampilan ini akan ditampilkan padaListing Program bagian *)HalamanInputan Data.

3.7.7 Tampilan Halaman ViewData

Gambar 3.28 Tampilan Halaman View Data

Untuk melihat data apasaja yang ada pada database yangsudah diinput sebelumnya padahalaman inputan, digunakan “HalamanView Data”. Untuk penjelasan scriptdalam pembuatan tampilan ini akanditampilkan pada Listing Programbagian *)Halaman View Data.

3.7.8 Tampilan Halaman EditTrayek

Gambar 3.29 Tampilan Halaman Edit Trayek

Halaman ini digunakan untukmengubah (edit) isi data trayek danketentuan – ketentuannya berdasarkanpenginputan yang sudah dilakukansebelumnya pada database melaluihalaman inputan. Untuk penjelasanscript dalam pembuatan tampilan iniakan ditampilkan pada ListingProgram bagian *)Halaman EditTrayek.

3.7.9 Tampilan Halaman EditNama Jalan

Gambar 3.30 Tampilan Halaman Edit NamaJalan

Halaman ini digunakan untukmengubah (edit) isi data nama – namajalan di kota Bogor berdasarkanpenginputan yang sudah dilakukansebelumnya pada database melaluihalaman inputan. Untuk penjelasanscript dalam pembuatan tampilan iniakan ditampilkan pada ListingProgram bagian *)Halaman EditNama Jalan.

4. Pengujian4.1 Pendahuluan

Setelah perancangan danpembuatan sistem berbasis web iniselesai dilakukan, maka tahapselanjutnya adalah dilakukannyapengujian sistem. Pengujian sistem inidilakukan melalui server lokal /komputer personal dan belumdilakukan melelui internet karenabelum melewati tahap upload sehingga

belum diketahui apakah sistem inidapat berjalan dengan semestinya jikadiakses oleh banyak user melaluiinternet.

Pengujian sistem ini dilakukanmelalui beberapa web browserdiantaranya Internet Explorer, MozillaFirefox, dan Opera. Untukmenjalankan program modul inisebelumnya diaktifkan server yangdigunakan. Bermacam-macam serverdapat digunakan antara lain Apache,Xitami, PWS dan sebagainya.Penggunaan server hanya dapatdigunakan salah satu. Dalam pengujianini digunakan server Apache untukmelihat apakah sistem dapat berjalandengan baik.

4.2 Spesifikasi Perangkat YangDigunakan

Untuk dapat menjalankansistem ini dibutuhkan spesifikasiperangkat keras (hardware) danperangkat lunak (software) sebagaiberikut :

a. Hardware Processor Pentium 3 or Higher RAM 256 Mb or Higher VGA Card 32.0 Mb or Higherb. Software Sistem Operasi : Microsoft

Windows 98 / 2000 / XP / Vista Desain Web : PHPDatabase : MYSQLDesain Peta : MapServerPerancangan : Star UML,Microsoft VisioWord Processing : Microsoft OfficeWord 2003Teknologi Server : ApacheBrowser : Mozilla Firefox,Internet Explorer, Opera

4.3 Pengujian SistemPengujian pada browser dapat

dilakukan dengan cara mengetikkanhttp://localhost/trayek/home. Berikutadalah langkah – langkah yangdilakukan pengguna sistem untukmenjalankan sistem ini :

1. User menekan tombol Startpada taskbar.

2. Kemudian memilih webbrowser pada menu AllProgram | , dalam hal ini usermenggunakan beberapabrowser diantaranya MozillaFirefox, Internet Explorer,dan Opera untukmembandingan kehandalanmasing – masing browserterhadap sistem.

3. Selanjutnya akan munculbeberapa web browser tersebutberupa halaman kosong sepertidiperlihatkan pada gambar dibawah ini :

Gambar 4.1 Tampilan AwalMozilla Firefox

http://localhost/trayek/home

Gambar 4.2 Tampilan AwalInternet Explorer

Gambar 4.3 Tampilan AwalOpera

4. User mengetikkan‘http://localhost/trayek/home.php’ pada browser kosong danmenekan enter untuk masuk kehalaman utama website yanghasilnya masing – masingdapat dilihat pada beberapagambar di bawah ini:

Gambar 4.4 Pengujian HalamanUtama Menggunakan Mozilla

Firefox

Gambar 4.5 Pengujian HalamanUtama Menggunakan Internet

Explorer

Gambar 4.6 Pengujian HalamanUtama Menggunakan Opera

http://localhost/trayek/home.p

5. Setelah user masuk ke halamanutama website maka user dapatlangsung memanfaatkan fasilitas– fasilitas yang ada terutamafasilitas journey planner yangmerupakan salah satu fasilitasutama dari website ini.

6. Melalui fasilitas journey plannerini, user dapat menentukan nama– nama jalan yang diinginkanmelalui opsi “Dari : “ dan opsi“Menuju : “ , dalam pengujianini pengguna sistem melakukanperencanaan perjalanannya(jorney planner) dari “Jl. AhmadYani” menuju ke “Bantarjati”.Setelah opsi – opsi ditentukan,selanjutnya pengguna sistemmenekan button “Proses” yanghasilnya dapat dilihat padabeberapa gambar berikut ini :

Gambar 4.7 Pengujian Journey PlannerMenggunakan Mozilla Firefox

Gambar 4.8 Pengujian Journey PlannerMenggunakan Internet Explorer

Gambar 4.9 Pengujian Journey PlannerMenggunakan Opera

7. Setelah button “Proses” ditekan,maka akan tampil hasil outputfasilitas journey planner berupainformasi mengenai trayekangkutan umum yangdiinginkan. Pada pengujian ini,user ingin mengetahui trayek apayang digunakan jika inginmelakukan perjalanan dari “Jl.Ahmad Yani” menuju ke“Bantarjati”. Hasil informasiyang diperoleh adalah user akanmenggunakan trayek angkutanumum bernomor trayek 07 yang

digunakan dari “Jl. AhmadYani”, kemudian transit atauganti angkutan umum bernomortrayek 08 di “Jl. Jend.Sudirman”, kemudian turun ataudengan kata lain perjalananberakhir di “Bantarjati”.

8. User mendapatkan informasisesuai dengan apa yangdiinginkan. Selain sebuahinformasi trayek, penggunasistem juga mendapatkansebuah link bertuliskan “LihatPeta” yang apabila ditekan akanmembawa user menuju kehalaman peta dari trayekangkutan umum yangbersangkutan. Untuk tampilanmasing – masing peta dapatdilihat pada beberapa gambar dibawah ini :

Gambar 4.10 Pengujian OutputPeta Menggunakan Mozilla

Firefox

Gambar 4.11 Pengujian OutputPeta Menggunakan Internet

Explorer

Gambar 4.12 Pengujian OutputPeta Menggunakan Opera

9. Ketiga gambar di atasmerupakan hasil output darijourney planner yangdilakukan sebelumnya padahalaman utama website. Padapeta tersebut terlihat sketsajalan – jalan raya di kota Bogoryang dilalui oleh angkutanumum, untuk jalan raya yangditandai warna merahmenandakan bahwa jalantersebut dilalui oleh angkutanumum bernomor trayek 07,sedangkan warna biru

menandakan bahwa jalantersebut dilalui oleh angkutanumum bernomor trayek 08.Untuk keterangan lebih detailbisa dilihat pada “Legenda”.Halaman peta ini jugamemiliki beberapa tools yangdigunakan untuk memperbesaratau mengecilkan skala petadan mengubah posisi petasesuai dengan yang diinginkan.

10. Pada halaman peta jugaterdapat sebuah link yangapabila ditekan akan membawauser menuju ke halaman utamawebsite.

11. Selain menggunakan fasilitasjourney planner, user juga bisamendapatkan informasi seputartrayek angkutan umum melaluimenu “Info”. Melalui menuini, user dapat mengetahuitrayek apa saja yang melaluijalan – jalan utama di kotaBogor secara keseluruhan,termasuk tarif angkutan umumsesuai dengan ketentuan yangberlaku. Tampilan halaman“Info” dapat dilihat padagambar dibawah ini :

Gambar 4.13 PengujianHalaman Info Menggunakan

Mozilla Firefox


Internet Explorer


Opera

12. Sedangkan menu “AboutUs” digunakan untukmengetahui profil dariwebsite itu sendiri dan carapenggunaan website, sepertiterlihat pada ketiga gambardi bawah ini :

Gambar 4.16 PengujianHalaman About Us

Menggunakan MozillaFirefox


Menggunakan Internet Explorer


Menggunakan Opera13. Untuk melakukan pengolahan

data pada sistem, diperlukansebuah aplikasi manajemendata untuk administratorsistem. Admin mengetikkan

http://localhost/trayek/adminpada web browser untuk dapatmenuju ke halaman loginadmin dan menginput namaadmin dan password sesuaidengan identitas admin yangsudah terdaftar pada databasesebelum akan melakukanpengolahan data pada sistem,yang tampilannya dapat dilihatpada gambar berikut :

Gambar 4.19 PengujianHalaman Login Admin

Menggunakan Mozilla Firefox

Gambar 4.20 PengujianHalaman Login Admin

Menggunakan Internet Explorer

http://localhost/trayek/admin

Gambar 4.21 PengujianHalaman Login AdminMenggunakan Opera

14. Setelah admin melakukanlogin lalu menekan “enter”atau menekan button “LOGIN”pada form login admin danakan menuju ke halamaninputan data yang hasilnyadapat dilihat pada gambar dibawah ini :

Gambar 4.22 Pengujian InputData Menggunakan Mozilla

Firefox

Gambar 4.23 Pengujian InputData Menggunakan Internet

Explorer

Gambar 4.24 Pengujian InputData Menggunakan Opera

15. Admin dapat melihat data apasaja yang sudah diinputdengan menekan menu “Viewtrayek” yang terletak disebelah kanan atas halamanwebsite, untuk hasilnyamasing – masing dapat dilihatpada gambar berikut ini :

Gambar 4.25 Pengujian ViewData Menggunakan Mozilla

Firefox

Gambar 4.26 Pengujian ViewData Menggunakan Internet

Explorer

Gambar 4.27 PengujianView DataMenggunakan Opera

16. Melalui halaman view, admindapat mengubah (edit) datayang telah diinput sebelumnyadengan cara menekan menu “Edit trayek” yang terletak disebelah masing – masing tabeldatabase, untuk tampilannyamasing – masing dapat dilihatpada gambar di bawah ini :

Gambar 4.28 Pengujian EditTrayek Menggunakan Mozilla

Firefox

Gambar 4.29 Pengujian EditTrayek Menggunakan Internet

Explorer

Gambar 4.30 Pengujian EditTrayek Menggunakan Opera

Gambar 4.31 Pengujian EditNama Jalan Menggunakan

Mozilla Firefox


Internet Explorer


Opera

17. Website ini juga memilikiRelated Links atau link – linkterkait yang dapatdimanfaatkan oleh penggunasistem yang membutuhan,

diantaranya adalah link menujuke “Website Pemerintah KotaBogor”, “Website DepartemenPerhubungan RI”, “WEB GISKota Bogor”, dan “WebsiteISP (Internet Service Provider)Kota Bogor / Bonet (BogorInternet)”.

4.4 EvaluasiSetelah pengujian sistem

dilakukan dengan menggunakanbeberapa browser , tahap selanjutnyaadalah melakukan evaluasi. Dalampengujian sistem menggunakan ketigabrowser di atas, tidak ditemukankendala atau masalah – masalah yangmengakibatkan sistem menjaditerganggu. Perbedaan yang terlihathanyalah pada waktu respon masing –masing browser yang memilikiperbedaan dalam hal kecepatan waktupengaksesan sistem.

Dalam pengujian inididapatkan sebuah kesimpulan bahwaweb browser yang paling handal untukdigunakan oleh sistem ini adalahMozilla Firefox, hal ini dapatdibuktikan oleh waktu respon browseryang relatif lebih cepat dankeamananannya berupa blocker(digunakan untuk mencegah serangan– serangan web luar) sehinggamembuat fungsi sistem menjadi lebihoptimal dibandingkan dengan browserInternet Explorer dan Opera.

5. Penutup

5.1 KesimpulanDalam penulisan ini telah

dibuat Sistem Informasi TrayekAngkutan Umum Kota Bogor Berbasis

Web, dimana melalui sistem inipengguna sistem diberi kemudahandalam merencanakan perjalanannyasesuai dengan trayek angkutan umumyang diinginkan kapanpun dandimanapun pengguna sistem berada,selama memiliki koneksi ke internet.Dalam Hal ini pengguna sistem jugabisa memperoleh berita atau informasiseputar trayek angkutan umum secaraup to date. Kekurangan dari sistem iniadalah visualisasi peta trayek yangmasih sangat sederhana danperhitungan akurasi resolusi peta yangkurang tepat dalam pembuatan sistemsehingga terkadang mengakibatkantampilan output peta menjadi “pecah”.Kekurangan lainnya adalah kurangnyaanimasi dan audio yang digunakanagar pengguna sistem dapat lebihtertarik dan merasa tidak bosan untukmenggunakan sistem.

5.2 SaranSangat diharapkan kepada

siapa saja yang menggunakan sistemini untuk dapat mengembangkan danmenyempurnakannya agar lebih baiklagi. Terutama dari visualisasi peta danresolusi peta serta penambahanfasilitas berupa penambahan suara –suara dan animasi yang digunakanagar para pengguna lebih tertarikuntuk menggunakan sistem ini.Misalnya visualisasi peta yang dibuatsecara 3D (tiga dimensi),menambahkan animasi trayek berupaangkutan umum yang berjalanmelewati jalan raya, suara – suarakendaraan yang muncul ketikapengguna menekan tombol proses atausuara – suara menarik yang muncul

ketika pengguna menekan tombolmenu atau link halaman website, dansebagainya. Namun perlu diperhatikanpenyesuaian spesifikasi hardware dansoftware yang digunakan ketika akanmengembangkan sistem agar tidakterjadi gangguan – gangguan yangmengakibatkan sistem menjadi tidakstabil.

Daftar Pustaka

[1] Jogiyanto Hartono, PengenalanKomputer, Dasar IlmuKomputer, Pemrograman,Sistem Informasi danIntelegensi Buatan, ANDI,Yogyakarta, 1999.

[2] Jack Febrian, MenggunakanInternet, Informatika Bandung,Bandung, 2007.

[3] http://uml.org [8 September 2008]

[4] Jack Febrian, Kamus Komputerdan Teknologi Informasi ,Informatika Bandung,Bandung, 2004.

[5] Abdul Kadir, DasarPemrograman WEB DinamisMenggunakan PHP, AndiYogyakarta, Yogyakarta, 2002.

[6] Bimo Sunarfrihantono, PHPdan MySQL Untuk Web, AndiYogyakarta, Yogyakarta, 2002.

[7] Denny Charter, Cara KerjaMapServer, Mei 2008.

http://uml.org

[8] Ruslan Nuryadin, PanduanMenggunakan MapServer,Informatika Bandung,Bandung, 2005.

[9] http://httpd.apache.org/[8 September 2008]

[10] David Sugianto, HapsoroRenaldy N., MuhammadFarhan Sjaugi, Langkah DemiLangkah Membangun Websitedengan PHP, Datakom,Jakarta, 2005.

http://httpd.apache.org/

artikel_10104469.pdf

Documents