BAB III ANALISA DAN PERANCANGAN
Perancangan suatu sistem diperlukan analisis yang tepat sehingga proses pembuatan sistem dapat berjalan dengan lancar dan sistem yang dibuat sesuai dengan yang diinginkan. Setelah analisis perlu dilakukan desain sistem yang bertujuan untuk memberikan gambaran tentang jalannya sistem tersebut. Selain itu,
desain
sistem
juga
bertujuan
mempermudah
programmer
dalam
mengimplementasikan sistem tersebut. Dalam tahap ini penulis akan menganalisa dan menentukan sintesis pada penerapan sistem penjualan di CV. XYZ dengan merancang sebuah aplikasi sistus penjualan berbasis web. Kemudian akan diimplementasikan sesuai data – data yang sudah diperoleh pada analisis.
3.1 Profil Perusahaan 3.1.1 Latar Belakang CV. XYZ berdiri pada tahun 2005 adalah perusahaan yang bergerak dalam bidang jual – beli mobil bekas. Dengan kondisi ekonomi yang sangat sulit banyak sekali masyarakat yang tidak mampu untuk membeli mobil baru, Sebagai perusahaan yang bergerak dibidang bisnis penjualan dan pembelian mobil bekas serta tukar tambah mobil bekas baik secara cash maupun kredit, CV. XYZ berpengalaman menaungi berbagai jenis kendaraan seperti sedan, minibus, city car, SUV maupun pickup dari berbagai merk antara lain : Toyota, Daihatsu, Suzuki, Isuzu dan berbagai jenis dan merk kendaraan lainnya. Setiap kendaraan dihadirkan sesuai kebutuhan dari pelanggan. Dari hasil survey beberapa showroom mobil, akhir – akhir ini permintaan mobil bekas cukup tinggi. Terutama untuk harga mobil antara Rp 50.000.000,sampai Rp 100.000.000,-. Sebagian besar pembelinya adaah pengusaha, karyawan
27
28
dan pegawai pemrintahan. Ada yang membeli secara tunai atau kredit. Untuk pembeian secara kredit diserahkan kepada perusahaan penyedia jasa keuangan.
3.1.2 Visi dan Misi Visi dari CV. XYZ adalah sebagai berikut : 1. Menjadi
perusahaan
yang
dapat
menghantarkan
masyarakat
pada
kesejahteraan hidup.
Misi dari CV. XYZ adalah sebagai berikut : 1. Menyediakan sarana sehingga masyarakat dengan mudah mendapatkan kendaraan khususnya roda empat. 2. Memfasilitasi pembiayaan kepada penyedia jasa keuangan sehingga masyarakat dengan mudah mendapatkan kendaraan khususnya kendaraan roda empat. 3. Memberikan kesempatan seluas – luasnya kepada masyarakat untuk berperan aktif dalam kegiatan usaha. 4. Memberikan masyarakat peluang usaha yang produktif.
3.1.3 Tujuan CV. XYZ mempunyai tujuan sebagai berikut 1. Dengan adanya perusahaan jual beli mobil bekas di harapkan masyarakat lebih antusias untuk membeli kendaraan roda empat karena aksesnya lebih mudah. 2. Dengan pelayanan yang baik diharapkan masyarakat dapat membedakan perusahaan kami dengan para pesaing. 3. Dengan adanya visi dan misi perusahaan, diharapkan akan memberikan dampak yang baik pada citra dan image perusahaan kami baik internal maupun
eksternal
serta
diharapkan
akan
memberikan
solusi
bagi
perkembangan perusahaan untuk lebih maju lagi kedepannya ditengah persaingan yang ketat.
29
3.2 Analisa Sistem Dengan adanya aplikasi penjualan berbasis web ini diharapkan dapat memudahkan masyarakat luas untuk mengetahui informasi secara lengkap mengenai harga mobil bekas, harga sparepart dan spesifikasi mobil yang akan dibeli. Aplikasi ini dirancang agar dapat digunakan di laptop, PC, tablet dan smartphone, sehingga dapat digunakan kapan saja dan dimana saja selama masih terhubung dengan jaringan internet. Selain itu dibutuhkan hak akses untuk dapat login untuk dapat masuk ke halaman administrator, hak akses disesuaikan dengan kebutuhan user. Untuk menghasilkan aplikasi penjualan dan inventory kendaraan bermotor berbasis web ini diperlukan informasi dan sumber data yaitu dari CV. XYZ itu sendiri.
3.3 Analisa Kebutuhan Untuk mendukung pengembangan sistem informasi, analisis kebutuhan sistem sangat penting, dengan analisis tersebut diketahui kebutuhan – kebutuhan yang diperlukan oleh sistem agar dapat berjalan sesuai yang diharapkan. Dalam analisis penulis menyajikan informasi yang dibutuhkan antara lain : 1. Informasi tentang spesifikasi mobil Informasi ini digunakan untuk mengetahui spesifikasi mobil yang dijual, serta memudahkan pembeli menentukan pilihan terhadap mobil yang akan di beli. 2. Informasi tentang aksesoris mobil Informasi ini digunakan untuk mengetahui spesifikasi aksesoris yang dijual, serta memudahkan pembeli menentukan pilihan terhadap mobil yang akan di beli.
30
3.4 Rancangan Umum Aplikasi Dari hasil analisa, penulis membuat aplikasi berbasis web dengan fitur yang sederhana dengan menggunakan bahasa pemprograman PHP serta menggunakan basis data MySQL. Penulis membuat permodelan diagram Use Case untuk menunjukan fungsional suatu sistem dan permodelan diagram Activity untuk mengurutkan aktifitas dalam suatu proses serta permodelan diagram Sequence untuk menggambarkan interaksi antar objek di dalam dan di sekitar sistem. Permodelan ini dibuat agar aplikasi ini dapat dipahami dengan mudah.
3.5 Perancangan Proses Perancangan proses merupakan perancangan proses – proses yang akan terjadi didalam sistem aplikasi penjualan dan inventory kendaraan bermotor berbasis web. Perancangan proses – proses yang akan dilakukan didalam aplikasi ini menggunakan perancangan UML (Unified Modeling Language) seperti ERD (Entity Relationship Diagram), Use Case, Activity Diagram, Sequence Diagram.
3.6 Perancangan UML Perancangan UML merupakan kesatuan dari bahasa permodelan yang dikembangkan oleh Booch, UML adalah hasil kerja dari konsorsium berbagai organisasi yang berhasil dijadikan sebagai standar baku dalam OOAD (Object Orienter Analysis dan Design). Kontribusi UML telah dihasilkan dari banyak perusahaan – perusahaan ternama diantaranya Hewlet Packard Company, i-Logic, IBM, Microsoft, Oracle dan lainnya. UML juga menawarkan banyak keistimewaan, tidak hanya dominan dalam penotasian dilingkungan OO (Object Oriented) tetapi juga popular diluar lingkungan OO. Sebagai bahasa pemprograman, PHP dapat menterjemahkan diagram yang ada di UML menjadi kode program yang siap dijalankan.
31
3.6.1 Diagram Use Case Superadmin Berikut ini merupakan Diagram Use Case yang menjelaskan kinerja dari Superadmin : Home
input stock mobil
Update stock mobil
Hapus stock mobil
«extends» «extends»
Input stock aksesoris
«extends» «extends»
update stock aksesoris
«extends» «extends»
hapus stock aksesoris
«extends»
«extends» Membuat invoice
CPanel Super Admin
«extends» «extends»
super admin Update penjualan
«extends» «extends»
data reparasi «extends» data reparasi eksternal
input data sales
«extends» «extends» «extends» «extends» «extends»
hapus data sales
edit data sales
hapus data sales
input data admin
edit data admin
hapus data admin
Gambar 3.1 Diagram Use Case Halaman Superadmin
32
Superadmin adalah user yang mempunya hak penuh didalam sistem, Superadmin dapat melakukan semua yang tidak bisa dilakukan oleh guest dan admin. Di sistem ini hanya terdapat satu Superadmin.
3.6.2 Diagram Use Case Admin Berikut ini merupakan Diagram Use Case yang menjelaskan kinerja dari Admin :
Home
Input stock mobil
update stock mobil «extends» input stock aksesoris
«extends» «extends»
update stock aksesoris
«extends» «extends»
membuat invoice «extends» «extends» admin
update penjualan «extends» «extends» data reparasi
data reparasi eksternal
input data sales
Gambar 3.2 Diagram Use Case Halaman Admin
log in
33
Admin merupakan user yang bekerja di perusahaan tersebut, Admin bertugas sebagai operator yang mengatur pembelian, penjualan, input data, update data.
3.6.3 Diagram Use Case User Berikut ini merupakan Diagram Use Case yang menjelaskan apa yang bisa dilakukan oleh user :
tentang kami
produk
«extends»
«extends» «extends»
produk detail
«extends» Aksesoris
Home
«extends» user «extends» Aksesoris Detail «extends»
Kontak
Simulasi Kredit
Gambar 3.3 Diagram Use Case Halaman User
34
Hak akses User hanya dapat melihat informasi yang ada di website, seperti home, tentang kami, daftar produk mobil yang tersedia, detail dan spesifikasi mobil yang tersedia, dan apabila user ingin menanyakan spesifikasi, keadaan dan melakukan pembelian mobil atau aksesoris bisa langsung menghubungi contact person yang terdapat dihalaman kontak.
3.6.4 Diagram Use Case Hak Akses
Gambar 3.4 Diagram Use Case Hak Akses Hak akses berfungsi untuk membatasi ruang gerak suatu user didalam suatu aplikasi, di sistem ini hanya terdapat 3 hak akses, yaitu Superadmin, Admin, dan User. Pada level hak akses Superadmin, user ini mempunyai hak akses penuh
35
terhadap aplikasi, dan di sistem ini hanya terdapat 1 Superadmin. Pada level hak akses Admin, user ini mempunya hak akses sebagai operator yang mengatur pembelian, penjualan, input data, update data. Pada level hak akses user, hanya dapat melihat informasi yang ada di website, seperti home, tentang kami, daftar produk mobil yang tersedia, detail dan spesifikasi mobil yang tersedia, dan apabila user ingin menanyakan spesifikasi, keadaan dan melakukan pembelian mobil atau aksesoris bisa langsung menghubungi contact person yang terdapat dihalaman kontak.
3.6.5 Diagram Activity Login Superadmin dan Admin
Gambar 3.5 Diagram Activity Proses Login
36
Pada gambar 3.5 dijelaskan aktifitas dari proses login, dimana tahap awal yang harus dilakukan adalah membuka sistem aplikasi terlebih dahulu, lalu sistem akan langsung masuk ke halaman login tanpa harus klik menu login. User harus memasukkan username dan password dan klik sign in. Setelah itu sistem akan melakukan verifikasi terhadap username, password, dan role. Jika sistem selesai melakukan verifikasi dan user memiliki hak akses maka sistem akan redirect ke halaman control panel sesuai tingkatan user. Jika username atau password salah maka sistem akan memunculkan top up notifikasi bahwa “username atau password salah”.
3.6.6 Diagram Activity Input Data
Gambar 3.6 Diagram Activity Proses Input Data
37
Pada gambar 3.6 adalah proses input data mobil, tahap awal yang dilakukan adalah mengklik input setelah itu mengiri form data mobil. Setelah itu sistem akan memeriksa terlebih dahulu apakan ada isi dari form yang kosong, dan apabilan kosong maka sistem akan mengembalikan ke form yang kosong, apabila semua sudah terisi maka sistem akan menyimpan pada database.
3.6.7 Diagram Sequence Login
Gambar 3.7 Diagram Sequence Login Superadmin dan Admin
38
Pada gambar 3.7 menjelaskan aktifitas login dari proses login, dimana tahap awal yang harus dilakukan adalah membuka sistem aplikasi terlebih dahulu, lalu sistem akan langsung masuk ke halaman login tanpa harus klik menu login. User harus memasukkan username dan password dan klik sign in. Setelah itu sistem akan melakukan verifikasi terhadap username, password, dan role. Jika sistem selesai melakukan verifikasi dan user memiliki hak akses maka sistem akan redirect ke halaman control panel sesuai tingkatan user. Jika username atau password salah maka sistem akan memunculkan top up notifikasi bahwa “username atau password salah”.
3.6.8 Diagram Sequence Input Data Kendaraan dan Input Data Aksesoris
Gambar 3.8 Diagram Sequence Input Data Kendaraan dan Input Data Aksesoris
Pada gambar 3.8 menjelaskan proses input kendaraan dan input data aksesoris, pertama – tama user diharuskan masuk ke form input data kendaraan atau data aksesoris, setelah itu user mengisi form yang disediakan, selanjutnya sistem akan melakukan validasi, jika terdapat kesalahan input data maka sistem akan mengembalikan ke form input. Jika data sudah di input dengan benar maka
39
sistem akan menyimpan data kedalam database dan upload gambar ke halaman produk.
3.6.9 Diagram Sequence Penjualan
Gambar 3.9 Diagram Sequence Penjualan
Pada gambar 3.9 menjelaskan langkah – langkah proses penjualan sampai mencetak invoice. Dimana user masuk kedalam form stock barang lalu memilih button penjualan, setelah itu otomatis tersimpan di halaman data penjualan, dan user dapat mencetak dengan memilih button cetak invoice.
3.7 Perancangan Basis Data Tujuan dari perancangan database ini adalah untuk memenuhi informasi yang berisikan kebutuhan – kebutuhan user secara khusus dan aplikasi – aplikasinya, memudahkan pengertian struktur informasi dan mendukung kebutuhan – kebutuhan pemrosesan serta beberapa obyek penampilan (response time, processing time, dan storage space).
40
3.7.1 Entity Relationship Diagram Entity Relationship Diagram atau ERD merupakan suatu model untuk menjelaskan hubungan anta data dalam basis data berdasarkan objek – objek dasar data yang mempunyai hubungan antar relasi. Untuk menggambarkan ERD digunakan beberapa notasi dan symbol. tb_Admin
tb_admin_role
PK
id_admin
PK
FK1
id_admin_role
id_admin_role nama_role
tb_mobil PK
tb_transaksi tb_sales PK
transaksi_id
FK1 FK2
sales_id mobil_id transaksi_totalPembelian transaksi_pembayaran transaksi_keuntungan transaksi_bagiHasil transaksi_metode transaksi_deskripsi transaksi_status transaksi_tanggal
mobil_merk mobil_tipe mobil_jenis mobil_noPolisi mobil_thPerakitan mobil_wana mobil_cc_mesin mobil_transmisi mobil_hargaBeli mobil_biayaService mobil_hargaJual mobil_status
sales_id sales_nama sales_alamat sales_telepon sales_email
tb_service_eksternal PK
PK
mobil_id
service_eksternal_id service_eksternal_merk service_ekternal_tipe service_ekternal_jenis service_ekternal_noPolisi service_ekternal_stnk_kir service_ekternal_bunga service_ekternal_cat service_ekternal_tk_cat service_ekternal_comp service_ekternal_mesin service_ekternal_finishing service_ekternal_variasi service_ekternal_ac service_ekternal_iklan service_ekternal_transport service_ekternal_interior service_ekternal_aki service_ekternal_tgl_masuk service_ekternal_tgl_keluar service_ekternal_nama_customer service_ekternal_alamat_customer service_ekternal_telp_customer
tb_aksesoris PK tb_invoice PK
id_invoice
FK1
transaksi_id tgl_invoice
kd_aksesoris nama_aksesoris harga_aksesoris jenis_mobil
Gambar 3.10 ERD sistem inventory Pada gambar 3.10 menjelaskan hubungan antar data dalam basis data yang terdapat dalam sistem 3.7.2 Struktur Tabel Dalam perancangan basis data ini penulis menggunakan MySQL untuk menyimpan data mengenai gejala serta keterkaitannya. Berikut ini merupakan struktur tabel yang digunakan dalam aplikasi ini :
41
1. Tabel admin Tabel ini digunakan untuk menyimpan data superadmin dan admin. Nama table : admin Primary key : id_admin Tabel 3.1 tabel admin Nama Field
Panjang
Type
Keterangan
id_admin
10
Int
Index urutan admin
id_admin_role
10
Int
1= Superadmin, 2= Admin
nama_lengkap
50
Varchar
Nama lengkap calon admin
Email
32
Varchar
Email admin
Telepon
16
Varchar
Telepon admin
Username
16
Varchar
Username untuk login
Password
32
Char
Password untuk login
2. Tabel admin_role Tabel ini berfungsi sebagai hak akses antara superadmin dan admin. Nama tabel : admin_role Primary key : id_admin_role Tabel 3.2 tabel admin_role Nama Field
Panjang
Type
Keterangan
id_admin_role
10
Int
1= Superadmin, 2= Admin
nama_Role
32
Varchar
1= Superadmin, 2= Admin
3. Tabel aksesoris Tabel ini digunakan untuk menyimpan data stock aksesoris mobil yang ada di showroom.
42
Nama tabel : aksesoris Primary Key : id_aksesoris Tabel 3.3 Tabel aksesoris Nama Field
Panjang
Type
Keterangan
id_aksesoris
10
Int
ID aksesoris
Kode_aksesoris
15
Varchar
Kode dari aksesoris
Nama_aksesoris
30
Varchar
Nama dari aksesoris
Harga_aksesoris
16
Int
Harga dari aksesoris
Jenis_mobil
30
Varchar
Jenis aksesoris untuk mobil
Gambar_aksesoris
225
Varchar
Gambar aksesoris 1
Aksesoris_gbr1
225
Varchar
Gambar aksesoris 2
Aksesoris_gbr2
225
Varchar
Gambar aksesoris 3
Aksesoris_gbr3
225
Varchar
Gambar aksesoris 4
4. Tabel invoice Tabel ini digunakan untuk menyimpan data invoice. Nama tabel : invoice Primary key : id_invoice Tabel 3.4 Tabel invoice Nama Field
Panjang
Type
Keterangan
Id_invoice
10
Int
ID dari invoice
Item1
50
Varchar
Barang yang di beli 1
Item2
50
Varchar
Barang yang di beli 2
43
5. Tabel mobil Tabel ini digunakan untuk menyimpan data stock mobil yang ada di showroom Nama tabel : mobil Primary key : mobil_id Tabel 3.5 tabel mobil Nama Field
Panjang
Type
Keterangan
Mobil_id
10
Int
ID Mobil
Mobil_merk
50
Varchar
Merek dari mobil
Mobil_type
32
Varchar
Type dari monil
Mobil_jenis
I
Char
Jenis dari mobil
Mobil_no_polisi
16
Varchar
No Polisi dari mobil
Mobil_thn_perakitan
8
Varchar
Tahun perakitan dari mobil
Mobil_warna
16
Varchar
Warna dari mobil
Mobil_cc_mesin
16
Vrachar
CC Mesin dari mobil
Mobil_tranmisi
1
Char
Transmisi dari mobil
Mobil_harga_beli
10
Int
Harga beli mobil
Mobil_biaya_service
10
Int
Harga biaya service
Mobil_harga_jual
10
Int
Harga jual mobil
Mobil_status
1
Char
Status mobil
Mobil_gambar
255
Varchar
Gambar mobil 1
Mobil_gbr_1
255
Varchar
Gambar mobil 2
44
Tabel 3.5 (Lanjutan) `Mobil_gbr_2
255
Varchar
Gambar mobil 3
Mobil_gbr_3
255
Varchar
Gambar mobil 4
Mobil_gbr_4
255
Varchar
Gambar mobil 5
Mobil_gbr_5
255
Varchar
Gambar mobil 6
Mobil_gbr_6
255
Varchar
Gambar mobil 7
Insert_date
Timestamp
Tanggal pada saai input
Update_date
Datetime
Tanggal pada saat update
6. Tabel pembayaran Tabel ini digunakan menyimpan data pembayaran. Nama tabel : pembayaran Primary Key : pembayaran_id Tabel 3.6 tabel pembayaran Nama Field
Panjang
Type
Keterangan
Pembayaran_id
10
Int
ID Pembayaran
Transaksi_id
10
Int
ID Transaksi
Mobil_id
10
Int
ID Mobil
Sales_id
10
Int
ID Sales
Pembayaran_rupiah
Int
10
Nominal pembayaran
Pembayaran_tanggal
Datetime
Tanggal pembayaran
Pembayaran_deskripsi
Text
Deskripsi dari pembayaran
45
7. Tabel sales Tabel ini digunakan untuk menyimpan data sales. Nama tabel : sales Primary Key : sales_id Tabel 3.7 tabel sales Nama Field
Panjang
Type
Keterangan
Sales_id
10
Int
ID dari sales baru
Sales_nama
50
Varchar
Nama sales
Text
Alamat Sales
Sales_Alamat Sales_telepon
16
Char
Nomer telepon sales
Sales_email
16
Char
Email sales
8. Tabel service Tabel ini digunakan untuk menyimpan data mobil di showroom yang harus di service atau diperbaiki. Nama tabel : service Primary Key : service_id Tabel 3.8 tabel service Nama Field
Panjang
Type
Keterangan
Service_id
10
Int
ID Service
Mobil_id
10
Int
ID Mobil
Service_stnk_kir
10
Int
Biaya STNK
Service_bunga
10
Int
Bunga
46
Tabel 3.8 (Lanjutan) Service_cat
10
Int
Biaya Penggunaan Cat
Service_tk_cat
10
Int
Jasa tukang cat
Service_las
10
Int
Biaya las
Service_tk_las
10
Int
Jasa tukang las
Service_comp
10
Int
Biaya service komponen
Service_mesin
10
Int
Biaya service mesin
Service_finishing
10
Int
Biaya finishing
Service_variasi
10
Int
Biaya variasi
Service_ac
10
Int
Biaya service AC
Service_iklan
10
Int
Biaya iklan
Service_transport
10
Int
Biaya transport
Service_interior
10
Int
Biaya service interior
Service_aki
10
Int
Biaya service aki
Date
Tanggal service
Service_tanggal
9. Tabel service_external Tabel ini digunakan untuk menyimpan data mobil customer dari luar yang ingin di service. Nama tabel : service_external Primary Key : service_external_id
47
Tabel 3.9 tabel service_external Nama Field
Panjang
Type
Keterangan
Service_external_id
10
Int
ID Service eksternal
Service_external_merk
50
Varchar
Merek mobil eksternal
Service_external_tipe
32
Varchar
Tipe mobil eksternal
Service_external_jenis
1
Char
Jenis mobil eksternal
Service_external_nopol
16
Varchar
Nopol mobil eksternal
Service_external_stnk_kir
11
Int
STNK mobil ekternal
Service_external_bunga
11
Int
Bunga mobil eksternal
Service_external_cat
11
Int
Biaya cat mobil eksternal
Service_external_tk_cat
11
Int
Jasa tukang cat eksternal
Service_external_las
11
Int
Biaya las eksternal
Service_external_tk_las
11
Int
Jasa tukang las eksternal
Service_external_comp
11
Int
Service komponen eksternal
Service_external_mesin
11
Int
Service mesin eksternal
Service_external_finishing
11
Int
Finishing eksternal
Service_external_variasi
11
Int
Variasi eksternal
Service_external_ac
11
Int
Service AC eksternal
Service_external_iklan
11
Int
Iklan eksternal
Service_external_transport
11
Int
Jasa transport eksternal
Service_external_interior
11
Int
Jasa service interior eksternal
48
Tabel 3.9 (Lanjutan) Service_external_aki
Int
Jasa service aki
Service_external_tanggal
Date
Tanggal service eksternal
Service_external_tanggal_masuk
Date
Tanggal masuk service
Service_external_tanggal_keluar
Date
Tanggal keluar service
Varchar
Nama customer
Service_external_alamat_customer
Text
Alamat customer
Service_external_telepon_customer
Text
Nomer telepon customer
Service_external_nama_customer
11
50
10. Tabel transaksi Tabel ini digunakan untuk menyimpan data transaksi yang terjadi antara penjual dan pembeli Nama tabel : transaksi Primary Key : transaksi_id Tabel 3.10 tabel transaksi Nama Field
Panjang
Type
Transaksi_id
10
Int
Mobil_id
10
Int
Sales_id
10
Int
Transaksi_total_pembelian
10
Int
Transaksi_pembayaran
10
Int
Transaksi_keuntungan
10
Int
49
Tabel 3.10 (Lanjutan) Transaksi_bagi_hasil
10
Int
Transaksi_metode
1
Char
Transaksi_deskripsi Transaksi_status
Text 1
Transaksi_tanggal
Char Timestamp
Transaksi_bagi_hasil
10
Int
Transaksi_metode
1
Char
Transaksi_deskripsi Transaksi_status Transaksi_tanggal
Text 1
Char Timestamp
50
3.8 Perancangan Antar Muka (Interface) Perancangan user interface merupakan perancangan halaman tampilan dalam aplikasi diagnosa yang akan dibuat. Perancangan user interface ini, merancang halaman dalam proses input maupun output dalam aplikasi ini. Pada saat pertama kali user menjalankan aplikasi web halaman pertama yang user jumpai adalah halaman home yang berisi berbagai macam jenis mobil yang dijual dan beberapa menu utama. Rancangan awal dapat dilihat pada Gambar 3.10
HEADER HOME
TENTANG KAMI
GAMBAR
PRODUK
GAMBAR
ASESORIS
KONTAK
GAMBAR
FOOTER Gambar 3.11 Rancangan Halaman Utama
Pada halaman utama terdapat menu-menu yang dapat dipilih oleh pengguna untuk menampilkan halaman lain yang disediakan pada aplikasi penjualan kendaraan bermotor berbasis web ini. Berikut penjelasan dari setiap menunya :
51
1. Rancangan antarmuka Tentang Kami Halaman ini berisi mengenai penjelasan singkat dari PT. XYZ, disini calon pembeli dapat melihat visi misi dari CV. XYZ, sekaligus terdapat form simulasi kredit yang memberikan gambaran tentang kredit kepada calon buyer.
HEADER HOME
TENTANG KAMI
PRODUK
ASESORIS
KONTAK
GAMBAR
text SIMULASI KREDIT HARGA MOBIL DP CICILAN PROSES
FOOTER Gambar 3.12 Rancangan Halaman Tentang Kami
52
2. Rancangan antarmuka Produk Halaman ini menjelaskan mengenai macam-macam jenis mobil yang dijual dan menjelaskan secara rinci kondisi, keadaan, spesifikasi mobil yang akan dijual. Dan di halaman ini juga terdapat form simulasi kredit yang sudah penulis jelaskan sebelumnya.
HEADER HOME
TENTANG KAMI
GAMBAR
PRODUK
ASESORIS
KONTAK
text
SIMULASI KREDIT
GAMBAR
HARGA MOBIL
text
DP CICILAN PROSES
FOOTER Gambar 3.13 Rancangan Halaman Produk
53
3. Rancangan antarmuka Aksesoris Halaman ini menjelaskan mengenai macam-macam jenis aksesoris mobil yang dijual dan menjelaskan secara rinci kondisi, spesifikasi aksesoris mobil yang akan dijual. Dan di halaman ini juga terdapat form simulasi kredit yang sudah penulis jelaskan sebelumnya.
HEADER HOME
TENTANG KAMI
GAMBAR
PRODUK
ASESORIS
KONTAK
text
SIMULASI KREDIT HARGA MOBIL DP CICILAN PROSES
FOOTER Gambar 3.14 Rancangan Halaman Aksesoris
54
4. Rancangan antarmuka Kontak Halaman ini berisi mengenai kontak penjual berupa nomer telefon, email dan lokasi penjual. Jadi saat calon pembeli tertarik untuk membeli mobil atau aksesoris dari CV. XYZ maka calon pembeli dapat langsung menghubungi contact person yang tertera atau langsung datang ke showroom CV. XYZ
HEADER HOME
Telfon :
TENTANG KAMI
PRODUK
ASESORIS
E-mail : Web
:
GOOGLE MAPS
FOOTER Gambar 3.15 Rancangan Halaman Kontak
KONTAK
55
5. Rancangan antarmuka Login Halaman ini merupakan halaman login sebagai superadmin dan admin. Setelah login user dapat masuk ke dalam control panel.
SIGN IN
USERNAME
PASSWORD
SIGN IN
Gambar 3.16 Rancangan Halaman Login Gambar 3.14 merupakan form login, merupakan jendela awal untuk mengakses sistem inventory ini. Di form ini terdapat 2 textbox dan 1 button. Berikut ini merupakan penjelasan dari masing – masing textbox dan button : a. Textbox username : berfungsi untuk memasukkan username dari user b. Textbox password : berfungsi untuk memasukkan password dari user c. Button Sign In : berfungsi untuk validasi username dan password, apabila username dan password salah maka akan kembali ke form login dan apabila username dan password benar akan langsung redirect ke halaman home.
56
6. Rancangan Halaman Dashboard Superadmin dan Admin Halaman ini merupakan alaman control panel dari superadmin, dari menu – menu yang ada terlihat jelas bahwa superadmin memiliki akses penuh terhadap sistem ini.
Gambar 3.17 Rancangan Halaman Dashboard Superadmin dan Admin
57
3.9 Coding Sistem dokumentasi digital ini dirancang menggunakan bahasa pemprograman web yaitu PHP dan bahasa pemprograman basis data yaitu MySQL. Coding adalah penerjemah dari design ke bahasa computer yang dapat dikenali oleh sistem operasi komputer menjadi sebuah antar muka, query dari logika yang telah direncanakan.
3.10 Pengujian Bagian ini adalah tahap selanjutnya setelah melakukan coding . Dibagian ini penulis memeriksa semua fungsi dan query
yang ada di dalam antar muka,
apakah terdapat kesalahan fungsi dan query dalam sistem ini yang kemudian akan diperbaiki. Dalam pengujian sistem ini penulis menggunakan metode pengujian black box.
3.11 Pemeliharaan Pada bagian ini merupakan bagian terakhir apabila semua bagian diatas sudah dilakukan dan sistem aplikasi ini sudah diterbitkan atau digunakan. Bagian ini melakukan pemeliharaan pada sistem aplikasi, basis data dan pada tampilan antar muka, yang kemudian dapat diperbaiki dan dapat dikembangkan.
