PEMBANGUNAN FORUM BENGKEL, DEALER, DAN CARA PERAWATAN MOBIL DI INDONESIA BERBASIS RESPONSIVE WEB DESIGN

Transkripsi

1 PEMBANGUNAN FORUM BENGKEL, DEALER, DAN CARA PERAWATAN MOBIL DI INDONESIA BERBASIS RESPONSIVE WEB DESIGN TUGAS AKHIR Diajukan Untuk Memenuhi Sebagian Persyaratan Mencapai Derajat Sarjana Teknik Informartika Oleh: KADEK AGUS DWIWIJAYA NPM: PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS TEKNOLOGI INDUSTRI UNIVERSITAS ATMA JAYA YOGYAKARTA 2014 i

2 ii

3 Halaman Persembahan Bangun di fajar subuh dengan hati seringan awan, Mensyukuri hari baru penuh sinar kecintaan, Istirahat di terik siang merenungkan puncak getaran cinta, Pulang di kala senja dengan syukur penuh di rongga dada, Kemudian terlena dengan doa bagi yang tercinta dalam sanubari, Dan sebuah nyanyian kesyukuran terpahat di bibir senyuman... (Kahlil Gibran) Keindahan adalah kehidupan itu sendiri saat ia membuka tabir penutup wajahnya. Dan kalian adalah kehidupannya itu, kalianlah cadar itu. Keindahan adalah keabadian yang termangu di depan cermin. Dan kalian adalah keabadian itu, kalianlah cermin itu. (Kahlil Gibran) Sebab kehidupan tidak berjalan mundur, pun tidak tenggelam dimasa lampau. (Kahlil Gibran) Puisi yang selalu menginspirasi Penulis Kadek Agus Dwiwijaya iii

4 KATA PENGANTAR Rasa dan Puji syukur penulis haturkan kehadapan Ida Sang Hyang Widhi Wasa dan Bhagawan Sri Satya Sai Baba, karena atas rahmat, berkat, dan tuntunan-nya penulis dapat menyelesaikan laporan skripsi ini dengan baik. Skripsi merupakan salah satu tugas akhir yang diwajibkan kepada mahasiswa Program Studi Teknik Informatika Fakultas Teknologi Industri Universitas Atma Jaya Yogyakarta setelah lulus mata kuliah teori, praktikum, dan kerja praktek. Tujuan dari pembuatan skripsi ini adalah sebagai salah satu syarat untuk mencapai derajat sarjana Teknik Informatika dari Program Studi Teknik Informatika Fakultas Teknologi Industri Universitas Atma Jaya Yogyakarta. Dalam kesempatan ini pula, penulis tidak lupa mengucapkan terima kasih yang sedalam-dalamnya kepada : 1. Bapak Dr. Drs.A. Teguh Siswantoro, M.sc. selaku Dekan Fakultas Teknologi Industri Universitas Atma Jaya Yogyakarta. 2. Bapak B. Yudi Dwiandiyanta, S.T., M.T. selaku Kepala Program Studi Teknik Informatika Fakultas Teknologi Industri Universitas Atma Jaya Yogyakarta. 3. Bapak Thomas Adi Purnomo Sidhi, S.T., M.T. selaku Dosen Pembimbing I. 4. Bapak B. Yudi Dwiandiyanta, S.T., M.T. selaku Dosen Pembimbing II. 5. Ayahanda Drs. I Nengah Korja dan Ibunda Ni Made Sukerawi selaku orang tua penulis yang tiada henti- iv

5 hentinya selalu mendoakan, memberikan dukungan dan perhatian dalam segala hal untuk penulis. 6. Saudara I Gede Yogantara Teguh Eko Wijaya yang selalu mendoakan dan memberikan dukungan dalam pembuatan skripsi. 7. Keluarga besar yang selalu memberikan perhatian bimbingan dan doa restu. 8. Semua Dosen TF UAJY, karyawan-karyawan kantor Campus Ministry, Kantor Sistem Informasi UAJY, dan temanteman Leaders Community, TF, TI, FE, FISIP, Arsitek, Biologi, Sipil, remaja Sapta Dharma Yogyakarta, serta semua elemen yang tidak bisa penulis sebutkan satu per satu. 9. Teman-teman geng kontrakan Alnafi yang selalu memberikan dukungan dan semangat moril kepada penulis. 10. Para digimon alnafi : Rambomon, Yukomon, dan Roxymon yang selalu memberikan semangat dan dukungan kepada penulis melalui tingkah-tingkah mereka yang lucu dan menggemaskan. 11. Teman-teman sejati yang memiliki kesetiakawanan sangat tinggi yang telah membantu penulis. Yogyakarta, 7 Juli 2014 Penulis v

6 DAFTAR ISI Halaman Pengesahan... Error! Bookmark not defined. Halaman Persembahan... ii KATA PENGANTAR... iv DAFTAR ISI... vi DAFTAR TABEL... x DAFTAR GAMBAR... xi INTISARI... xiii BAB I Latar Belakang Masalah Rumusan Masalah Tujuan Penelitian Batasan Masalah Metodologi Penelitian Sistematika Penulisan Tugas Akhir... 6 BAB II... 8 BAB III LANDASAN TEORI Internet Website Forum Framework MySQL Arsitektur Aplikasi Arsitektur Client-Server Arsitektur Model-View-Controller PHP CodeIgniter Basis Data Mobile-Web Jquery Mobile Responsive Web Design Location Based Service (LBS) BAB IV Analisis Sistem Lingkup Masalah Perspektif Produk Kebutuhan Antarmuka Eksternal Antarmuka Pemakai Antarmuka Perangkat Keras Antarmuka Perangkat Lunak Antarmuka Komunikasi Kebutuhan Fungsionalitas Perangkat Lunak Use Case Diagram Spesifikasi Rinci Kebutuhan Use Case Spesification : Login Use Case Spesification : Mendaftar Use Case Spesification : Mencari Thread vi

7 Use Case Spesification : Melihat Thread Use Case Spesification : Pengelolaan Thread Pribadi Use Case Spesification : Pengelolaan Akun Pribadi Use Case Spesification : Pengelolaan Komentar Pribadi Use Case Spesification : Pengelolaan Thread Use Case Spesification : Pengelolaan Kategori Forum Use Case Spesification : Pengelolaan User Use Case Spesification : Pengelolaan Komentar Perancangan Rinci Sequence Diagram Login Mendaftar Melihat Thread Pengunjung Melihat Thread Pengguna Melihat Thread Mencari Thread Pengguna Melihat Thread Pengguna Mencari Thread Pengelolaan Thread Pribadi Pengguna Membuat Thread Pengguna Mengubah Thread Pengguna Menghapus Thread Pengguna Melihat Daftar Thread Pribadi Pengelolaan Akun Pribadi Mengubah Foto Profil Menghapus Foto Profil Mengubah Kata Sandi Reset Kata Sandi Pengelolaan Komentar Pribadi Pengguna Membuat Komentar Pengguna Mengubah Komentar Pengguna Menghapus Komentar Pengguna Melihat Komentar Pengguna Membuat Komentar Saran Pengguna Mengubah Komentar Saran Pengguna Menghapus Komentar Saran Pengguna Melihat Komentar Saran Pengelolaan Data Thread Menampilkan Daftar Thread Menghapus Daftar Data Thread Mencari Data Thread Pengelolaan Data Kategori Membuat Data Kategori Mengubah Data Kategori Menghapus Data Kategori Mencari Data Kategori Menampilkan Daftar Data Kategori Pengelolaan Data User vii

8 Menampilkan Daftar Data User Menghapus Data User Mencari Data User Pengelolaan Data Komentar Melihat Daftar Data Komentar Menghapus Data Komentar Mencari Data Komentar Class Diagram Class Diagram Specific Descriptions Specific Design Class a_changepass Spesific Desain Class a_addkategori Specific Design Class a_carikategori Specific Design Class a_editkategori Specific Design Class a_kategori Specific Design Class a_carithread Specific Design Class a_thread Specific Design Class a_komentar Specific Design Class a_carikomentar Specific Design Class a_cariuser Specific Design Class a_user Specific Design Class login_admin Specific Design Class t_bengkel Specific Design Class t_bengkel_kota Specific Design Class tl_bengkel Specific Design Class tl_bengkel_kota Specific Design Class t_dealer Specific Design Class t_dealer_kota Specific Design Class tl_dealer Specific Design Class tl_dealer_kota Specific Design Class t_perawatan Specific Design Class tl_perawatan Specific Design Class detailthread Specific Design Class tl_detailthread Specific Design Class buat_thread Specific Design Class ubah_thread Specific Design Class Thread_Anda Specific Design Class t_carithread Specific Design tl_carithread Specific Design Class index Specific Design Class register Specific Design Class login Specific Design Class akun Specific Design Class lupa_password Specific Design Class berikomentarsaran Specific Design Class detailthreadkomentar Specific Design Class ubahkomentarsaran Specific Design Class admin Specific Design Class kategori Specific Design Class Thread Specific Design Class user Specific Design Class komentar Specific Design Class user_admin Specific Design Class login_admin viii

9 Specific Design Class lupa_password Specific Design Class M_Admin Specific Design Class M_Kategori Specific Design Class M_Thread Specific Design Class Data M_User Specific Design Class Data M_Komentar Specific Design Class Data M_User_Admin Specific Design Class Data M_Login_Admin Specific Design Class Data M_Lupa_Password Perancangan Antarmuka Login Mendaftar Beranda Buat Thread Thread Anda Detail Thread Daftar Thread Buat Kategori Deskripsi Dekomposisi Dekomposisi Data Deskripsi Entitas Tabel User Deskripsi Entitas Tabel Kategori Deskripsi Entitas Tabel Thread Deskripsi Entitas Tabel Comment Physical Data Model BAB V Definisi Sistem Implementasi Sistem Hasil Pengujian Hasil Pengujian Terhadap Pengguna Analisis Kelebihan dan Kekurangan Sistem BAB VI DAFTAR PUSTAKA ix

10 DAFTAR TABEL Tabel 2.1 Perbandingan Fungsionalitas dan Kelebihan Sistem Tabel 5.3 Hasil Pengujian Website FORMI Tabel 5.4 Hasil Pengujian Terhadap Pengguna x

11 DAFTAR GAMBAR Gambar 1: Arsitektur Client-server (Morgan, 2004) Gambar 2 : Arsitektur Model-View-Controller (Rozi, 2008) Gambar 3 : Flow chart aplikasi pada CodeIgniter (EllisLab, 2010). 23 Gambar 4: Responsive Web Design(Goran,2013) Gambar : Arsitektur Website FORMI Gambar Use Case Diagram Gambar Entity Relationship Diagram Gambar Sequence Diagram : Login Gambar Sequence Diagram : Mendaftar Gambar Sequence Diagram : Pengunjung Melihat Thread. 64 Gambar Sequence Diagram : Pengguna Melihat Thread Gambar Sequence Diagram : Pengunjung Mencari Thread. 66 Gambar Sequence Diagram : Pengguna Mencari Thread Gambar Sequence Diagram : Pengguna Membuat Thread Gambar Sequence Diagram : Pengguna Mengubah Thread.. 69 Gambar Sequence Diagram : Pengguna Menghapus Thread. 70 Gambar Sequence Diagram : Pengguna Melihat Daftar Thread Pribadi Gambar Sequence Diagram : Mengubah Foto Profil Gambar Sequence Diagram : Menghapus Foto Profil Gambar Sequence Diagram : Mengubah Kata Sandi Gambar Sequence Diagram : Reset Kata Sandi Gambar Sequence Diagram : Pengguna Membuat Komentar. 76 Gambar Sequence Diagram : Pengguna Mengubah Komentar 77 Gambar Sequence Diagram : Pengguna Menghapus Komentar 78 Gambar Sequence Diagram : Pengguna Melihat Komentar. 79 Gambar Sequence Diagram : Pengguna Membuat Komentar Saran Gambar Sequence Diagram : Pengguna Mengubah Komentar Saran Gambar Sequence Diagram : Pengguna Menghapus Komentar Saran Gambar Sequence Diagram : Pengguna Melihat Komentar Saran Gambar Sequence Diagram : Administrator Melihat Daftar Data Thread Gambar Sequence Diagram : Administrator Menghapus data Thread Gambar Sequence Diagram : Administrator Mencari Data Thread Gambar Sequence Diagram : Administrator Membuat Daftar Data Kategori Gambar Sequence Diagram : Administrator Mengubah data Kategori Gambar Sequence Diagram : Administrator Menghapus Data Kategori Gambar Sequence Diagram : Administrator Mencari Data Kategori Gambar Sequence Diagram : Administrator melihat daftar Kategori Gambar Sequence Diagram : Administrator Melihat Daftar Data User xi

12 Gambar Sequence Diagram : Administrator Menghapus data User Gambar Sequence Diagram : Administrator Mencari Data User Gambar Sequence Diagram : Administrator Melihat Daftar Data komentar Gambar Sequence Diagram : Administrator Menghapus data Komentar Gambar Sequence Diagram : Administrator Mencari Data Komentar Gambar Class Diagram Administrator FORMI Gambar Class Diagram Pengguna FORMI Gambar Class Diagram Pengunjung FORMI Gambar Rancangan Antarmuka Login Gambar Rancangan Antarmuka Mendaftar Gambar Rancangan Antarmuka Beranda Gambar Rancangan Antarmuka Buat Thread Gambar Rancangan Antarmuka Thread Anda Gambar Rancangan Antarmuka Buat Thread Gambar Rancangan Antarmuka Buat Thread Gambar Physical Data Model FORMI Gambar Antarmuka Sistem Gambar Antarmuka Login Gambar Antarmuka Login Gambar Antarmuka Buat Thread Pribadi Gambar Antarmuka Ubah Thread Pribadi Gambar Antarmuka Cari Thread Gambar Antarmuka Cari Thread Gambar Antarmuka Buat Komentar Gambar Antarmuka Ubah Komentar Gambar Antarmuka Hapus Komentar Gambar Antarmuka Akun Pribadi Gambar Antarmuka Ganti Kata Sandi Gambar Antarmuka Ubah Foto Profil Gambar Antarmuka Hapus Foto Profil Gambar Antarmuka Hapus Foto Profil Gambar Antarmuka Reset Kata Sandi Gambar Antarmuka Halaman Daftar Kategori Gambar Antarmuka Halaman Tambah Kategori Gambar Antarmuka Halaman Hapus Kategori Gambar Antarmuka Halaman Hapus Kategori Gambar Antarmuka Halaman Cari Kategori Gambar Antarmuka Halaman Daftar Thread Gambar Antarmuka Halaman Cari Thread Gambar Antarmuka Halaman Hapus Thread Gambar Antarmuka Halaman Daftar User Gambar Antarmuka Halaman Cari User Gambar Antarmuka Halaman Hapus User Gambar Antarmuka Halaman Daftar Komentar Gambar Antarmuka Halaman Hapus Komentar Gambar Antarmuka Halaman Cari Komentar Gambar Antarmuka Daftar xii

13 PEMBANGUNAN FORUM BENGKEL, DEALER, DAN CARA PERAWATAN MOBIL DI INDONESIA BERBASIS RESPONSIVE WEB DESIGN KADEK AGUS DWIWIJAYA INTISARI Berbagai forum diskusi online terus berkembang seiring dengan perkembangan teknologi yang mendukungnya. Salah satu forum yang dibutuhkan oleh pengguna adalah forum yang menyediakan informasi yang baik dan akurat dalam suatu kasus dalam hal ini adalah forum yang membahas tentang bengkel, dealer, dan cara perawatan mobil, serta bisa diakses kapanpun, dimanapun, dan oleh siapapun. Pembangunan Forum Bengkel, Dealer dan Cara Perawatan Mobil di Indonesia berbasis Responsive Web Design dilakukan dengan menggunakan framework Codeigniter dan Twitter Bootstrap. Selain pembangunan fungsionalitasnya, dilakukan juga pengintegrasian dengan Responsive Web Design, dan google maps API. Tools yang digunakan adalah Codeigniter 2.1.1, Netbeans 7.0, MySql 1.7.0, dan Apache Web Server Diharapkan dengan pembangunan Forum bengkel, dealer dan cara perawatan mobil di Indonesia berbasis Responsive Web Design ini, maka proses untuk mendapatkan informasi dan berdiskusi tentang segala hal yang berkaitan dengan mobil dapat berlangsung secara lebih baik dan dapat meningkatkan pengetahuan tentang informasi untuk yang diketahui para pemilik mobil atau yang ingin memiliki mobil. Kata kunci : Forum, bengkel Mobil, dealer mobil, cara perawatan mobil, Diskusi, Online, Responsive Web Design, Codeigniter, google map. Pembimbing I : Thomas Adi Purnomo Sidhi, S.T., M.T. Pembimbing II : B.Yudi Dwiandiyanta, S.T., M.T Tanggal Pendadaran : 14 Juli 2014 xiii