iii
UNI VERSI TAS BI NA NUSANTARA
_______________________________________________________________
Jurusan Teknik Informatika Skripsi Sarjana Komputer Semester Ganjil tahun 2006/2007
PERANCANGAN WEBSITE BERBASIS MULTIMEDIA PADA SHOWROOM MOBIL MJ AUTOSHOP WILAYAH SERPONG
William Liady 0600615135 Kelas 09MAT
Abstrak
MJ Autoshop adalah sebuah showroom mobil bekas yang sudah memiliki 2 tempat untuk show unit dan 1 kantor manajemen. Guna meningkatkan daya saing dan kualitas dari pelayanan yang bisa diberikannya, dibuatlah sebuah layanan website bagi para pelanggannya. Selain itu, diharapkan melalui website ini para pelanggan yang berdomisili jauh dari showroom dapat berinteraksi dengan showroom baik dalam pengadakan transaksi ataupun dalam permintaan layanan customer service dari showroom. Metode penelitian yang digunakan dalam pengembangan sistem adalah IMSDD (Interactive Multimedia System Design and Development). Dimana dalam mengumpulkan data yang diperlukan untuk mengembangkan sistem ini adalah melalui studi kepustakaan dan metode penelitian lapangan dengan membagikan kuisioner kepada para pelanggan dari showroom MJ Autoshop. Hasil yang dicapai dari pengimplementasian dan evaluasi sistem ini adalah Website showroom mobil MJ Autoshop ini cukup menarik dan mudah digunakan oleh user. Selain itu berbagai jenis layanan dan fitur yang disediakan juga cukup berguna dan lengkap bagi pelanggan MJ Autoshop. Maka simpulan yang didapat adalah bahwa website ini dapat membantu dalam meningkatkan daya saing dan kualitas penyediaan layanan showroom mobil MJ Autoshop bagi para pelanggannya. Website ini dapat meningkatkan pemasaran showroom mobil MJ Autoshop dan mengurangi biaya operasional dalam mempromosikan showroom MJ Autoshop.
iv PRAKATA
Pertama – tama penulis mengucapkan puji dan syukur kepada Tuhan Yang Maha Esa atas berkat, rahmat, kesehatan dan karunia-Nya yang telah diberikan kepada penulis sehingga penulis dapat menyelesaikan skripsi ini tepat pada waktunya.
Penulisan skripsi ini merupakan salah satu syarat untuk memperoleh gelar sarjana Strata-1 jurusan Teknik Informatika pada Universitas Bina Nusantara.
Skripsi ini tidak akan selesai dengan baik tanpa bantuan dan dorongan yang telah diberikan oleh semua pihak dalam penyusunan skripsi ini. Oleh karena itu, pada kesempatan ini dari lubuk hati yang paling dalam, penulis ingin mengucapkan terima kasih yang sebesar – besarnya kepada yang terhormat :
1. Bapak Prof. Dr. Gerardus Polla, M.App.Sc. Selaku Rektor Universitas Bina Nusantara yang telah memberikan kesempatan bagi penulis untuk menyelesaikan skripsi di Universitas Bina Nusantara.
2. Bapak H.M. Subekti, BE,M.Sc. Selaku ketua Jurusan Teknik Informatika Universitas Bina Nusantara, yang telah memberikan nasehat dan memotivasi penulis selama mengikuti pendidikan di Universitas Bina Nusantara.
3. Bapak Felix Oktarianto, S.Kom,MM. Selaku dosen pembimbing, yang telah membimbing dan mengarahkan penulis dalam menyelesaikan skripsi ini.
v
5. Segenap staf dosen dan pengajar Universitas Bina Nusantara yang telah memberikan pengarahan dan bimbingan akademis kepada penulis selama masa perkuliahan.
6. Orang tua penulis yang sepenuh hati mendukung dalam doa dan nasehat yang bijak dan berarti yang mendorong penulis untuk menyelesaikan skripsi ini dengan baik.
7. Natania Masuang Zantika, yang senantiasa mendorong dan sangat mendoakan penulis serta memberikan semangat saat penulis mengalami jalan buntu dalam menyelesaikan skripsi ini.
8. Seluruh pihak lain yang telah memberikan bantuan, dukungan dan semangat secara langsung maupun tidak langsung yang namanya penulis tidak cantumkan. Walaupun penulis berusaha semaksimal mungkin, penulis menyadari bahwa penulis tidak lepas dari segala kekurangan karena pengetahuan dan pengalaman yang masih kurang memadai. Oleh karena itu, saran dan kritik yang bersifat membangun akan sangat kami hargai. Akhir kata penulis berharap semoga skripsi ini dapat bermanfaat bagi pengembangan dan penelitian selanjutnya, khususnya di Universitas Bina Nusantara.
Jakarta, Januari 2007
vi
DAFTAR ISI
Halaman Judul Luar Halaman Judul Dalam
Halaman Persetujuan Hardcover...i
Halaman Pernyataan dewan penguji...ii
Abstrak... iii
Prakata...iv
Daftar Isi...vi
Daftar Tabel...xiii
Daftar Gambar...xiv
Daftar Lampiran...xix
BAB I PENDAHULUAN 1.1 Latar Belakang...1
1.2 Ruang Lingkup...2
1.3 Tujuan dan Manfaat...2
1.4 Metodologi...3
1.5 Sistematika Penulisan...4
BAB II LANDASAN TEORI 2.1 Multimedia...6
2.1.1 Sejarah Singkat Multimedia...6
vii
2.1.3 Elemen – elemen Multimedia...8
2.1.4 Keuntungan Multimedia...11
2.1.5 Penggunaan Multimedia...13
2.2 Interaksi Manusia dan Komputer...13
2.2.1 Definisi Interaksi Manusia dan Komputer...13
2.2.2 Definisi User Interface ( Antarmuka Pengguna ) ...14
2.2.2.1 Perancangan User Interface...15
2.2.3 Masalah – masalah Interaksi Manusia dan Komputer...17
2.2.4 Pendekatan Interaksi Manusia dan Komputer...18
2.2.5 Sistem Interaktif...19
2.3 Sistem dan Informasi...19
2.3.1 Sistem...19
2.3.1.1 Elemen – elemen Sistem...20
2.3.2 Informasi...21
2.3.3 Sistem Informasi...21
2.4 Internet...23
2.4.1 Pengertian Internet...23
2.4.2 Pengertian World Wide Web...23
2.4.3 Pengertian Website...23
2.5 Basis Data...24
2.5.1 Sistem Basis Data...24
2.5.2 Interactive Multimedia System Design and Development (IMSDD) ...24
viii
2.6 Pemasaran...27
2.6.1 Definisi Pemasaran...27
2.6.2 Konsep Pemasaran...28
2.7 SWOT...28
2.7.1 Definisi SWOT...28
BAB III ANALISIS SISTEM YANG BERJALAN 3.1 Riwayat Perusahaan...30
3.2 Struktur Organisasi...32
3.2.1 Struktur Organisasi Perusahaan...32
3.2.2 Tugas dan Tanggung Jawab...33
3.3 Prosedur yang Sedang Berjalan...36
3.3.1 Analisa Prosedur yang Berjalan...36
3.3.2 Tahapan Analisa Prosedur...38
3.4 Diagram Aliran Data...40
3.4.1 Diagram Hubungan Sistem Informasi...40
3.4.2 Diagram Nol...41
3.5 Analisis Sistem...42
3.5.1 Analisis SWOT...42
3.5.2 Analisis Kebutuhan Sistem...45
3.5.2.1 Hasil Pengembalian Kuisioner...46
3.5.2.2 Analisa Hasil Kuisioner Awal...58
ix
3.6 Permasalahan yang Dihadapi...61
3.7 Alternatif Pemecahan Masalah...62
3.8 Solusi yang Dipilih...63
3.9 Perancangan Sistem...64
3.9.1 Rancangan Hirarki / Struktur Menu...64
3.9.1.1 Rancangan Struktur Front End...64
3.9.1.1.1 Rancangan Struktur Menu Utama...64
3.9.1.1.2 Rancangan Struktur Menu Gallery...66
3.9.1.1.3 Rancangan Struktur Menu Price List...66
3.9.1.1.4 Rancangan Struktur Menu Order...67
3.9.1.1.5 Rancangan Struktur Menu Leasing...67
3.9.1.1.6 Rancangan Struktur Menu Contact Us...67
3.9.1.1.7 Rancangan Struktur Menu About Us...68
3.9.1.2 Rancangan Struktur Back End...68
3.9.2 Rancangan State Transition Diagram...70
3.9.2.1 Rancangan State Transition Diagram Front End...70
3.9.2.1.1 Rancangan State Transition DiagramWebsite...70
3.9.2.1.2 Rancangan State Transition Diagram Halaman Utama...71
3.9.2.1.3 Rancangan State Transition Diagram Gallery...71
3.9.2.1.4 Rancangan State Transition Diagram Price List...72
3.9.2.1.5 Rancangan State Transition Diagram Order...72
x
3.9.2.1.7 Rancangan State Transition Diagram Contact Us...73
3.9.2.1.8 Rancangan State Transition Diagram About Us...74
3.9.2.2 Rancangan State Transition Diagram Back End...75
3.9.2.2.1 Rancangan State Transition DiagramHome Admin...76
3.9.2.2.2 Rancangan State Transition DiagramGallery Admin...77
3.9.2.2.3 Rancangan State Transition Diagram Price List Admin...78
3.9.2.2.4 Rancangan State Transition Diagram Order Admin...79
3.9.2.2.5 Rancangan State Transition Diagram Leasing Admin...80
3.9.2.2.6 Rancangan State Transition Diagram Contact Us Admin...80
3.9.3 Rancangan Layar...81
3.9.3.1 Rancangan Layar Front End...81
3.9.3.1.1 Rancangan Layar Intro...81
3.9.3.1.2 Rancangan Layar Menu Utama...84
3.9.3.1.3 Rancangan Layar Menu Gallery...85
3.9.3.1.4 Rancangan Layar Menu Detil Mobil...86
3.9.3.1.5 Rancangan Layar Menu Price List...87
3.9.3.1.6 Rancangan Layar Menu Order...89
3.9.3.1.7 Rancangan Layar Menu Leasing...90
xi
3.9.3.1.7 Rancangan Layar Menu About Us...92
3.9.3.2 Rancangan Layar Back End...93
3.9.3.2.1 Rancangan Layar Admin Menu Login...93
3.9.3.2.2 Rancangan Layar Admin Menu Utama...94
3.9.3.2.3 Rancangan Layar Admin Menu Gallery...95
3.9.3.2.4 Rancangan Layar Admin Menu Price List...96
3.9.3.2.5 Rancangan Layar Admin Menu Order...98
3.9.3.2.6 Rancangan Layar Admin Menu Update Mobil...99
3.9.3.2.7 Rancangan Layar Admin Menu Contact Us...100
3.9.4 Rancangan Database...101
3.9.5 Spesifikasi Proses...111
BAB IV IMPLEMENTASI DAN EVALUASI 4.1 Implementasi...133
4.1.1 Sarana yang dibutuhkan dalam pembangunan Websiteshowroom MJ Autoshop...133
4.1.2 Sarana yang dibutuhkan dalam implementasi Websiteshowroom MJ Autoshop...134
4.1.3 Rencana Implementasi...136
4.2 Cara Pengoperasian Aplikasi...137
4.2.1 Pengoperasian Aplikasi untuk User...137
4.2.2 Pengoperasian Aplikasi untuk Admin...158
4.3 Evaluasi Aplikasi...181
xii
4.3.2 Evaluasi dari Sudut Pandang IMK………...181 4.3.3 Evaluasi berdasarkan elemen – elemen
multimedia………...183 BAB V SIMPULAN DAN SARAN
5.1 Simpulan...188 5.2 Saran...189 DAFTAR PUSTAKA
RIWAYAT HIDUP
LAMPIRAN-LAMPIRAN
xiii
DAFTAR TABEL
Tabel 3.1 Tabel Hasil Kuisioner...58
Tabel 3.2 Tabel tabadmin...101
Tabel 3.3 Tabel tabcars...102
Tabel 3.4 Tabel tabgallery...103
Tabel 3.5 Tabel tabmember...105
Tabel 3.6 Tabel tabmerek...106
Tabel 3.7 Tabel tabnewcars...107
Tabel 3.8 Tabel taborder...108
Tabel 3.9 Tabel tabpriceyear...110
xiv
DAFTAR GAMBAR
Gambar 2.1 Interactive Multimedia System Design and Development...26
Gambar 3.1 Struktur Organisasi MJ Autoshop...32
Gambar 3.2 Tahapan Pembelian Kendaraan...38
Gambar 3.3 Tahapan Penjualan Kendaraan...39
Gambar 3.4 Diagram Hubungan Sistem Informasi...40
Gambar 3.5 Diagram Nol Sistem...41
Gambar 3.6 Struktur Menu Utama...64
Gambar 3.7 Struktur Menu Gallery...66
Gambar 3.8 Struktur Menu Price List...66
Gambar 3.9 Struktur Menu Order...67
Gambar 3.10 Struktur Menu Leasing...67
Gambar 3.11 Struktur Menu Contact Us...67
Gambar 3.12 Struktur Menu About Us...68
Gambar 3.13 Struktur Menu Back End...69
Gambar 3.14 Rancangan StateTransition Diagram Website...70
Gambar 3.15 Rancangan StateTransition Diagram Halaman Utama...71
Gambar 3.16 Rancangan StateTransition Diagram Gallery...71
Gambar 3.17 Rancangan StateTransition Diagram Price List...72
Gambar 3.18 Rancangan StateTransition Diagram Order...72
Gambar 3.19 Rancangan StateTransition Diagram Leasing...73
Gambar 3.20 Rancangan StateTransition Diagram Contact Us...73
xv
Gambar 3.22 Rancangan State Transition Diagram Back End...75
Gambar 3.23 Rancangan State Transition Diagram Home Admin...76
Gambar 3.24 Rancangan State Transition Diagram Gallery Admin...77
Gambar 3.25 Rancangan State Transition Diagram Price List Admin...78
Gambar 3.26 Rancangan State Transition Diagram Order Admin...79
Gambar 3.27 Rancangan State Transition Diagram Leasing Admin...80
Gambar 3.28 Rancangan State Transition Diagram Contact Us Admin...80
Gambar 3.29 Rancangan Layar Intro bagian 1...81
Gambar 3.30 Rancangan Layar Intro bagian 2...81
Gambar 3.31 Rancangan Layar Intro bagian 3...82
Gambar 3.32 Rancangan Layar Intro bagian 4...82
Gambar 3.33 Rancangan Layar Menu Utama...84
Gambar 3.34 Rancangan Layar Menu Gallery...85
Gambar 3.35 Rancangan Layar Menu Detil Mobil...86
Gambar 3.36 Rancangan Layar Menu Price List bagian Mobil Baru...87
Gambar 3.37 Rancangan Layar Menu Price List bagian Mobil Bekas...88
Gambar 3.38 Rancangan Layar Menu Order...89
Gambar 3.39 Rancangan Layar Menu Leasing...90
Gambar 3.40 Rancangan Layar Menu Contact Us...91
Gambar 3.41 Rancangan Layar Menu About Us ...92
Gambar 3.42 Rancangan Layar Admin Menu Login...93
Gambar 3.43 Rancangan Layar Admin Menu Utama...94
Gambar 3.44 Rancangan Layar Admin Menu Gallery...95
xvi
Gambar 3.46 Rancangan Layar Admin Menu Price List untuk Mobil Bekas...97
Gambar 3.47 Rancangan Layar Admin Menu Order...98
Gambar 3.48 Rancangan Layar Admin Menu Update Mobil...99
Gambar 3.49 Rancangan Layar Admin Menu Contact Us...100
Gambar 4.1 Tampilan Layar Halaman Intro Bagian 1...137
Gambar 4.2 Tampilan Layar Halaman Intro Bagian 2...138
Gambar 4.3 Tampilan Layar Halaman Intro Bagian 3...139
Gambar 4.4 Tampilan Layar Halaman Intro Bagian 4...140
Gambar 4.5 Tampilan Layar Halaman Utama Website...142
Gambar 4.6 Tampilan Layar Halaman Utama Menu Gallery...143
Gambar 4.7 Tampilan Layar Menu Gallery berdasarkan Merk...144
Gambar 4.8 Tampilan Layar Menu Gallery bagian Detil Mobil...145
Gambar 4.9 Tampilan Layar Utama Menu Order...146
Gambar 4.10 Tampilan Layar Utama Menu Order dengan Validasi...147
Gambar 4.11 Tampilan Layar Utama Menu Order Sukses...148
Gambar 4.12 Tampilan Layar Utama Menu Leasing via Menu Gallery...149
Gambar 4.13 Tampilan Layar Utama Menu Leasing...150
Gambar 4.14 Tampilan Layar Utama Menu Leasing dengan Validasi...151
Gambar 4.15 Tampilan Layar Utama Menu Leasing Sukses...152
Gambar 4.16 Tampilan Layar Utama Menu Price List Harga Mobil Baru...153
Gambar 4.17 Tampilan Layar Utama Menu Price List Harga Mobil Bekas...154
Gambar 4.18 Tampilan Layar Utama Menu Price List show Harga Mobil Baru...155
Gambar 4.19 Tampilan Layar Utama Menu Price List show Harga Mobil Bekas...156
xvii
Gambar 4.21 Tampilan Layar Utama Menu About Us...158
Gambar 4.22 Tampilan Layar Utama Login Admin...159
Gambar 4.23 Tampilan Layar Login Admin dengan Validasi...160
Gambar 4.24 Tampilan Layar Utama Admin...162
Gambar 4.25 Tampilan Layar Admin Data Member...163
Gambar 4.26 Tampilan Layar Admin Form Tambah Member Baru...164
Gambar 4.27 Tampilan Layar Admin Form Tambah Member dengan Validasi...165
Gambar 4.28 Tampilan Layar Admin Form Ubah Member...166
Gambar 4.29 Tampilan Layar Admin Form Tambah Merk Mobil...167
Gambar 4.30 Tampilan Layar Admin Form Tambah Gambar Mobil Bekas...168
Gambar 4.31 Tampilan Layar Admin Form Tambah Gambar Mobil Bekas...169
Gambar 4.32 Tampilan Layar Admin Form Ubah Merk Mobil...170
Gambar 4.33 Tampilan Layar Admin Form Ubah Gambar Mobil Bekas...171
Gambar 4.34 Tampilan Layar Admin Harga Mobil Baru...172
Gambar 4.35 Tampilan Layar Admin Harga Mobil Bekas...173
Gambar 4.36 Tampilan Layar Admin Form Tambah Data Mobil Baru...174
Gambar 4.37 Tampilan Layar Admin Form Tambah Data Mobil Bekas...175
Gambar 4.38 Tampilan Layar Admin Form Ubah Harga Mobil Baru...176
Gambar 4.39 Tampilan Layar Admin Form Ubah Harga Mobil Bekas...177
Gambar 4.40 Tampilan Layar Admin Menu Order...178
Gambar 4.41 Tampilan Layar Admin Tabel Detil Order...179
Gambar 4.42 Tampilan Layar Admin Menu Contact Us...180
Gambar 4.43 Elemen teks halaman price list website...184
xviii
Gambar 4.45 Elemen gambar pada halaman galeri...185
Gambar 4.46 Elemen animasi pada layar intro...186
Gambar 4.47 Elemen animasi pada bagian banner website...186
Gambar 4.48 Tombol on / off elemen suara pada halaman utama...187
xix
