BAB III PERANCANGAN SISTEM 3.1 Pengumpulan Kebutuhan Berdasarkan kebutuhan pengguna web ini digunakanuntuk mempermudah customer untuk berbelanja karena banyak kegiatan atau kesibukan customer. Media perbelanjaan web online saat ini berbagai macam barang yang dijual dalam online tetapi dalam web online yang biasanya tersedia banyak transaksi yang digunakan dengan pembayaran online akan tetapi web delivery order ini berbeda dan tidak melayani pembayaran online maka pembayaran dilakukan saat karyawan yang mengantar barang yang dibeli oleh custome. 3.2 Ruang Lingkup Aplikasi/Sistem web ini mempermudah customer untuk berbelanja online - Fungsi a. input mempermudah customer menginput data diri dan pemesanan barang yang sesuai dipilih customer b. melakukan penyimpanan untuk customer yang ingin berbelanja - Fitur User (Customer) a. Mencari barang apa yang ingin di beli oleh customer b. Memilih barang yang tersedia dalam web tersebut. c. Memesan barang yang sudah dibeli d. Mengisi data diri saat pembelian e. Mengirim pemesanan yang telah dipesan 14
15 Admin a. Memasukkan gambar serta stok yang tersedia. b. Mengedit barang yang baru di stok c. Menerima pesanan dan mengepak barang yang dipesan customer d. Mencetak struk pemesanan. 3.3 Konsep Perancangan Sistem 3.3.1 Gambaran Umum Skema dalam menjalankan website ini adalah admin menginput barang dan daftar barang dengan menyertakan gambar yang ingin ditampilkan.. Segala macam aktivitas admin seperti insert konten baru, update dan delete berada pada halaman terkhusus admin. Lalu terotomatisasi terhubung pada database sebagai media penyimpanan data. Tampilan pada user interface mengambil data pada database yang sebelumnya sudah diinputkan maupun diolah oleh admin. 3.3.2 Pengguna Aplikasi Perancangan system ini membantu proses pengembangan website berbelanja online dan mempermudah customer berbelanja dengan menghemat waktu saat customer sibuk dengan pekerjaannya Pengguna Admin Hak Akses 1. Memasukkan,mengubah menghapus,melihat data yang tersedia. 2. Melihat rekam medis pasien 3. Memasukkan stok gambar yang ada dan terbaru.
16 Mencetak struk yang sudah dipesan customer. Customer 1. Melihat daftar dari stok barang yang tersedia. 2. Memilih barang yang ingin dipesan. 3. Memasukkan data diri dengan lengkap serta pemesanan yang ingin dipesan. Tabel 3.1 Tabel Pengguna Aplikasi 3.4 Perancangan Antar Muka Aplikasi 3.4.1 Storyboard Berikut ini adalah perancangan sistem web swalayan ada baru delivery order a. Lembar kerja tampilan awal Header Menu Tampilan awal pada halaman awal Tampilan gambar tetap. Gambar 3.1 Tampilan awal Menu awal: Pada tampilan awal terdapat tampilan yang berisikan tampilan awal tentang web tersebut.
17 Header : tampilan background ada baru Menu : ada beberapa macam menu seperti beranda, kosmetik, sabun, makan dan minum. b. Lembar kerja tampilan menu utama Header Beranda Tampilan awal beranda berdasarkan hanya tulisan. Tampilan gambar tetap. Gambar 3.2 Design tampilan kedua Beranda: menampilkan beberapa kata pengantar dan sejarah tentang dibuatnya ada baru delivery order dan berisikan teks. c. Lembar kerja tampilan submenu Gambar 3.3 Design jenis kosmetik
18 Menu kosmetik: menampilkan beberapa pilihan menu yang akan dipilih oleh customer. Menu kosmetik: menu jenis kosmetik berisi tentang beberapa gambar kosmetik dan harga seerta stock yang tersedia Menu kosmetik: Jika ingin memilih barang dari tampilan jenis kosmetik bisa klik di gambar kemudian akan langsung pindah tampilan ke lembar pemesanan. d. Lembar kerja tampilan jenis dari produk sabun Gambar 3.4 Design tampilan jenis sabun Menu sabun: menampilkan beberapa pilihan menu yang akan dipilih oleh customer. Menu sabun: tampilan ini berisi ada berbagai jenis pilihan sabun.
19 e. Tampilan menu terakhir dari jenis makan dan minum. Gambar 3.5 Design tampilan jenis makan minum A. menampilkan beberapa pilihan menu yang akan dipilih oleh customer. B. tampilan ini berisi ada berbagai jenis pilihan sabun C. berisi berbagai macam jenis dari makanan dan minuman yang di inginkan customer. f. Tampilan pemesanan Header Pemesanan Tampilan gambar tetap. Gambar 3.6 Design pemesanan
20 A: berisi form pemesanan yang tersedia untuk pemesanan dari customer. B: tampilan beberapa textbox yang harus di isi customer untuk melengkapi identitas diri serta pemesanannya. 3.4.2 Tampilan Jaringan Simantik Gambar 3.7 Jaringan Simantik Tampilan Penjelasan jaringan simantik ini adalah : 1 : customer biasa masuk ke tampilan web A(beranda), B(jenis kosmetik), C( jebus sabun), D( jenis makan & minum) kemudian setelah memilih barang maka customer bisa memesan dengan mengisi data lengkap ke pemesanan.
21 3.5 Perancangan Proses Bisnis (UML, Komponen-komponen class, class diagram) 3.5.1 Use Case Diagram Proses Bisnis Gambar 3.8 Use case diagram proses bisnis Penjelasan use case diagram proses bisnis ini adalah: a. Admin : - admin dapat memasukkan,mengedit gambar/foto barang yang tersedia dalam web tersebut. - Admin dapat menambah stock barang yang tersedia. - Admin dapat menerima order dari customer.
22 b. Customer : - Customer dapat memilih barang apa yang ingin di pesan - Customer dapat memesan barang yang di inginkan Customer dapat meng input data diri ke table pemesanan jika ingin order barang. 3.5.2 Flowchart pemesanan delivery order Gambar 3.9 Flowchart Pemesanan
23 Penjelasan dari flowchart di atas adalah proses bisnis dalam pemesanan online dalam web ada baru delivery order. awal dari customer masuk web delivery order maka akan tampil pilihan barang apa saja yang dipesan, jika customer memesan barang yang diinginkan maka customer mengisi data diri dalam table pemesanan kemudian memesan barang tersebut maka data san barang yang dipesan akan tersimpan ke dalam database. 3.6 Pemodelan Penyimpanan Data Tabel 3.2 Tabel Database a. ID : merupakan primary key untuk ID b. Tanggal : tanggal ini untuk menentukan pemesanan dari customer c. Nama : nama lengkap dari customer d. Alamat: alamat lengkap customer agar admin bisa mengantar lebih jelas dalam pengantaran e. Hp : nomor handphone dari customer f. Barang : jenis barang apa saja yang dipesan oleh customer g. Banyak : berapa banyak barang yang dipesan h. Harga : harga setiap satuan barangnya Total : total harga dari total barang yang diberi