Perancangan Susunan Diagram Tampil

Gambar 3.2 Diagram Konteks Aplikasi Penjualan Secara Online

3.2.3 Perancangan Susunan Diagram Tampil

Diagram tampil mendeskripsikan kemampuan visualisasi dari tampilan yang akan dirancang.

3.2.3.1 Perancangan Susunan Diagram Tampil Administrator

Diagram tampil atau susunan perancangan tampilan dari Antarmuka Administrator terdiri dari halaman kategori, halaman produk jenis dari kategori itu, halaman simpan pesanan dari pembeli, halaman config yang berfungsi untuk mengubah tampilan data – data administrator pada antarmuka pembeli, dan halaman user yang berfungsi untuk mengubah maupun menghapus dan menambah user administrator. Diagram Tampil ini dapat dilihat pada Gambar 3.3. Gambar 3.3 Diagram Tampil Untuk Antarmuka Administrator Halaman Administrator Halaman Kategori edit kategori tambah kategori ubah katogori Halaman Produk jenis edit produk tambah produk ubah produk Halaman order simpan daftar pesanan hapus daftar pesanan Halaman Config Shop Mengubah tampilan di antarmuka pembeli Halaman user tambah user edit user khusus untuk user di administrat or Universitas Sumatera Utara 3.2.3.2 Perancangan Susunan Diagram Tampil Antarmuka Pembeli Diagram tampil antarmuka pembeli ini terdiri dari halaman yang menampilkan semua kategori, halaman yang menampilkan satu dari tiga macam kategori, dimana pada sistem ini kategori yang dibahas hanya tiga kategori saja yaitu kategori wortel, tomat, dan cabai. Selanjutnya, akan ditampilkan halaman jenis–jenis produk dari masing– masing ketiga kategori tersebut, dan berlanjut di pemesanan oleh pembeli, setelah pembeli melakukan pembelian pembeli akan mengisi data, dan berlanjut terbukanya halaman dimana pembeli dapat melihat total daftar pembelian beserta harganya. Untuk lebih jelasnya dapat dilihat pada Gambar 3.4. Gambar 3.4 Diagram Tampil Pada Antarmuka Pembeli Halaman Antarmuka Pembeli Halaman menampilkan semua kategori Kategori Wortel Kategori Cabai Kategori Tomat Jenis Produk Jenis Produk1 Jenis Produk Jenis Produk1 Jenis Produk Jenis Produk1 Halaman Pesan Halaman Pengisian Data Pembeli Daftar dan Harga Pembelian Universitas Sumatera Utara 3.2.4 Diagram Arus Data 3.2.4.1 Diagram Arus Data Level 1 Diagram arus data level 1 pada sistem ini dimulai pada Aplikasi Antarmuka Administrator, dan terdiri dari dua proses yaitu, proses login dan proses menghasilkan data yang akan ditampilkan pada antarmuka pembeli. Tampilan pada antarmuka pembeli inilah yang merupakan diagram arus data level 2 pada sistem ini. Diagram arus data level 1 sistem ini diperlihatkan pada Gambar 3.5. Nama user password status Nama user Password Status Data administrator Gambar 3.5 Diagram Arus Data Level 1 Admin User admin 1 status login Db1 Admin Db1 user 2 Administrator Interface Db2 Data Kategori Db2 Data Produk Db2 Data Currency Db2 Data Config Universitas Sumatera Utara 3.2.4.2 Diagram Arus Data Level 2 Diagram arus data level 2 prosesnya terjadi pada antarmuka pembeli. Data penjualan yang telah dihasilkan pada managemen administrator ditampilkan pada antarmuka pembeli. Dari proses pada antarmuka pembeli dihasilkan data – data yang dialirkan kembali ke manejemen administrator. Aliran data inilah yang merupakan arus data level 3. Diagram arus data level 2 sistem ini dapat dilihat pada Gambar 3.6. Kategori produk Kategori panjualan mata uang yang dipakai Dalam proses pembayaran Data item – item perincian Yang dipesan pesanan Data si pemesan Dan yang membayar Gambar 3.6 Diagram Arus Data Level 2 3.2.4.3 Diagram Arus Data Level 3 Pada diagram arus data level 3, proses aliran data berlangsung dari sistem antarmuka pembeli customer menuju pada sistem administrator. Adapun data yang dialirkan adalah data order pemesan dan pembayar, data pesanan, dan penjabaran data – data Db2 Data Kategori Db2 Data Produk Db2 Data Currency 1 Antarmuka Pembeli Db3 Data Order Db3 Data Order Item Db3 Data Waktu Pesanan Universitas Sumatera Utara pemesan dan pesanan. Penjabaran disini mencakup waktu pesanan dan total harga pesanan. Diagram arus data level 3 dapat dilihat pada Gambar 3.7. Aliran aliran data pesanan data pemesan update update data data kategori produk Gambar 3.7 Diagram Arus Data Level 3 3.2.5 Perancangan Basis Data Perancangan basis data dari sistem ini terdiri dari delapan tabel. Di antara delapan tabel tersebut terdapat dua tabel yang berdiri sendiri-sendiri atau tidak memiliki relasi dengan tabel lain. Kedua tabel tersebut adalah tabel user administrator dan tabel configurasi shop.

3.2.6 Hubungan Antartabel