BAB III PERANCANGAN SISTEM 3.1 Analisis Sistem Murdick, R. G (1991:27), Sistem adalah seperangkat elemen yang membentuk kumpulan atau prosedurprosedur atau bagan-bagan pengolahan yang mencari suatu tujuan bagian atau tujuan bersama dengan mengoperasikan data dan atau barang pada waktu rujukan tertentu untuk menghasilkan informasi dan atau energi dan atau barang. Pada dasarnya web penjualan dan pemesanan online ini memproses data input yang dilakukan oleh pengguna dan administrator. Analasis sistem bertujuan untuk menguraikan masing masing fungsi pengguna dan admnistrator, meliputi kewenangan apa saja yang dimiliki, batasan apa saja yang bisa dilakukan oleh masing masing pengguna sisitem agar dalam pembuatan sistem ini tidak terjadi kesalahan dalam memcahkan masalah yang sudah ditetapkan. Dalam garis besar, sistem yang akan dibuat ini meliputi input data penjualan administrator, input pemesanan oleh pelanggan, output data yang diterima oleh administrator perihal pemesanan, dan output data hasil pemesanan yang diterima oleh pelanggan. Setelah sistem web sesuai dengan tujuan pengembangan, maka selanjutnya akan dilakukan 21
pengumpulan data yang akan digunakan sebagai pembangunan SEO. 3.1.1 Alur Sistem Sistem pemesanan dan penjualan online akan dikembangkan sesuai dengan fungsi operasi antara penjual dan pembeli yang akan memudahkan dalam transaksi. Dalam hal ini masing masing user mempunyai fungsi tersendiri, dimana penjual merupakan orang yang mengatur akses web sebagai administrator dan menyediakan jasa sedangkan pembeli merupakan orang yang membutuhkan jasa yang dimilik oleh penjual. Pengembangan web ini juga akan diatur secara terstruktur dalam membangun SEO sesuai keyword dan deskripsi tentang perusahaan yang akan meningkatkan rating web dalam search engine. 3.1.2 DFD Data Flow Diagram (DFD) merupakan suatu model logika data atau proses yang dibuat untuk menggambarkan dari mana asal data, kemana tujuan data yang keluar sistem dan dimana data disimpan. Secara umum DFD adalah grafik yang menggambarkan aliran data yang berhubungan dengan input, proses dan output dari model sistem. 22
Dalam tahap analisis perancangan website penjualan ini, dibuat DFD yang akan menunjukkan alur proses dari sistem yang berjalan. Pada sistem yang berjalan akan dioperasikan oleh dua user yang masing masing mempunyai fungsi sendiri, dimana pelanggan sebagai pembeli dan penjual sebagai administrator yang akan mengelola basis data siste. Berdasarkan kedua fungsi dan definisi diatas tersebut dibuat DFD level 0 pada gambar 3.1 sebagai permulaan penyusunan analisis perancangan sistem penjualan online berbasis web. Gambar 3.1 Data Flow Diagram Level 0 Data yang mengalir dari atau ke admin : 1. Username dan Password 2. Edit konten website 3. Konfirmasi order 4. Input jawaban 5. Data pertanyaan 6. Data order Data yang mengalir dari atau ke Customer : 7. Input data order 23
8. Input pertanyaan 9. Konfirmasi order 10. Jawaban pertanyaan 11. Akun Facebook atau Gmail atau identitas diri 3.1.3 Data Flow Diagram level 1 dan 2 Selanjutnya untuk memenuhi kebutuhan sistem yang masih belum lengkap pada DFD level 0 maka dibuat DFD pada tahapan proses yang diperlukan oleh sistem belanja online yang ditunjukkan pada gambar sebagai DFD yang meneruskan proses sistem DFD sebelumnya. Gambar 3.2 Data Flow Diagram Level 1 24
Gambar 3.3 Data Flow Diagram Prose Order Gambar 3.4 Data Flow Diagram Proses Chatbox Online 25
Gambar 3.5 Data Flow Diagram Proses Management Content Data yang mengalir dari atau ke admin : 1. Username dan Password 2. Edit konten website 3. Konfirmasi order 4. Input jawaban 5. Data pertanyaan 6. Data order Data yang mengalir dari atau ke Customer : 7. Input data order 3.2 FLOWCHART 8. Input pertanyaan 9. Konfirmasi order 10. Jawaban pertanyaan 11. Akun Facebook atau Gmail atau identitas diri Diagram alur sistem pada sistem belanja online berbasis web meliputi beberapa proses yang dilakukan 26
oleh user dalam berinteraksi dengan sistem. Sistem ujian online dikembangkan atas dasar interaksi antara dosen dengan mahasiswa dalam menempuh suatu perkuliahan konvensional. 1. Diagram alur pemesanan customer. Untuk dapat melakukan pemesanan online, makan pelanggan akan terlebih dahulu melakukan input order data pemesanan setelah memilih barang yang akan dipesan. Dalam input data, pelanggan akan melakukan upload desain atau mengirim url bahan desain yang akan digunakan dalam acuan desain barang yang akan dipesan. Setelah barang siap, selanjutnya customer akan melakukan pembayaran. Berikut adalah Gambar 3.3 dari diagram alur pemesanan barang. 27
Gambar 3.6 Flowchart pemesanan customer 2. Diagram alur bantuan chat online. Proses pemesanan barang memungkinkan customer mengalami kendala. Customer bisa meminta bantuan penjelasan dengan melakukan chat online melalui box chat dipojok kanan bawah web. Customer harus mengisi nama yang akan digunakan untuk memulai chat, lalu customer dapat melakukan pertanyaan yang akan dijawab langsung oleh administrator. Berikut alur bantuan chat online pada gambar 3.4 ini. Gambar 3.7 Flowchart bantuan chat online 28
3.3 LKT (Lembar Kerja Tampilan) 3.3.1 Halaman Pelanggan 1. Halaman Beranda Gambar 3.8 Halaman beranda Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Slideshow promo Fr8 : Footer Fr9 : Slideshow promo perkategori Fr10: Button next dan previous Fr11: Chatbox online 29
2. Halaman Profil Gambar 3.9 Halaman Profil Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Detail profil Fr8 : Footer Fr9 : Judul halaman Fr10 : Chatbox online 30
3. Halaman Kontak Gambar 3.10 Halaman Profil Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Google Map Fr8 : Footer Fr9 : Judul halaman Fr10 : Chatbox online 31
4. Halaman Portofolio Gambar 3.11 Halaman Portofolio Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Foto Produk Fr8 : Footer Fr9 : Judul halaman Fr10 : Halaman Fr11 : Chatbox online 32
5. Halaman Galeri Gambar 3.12 Halaman Galeri Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Foto Promo Fr8 : Footer Fr9 : Judul halaman Fr10 : Chatbox online 33
6. Halaman Produk Perkategori Gambar 3.13 Halaman Produk Perkategori Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Foto Produk Fr8 : Footer Fr9 : Halaman Fr10 : Chatbox online 34
7. Halaman Detail Produk Gambar 3.14 Halaman Detail Produk Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Deskripsi produk Fr8 : Footer Fr9 : Judul produk Fr10 : Gambar produk Fr11 : Judul Deskripsi Fr12 : Judul halaman Fr13 : Chatbox online 35
8. Halaman Form Pemesanan Gambar 3.15 Halaman Form Pemesanan Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Judul aturan pemesanan Fr8 : Footer Fr9 : Aturan pemesanan Fr10 : Judul form pemesanan Fr11 : Judul halaman Fr12 : Chatbox online 36
9. Halaman Promo Gambar 3.16 Halaman Promo Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Gambar promo Fr8 : Footer Fr9 : Halaman Fr10 : Judul halaman Fr11 : Chatbox online 37
10. Halaman Detail Promo Gambar 3.17 Halaman Detail Promo Fr2 : Search box Fr3 : Menu kategori produk Fr4 : Testimoni Fr5 : Kontak perusahaan Fr6 : Sosial media Fr7 : Deskripsi promo Fr8 : Footer Fr9 : Judul promo Fr10 : Gambar promo Fr11 : Judul deskripsi Fr12 : Judul halaman Fr13 : Chatbox online 38
3.3.2 Halaman Admin 1. Halaman Login Admin Gambar 3.18 Halaman Login Admin Fr2 : Username Fr3 : Password Fr4 : Button login 39
1. Halaman Admin Gambar 3.19 Halaman Login Admin Fr2 : Menu utama Fr3 : Link menu utama Fr4 : Menu produk Fr5 : Link menu produk Fr6 : Menu admin Fr7 : Link menu admin Fr8 : Menu Website Fr9 : Link menu website Fr10 : Tampilan edit konten Fr11 : logout 40
3.4 JST (Jaringan Semantik Tampilan) Gambar 3.20 Jaringan Semantik Tampilan Penjualan dan pemesanan online 1 : Home 6 : Kategori produk 2 : Profil 7 : Produk perkategori 3 : Kontak 8 : Detail produk 4 : Porotofolio 9 : Form pemesanan 5 : Galeri 10 : Chatbox Online 41